From 6308aa5c9a67cecb48dad3aa35b17ff988fa0068 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= Date: Sun, 8 Jan 2023 16:27:38 +0800 Subject: [PATCH 01/23] refactor: use paginator for explore --- components/tag/TagCardPaginator.vue | 22 +++++++++++++ components/timeline/TimelineList.vue | 13 -------- pages/[[server]]/explore/tags.vue | 30 +++--------------- pages/[[server]]/explore/users.vue | 46 ++++++++++------------------ 4 files changed, 43 insertions(+), 68 deletions(-) create mode 100644 components/tag/TagCardPaginator.vue delete mode 100644 components/timeline/TimelineList.vue diff --git a/components/tag/TagCardPaginator.vue b/components/tag/TagCardPaginator.vue new file mode 100644 index 00000000..498ff92a --- /dev/null +++ b/components/tag/TagCardPaginator.vue @@ -0,0 +1,22 @@ + + + diff --git a/components/timeline/TimelineList.vue b/components/timeline/TimelineList.vue deleted file mode 100644 index 36b36473..00000000 --- a/components/timeline/TimelineList.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - diff --git a/pages/[[server]]/explore/tags.vue b/pages/[[server]]/explore/tags.vue index e687e3be..f69447f5 100644 --- a/pages/[[server]]/explore/tags.vue +++ b/pages/[[server]]/explore/tags.vue @@ -4,10 +4,9 @@ import { STORAGE_KEY_HIDE_EXPLORE_TAGS_TIPS } from '~~/constants' const { t } = useI18n() const masto = useMasto() -const { data, pending, error } = useLazyAsyncData( - async () => masto.v1.trends.listTags({ limit: 20 }), - { immediate: true }, -) +const paginator = masto.v1.trends.listTags({ + limit: 20, +}) const hideTagsTips = useLocalStorage(STORAGE_KEY_HIDE_EXPLORE_TAGS_TIPS, false) @@ -17,28 +16,9 @@ useHeadFixed({ diff --git a/pages/[[server]]/explore/users.vue b/pages/[[server]]/explore/users.vue index 8d0ed9c6..218d5964 100644 --- a/pages/[[server]]/explore/users.vue +++ b/pages/[[server]]/explore/users.vue @@ -2,11 +2,7 @@ const { t } = useI18n() // limit: 20 is the default configuration of the official client -const masto = useMasto() -const { data, pending, error } = useLazyAsyncData( - async () => masto.v2.suggestions.list({ limit: 20 }), - { immediate: true }, -) +const paginator = useMasto().v2.suggestions.list({ limit: 20 }) useHeadFixed({ title: () => `${t('tab.for_you')} | ${t('nav.explore')}`, @@ -14,29 +10,19 @@ useHeadFixed({ From c64106c98a0599ee093d5afe01ccb6e4e3c7dc5f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= Date: Sun, 8 Jan 2023 16:51:45 +0800 Subject: [PATCH 02/23] refactor(status): rework edit history list --- components/common/CommonPaginator.vue | 6 +++ components/status/edit/StatusEditHistory.vue | 53 ++++++++++--------- .../status/edit/StatusEditHistorySkeleton.vue | 3 ++ 3 files changed, 38 insertions(+), 24 deletions(-) create mode 100644 components/status/edit/StatusEditHistorySkeleton.vue diff --git a/components/common/CommonPaginator.vue b/components/common/CommonPaginator.vue index fcb10b9a..1a27d177 100644 --- a/components/common/CommonPaginator.vue +++ b/components/common/CommonPaginator.vue @@ -22,7 +22,9 @@ const { defineSlots<{ default: { + items: T[] item: T + index: number active?: boolean older?: T newer?: T // newer is undefined when index === 0 @@ -61,6 +63,8 @@ const { items, prevItems, update, state, endAnchor, error } = usePaginator(pagin :active="active" :older="items[index + 1]" :newer="items[index - 1]" + :index="index" + :items="items" /> @@ -71,6 +75,8 @@ const { items, prevItems, update, state, endAnchor, error } = usePaginator(pagin :item="item" :older="items[index + 1]" :newer="items[index - 1]" + :index="index" + :items="items" /> diff --git a/components/status/edit/StatusEditHistory.vue b/components/status/edit/StatusEditHistory.vue index 3935cca7..c5d29343 100644 --- a/components/status/edit/StatusEditHistory.vue +++ b/components/status/edit/StatusEditHistory.vue @@ -6,38 +6,43 @@ const { status } = defineProps<{ status: mastodon.v1.Status }>() -const masto = useMasto() -const { data: statusEdits } = useAsyncData(`status:history:${status.id}`, () => masto.v1.statuses.listHistory(status.id).then(res => res.reverse())) +const paginator = useMasto().v1.statuses.listHistory(status.id) const showHistory = (edit: mastodon.v1.StatusEdit) => { openEditHistoryDialog(edit) } const timeAgoOptions = useTimeAgoOptions() + +const reverseHistory = (items: mastodon.v1.StatusEdit[]) => + [...items].reverse() diff --git a/components/status/edit/StatusEditHistorySkeleton.vue b/components/status/edit/StatusEditHistorySkeleton.vue new file mode 100644 index 00000000..96a0bfbb --- /dev/null +++ b/components/status/edit/StatusEditHistorySkeleton.vue @@ -0,0 +1,3 @@ + From 2211383258737d54b2ba29bd7525d0f6bcdac26f Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Sun, 8 Jan 2023 10:03:23 +0100 Subject: [PATCH 03/23] feat(ui): colorize reply and reblog --- components/account/AccountTabs.vue | 2 +- components/status/StatusActions.vue | 2 +- components/status/StatusActionsMore.vue | 2 +- components/status/StatusCard.vue | 50 ++++++++++++------------- components/status/StatusReplyingTo.vue | 10 +++-- 5 files changed, 34 insertions(+), 32 deletions(-) diff --git a/components/account/AccountTabs.vue b/components/account/AccountTabs.vue index 8f9bad38..75b58196 100644 --- a/components/account/AccountTabs.vue +++ b/components/account/AccountTabs.vue @@ -22,7 +22,7 @@ const tabs = $computed(() => [ params: { server, account }, }, display: t('tab.posts_with_replies'), - icon: 'i-ri:chat-3-line', + icon: 'i-ri:chat-1-line', }, { name: 'account-media', diff --git a/components/status/StatusActions.vue b/components/status/StatusActions.vue index 8eb66932..693590f5 100644 --- a/components/status/StatusActions.vue +++ b/components/status/StatusActions.vue @@ -38,7 +38,7 @@ const reply = () => { :content="$t('action.reply')" :text="status.repliesCount || ''" color="text-blue" hover="text-blue" group-hover="bg-blue/10" - icon="i-ri:chat-3-line" + icon="i-ri:chat-1-line" :command="command" @click="reply" > diff --git a/components/status/StatusActionsMore.vue b/components/status/StatusActionsMore.vue index 4b991f8c..697d2c51 100644 --- a/components/status/StatusActionsMore.vue +++ b/components/status/StatusActionsMore.vue @@ -129,7 +129,7 @@ async function editStatus() {