feat: better messages for no favourites and bookmarks (#2031)

This commit is contained in:
patak 2023-04-30 17:49:33 +02:00 committed by GitHub
parent ccf115ca4c
commit d4e0d5c5f5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 12 additions and 9 deletions

View file

@ -11,7 +11,7 @@ const {
virtualScroller = false,
eventType = 'update',
preprocess,
noEndMessage = false,
endMessage = true,
} = defineProps<{
paginator: Paginator<T[], O>
keyProp?: keyof T
@ -19,7 +19,7 @@ const {
stream?: Promise<WsEvents>
eventType?: 'notification' | 'update'
preprocess?: (items: (U | T)[]) => U[]
noEndMessage?: boolean
endMessage?: boolean | string
}>()
defineSlots<{
@ -109,9 +109,9 @@ defineExpose({ createEntry, removeEntry, updateEntry })
<slot v-if="state === 'loading'" name="loading">
<TimelineSkeleton />
</slot>
<slot v-else-if="state === 'done' && !noEndMessage" name="done">
<slot v-else-if="state === 'done' && endMessage !== false" name="done">
<div p5 text-secondary italic text-center>
{{ t('common.end_of_list') }}
{{ t(typeof endMessage === 'string' ? endMessage : 'common.end_of_list') }}
</div>
</slot>
<div v-else-if="state === 'error'" p5 text-secondary>

View file

@ -30,7 +30,7 @@ async function edit(listId: string) {
</script>
<template>
<CommonPaginator no-end-message :paginator="paginator">
<CommonPaginator :end-message="false" :paginator="paginator">
<template #default="{ item }">
<div p4 hover:bg-active block w="100%" flex justify-between items-center gap-4>
<p>{{ item.title }}</p>

View file

@ -3,5 +3,5 @@ const paginator = useMastoClient().v1.bookmarks.list()
</script>
<template>
<TimelinePaginator :paginator="paginator" />
<TimelinePaginator end-message="common.no_bookmarks" :paginator="paginator" />
</template>

View file

@ -3,5 +3,5 @@ const paginator = useMastoClient().v1.favourites.list()
</script>
<template>
<TimelinePaginator :paginator="paginator" />
<TimelinePaginator end-message="common.no_favourites" :paginator="paginator" />
</template>

View file

@ -4,13 +4,14 @@ import { DynamicScrollerItem } from 'vue-virtual-scroller'
import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
import type { Paginator, WsEvents, mastodon } from 'masto'
const { paginator, stream, account, buffer = 10 } = defineProps<{
const { paginator, stream, account, buffer = 10, endMessage } = defineProps<{
paginator: Paginator<mastodon.v1.Status[], mastodon.v1.ListAccountStatusesParams>
stream?: Promise<WsEvents>
context?: mastodon.v2.FilterContext
account?: mastodon.v1.Account
preprocess?: (items: mastodon.v1.Status[]) => mastodon.v1.Status[]
buffer?: number
endMessage?: boolean | string
}>()
const { formatNumber } = useHumanReadableNumber()
@ -22,7 +23,7 @@ const showOriginSite = $computed(() =>
</script>
<template>
<CommonPaginator v-bind="{ paginator, stream, preprocess, buffer }" :virtual-scroller="virtualScroller">
<CommonPaginator v-bind="{ paginator, stream, preprocess, buffer, endMessage }" :virtual-scroller="virtualScroller">
<template #updater="{ number, update }">
<button py-4 border="b base" flex="~ col" p-3 w-full text-primary font-bold @click="update">
{{ $t('timeline.show_new_items', number, { named: { v: formatNumber(number) } }) }}

View file

@ -98,6 +98,8 @@
"error": "ERROR",
"fetching": "Fetching...",
"in": "in",
"no_bookmarks": "No bookmarked posts yet",
"no_favourites": "No liked posts yet",
"not_found": "404 Not Found",
"offline_desc": "Seems like you are offline. Please check your network connection."
},