Show just-posted replies above OP replies (#4901)

* Unify onPostReply handler

* Show just-posted replies above OP replies

* Only do this for the highlighted post or thread mode

It's confusing to have your post displace OP thread or other people's leaf posts.

1 files changed, 29 insertions, 4 deletions

diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread.tsx
index 704c7d325..c64be8d67 100644
--- a/src/view/com/post-thread/PostThread.tsx
+++ b/src/view/com/post-thread/PostThread.tsx
@@ -160,12 +160,22 @@ export function PostThread({uri}: {uri: string | undefined}) {
     return cache
   }, [thread, moderationOpts])
 
+  const [justPostedUris, setJustPostedUris] = React.useState(
+    () => new Set<string>(),
+  )
+
   const skeleton = React.useMemo(() => {
     const threadViewPrefs = preferences?.threadViewPrefs
     if (!threadViewPrefs || !thread) return null
 
     return createThreadSkeleton(
-      sortThread(thread, threadViewPrefs, threadModerationCache, currentDid),
+      sortThread(
+        thread,
+        threadViewPrefs,
+        threadModerationCache,
+        currentDid,
+        justPostedUris,
+      ),
       !!currentDid,
       treeView,
       threadModerationCache,
@@ -178,6 +188,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
     treeView,
     threadModerationCache,
     hiddenRepliesState,
+    justPostedUris,
   ])
 
   const error = React.useMemo(() => {
@@ -302,6 +313,20 @@ export function PostThread({uri}: {uri: string | undefined}) {
     setMaxReplies(prev => prev + 50)
   }, [isFetching, maxReplies, posts.length])
 
+  const onPostReply = React.useCallback(
+    (postUri: string | undefined) => {
+      refetch()
+      if (postUri) {
+        setJustPostedUris(set => {
+          const nextSet = new Set(set)
+          nextSet.add(postUri)
+          return nextSet
+        })
+      }
+    },
+    [refetch],
+  )
+
   const {openComposer} = useComposerControls()
   const onPressReply = React.useCallback(() => {
     if (thread?.type !== 'post') {
@@ -315,9 +340,9 @@ export function PostThread({uri}: {uri: string | undefined}) {
         author: thread.post.author,
         embed: thread.post.embed,
       },
-      onPost: () => refetch(),
+      onPost: onPostReply,
     })
-  }, [openComposer, thread, refetch])
+  }, [openComposer, thread, onPostReply])
 
   const canReply = !error && rootPost && !rootPost.viewer?.replyDisabled
   const hasParents =
@@ -415,7 +440,7 @@ export function PostThread({uri}: {uri: string | undefined}) {
                 HiddenRepliesState.ShowAndOverridePostHider &&
               item.ctx.depth > 0
             }
-            onPostReply={refetch}
+            onPostReply={onPostReply}
             hideTopBorder={index === 0 && !item.ctx.isParentLoading}
           />
         </View>