kglt/fyne-on
1
0
Fork 0
Code Pull requests Activity Actions

feat: show followed hashtag badge (#3273)

Browse source
This commit is contained in:
ayo 2025-04-26 14:53:54 +02:00 • committed by GitHub
parent b0f301843b
commit b82e85585c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 36 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

15
components/status/StatusCard.vue
View file

@ -3,6 +3,7 @@ import type { mastodon } from 'masto'
const { actions = true, older, newer, hasOlder, hasNewer, main, ...props } = defineProps<{
status: mastodon.v1.Status
followedTag?: string | null
actions?: boolean
context?: mastodon.v2.FilterContext
hover?: boolean
@ -73,6 +74,20 @@ const forceShow = ref(false)
<div :h="showUpperBorder ? '1px' : '0'" w-auto bg-border mb-1 z--1 />
<slot name="meta">
<!-- followed hashtag badge -->
<div flex="~ col" justify-between>
<div
v-if="!!followedTag && followedTag !== ''"
flex="~ gap2" items-center h-auto text-sm text-orange
m="is-5" p="t-1 is-5"
relative text-secondary ws-nowrap
>
<div i-ri:hashtag />
<!-- show first hit followed tag -->
<span>{{ followedTag }}</span>
</div>
</div>
<!-- Pinned status -->
<div flex="~ col" justify-between>
<div

4
components/timeline/TimelineHome.vue
View file

@ -10,12 +10,14 @@ const stream = useStreaming(client => client.user.subscribe())
function reorderAndFilter(items: mastodon.v1.Status[]) {
return reorderedTimeline(items, 'home')
}
const followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
</script>
<template>
<div>
<PublishWidgetList draft-key="home" />
<div h="1px" w-auto bg-border mb-3 />
<TimelinePaginator v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="home" />
<TimelinePaginator :followed-tags="followedTags" v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="home" />
</div>
</template>

13
components/timeline/TimelinePaginator.vue
View file

@ -4,11 +4,12 @@ import type { mastodon } from 'masto'
import { DynamicScrollerItem } from 'vue-virtual-scroller'
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
const { account, buffer = 10, endMessage = true } = defineProps<{
const { account, buffer = 10, endMessage = true, followedTags = [] } = defineProps<{
paginator: mastodon.Paginator<mastodon.v1.Status[], mastodon.rest.v1.ListAccountStatusesParams>
stream?: mastodon.streaming.Subscription
context?: mastodon.v2.FilterContext
account?: mastodon.v1.Account
followedTags?: mastodon.v1.Tag[]
preprocess?: (items: mastodon.v1.Status[]) => mastodon.v1.Status[]
buffer?: number
endMessage?: boolean | string
@ -20,6 +21,12 @@ const virtualScroller = usePreferences('experimentalVirtualScroller')
const showOriginSite = computed(() =>
account && account.id !== currentUser.value?.account.id && getServerName(account) !== currentServer.value,
)
function getFollowedTag(status: mastodon.v1.Status): string | null {
const followedTagNames = followedTags.map(tag => tag.name)
const followedStatusTags = status.tags.filter(tag => followedTagNames.includes(tag.name))
return followedStatusTags.length ? followedStatusTags[0]?.name : null
}
</script>
<template>
@ -32,11 +39,11 @@ const showOriginSite = computed(() =>
<template #default="{ item, older, newer, active }">
<template v-if="virtualScroller">
<DynamicScrollerItem :item="item" :active="active" tag="article">
<StatusCard :status="item" :context="context" :older="older" :newer="newer" />
<StatusCard :followed-tag="getFollowedTag(item)" :status="item" :context="context" :older="older" :newer="newer" />
</DynamicScrollerItem>
</template>
<template v-else>
<StatusCard :status="item" :context="context" :older="older" :newer="newer" />
<StatusCard :followed-tag="getFollowedTag(item)" :status="item" :context="context" :older="older" :newer="newer" />
</template>
</template>
<template v-if="context === 'account' " #done="{ items }">

4
components/timeline/TimelinePublic.vue
View file

@ -6,10 +6,12 @@ const stream = useStreaming(client => client.public.subscribe())
function reorderAndFilter(items: mastodon.v1.Status[]) {
return reorderedTimeline(items, 'public')
}
const followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
</script>
<template>
<div>
<TimelinePaginator v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="public" />
<TimelinePaginator :followed-tags="followedTags" v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="public" />
</div>
</template>

4
components/timeline/TimelinePublicLocal.vue
View file

@ -6,10 +6,12 @@ const stream = useStreaming(client => client.public.local.subscribe())
function reorderAndFilter(items: mastodon.v1.Status[]) {
return reorderedTimeline(items, 'public')
}
const followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
</script>
<template>
<div>
<TimelinePaginator v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="public" />
<TimelinePaginator :followed-tags="followedTags" v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="public" />
</div>
</template>

3
pages/[[server]]/tags/[tag].vue
View file

@ -23,6 +23,7 @@ onReactivated(() => {
// The user will see the previous content first, and any changes will be updated to the UI when the request is completed
refresh()
})
const followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
</script>
<template>
@ -38,7 +39,7 @@ onReactivated(() => {
</template>
<slot>
<TimelinePaginator v-bind="{ paginator, stream }" context="public" />
<TimelinePaginator :followed-tags="followedTags" v-bind="{ paginator, stream }" context="public" />
</slot>
</MainContent>
</template>