feat: initial support for lists (#1474)

This commit is contained in:
Evan Boehs 2023-01-26 16:41:28 -05:00 committed by GitHub
parent 901463301c
commit 3904bc4d2d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 68 additions and 0 deletions

View file

@ -32,6 +32,7 @@ const { notifications } = useNotifications()
<NavSideItem :text="$t('nav.explore')" :to="isHydrated ? `/${currentServer}/explore` : '/explore'" icon="i-ri:hashtag" :command="command" />
<NavSideItem :text="$t('nav.local')" :to="isHydrated ? `/${currentServer}/public/local` : '/public/local'" icon="i-ri:group-2-line " :command="command" />
<NavSideItem :text="$t('nav.federated')" :to="isHydrated ? `/${currentServer}/public` : '/public'" icon="i-ri:earth-line" :command="command" />
<NavSideItem :text="$t('nav.lists')" :to="`/${currentServer}/lists`" icon="i-ri:list-check" :command="command" />
<div shrink hidden sm:block mt-4 />
<NavSideItem :text="$t('nav.settings')" to="/settings" icon="i-ri:settings-3-line" :command="command" />

View file

@ -216,6 +216,8 @@
"favourites": "Favorites",
"federated": "Federated",
"home": "Home",
"list": "List",
"lists": "Lists",
"local": "Local",
"muted_users": "Muted users",
"notifications": "Notifications",

View file

@ -0,0 +1,35 @@
<script setup lang="ts">
definePageMeta({
name: 'list',
})
const params = useRoute().params
const listId = $(computedEager(() => params.list as string))
const { client } = $(useMasto())
const { data: listInfo, refresh } = $(await useAsyncData(() => client.v1.lists.fetch(listId), { default: () => shallowRef() }))
const paginator = client.v1.timelines.listList(listId)
const stream = useStreaming(client => client.v1.stream.streamListTimeline(listId))
if (listInfo) {
useHeadFixed({
title: () => `${listInfo.title}`,
})
}
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>{{ listInfo ? listInfo.title : $t('nav.list') }}</span>
</template>
<TimelinePaginator v-bind="{ paginator, stream }" :preprocess="reorderedTimeline" context="home" />
</MainContent>
</template>

View file

@ -0,0 +1,30 @@
<script lang="ts" setup>
const { t } = useI18n()
const { client } = $(useMasto())
const paginator = client.v1.lists.list()
useHeadFixed({
title: () => t('nav.lists'),
})
</script>
<template>
<MainContent>
<template #title>
<NuxtLink to="/lists" timeline-title-style flex items-center gap-2 @click="$scrollToTop">
<div i-ri:list-check />
<span text-lg font-bold>{{ t('nav.lists') }}</span>
</NuxtLink>
</template>
<slot>
<CommonPaginator :paginator="paginator">
<template #default="{ item }">
<NuxtLink :to="`list/${item.id}`" block p4 hover:bg-active flex justify-between>
{{ item.title }}
</NuxtLink>
</template>
</CommonPaginator>
</slot>
</MainContent>
</template>