42 lines
1.2 KiB
Vue
42 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { ref, watch } from "vue";
|
|
import { useRouter, useRoute } from "vue-router";
|
|
import useSWRV from "swrv";
|
|
import type Activity from "@/lib/api/entities/activity";
|
|
import apiFetch from "@/lib/api-fetch";
|
|
|
|
import { FwbSpinner } from "flowbite-vue";
|
|
import VulStatus from "@/components/status/VulStatus.vue";
|
|
|
|
const router = useRouter();
|
|
const route = useRoute();
|
|
const username = ref(route.params.username);
|
|
const statusId = ref(route.params.statusId);
|
|
|
|
const { data, error } = useSWRV(() => `/api/v1/statuses/${statusId.value}`, apiFetch<Activity>);
|
|
|
|
watch(
|
|
() => [route.params.username, route.params.statusId],
|
|
([newUsername, newId]) => {
|
|
username.value = newUsername as string;
|
|
statusId.value = newId as string;
|
|
},
|
|
);
|
|
|
|
watch(
|
|
() => ({ activity: data.value, username: route.params.username }),
|
|
({ activity, username }) => {
|
|
if (activity && activity.account.acct !== username) {
|
|
router.push({
|
|
name: "user-status",
|
|
params: { username: activity.account.acct, statusId: activity.id },
|
|
});
|
|
}
|
|
},
|
|
);
|
|
</script>
|
|
<template>
|
|
<div v-if="error">Failed to load: {{ error }}</div>
|
|
<FwbSpinner v-else-if="!data" size="10" />
|
|
<VulStatus v-else :status="data" />
|
|
</template>
|