Fixed #536

src/utils/queryHooks/tags.ts

@@ -1,32 +1,40 @@
-import apiInstance from '@api/instance'
+import apiInstance, { InstanceResponse } from '@api/instance'
 import { AxiosError } from 'axios'
 import {
   QueryFunctionContext,
+  useInfiniteQuery,
+  UseInfiniteQueryOptions,
   useMutation,
   UseMutationOptions,
   useQuery,
   UseQueryOptions
 } from '@tanstack/react-query'
+import { infinitePageParams } from './utils'
 
-type QueryKeyFollowedTags = ['FollowedTags']
-const useFollowedTagsQuery = ({
-  options
-}: {
-  options?: UseQueryOptions<Mastodon.Tag, AxiosError>
-}) => {
+export type QueryKeyFollowedTags = ['FollowedTags']
+const useFollowedTagsQuery = (
+  params: {
+    options?: Omit<
+      UseInfiniteQueryOptions<InstanceResponse<Mastodon.Tag[]>, AxiosError>,
+      'getPreviousPageParam' | 'getNextPageParam'
+    >
+  } | void
+) => {
   const queryKey: QueryKeyFollowedTags = ['FollowedTags']
-  return useQuery(
+  return useInfiniteQuery(
     queryKey,
     async ({ pageParam }: QueryFunctionContext<QueryKeyFollowedTags>) => {
       const params: { [key: string]: string } = { ...pageParam }
-      const res = await apiInstance<Mastodon.Tag>({ method: 'get', url: `followed_tags`, params })
-      return res.body
+      return await apiInstance<Mastodon.Tag[]>({ method: 'get', url: `followed_tags`, params })
     },
-    options
+    {
+      ...params?.options,
+      ...infinitePageParams
+    }
   )
 }
 
-type QueryKeyTags = ['Tags', { tag: string }]
+export type QueryKeyTags = ['Tags', { tag: string }]
 const queryFunction = async ({ queryKey }: QueryFunctionContext<QueryKeyTags>) => {
   const { tag } = queryKey[1]
 
@@ -43,15 +51,12 @@ const useTagsQuery = ({
   return useQuery(queryKey, queryFunction, options)
 }
 
-type MutationVarsAnnouncement = { tag: string; type: 'follow'; to: boolean }
-const mutationFunction = async ({ tag, type, to }: MutationVarsAnnouncement) => {
-  switch (type) {
-    case 'follow':
-      return apiInstance<{}>({
-        method: 'post',
-        url: `tags/${tag}/${to ? 'follow' : 'unfollow'}`
-      })
-  }
+type MutationVarsAnnouncement = { tag: string; to: boolean }
+const mutationFunction = async ({ tag, to }: MutationVarsAnnouncement) => {
+  return apiInstance<{}>({
+    method: 'post',
+    url: `tags/${tag}/${to ? 'follow' : 'unfollow'}`
+  })
 }
 const useTagsMutation = (options: UseMutationOptions<{}, AxiosError, MutationVarsAnnouncement>) => {
   return useMutation(mutationFunction, options)

src/utils/queryHooks/utils.ts

@@ -0,0 +1,8 @@
+import { InstanceResponse } from '@api/instance'
+
+export const infinitePageParams = {
+  getPreviousPageParam: (firstPage: InstanceResponse<any>) =>
+    firstPage.links?.prev && { since_id: firstPage.links.next },
+  getNextPageParam: (lastPage: InstanceResponse<any>) =>
+    lastPage.links?.next && { max_id: lastPage.links.next }
+}