WIP kill me

src/view/com/post-thread/PostThread.tsx

@@ -90,7 +90,6 @@ type ThreadSkeletonParts = {
 }
 
 const keyExtractor = (item: RowItem) => {
-  console.log(item._reactKey)
   return item._reactKey
 }
 
@@ -258,7 +257,6 @@ export function PostThread({uri}: {uri: string | undefined}) {
     fetchedAt,
     randomCache,
   ])
-  console.log({thread, skeleton})
 
   const error = React.useMemo(() => {
     if (AppBskyFeedDefs.isNotFoundPost(thread)) {
@@ -299,6 +297,9 @@ export function PostThread({uri}: {uri: string | undefined}) {
       // maintainVisibleContentPosition and onContentSizeChange
       // to "hold onto" the correct row instead of the first one.
 
+      /*
+       * This is basically `!!parents.length`, see notes on `isParentLoading`
+       */
       if (!highlightedPost.ctx.isParentLoading && !deferParents) {
         // When progressively revealing parents, rendering a placeholder
         // here will cause scrolling jumps. Don't add it unless you test it.
@@ -325,6 +326,8 @@ export function PostThread({uri}: {uri: string | undefined}) {
     return arr
   }, [skeleton, deferParents, maxParents, maxReplies])
 
+  console.log({anchorIndex: posts.findIndex(p => p.ctx?.isHighlightedPost)})
+
   // This is only used on the web to keep the post in view when its parents load.
   // On native, we rely on `maintainVisibleContentPosition` instead.
   const didAdjustScrollWeb = useRef<boolean>(false)
@@ -340,11 +343,8 @@ export function PostThread({uri}: {uri: string | undefined}) {
       const headerNode = headerRef.current
       if (postNode && headerNode) {
         let pageY = (postNode as any as Element).getBoundingClientRect().top
-      console.log({pageY})
         pageY -= (headerNode as any as Element).getBoundingClientRect().height
-      console.log({pageY})
         pageY = Math.max(0, pageY)
-      console.log({pageY})
         ref.current?.scrollToOffset({
           animated: false,
           offset: pageY,
@@ -423,6 +423,8 @@ export function PostThread({uri}: {uri: string | undefined}) {
     (skeleton.highlightedPost.ctx.isParentLoading ||
       Boolean(skeleton?.parents && skeleton.parents.length > 0))
 
+  console.log({hasParents})
+
   const renderItem = ({item, index}: {item: RowItem; index: number}) => {
     if (item === REPLY_PROMPT && hasSession) {
       return (

src/view/screens/PostThread.tsx

@@ -13,9 +13,7 @@ import {cleanError} from '#/lib/strings/errors'
 import {makeRecordUri} from '#/lib/strings/url-helpers'
 import {isNative} from '#/platform/detection'
 import {useSetMinimalShellMode} from '#/state/shell'
-{
-  /* import {PostThread as PostThreadComponent} from '#/view/com/post-thread/PostThread' */
-}
+import {PostThread as PostThreadComponent} from '#/view/com/post-thread/PostThread'
 import {useInitialNumToRender} from '#/lib/hooks/useInitialNumToRender'
 import {useOpenComposer} from '#/lib/hooks/useOpenComposer'
 import {ScrollProvider} from '#/lib/ScrollContext'
@@ -32,7 +30,10 @@ import {PostThreadShowHiddenReplies} from '#/view/com/post-thread/PostThreadShow
 import {List, type ListMethods} from '#/view/com/util/List'
 import {atoms as a, useBreakpoints, useTheme, web} from '#/alf'
 import {Button, ButtonIcon} from '#/components/Button'
+import {Link} from '#/components/Link'
+import {makeProfileLink} from '#/lib/routes/links'
 import {SettingsSliderVertical_Stroke2_Corner0_Rounded as SettingsSlider} from '#/components/icons/SettingsSlider'
+import {CirclePlus_Stroke2_Corner0_Rounded as CirclePlus} from '#/components/icons/CirclePlus'
 import * as Layout from '#/components/Layout'
 import {ListFooter} from '#/components/Lists'
 import * as Menu from '#/components/Menu'
@@ -41,7 +42,7 @@ import {Text} from '#/components/Typography'
 const MAINTAIN_VISIBLE_CONTENT_POSITION = {
   // We don't insert any elements before the root row while loading.
   // So the row we want to use as the scroll anchor is the first row.
-  minIndexForVisible: 1,
+  minIndexForVisible: 0,
 }
 
 type Props = NativeStackScreenProps<CommonNavigatorParams, 'PostThread'>
@@ -232,13 +233,11 @@ export function Inner({uri}: {uri: string | undefined}) {
             // prevPost={prev}
             // nextPost={next}
             isHighlightedPost={item.ui.isAnchor}
-            // @ts-expect-error
-            hasMore={item.value.hasUnhydratedReplies}
+            hasMore={false} // TODO need to replace this entirely
             showChildReplyLine={item.ui.showChildReplyLine}
             showParentReplyLine={item.ui.showParentReplyLine}
             hasPrecedingItem={
-              // @ts-expect-error
-              item.ui.showParentReplyLine || !!item.value.hasUnhydratedParents
+              item.ui.showParentReplyLine
             } // !!hasUnrevealedParents // TODO
             overrideBlur={
               shownHiddenReplyKinds.has(HiddenReplyKind.Muted) && item.depth > 0
@@ -248,6 +247,68 @@ export function Inner({uri}: {uri: string | undefined}) {
           />
         </View>
       )
+    } else if (item.type === 'readMore') {
+      return (
+        <View style={[a.flex_row, a.px_sm]}>
+          {Array.from(Array(item.indent - 1)).map((_, n: number) => (
+            <View
+              key={`${item.key}-padding-${n}`}
+              style={[
+                a.ml_sm,
+                t.atoms.border_contrast_low,
+                {
+                  borderLeftWidth: 2,
+                  paddingLeft: a.pl_sm.paddingLeft - 2, // minus border
+                },
+              ]}
+            />
+          ))}
+          <View style={[a.ml_sm]}>
+            <View
+              style={[
+                t.atoms.border_contrast_low,
+                {
+                  borderLeftWidth: 2,
+                  borderBottomWidth: 2,
+                  borderBottomLeftRadius: a.rounded_sm.borderRadius,
+                  height: 12,
+                  width: a.pl_sm.paddingLeft * 2,
+                },
+              ]}
+            />
+          </View>
+          <Link
+            label={_(msg`Read more replies`)}
+            to={makeProfileLink(
+              {
+                did: item.nextAnchorUri.host,
+                handle: item.nextAnchor.value.post.author.handle,
+              },
+              'post',
+              item.nextAnchorUri.rkey,
+            )}
+            style={[a.pt_2xs, a.pb_sm, a.gap_xs]}>
+            {({hovered, pressed}) => {
+              return (
+                <>
+                  <CirclePlus
+                    fill={t.atoms.text_contrast_high.color}
+                    width={18}
+                  />
+                  <Text
+                    style={[
+                      a.text_sm,
+                      t.atoms.text_contrast_medium,
+                      (hovered || pressed) && a.underline,
+                    ]}>
+                    Read {item.replyCount} more replies
+                  </Text>
+                </>
+              )
+            }}
+          </Link>
+        </View>
+      )
     } else if (item.type === 'threadPostBlocked') {
       return (
         <View
@@ -297,6 +358,8 @@ export function Inner({uri}: {uri: string | undefined}) {
     return null
   }
 
+  console.log('PostThreadScreen', data?.anchorIndex)
+
   return (
     <>
       <Layout.Header.Outer headerRef={headerRef}>
@@ -337,7 +400,7 @@ export function Inner({uri}: {uri: string | undefined}) {
              */
             maintainVisibleContentPosition={
               isNative // && hasParents // TODO not sure we need this
-                ? MAINTAIN_VISIBLE_CONTENT_POSITION
+                ? { minIndexForVisible: 0 } // MAINTAIN_VISIBLE_CONTENT_POSITION
                 : undefined
             }
             desktopFixedHeight