octo/tooot
1
0
Fork 0
mirror of https://github.com/tooot-app/app synced 2025-06-05 22:19:13 +02:00
Code Issues Projects Releases Wiki Activity

Refine scroll after fetch newer

Browse Source
This commit is contained in:
xmflsct
2023-01-07 12:10:41 +01:00
parent 1704c0401c
commit 88528f5293
1 changed files with 43 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/Timeline/Refresh.tsx
View File

@ -31,7 +31,7 @@ export interface Props {
disableRefresh?: boolean
}
const CONTAINER_HEIGHT = StyleConstants.Spacing.M * 2
const CONTAINER_HEIGHT = StyleConstants.Spacing.M * 2.5
export const SEPARATION_Y_1 = -(CONTAINER_HEIGHT / 2 + StyleConstants.Font.Size.S / 2)
export const SEPARATION_Y_2 = -(CONTAINER_HEIGHT * 1.5 + StyleConstants.Font.Size.S / 2)
@ -119,6 +119,7 @@ const TimelineRefresh: React.FC<Props> = ({
[isFetching]
)
const fetchAndScrolled = useSharedValue(false)
const runFetchPrevious = async () => {
if (prevActive.current) return
@ -140,7 +141,8 @@ const TimelineRefresh: React.FC<Props> = ({
: { min_id: firstPage.links.prev.id })
},
meta: {}
}).then(res => {
})
.then(res => {
queryClient.setQueryData<
InfiniteData<
PagedResponse<(Mastodon.Status | Mastodon.Notification | Mastodon.Conversation)[]>
@ -149,13 +151,21 @@ const TimelineRefresh: React.FC<Props> = ({
if (!old) return old
prevCache.current = res.body.slice(0, -PREV_PER_BATCH)
return { ...old, pages: [{ ...res, body: res.body.slice(-PREV_PER_BATCH) }, ...old.pages] }
})
})
return {
...old,
pages: [{ ...res, body: res.body.slice(-PREV_PER_BATCH) }, ...old.pages]
}
useEffect(() => {
const loop = async () => {
for await (const _ of Array(Math.ceil((prevCache.current?.length || 0) / PREV_PER_BATCH))) {
})
return res.body.length - PREV_PER_BATCH
})
.then(async nextLength => {
for (let [index] of Array(Math.ceil(nextLength / PREV_PER_BATCH)).entries()) {
if (!fetchAndScrolled.value && index < 3 && scrollY.value > 15) {
fetchAndScrolled.value = true
flRef.current?.scrollToOffset({ offset: scrollY.value - 15, animated: true })
}
await new Promise(promise => setTimeout(promise, 32))
queryClient.setQueryData<
InfiniteData<
@ -181,13 +191,10 @@ const TimelineRefresh: React.FC<Props> = ({
})
}
})
break
}
prevActive.current = false
})
}
loop()
}, [prevCache.current])
const runFetchLatest = async () => {
queryClient.invalidateQueries(queryKey)