From 338f3bca78b7c3a9e250cb9845cba239fb21c7dc Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Wed, 14 Aug 2024 09:48:56 +0800 Subject: [PATCH 1/4] WIP: infinite scroll on the library with react-query --- packages/web/lib/hooks/useFetchMoreScroll.tsx | 16 +++++--- .../library_items/useLibraryItems.tsx | 39 +++++++++++-------- 2 files changed, 32 insertions(+), 23 deletions(-) diff --git a/packages/web/lib/hooks/useFetchMoreScroll.tsx b/packages/web/lib/hooks/useFetchMoreScroll.tsx index f454645e0..eb7a1759f 100644 --- a/packages/web/lib/hooks/useFetchMoreScroll.tsx +++ b/packages/web/lib/hooks/useFetchMoreScroll.tsx @@ -10,13 +10,17 @@ export const useFetchMore = (callback: () => void, delay = 500): void => { } const callbackInternal = (): void => { - const { - scrollTop, - scrollHeight, - clientHeight - } = window.document.documentElement; + const { scrollTop, scrollHeight, clientHeight } = + window.document.documentElement - if (scrollTop + clientHeight >= scrollHeight - (scrollHeight / 3)) { + if (scrollTop + clientHeight >= scrollHeight - scrollHeight / 3) { + console.log( + 'calling fetchMore: scrollTop + clientHeight >= scrollHeight - scrollHeight / 3', + scrollTop, + clientHeight, + scrollHeight, + scrollHeight / 3 + ) callback() } throttleTimeout.current = undefined diff --git a/packages/web/lib/networking/library_items/useLibraryItems.tsx b/packages/web/lib/networking/library_items/useLibraryItems.tsx index 27d2762db..b193cf827 100644 --- a/packages/web/lib/networking/library_items/useLibraryItems.tsx +++ b/packages/web/lib/networking/library_items/useLibraryItems.tsx @@ -537,7 +537,7 @@ export function useRefreshProcessingItems() { includeContent: false, })) as LibraryItemsData if (result.search.errorCodes?.length) { - throw new Error(result.search.errorCodes[0]) + return undefined } return result.search } @@ -546,33 +546,38 @@ export function useRefreshProcessingItems() { retry: 3, retryDelay: 10, onSuccess: async ( - data: LibraryItems, + data: LibraryItems | undefined, variables: { attempt: number itemIds: string[] } ) => { - let shouldRefetch = false - console.log('got processing items: ', data.edges) - for (const item of data.edges) { - if (item.node.state !== State.PROCESSING) { - overwriteItemPropertiesInCache( - queryClient, - item.node.id, - undefined, - item.node - ) - } else { - shouldRefetch = true + let shouldRefetch = data == undefined + if (data) { + for (const item of data.edges) { + if (item.node.state !== State.PROCESSING) { + overwriteItemPropertiesInCache( + queryClient, + item.node.id, + undefined, + item.node + ) + } else { + shouldRefetch = true + } } + } else { + shouldRefetch = true } if (shouldRefetch && variables.attempt < maxAttempts) { await delay(5000 * variables.attempt + 1) mutation.mutate({ attempt: variables.attempt + 1, - itemIds: data.edges - .filter((item) => item.node.state == State.PROCESSING) - .map((it) => it.node.id), + itemIds: data + ? data.edges + .filter((item) => item.node.state == State.PROCESSING) + .map((it) => it.node.id) + : variables.itemIds, }) } }, From f58ddbeb9a018c1c15c014ce87a297c4a0306388 Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Wed, 14 Aug 2024 09:58:29 +0800 Subject: [PATCH 2/4] Add maxPages and refetchOnMount params --- packages/web/lib/networking/library_items/useLibraryItems.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/web/lib/networking/library_items/useLibraryItems.tsx b/packages/web/lib/networking/library_items/useLibraryItems.tsx index b193cf827..6134d9b6d 100644 --- a/packages/web/lib/networking/library_items/useLibraryItems.tsx +++ b/packages/web/lib/networking/library_items/useLibraryItems.tsx @@ -232,6 +232,8 @@ export function useGetLibraryItems( return response.search }, enabled, + maxPages: 3, + refetchOnMount: false, initialPageParam: '0', getNextPageParam: (lastPage: LibraryItems) => { return lastPage.pageInfo.hasNextPage From 48f427401fa72eec47aa55d92c4987d4094dc55b Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Wed, 14 Aug 2024 10:01:51 +0800 Subject: [PATCH 3/4] Set maxPages to 2, dont disable refetch yet --- packages/web/lib/networking/library_items/useLibraryItems.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/web/lib/networking/library_items/useLibraryItems.tsx b/packages/web/lib/networking/library_items/useLibraryItems.tsx index 6134d9b6d..a3937ec17 100644 --- a/packages/web/lib/networking/library_items/useLibraryItems.tsx +++ b/packages/web/lib/networking/library_items/useLibraryItems.tsx @@ -232,8 +232,7 @@ export function useGetLibraryItems( return response.search }, enabled, - maxPages: 3, - refetchOnMount: false, + maxPages: 2, initialPageParam: '0', getNextPageParam: (lastPage: LibraryItems) => { return lastPage.pageInfo.hasNextPage From e0b1a01f8fed21e7cda32b0a46c797f8e2e7bcd0 Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Wed, 14 Aug 2024 10:19:17 +0800 Subject: [PATCH 4/4] Set a max age on CORs requests --- packages/api/src/utils/corsConfig.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/api/src/utils/corsConfig.ts b/packages/api/src/utils/corsConfig.ts index b31cb4741..2ed6cb334 100644 --- a/packages/api/src/utils/corsConfig.ts +++ b/packages/api/src/utils/corsConfig.ts @@ -19,4 +19,5 @@ export const corsConfig = { 'capacitor://localhost', 'http://localhost', ], + maxAge: 86400, }