2021-08-07 10:18:27 +10:00
|
|
|
import Status from '../status/status.vue'
|
|
|
|
|
|
|
|
const debug = console.log
|
|
|
|
|
|
|
|
const ThreadTree = {
|
|
|
|
components: {
|
|
|
|
Status
|
|
|
|
},
|
|
|
|
name: 'ThreadTree',
|
|
|
|
props: {
|
|
|
|
depth: Number,
|
|
|
|
status: Object,
|
|
|
|
inProfile: Boolean,
|
|
|
|
conversation: Array,
|
|
|
|
collapsable: Boolean,
|
|
|
|
isExpanded: Boolean,
|
|
|
|
pinnedStatusIdsObject: Object,
|
|
|
|
profileUserId: String,
|
|
|
|
|
|
|
|
focused: Function,
|
|
|
|
getHighlight: Function,
|
|
|
|
getReplies: Function,
|
|
|
|
setHighlight: Function,
|
2021-08-07 14:33:06 +10:00
|
|
|
toggleExpanded: Function,
|
|
|
|
|
|
|
|
// to control display of the whole thread forest
|
|
|
|
toggleThreadDisplay: Function,
|
|
|
|
threadDisplayStatus: Object,
|
|
|
|
showThreadRecursively: Function,
|
|
|
|
totalReplyCount: Object,
|
|
|
|
totalReplyDepth: Object
|
2021-08-07 10:18:27 +10:00
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
reverseLookupTable () {
|
|
|
|
return this.conversation.reduce((table, status, index) => {
|
|
|
|
table[status.id] = index
|
|
|
|
return table
|
|
|
|
}, {})
|
|
|
|
},
|
|
|
|
currentReplies () {
|
|
|
|
debug('status:', this.status)
|
|
|
|
debug('getReplies:', this.getReplies(this.status.id))
|
|
|
|
return this.getReplies(this.status.id).map(({ id }) => this.statusById(id))
|
|
|
|
},
|
2021-08-07 14:33:06 +10:00
|
|
|
threadShowing () {
|
|
|
|
return this.threadDisplayStatus[this.status.id] === 'showing'
|
|
|
|
}
|
2021-08-07 10:18:27 +10:00
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
statusById (id) {
|
|
|
|
return this.conversation[this.reverseLookupTable[id]]
|
|
|
|
},
|
|
|
|
collapseThread () {
|
|
|
|
},
|
|
|
|
showThread () {
|
|
|
|
},
|
|
|
|
showAllSubthreads () {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export default ThreadTree
|