Almost there with read mores

src/screens/PostThread/components/ThreadReply.tsx

@@ -192,22 +192,27 @@ let PostThreadItemLoaded = ({
             t.atoms.border_contrast_low,
           ],
       ]}>
-      {Array.from(Array(indents)).map((_, n: number) => (
-        <View
-          key={`${post.uri}-padding-${n}`}
-          style={[
-            t.atoms.border_contrast_low,
-            {
-              borderRightWidth:
-                item.ui.isDeadEnd && n === indents - 1 && !item.ui.hasReadMore
-                  ? 0
-                  : REPLY_LINE_WIDTH,
-              width: TREE_INDENT + TREE_AVI_WIDTH / 2,
-              left: 1,
-            },
-          ]}
-        />
-      ))}
+      {Array.from(Array(indents)).map((_, n: number) => {
+        const isLastIteration = n === indents - 1
+        return (
+          <View
+            key={`${post.uri}-padding-${n}`}
+            style={[
+              t.atoms.border_contrast_low,
+              {
+                borderRightWidth:
+                  isLastIteration &&
+                  item.ui.isDeadEnd &&
+                  !item.ui.precedesParentReadMore
+                    ? 0
+                    : REPLY_LINE_WIDTH,
+                width: TREE_INDENT + TREE_AVI_WIDTH / 2,
+                left: 1,
+              },
+            ]}
+          />
+        )
+      })}
       <View style={a.flex_1}>
         <SubtleHover>
           <View
@@ -220,6 +225,9 @@ let PostThreadItemLoaded = ({
                 !item.ui.showParentReplyLine && a.pt_lg,
                 !item.ui.showChildReplyLine && a.pb_sm,
               ],
+              item.ui.isDeadEnd &&
+                !item.ui.precedesParentReadMore &&
+                !item.ui.precedesChildReadMore && [a.pb_sm],
             ]}>
             {item.ui.indent > 1 && item.ui.parentHasBranchingReplies && (
               <View

src/state/queries/usePostThread/traversal.ts

@@ -59,12 +59,15 @@ export function flatten(
 
             if (item.depth <= parent.depth) {
               /*
-               * Find the previous post item and set the `hasReadMore` flag
+               * Find the previous post item and set the read more flags
                */
               for (let ui = i - 1; ui >= 0; ui--) {
                 let prev = flattened[ui]
                 if (prev.type === 'threadPost') {
-                  prev.ui.hasReadMore = true
+                  prev.ui.precedesParentReadMore =
+                    prev.ui.indent - 1 === parent.ui.indent // true
+                  prev.ui.precedesChildReadMore =
+                    prev.ui.indent === item.ui.indent
                   break
                 }
               }
@@ -107,12 +110,15 @@ export function flatten(
               const parent = parents[pi]
               if (parent.depth <= item.depth) {
                 /*
-                 * Find the previous post item and set the `hasReadMore` flag
+                 * Find the previous post item and set the read more flags
                  */
                 for (let ui = i; ui >= 0; ui--) {
                   let prev = flattened[ui]
                   if (prev.type === 'threadPost') {
-                    prev.ui.hasReadMore = true
+                    prev.ui.precedesParentReadMore =
+                      prev.ui.indent - 1 === parent.ui.indent
+                    prev.ui.precedesChildReadMore =
+                      prev.ui.indent === item.ui.indent
                     break
                   }
                 }
@@ -141,7 +147,7 @@ export function flatten(
       }
     }
   }
-  // console.log(flattened)
+  console.log(flattened)
 
   /*
    * Insert hidden items and buttons to show them

src/state/queries/usePostThread/types.ts

@@ -52,7 +52,18 @@ export type Slice =
         indent: number
         parentHasBranchingReplies: boolean
         isDeadEnd: boolean
-        hasReadMore?: boolean
+        /**
+         * Populated during the final traversal of the thread. Denotes whether
+         * there is a "Read more" link for the parent immediately following
+         * this item.
+         */
+        precedesParentReadMore?: boolean
+        /**
+         * Populated during the final traversal of the thread. Denotes whether
+         * there is a "Read more" link for this item immediately following
+         * this item.
+         */
+        precedesChildReadMore?: boolean
       }
     }
   | {

src/state/queries/usePostThread/views.ts

@@ -81,6 +81,15 @@ export function threadPost({
   moderationOpts: ModerationOpts
   traversalMetadata?: TraversalMetadata
 }): Extract<Slice, {type: 'threadPost'}> {
+  const parentHasBranchingReplies = !!traversalMetadata?.hasBranchingReplies
+  /*
+   * Indent differs from depth in cases where the tree has no branches, and so
+   * we can maintain the more shallow depth of the parent.
+   */
+  const indent = parentHasBranchingReplies
+    ? depth
+    : traversalMetadata?.indent || depth
+
   return {
     type: 'threadPost',
     key: uri,
@@ -101,11 +110,13 @@ export function threadPost({
       isAnchor: depth === 0,
       showParentReplyLine: !!oneUp && oneUp.depth !== 0 && oneUp.depth < depth,
       showChildReplyLine: (value.post.replyCount || 0) > 0,
-      indent: traversalMetadata?.hasBranchingReplies
-        ? depth
-        : traversalMetadata?.indent || depth,
-      parentHasBranchingReplies: !!traversalMetadata?.hasBranchingReplies,
-      isDeadEnd: !oneDown || oneDown?.depth < depth,
+      indent,
+      parentHasBranchingReplies,
+      /*
+       * If there are no slices below this one, or the next slice is less
+       * indented than the computed indent for this post.
+       */
+      isDeadEnd: !oneDown || oneDown?.depth < indent,
     },
   }
 }