add broken status page

src/components/status/VulStatus.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import type Activity from "@/lib/api/entities/activity";
+
+defineProps<{ status: Activity }>();
+</script>
+
+<template>
+	<div class="flex flex-row">
+		<div class="flex flex-row flex-grow">
+			<RouterLink :to="`/@${status.account.acct}`">
+				<img
+					class="rounded-full m-2"
+					:src="status.account.avatar"
+					width="64"
+					alt="Avatar for {{ status.account.acct }}"
+					title="Avatar for {{ status.account.acct }}"
+				/>
+			</RouterLink>
+			<div class="flex flex-col my-1">
+				<h2 className="text-lg font-bold">
+					<RouterLink :to="`/@${status.account.acct}`">
+						{{ status.account.display_name }}
+					</RouterLink>
+				</h2>
+				<h3 className="text-base font-light">
+					<RouterLink :to="`/@${status.account.acct}`"> @{{ status.account.acct }} </RouterLink>
+				</h3>
+			</div>
+		</div>
+		<div class="my-1 flex flex-row">
+			<span>
+				<span title="{t(statusScopeKey(status))}" aria-hidden="true">
+					<!-- <StatusScopeIcon status="{status}" /> -->
+					Public
+				</span>
+				<span class="sr-only">{t(statusScopeKey(status))}</span>
+			</span>
+			<RouterLink :to="`/@${status.account.acct}/statuses/${status.id}`">
+				{humanizeDuration(time)}
+			</RouterLink>
+		</div>
+	</div>
+</template>