fix: paginator values being cloned (#3433)

Author: ayoayco

app/components/modal/ModalMediaPreviewCarousel.vue

@@ -159,14 +159,16 @@ function handleTap([positionX, positionY]: Vector2) {
     goToFocusedSlide()
   }
   else {
-    const focusedSlideBounding = slide.value[modelValue.value].getBoundingClientRect()
-    const slideCenterX = focusedSlideBounding.left + focusedSlideBounding.width / 2
-    const slideCenterY = focusedSlideBounding.top + focusedSlideBounding.height / 2
-
-    scale.value = 3
-    x.value += positionX - slideCenterX
-    y.value += positionY - slideCenterY
-    restrictShiftToInsideSlide()
+    const focusedSlideBounding = slide.value[modelValue.value]?.getBoundingClientRect()
+    if (focusedSlideBounding) {
+      const slideCenterX = focusedSlideBounding.left + focusedSlideBounding.width / 2
+      const slideCenterY = focusedSlideBounding.top + focusedSlideBounding.height / 2
+
+      scale.value = 3
+      x.value += positionX - slideCenterX
+      y.value += positionY - slideCenterY
+      restrictShiftToInsideSlide()
+    }
   }
 }
 

app/components/timeline/TimelineHome.vue

@@ -11,9 +11,11 @@ function reorderAndFilter(items: mastodon.v1.Status[]) {
   return reorderedTimeline(items, 'home')
 }
 
-let followedTags: mastodon.v1.Tag[] | undefined
+let followedTags: mastodon.v1.Tag[]
 if (currentUser.value !== undefined) {
-  followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
+  const { client } = useMasto()
+  const paginator = client.value.v1.followedTags.list()
+  followedTags = (await paginator.values().next()).value ?? []
 }
 </script>
 

app/components/timeline/TimelineNotifications.vue

@@ -13,6 +13,8 @@ const options = { limit: 30, types: filter ? [filter] : [] }
 
 // Default limit is 20 notifications, and servers are normally caped to 30
 const paginator = useMastoClient().v1.notifications.list(options)
+
+// @ts-expect-error Type error should be fixed with the following PR to masto.js: https://github.com/neet/masto.js/pull/1355
 const stream = useStreaming(client => client.user.notification.subscribe())
 
 lastAccessedNotificationRoute.value = route.path.replace(/\/notifications\/?/, '')

app/components/timeline/TimelinePublic.vue

@@ -7,9 +7,11 @@ function reorderAndFilter(items: mastodon.v1.Status[]) {
   return reorderedTimeline(items, 'public')
 }
 
-let followedTags: mastodon.v1.Tag[] | undefined
+let followedTags: mastodon.v1.Tag[]
 if (currentUser.value !== undefined) {
-  followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
+  const { client } = useMasto()
+  const paginator = client.value.v1.followedTags.list()
+  followedTags = (await paginator.values().next()).value ?? []
 }
 </script>
 

app/components/timeline/TimelinePublicLocal.vue

@@ -7,9 +7,11 @@ function reorderAndFilter(items: mastodon.v1.Status[]) {
   return reorderedTimeline(items, 'public')
 }
 
-let followedTags: mastodon.v1.Tag[] | undefined
+let followedTags: mastodon.v1.Tag[]
 if (currentUser.value !== undefined) {
-  followedTags = (await useMasto().client.value.v1.followedTags.list({ limit: 0 }))
+  const { client } = useMasto()
+  const paginator = client.value.v1.followedTags.list()
+  followedTags = (await paginator.values().next()).value ?? []
 }
 </script>
 

app/composables/cache.ts

@@ -74,7 +74,7 @@ export async function fetchAccountByHandle(acct: string): Promise<mastodon.v1.Ac
     }
     else {
       const userAcctDomain = userAcct.includes('@') ? userAcct : `${userAcct}@${domain}`
-      account = (await client.v1.search.fetch({ q: `@${userAcctDomain}`, type: 'accounts' })).accounts[0]
+      account = (await client.v1.search.list({ q: `@${userAcctDomain}`, type: 'accounts' })).accounts[0]
     }
 
     if (account.acct && !account.acct.includes('@') && domain)

app/composables/masto/notification.ts

@@ -45,9 +45,10 @@ export function useNotifications() {
 
     const position = await client.value.v1.markers.fetch({ timeline: ['notifications'] })
     const paginator = client.value.v1.notifications.list({ limit: 30 })
+    const paginatorValues = paginator.values()
 
     do {
-      const result = await paginator.next()
+      const result = await paginatorValues.next()
       if (!result.done && result.value.length) {
         for (const notification of result.value) {
           if (notification.id === position.notifications.lastReadId)

app/composables/masto/search.ts

@@ -77,7 +77,7 @@ export function useSearch(query: MaybeRefOrGetter<string>, options: UseSearchOpt
       ...resolveUnref(options),
       resolve: !!currentUser.value,
     })
-    const nextResults = await paginator.next()
+    const nextResults = await paginator.values().next()
 
     done.value = !!nextResults.done
     if (!nextResults.done)
@@ -91,7 +91,7 @@ export function useSearch(query: MaybeRefOrGetter<string>, options: UseSearchOpt
       return
 
     loading.value = true
-    const nextResults = await paginator.next()
+    const nextResults = await paginator.values().next()
     loading.value = false
 
     done.value = !!nextResults.done

app/composables/paginator.ts

@@ -3,7 +3,7 @@ import type { mastodon } from 'masto'
 import type { Ref } from 'vue'
 
 export function usePaginator<T, P, U = T>(
-  _paginator: mastodon.Paginator<T[], P>,
+  paginator: mastodon.Paginator<T[], P>,
   stream: Ref<mastodon.streaming.Subscription | undefined>,
   eventType: 'update' | 'notification' = 'update',
   preprocess: (items: (T | U)[]) => U[] = items => items as unknown as U[],
@@ -12,8 +12,8 @@ export function usePaginator<T, P, U = T>(
   // called `next` method will mutate the internal state of the variable,
   // and we need its initial state after HMR
   // so clone it
-  const paginator = _paginator.clone()
 
+  const paginatorValues = paginator.values()
   const state = ref<PaginatorState>(isHydrated.value ? 'idle' : 'loading')
   const items = ref<U[]>([])
   const nextItems = ref<U[]>([])
@@ -75,7 +75,7 @@ export function usePaginator<T, P, U = T>(
 
     state.value = 'loading'
     try {
-      const result = await paginator.next()
+      const result = await paginatorValues.next()
 
       if (!result.done && result.value.length) {
         const preprocessedItems = preprocess([...nextItems.value, ...result.value] as (U | T)[])

app/composables/tiptap/suggestion.ts

@@ -28,7 +28,7 @@ export const TiptapMentionSuggestion: Partial<SuggestionOptions> = import.meta.s
           return []
 
         const paginator = useMastoClient().v2.search.list({ q: query, type: 'accounts', limit: 25, resolve: true })
-        return (await paginator.next()).value?.accounts ?? []
+        return (await paginator.values().next()).value?.accounts ?? []
       },
       render: createSuggestionRenderer(TiptapMentionList),
     }
@@ -47,7 +47,7 @@ export const TiptapHashtagSuggestion: Partial<SuggestionOptions> = {
       resolve: false,
       excludeUnreviewed: true,
     })
-    return (await paginator.next()).value?.hashtags ?? []
+    return (await paginator.values().next()).value?.hashtags ?? []
   },
   render: createSuggestionRenderer(TiptapHashtagList),
 }