From 8710e61529f6dad99f909f0f51003deb5377287f Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Thu, 5 Jun 2025 14:19:40 -0500 Subject: [PATCH] Checkpoint: learned new things, reset to base --- src/screens/PostThread/index.tsx | 46 +++++++++++++------------------- 1 file changed, 18 insertions(+), 28 deletions(-) diff --git a/src/screens/PostThread/index.tsx b/src/screens/PostThread/index.tsx index f0b68a2e1c..f2966f827d 100644 --- a/src/screens/PostThread/index.tsx +++ b/src/screens/PostThread/index.tsx @@ -102,28 +102,27 @@ export function Inner({uri}: {uri: string | undefined}) { /** * WEB ONLY * - * Needed after clicking into a post. This handler ensures that once the - * parents load in, the anchor post is still at the top of the screen. - * - * When this fires, the `List` is scrolled all the way to the top, so - * measurements taken from `top` correspond to the top of the screen. This - * handler scrolls the `List` to the top of the highlighted post after - * parents are prepended, offset by any fixed elements like the header. + * Needed after clicking into a post or on a cold load of a thread screen. + * This handler ensures that once the parents load in, the anchor post is + * still at the top of the screen. */ - { - /* const hasScrolledToAnchor = useRef(false) */ - } + const hasScrolledToAnchor = useRef(false) const onContentSizeChangeWebOnly = web(() => { const anchorElement = anchorRef.current as any as Element const headerElement = headerRef.current as any as Element - if ( - anchorElement && - headerElement && - !deferParents - //!hasScrolledToAnchor.current - ) { - console.log('HANDLE') - // distance from top of the list (screen) + + /* + * When this block runs, all posts in place and are about to paint. Thee + * `List` is at scroll position 0, so measurements taken from `top` + * correspond to the top of the List (screen). + * + * We measure this synchronously (before paint) and scroll the list to the + * top of the `anchorElement`, minus the height of any fixed elements like + * the Header. + * + * We only want this to run once. + */ + if (anchorElement && headerElement && !hasScrolledToAnchor.current) { const anchorOffsetTop = anchorElement.getBoundingClientRect().top const headerHeight = headerElement.getBoundingClientRect().height const scrollPosition = anchorOffsetTop - headerHeight @@ -134,20 +133,11 @@ export function Inner({uri}: {uri: string | undefined}) { * at all. */ if (scrollPosition >= headerHeight) { - console.log('Scrolling to anchor post at', scrollPosition) listRef.current?.scrollToOffset({ animated: false, offset: scrollPosition, }) - { - /* hasScrolledToAnchor.current = true */ - } - } else { - console.log('Scrolling to first position') - listRef.current?.scrollToOffset({ - animated: false, - offset: headerHeight * -1, - }) + hasScrolledToAnchor.current = true } } })