aboutsummaryrefslogtreecommitdiff
path: root/src/components/thread_tree/thread_tree.js
blob: 71e63725418c662fb9c11793167ac67a1360118a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
import Status from '../status/status.vue'

import { library } from '@fortawesome/fontawesome-svg-core'
import {
  faAngleDoubleDown,
  faAngleDoubleRight
} from '@fortawesome/free-solid-svg-icons'

library.add(
  faAngleDoubleDown,
  faAngleDoubleRight
)

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,
    highlight: String,
    getReplies: Function,
    setHighlight: Function,
    toggleExpanded: Function,

    simple: Boolean,
    // to control display of the whole thread forest
    toggleThreadDisplay: Function,
    threadDisplayStatus: Object,
    showThreadRecursively: Function,
    totalReplyCount: Object,
    totalReplyDepth: Object,
    statusContentProperties: Object,
    setStatusContentProperty: Function,
    toggleStatusContentProperty: Function,
    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
        return table
      }, {})
    },
    currentReplies () {
      return this.getReplies(this.status.id).map(({ id }) => this.statusById(id))
    },
    threadShowing () {
      return this.threadDisplayStatus[this.status.id] === 'showing'
    },
    currentProp () {
      return this.statusContentProperties[this.status.id]
    }
  },
  methods: {
    statusById (id) {
      return this.conversation[this.reverseLookupTable[id]]
    },
    collapseThread () {
    },
    showThread () {
    },
    showAllSubthreads () {
    },
    toggleCurrentProp (name) {
      this.toggleStatusContentProperty(this.status.id, name)
    },
    setCurrentProp (name, newVal) {
      this.setStatusContentProperty(this.status.id, name)
    }
  }
}

export default ThreadTree