From 2a510205c3e18bc1c3ff253dc4521909857cd530 Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Wed, 15 Sep 2021 23:35:17 -0400
Subject: [PATCH] Fix virtual scrolling for tree threading

Ref: tree-threading
---
 src/components/conversation/conversation.js  | 15 ++++++++++-----
 src/components/conversation/conversation.vue |  2 +-
 src/components/thread_tree/thread_tree.js    |  7 +++++++
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index d4972fbc..1e97bbf0 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -101,13 +101,16 @@ const conversation = {
     showOtherRepliesButtonInsideStatus () {
       return this.otherRepliesButtonPosition === 'inside'
     },
-    hideStatus () {
+    suspendable () {
       if (this.$refs.statusComponent && this.$refs.statusComponent[0]) {
-        return this.virtualHidden && this.$refs.statusComponent[0].suspendable
+        return this.$refs.statusComponent.every(s => s.suspendable)
       } else {
-        return this.virtualHidden
+        return true
       }
     },
+    hideStatus () {
+      return this.virtualHidden && this.suspendable
+    },
     status () {
       return this.$store.state.statuses.allStatusesObject[this.statusId]
     },
@@ -243,7 +246,6 @@ const conversation = {
       return this.topLevel
     },
     diveRoot () {
-      (() => {})(this.conversation)
       const statusId = this.inlineDivePosition || this.statusId
       const isTopLevel = !this.parentOf(statusId)
       return isTopLevel ? null : statusId
@@ -257,7 +259,10 @@ const conversation = {
     shouldShowAllConversationButton () {
       // The "show all conversation" button tells the user that there exist
       // other toplevel statuses, so do not show it if there is only a single root
-      return this.diveMode && this.topLevel.length > 1
+      return this.isTreeView && this.isExpanded && this.diveMode && this.topLevel.length > 1
+    },
+    shouldShowAncestors () {
+      return this.isTreeView && this.isExpanded && this.ancestorsOf(this.diveRoot).length
     },
     replies () {
       let i = 1
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index b3d97075..0cd74539 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -43,7 +43,7 @@
         class="thread-body"
       >
         <div
-          v-if="ancestorsOf(diveRoot).length"
+          v-if="shouldShowAncestors"
           class="thread-ancestors"
         >
           <div
diff --git a/src/components/thread_tree/thread_tree.js b/src/components/thread_tree/thread_tree.js
index cb1d2242..fd21c5bc 100644
--- a/src/components/thread_tree/thread_tree.js
+++ b/src/components/thread_tree/thread_tree.js
@@ -48,6 +48,13 @@ const ThreadTree = {
     dive: Function
   },
   computed: {
+    suspendable () {
+      const selfSuspendable = this.$refs.statusComponent ? this.$refs.statusComponent.suspendable : true
+      if (this.$refs.childComponent) {
+        return selfSuspendable && this.$refs.childComponent.every(s => s.suspendable)
+      }
+      return selfSuspendable
+    },
     reverseLookupTable () {
       return this.conversation.reduce((table, status, index) => {
         table[status.id] = index