Vue add one component before a component inside v-for loop dynamically

I have a question on how to add an unread component before a dynamic component (message, can be of a different type, which requires different rendering) inside a v-for loop.

Here is my sample code without the unread panel.

<template>
    <div>
        <Message v-for="(message, index) in messages" :key="index" :message="message></Message>
    </div>
</template>

AIM:

I want to add an unread panel before the message that is unread. And clearly, it will be added once in the template. So I would like another developer when viewing the template, can easily know that it does the job.

How to add Unread Panel

Method 1:

Add it in template directly.

<template>
    <div>
        <template v-for="(message, index) in messages" :key="index">
            <Unread v-if="message.getId() === firstUnreadId"></Unread>
            <Message :message="message"></Message>
        </template>
    </div>
</template>

Problem:

There are lots of unnecessary checking to see if unread is needed to place to the DOM, not to mention, it is difficult for the developer to know that the unread component will only be loaded once.

Method 2:

Put unread component inside messages, and add one more message into messages, so that the v-for loop will mark it work.

    <template>
        <div>
            <template v-for="(message, index) in messages" :key="index">
                <Message :message="message"></Message>
            </template>
        </div>
    </template>

    <template>
        <message :is="currentComponent"></message>
    </template>
    <script>
        export default {
            props: {
                message
            },
            computed: {
                currentComponent: function() {
                    switch (this.message.getType()) {
                         case "unread": 
                             return "Unread";
                         // ...
    
                    }
                }
            }
        }
    </script>

Problem:

Unread is definitely not a message, it seems a trick to make it work well.

I don't think any of the methods suggested above is a good one, does anyone have any solution for this? Thanks in advance.