From 5f254b378fa3b15b06ff5459b67a3d74e1a3a5ab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= Date: Fri, 25 Nov 2022 17:23:34 +0800 Subject: [PATCH] feat(status): optimistic update count --- components/status/StatusActions.vue | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/components/status/StatusActions.vue b/components/status/StatusActions.vue index 9d648f0a..c60151d8 100644 --- a/components/status/StatusActions.vue +++ b/components/status/StatusActions.vue @@ -24,9 +24,15 @@ const isLoading = $ref({ pinned: false, translation: false, }) -async function toggleStatusAction(action: 'reblogged' | 'favourited' | 'bookmarked' | 'pinned', newStatus: Promise) { + +type Action = 'reblogged' | 'favourited' | 'bookmarked' | 'pinned' +type CountField = 'reblogsCount' | 'favouritesCount' +async function toggleStatusAction(action: Action, newStatus: Promise, countField?: CountField) { // Optimistic update status[action] = !status[action] + if (countField) + status[countField] += status[action] ? 1 : -1 + try { isLoading[action] = true Object.assign(status, await newStatus) @@ -35,7 +41,6 @@ async function toggleStatusAction(action: 'reblogged' | 'favourited' | 'bookmark isLoading[action] = false } } - const toggleReblog = () => toggleStatusAction( 'reblogged', masto.statuses[status.reblogged ? 'unreblog' : 'reblog'](status.id).then((res) => { @@ -44,11 +49,13 @@ const toggleReblog = () => toggleStatusAction( return res.reblog! return res }), + 'reblogsCount', ) const toggleFavourite = () => toggleStatusAction( 'favourited', masto.statuses[status.favourited ? 'unfavourite' : 'favourite'](status.id), + 'favouritesCount', ) const toggleBookmark = () => toggleStatusAction(