chore: ⬆️ Upgrade to the latest Shadcn-Vue version

pages/[username]/[uuid].vue

@@ -1,20 +1,30 @@
 <template>
-    <div v-if="loaded" class="mx-auto max-w-2xl w-full rounded overflow-hidden border divide-border divide-y">
+    <div
+        v-if="loaded"
+        class="mx-auto max-w-2xl w-full rounded overflow-hidden border divide-border divide-y"
+    >
         <div>
-            <Note v-for="note, index of context?.ancestors" :note="note" :hide-actions="true"
-                :top-avatar-bar="index !== 0" :bottom-avatar-bar="true" :content-under-username="true" />
+            <Note
+                v-for="(note, index) of context?.ancestors"
+                :note="note"
+                :hide-actions="true"
+                :top-avatar-bar="index !== 0"
+                :bottom-avatar-bar="true"
+                :content-under-username="true"
+            />
             <Note v-if="note" :note="note" :top-avatar-bar="true" />
         </div>
         <Note v-for="note of context?.descendants" :note="note" />
     </div>
 
     <div v-else class="p-4 flex items-center justify-center h-48">
-        <Loader class="size-8 animate-spin" />
+        <Spinner />
     </div>
 </template>
 
 <script setup lang="ts">
 import { Loader } from "lucide-vue-next";
+import Spinner from "~/components/graphics/spinner.vue";
 import Note from "~/components/notes/note.vue";
 import * as m from "~/paraglide/messages.js";
 

pages/[username]/index.vue

@@ -4,22 +4,22 @@
             <Loader class="size-8 animate-spin" />
         </div>
         <TimelineScroller v-else-if="account">
-            <AccountProfile :account="account" />
-            <AccountTimeline v-if="accountId" :id="accountId" :key="accountId" />
+            <div class="p-4 pb-0">
+                <AccountProfile :account="account" />
+            </div>
+            <AccountTimeline
+                v-if="accountId"
+                :id="accountId"
+                :key="accountId"
+            />
         </TimelineScroller>
-        <Card v-else class="shadow-none bg-transparent border-none p-4">
-            <CardHeader class="text-center gap-y-4">
-                <CardTitle>{{ m.empty_awful_lark_dart() }}</CardTitle>
-                <CardDescription>
-                    {{ m.clean_even_mayfly_tap() }}
-                </CardDescription>
-            </CardHeader>
-        </Card>
+        <NotFound v-else />
     </div>
 </template>
 
 <script setup lang="ts">
 import { Loader } from "lucide-vue-next";
+import NotFound from "~/components/errors/NotFound.vue";
 import AccountProfile from "~/components/profiles/profile.vue";
 import AccountTimeline from "~/components/timelines/account.vue";
 import TimelineScroller from "~/components/timelines/timeline-scroller.vue";
@@ -64,4 +64,4 @@ useSeoMeta({
         noimageindex: !!account.value?.noindex,
     })),
 });
-</script>
+</script>