Tabs out of order

[IceBlizz6]

Overview of the problem

@oruga-ui/oruga-next: 0.5.4
vue: 3.2.31

Description

Oruga tabs component is placing all new tab items at the end, even when it's not supposed to.

Steps to reproduce

1. Use code snippet

<o-tabs>

    <o-tab-item
        v-for="car in cars"
        :key="car.id"
    >
        <template #header>
            {{ car.name }}
        </template>
    </o-tab-item>

    <o-tab-item>
        <template #header>
            Always last tab
        </template>
    </o-tab-item>

</o-tabs>

2. Create initial list

cars: [
    { id: 1, name: "Car#1" },
    { id: 2, name: "Car#2" }
]

3. Add a new car to the list (after component has been mounted)

this.cars.push({ id: 3, name: "Car#3" })

Expected behavior

Expected order of tabs:

1. Car#1
2. Car#2
3. Car#3
4. Always last tab

Actual behavior

Actual order of tabs:

1. Car#1
2. Car#2
3. Always last tab
4. Car#3

Reproduce here:
TabIssue.zip

[IceBlizz6]

@jtommy
I created the issue like you wanted.
This is my first time making a bug report by following a template, Feel free to let me know if it can be improved.

Note: I deleted node_modules in the zip project, so you need to run npm install if you want to test it.