Add mock order status timeline

app/pages/orders/[id].vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { useQuery } from '@vue/apollo-composable';
-import OrderStatusBadge from '~/components/orders/OrderStatusBadge.vue';
 import {
   MyOrdersDocument,
   type MyOrdersQuery,
@@ -36,15 +35,10 @@ const currentOrder = computed<OrderItem | null>(() =>
       </div>
 
       <div class="space-y-4">
-        <div class="surface-card rounded-3xl p-5">
-          <h2 class="text-xl font-bold text-[#123824]">Статус заказа</h2>
-          <div class="mt-4 flex flex-wrap items-center justify-between gap-3">
-            <div class="space-y-1 text-sm text-[#355947]">
-              <p>Создан: {{ new Date(currentOrder.createdAt).toLocaleString() }}</p>
-            </div>
-            <OrderStatusBadge :status="currentOrder.status" />
-          </div>
-        </div>
+        <OrdersOrderStatusTimelineCard
+          :status="currentOrder.status"
+          :created-at="currentOrder.createdAt"
+        />
 
         <div class="surface-card rounded-3xl p-5">
           <h2 class="text-xl font-bold text-[#123824]">Состав заказа</h2>