feat: un/follow tags (#188)
parent
09e071f6bf
commit
aac8a12091
|
@ -0,0 +1,36 @@
|
|||
<script setup lang="ts">
|
||||
import type { Tag } from 'masto'
|
||||
|
||||
const { tag } = defineProps<{
|
||||
tag: Tag
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
(event: 'change'): void
|
||||
}>()
|
||||
|
||||
const { tags } = useMasto()
|
||||
|
||||
const toggleFollowTag = async () => {
|
||||
if (tag.following)
|
||||
await tags.unfollow(tag.name)
|
||||
else
|
||||
await tags.follow(tag.name)
|
||||
|
||||
emit('change')
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<button
|
||||
rounded group focus:outline-none
|
||||
hover:text-primary focus-visible:text-primary
|
||||
@click="toggleFollowTag()"
|
||||
>
|
||||
<CommonTooltip placement="bottom" :content="tag.following ? 'Unfollow' : 'Follow'">
|
||||
<div rounded-full p2 group-hover="bg-orange/10" group-focus-visible="bg-orange/10" group-focus-visible:ring="2 current">
|
||||
<div :class="[tag.following ? 'i-ri:star-fill' : 'i-ri:star-line']" />
|
||||
</div>
|
||||
</CommonTooltip>
|
||||
</button>
|
||||
</template>
|
|
@ -53,7 +53,7 @@
|
|||
"js-yaml": "^4.1.0",
|
||||
"lint-staged": "^13.0.4",
|
||||
"lru-cache": "^7.14.1",
|
||||
"masto": "^4.6.10",
|
||||
"masto": "^4.7.0-rc1",
|
||||
"nuxt": "^3.0.0",
|
||||
"parse5": "^7.1.2",
|
||||
"pinia": "^2.0.26",
|
||||
|
|
|
@ -1,20 +1,34 @@
|
|||
<script setup lang="ts">
|
||||
const params = useRoute().params
|
||||
const tag = $(computedEager(() => params.tag as string))
|
||||
const tagName = $(computedEager(() => params.tag as string))
|
||||
|
||||
const paginator = useMasto().timelines.getHashtagIterable(tag)
|
||||
const stream = await useMasto().stream.streamTagTimeline(tag)
|
||||
const { data: tag, refresh } = $(await useAsyncData(() => useMasto().tags.fetch(tagName)))
|
||||
|
||||
const paginator = useMasto().timelines.getHashtagIterable(tagName)
|
||||
const stream = await useMasto().stream.streamTagTimeline(tagName)
|
||||
onBeforeUnmount(() => stream.disconnect())
|
||||
|
||||
useHead({
|
||||
title: `#${tag}`,
|
||||
if (tag) {
|
||||
useHead({
|
||||
title: () => `#${tag.name}`,
|
||||
})
|
||||
}
|
||||
|
||||
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()
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<MainContent back>
|
||||
<template #title>
|
||||
<span text-lg font-bold>#{{ tag }}</span>
|
||||
<span text-lg font-bold>#{{ tagName }}</span>
|
||||
</template>
|
||||
|
||||
<template v-if="typeof tag?.following === 'boolean'" #actions>
|
||||
<TagActionButton :tag="tag" @change="refresh()" />
|
||||
</template>
|
||||
|
||||
<slot>
|
||||
|
|
|
@ -38,7 +38,7 @@ specifiers:
|
|||
js-yaml: ^4.1.0
|
||||
lint-staged: ^13.0.4
|
||||
lru-cache: ^7.14.1
|
||||
masto: ^4.6.10
|
||||
masto: ^4.7.0-rc1
|
||||
nuxt: ^3.0.0
|
||||
parse5: ^7.1.2
|
||||
pinia: ^2.0.26
|
||||
|
@ -96,7 +96,7 @@ devDependencies:
|
|||
js-yaml: 4.1.0
|
||||
lint-staged: 13.0.4
|
||||
lru-cache: 7.14.1
|
||||
masto: 4.6.10
|
||||
masto: 4.7.0-rc1
|
||||
nuxt: 3.0.0_hsf322ms6xhhd4b5ne6lb74y4a
|
||||
parse5: 7.1.2
|
||||
pinia: 2.0.26_typescript@4.9.3
|
||||
|
@ -5497,8 +5497,8 @@ packages:
|
|||
semver: 6.3.0
|
||||
dev: true
|
||||
|
||||
/masto/4.6.10:
|
||||
resolution: {integrity: sha512-CNc2kmKPxUk+C/kq9qPZQh+zyrfVzoSFjadRHkqALN133/RxkHuF4cizxS7yXncfU4c9vtvCOnmYkmnr1lKM5A==}
|
||||
/masto/4.7.0-rc1:
|
||||
resolution: {integrity: sha512-aGd5Q0DNuWcRfvfweV10cwZx7o3VSnEv2J3q3ou1GfX+bZp2KPprenjMowFpbD+Mn2EiUPoqOZUWjB/CKWdB5w==}
|
||||
dependencies:
|
||||
axios: 1.1.3
|
||||
change-case: 4.1.2
|
||||
|
|
Loading…
Reference in New Issue