From d9866f8ada63cd322f238094d388e883eb94a9ca Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Sat, 31 May 2025 17:16:59 -0500 Subject: [PATCH] Scrolling still broken --- src/screens/PostThread/index.tsx | 45 +++++++++++++++--------- src/state/queries/usePostThread/index.ts | 2 +- 2 files changed, 29 insertions(+), 18 deletions(-) diff --git a/src/screens/PostThread/index.tsx b/src/screens/PostThread/index.tsx index f1117b0f4f..53c709d397 100644 --- a/src/screens/PostThread/index.tsx +++ b/src/screens/PostThread/index.tsx @@ -49,16 +49,23 @@ export function Inner({uri}: {uri: string | undefined}) { setTreeViewEnabled, } = useThreadPreferences() - const {isFetching, error, data, refetch, insertReplies, showHiddenReplies} = - usePostThread({ - enabled: isThreadPreferencesLoaded, - params: { - anchor: uri, - sort: sortReplies, - view: treeViewEnabled ? 'tree' : 'linear', - prioritizeFollowedUsers, - }, - }) + const { + isFetching, + isPlaceholderData, + error, + data, + refetch, + insertReplies, + showHiddenReplies, + } = usePostThread({ + enabled: isThreadPreferencesLoaded, + params: { + anchor: uri, + sort: sortReplies, + view: treeViewEnabled ? 'tree' : 'linear', + prioritizeFollowedUsers, + }, + }) const optimisticOnPostReply = (data: OnPostSuccessData) => { if (data) { @@ -114,11 +121,11 @@ export function Inner({uri}: {uri: string | undefined}) { const anchorOffsetTop = anchorElement.getBoundingClientRect().top const headerHeight = headerElement.getBoundingClientRect().height const scrollPosition = anchorOffsetTop - headerHeight - console.log({ - anchorOffsetTop, - headerHeight, - scrollPosition, - }) + // console.log({ + // anchorOffsetTop, + // headerHeight, + // scrollPosition, + // }) /* * If scroll position is negative, it means the anchor post is above the * top of the screen, meaning the user scrolled the list. In that case, @@ -151,11 +158,14 @@ export function Inner({uri}: {uri: string | undefined}) { const hasExhaustedReplies = useRef(false) const onStartReached = () => { + // console.log('onStartReached') + if (isFetching) return // limit to 100 setMaxParentCount(n => Math.min(100, n + PARENT_CHUNK_SIZE)) } const onEndReached = () => { + // console.log('onEndReached') if (isFetching) return // prevent any state mutations if we know we're done if (hasExhaustedReplies.current) return @@ -197,12 +207,13 @@ export function Inner({uri}: {uri: string | undefined}) { } } - if (totalRepliesCount < maxRepliesCount) { + // TODO should really just count these during traversal, can remove isPlaceholder data after that + if (maxRepliesCount > totalRepliesCount && !isPlaceholderData) { hasExhaustedReplies.current = true } return results - }, [data, deferParents, maxParentCount, maxRepliesCount]) + }, [data, deferParents, maxParentCount, maxRepliesCount, isPlaceholderData]) const renderItem = ({item, index}: {item: ThreadItem; index: number}) => { if (item.type === 'threadPost') { diff --git a/src/state/queries/usePostThread/index.ts b/src/state/queries/usePostThread/index.ts index 401241a565..8cea5ee00d 100644 --- a/src/state/queries/usePostThread/index.ts +++ b/src/state/queries/usePostThread/index.ts @@ -38,7 +38,7 @@ export function usePostThread({ const query = useQuery({ enabled, queryKey, - gcTime: 0, + // gcTime: 0, // TODO faster if we let it cache async queryFn(ctx) { const {data} = await wait( 400,