diff --git a/src/screens/PostThread/components/ThreadReply.tsx b/src/screens/PostThread/components/ThreadReply.tsx
index 51b448652e..fc10ad0862 100644
--- a/src/screens/PostThread/components/ThreadReply.tsx
+++ b/src/screens/PostThread/components/ThreadReply.tsx
@@ -192,22 +192,27 @@ let PostThreadItemLoaded = ({
t.atoms.border_contrast_low,
],
]}>
- {Array.from(Array(indents)).map((_, n: number) => (
-
- ))}
+ {Array.from(Array(indents)).map((_, n: number) => {
+ const isLastIteration = n === indents - 1
+ return (
+
+ )
+ })}
{item.ui.indent > 1 && item.ui.parentHasBranchingReplies && (
= 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
diff --git a/src/state/queries/usePostThread/types.ts b/src/state/queries/usePostThread/types.ts
index d28707e228..a0ccc24a3b 100644
--- a/src/state/queries/usePostThread/types.ts
+++ b/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
}
}
| {
diff --git a/src/state/queries/usePostThread/views.ts b/src/state/queries/usePostThread/views.ts
index b04afba43e..189c52942a 100644
--- a/src/state/queries/usePostThread/views.ts
+++ b/src/state/queries/usePostThread/views.ts
@@ -81,6 +81,15 @@ export function threadPost({
moderationOpts: ModerationOpts
traversalMetadata?: TraversalMetadata
}): Extract {
+ 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,
},
}
}