Benature/omnivore
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: infinite scroll on the library with react-query

Browse Source
This commit is contained in:
Jackson Harper
2024-08-14 09:48:56 +08:00
parent 3a6dbf9032
commit 338f3bca78
2 changed files with 32 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
packages/web/lib/hooks/useFetchMoreScroll.tsx
View File

@ -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

39
packages/web/lib/networking/library_items/useLibraryItems.tsx
View File

@ -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,
})
}
},