2022-11-20 21:30:21 +00:00
|
|
|
<script setup lang="ts">
|
2022-12-29 14:44:26 +00:00
|
|
|
definePageMeta({
|
|
|
|
name: 'tag',
|
|
|
|
})
|
|
|
|
|
2022-11-20 21:30:21 +00:00
|
|
|
const params = useRoute().params
|
2024-02-24 12:24:21 +00:00
|
|
|
const tagName = computed(() => params.tag as string)
|
2022-11-22 23:08:36 +00:00
|
|
|
|
2024-02-21 15:20:08 +00:00
|
|
|
const { client } = useMasto()
|
|
|
|
const { data: tag, refresh } = await useAsyncData(() => client.value.v1.tags.$select(tagName.value).fetch(), { default: () => shallowRef() })
|
2022-11-28 20:46:04 +00:00
|
|
|
|
2024-02-21 15:20:08 +00:00
|
|
|
const paginator = client.value.v1.timelines.tag.$select(tagName.value).list()
|
|
|
|
const stream = useStreaming(client => client.hashtag.subscribe({ tag: tagName.value }))
|
2022-11-25 11:48:48 +00:00
|
|
|
|
2024-02-21 15:20:08 +00:00
|
|
|
if (tag.value) {
|
2023-04-16 19:33:51 +00:00
|
|
|
useHydratedHead({
|
2024-02-21 15:20:08 +00:00
|
|
|
title: () => `#${tag.value.name}`,
|
2022-11-28 20:46:04 +00:00
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
onReactivated(() => {
|
|
|
|
// Silently update data when reentering the page
|
|
|
|
// The user will see the previous content first, and any changes will be updated to the UI when the request is completed
|
|
|
|
refresh()
|
2022-11-25 11:48:48 +00:00
|
|
|
})
|
2022-11-20 21:30:21 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2022-11-26 12:58:10 +00:00
|
|
|
<MainContent back>
|
2022-11-20 21:30:21 +00:00
|
|
|
<template #title>
|
2024-01-04 19:51:32 +00:00
|
|
|
<bdi text-lg font-bold>#{{ tagName }}</bdi>
|
2022-11-28 20:46:04 +00:00
|
|
|
</template>
|
|
|
|
|
2023-01-05 16:48:20 +00:00
|
|
|
<template #actions>
|
|
|
|
<template v-if="typeof tag?.following === 'boolean'">
|
|
|
|
<TagActionButton :tag="tag" @change="refresh()" />
|
|
|
|
</template>
|
2022-11-20 21:30:21 +00:00
|
|
|
</template>
|
2022-11-24 06:42:26 +00:00
|
|
|
|
2022-11-20 21:30:21 +00:00
|
|
|
<slot>
|
2022-12-04 19:28:26 +00:00
|
|
|
<TimelinePaginator v-bind="{ paginator, stream }" context="public" />
|
2022-11-20 21:30:21 +00:00
|
|
|
</slot>
|
|
|
|
</MainContent>
|
|
|
|
</template>
|