Checkpoint: learned new things, reset to base

This commit is contained in:
Eric Bailey
2025-06-05 14:19:40 -05:00
parent 6c582cceb4
commit 8710e61529
+18 -28
View File
@@ -102,28 +102,27 @@ export function Inner({uri}: {uri: string | undefined}) {
/** /**
* WEB ONLY * WEB ONLY
* *
* Needed after clicking into a post. This handler ensures that once the * Needed after clicking into a post or on a cold load of a thread screen.
* parents load in, the anchor post is still at the top of the screen. * 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.
*/ */
{ const hasScrolledToAnchor = useRef(false)
/* const hasScrolledToAnchor = useRef(false) */
}
const onContentSizeChangeWebOnly = web(() => { const onContentSizeChangeWebOnly = web(() => {
const anchorElement = anchorRef.current as any as Element const anchorElement = anchorRef.current as any as Element
const headerElement = headerRef.current as any as Element const headerElement = headerRef.current as any as Element
if (
anchorElement && /*
headerElement && * When this block runs, all posts in place and are about to paint. Thee
!deferParents * `List` is at scroll position 0, so measurements taken from `top`
//!hasScrolledToAnchor.current * correspond to the top of the List (screen).
) { *
console.log('HANDLE') * We measure this synchronously (before paint) and scroll the list to the
// distance from top of the list (screen) * 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 anchorOffsetTop = anchorElement.getBoundingClientRect().top
const headerHeight = headerElement.getBoundingClientRect().height const headerHeight = headerElement.getBoundingClientRect().height
const scrollPosition = anchorOffsetTop - headerHeight const scrollPosition = anchorOffsetTop - headerHeight
@@ -134,20 +133,11 @@ export function Inner({uri}: {uri: string | undefined}) {
* at all. * at all.
*/ */
if (scrollPosition >= headerHeight) { if (scrollPosition >= headerHeight) {
console.log('Scrolling to anchor post at', scrollPosition)
listRef.current?.scrollToOffset({ listRef.current?.scrollToOffset({
animated: false, animated: false,
offset: scrollPosition, offset: scrollPosition,
}) })
{ hasScrolledToAnchor.current = true
/* hasScrolledToAnchor.current = true */
}
} else {
console.log('Scrolling to first position')
listRef.current?.scrollToOffset({
animated: false,
offset: headerHeight * -1,
})
} }
} }
}) })