Fix virtual scrolling for tree threading

Ref: tree-threading
This commit is contained in:
Tusooa Zhu 2021-09-15 23:35:17 -04:00
parent 0db5a5a581
commit 2a510205c3
No known key found for this signature in database
GPG key ID: 7B467EDE43A08224
3 changed files with 18 additions and 6 deletions

View file

@ -101,13 +101,16 @@ const conversation = {
showOtherRepliesButtonInsideStatus () { showOtherRepliesButtonInsideStatus () {
return this.otherRepliesButtonPosition === 'inside' return this.otherRepliesButtonPosition === 'inside'
}, },
hideStatus () { suspendable () {
if (this.$refs.statusComponent && this.$refs.statusComponent[0]) { 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 { } else {
return this.virtualHidden return true
} }
}, },
hideStatus () {
return this.virtualHidden && this.suspendable
},
status () { status () {
return this.$store.state.statuses.allStatusesObject[this.statusId] return this.$store.state.statuses.allStatusesObject[this.statusId]
}, },
@ -243,7 +246,6 @@ const conversation = {
return this.topLevel return this.topLevel
}, },
diveRoot () { diveRoot () {
(() => {})(this.conversation)
const statusId = this.inlineDivePosition || this.statusId const statusId = this.inlineDivePosition || this.statusId
const isTopLevel = !this.parentOf(statusId) const isTopLevel = !this.parentOf(statusId)
return isTopLevel ? null : statusId return isTopLevel ? null : statusId
@ -257,7 +259,10 @@ const conversation = {
shouldShowAllConversationButton () { shouldShowAllConversationButton () {
// The "show all conversation" button tells the user that there exist // 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 // 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 () { replies () {
let i = 1 let i = 1

View file

@ -43,7 +43,7 @@
class="thread-body" class="thread-body"
> >
<div <div
v-if="ancestorsOf(diveRoot).length" v-if="shouldShowAncestors"
class="thread-ancestors" class="thread-ancestors"
> >
<div <div

View file

@ -48,6 +48,13 @@ const ThreadTree = {
dive: Function dive: Function
}, },
computed: { 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 () { reverseLookupTable () {
return this.conversation.reduce((table, status, index) => { return this.conversation.reduce((table, status, index) => {
table[status.id] = index table[status.id] = index