aboutsummaryrefslogtreecommitdiff
path: root/src/components/extra_buttons/extra_buttons.js
blob: 48b960b2b7f96c914c3ae595c8e0ece2a5732d6b (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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
import Popover from '../popover/popover.vue'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
  faEllipsisH,
  faBookmark,
  faEyeSlash,
  faThumbtack,
  faShareAlt,
  faExternalLinkAlt,
  faHistory,
  faPlus,
  faTimes
} from '@fortawesome/free-solid-svg-icons'
import {
  faBookmark as faBookmarkReg,
  faFlag
} from '@fortawesome/free-regular-svg-icons'

library.add(
  faEllipsisH,
  faBookmark,
  faBookmarkReg,
  faEyeSlash,
  faThumbtack,
  faShareAlt,
  faExternalLinkAlt,
  faFlag,
  faHistory,
  faPlus,
  faTimes
)

const ExtraButtons = {
  props: ['status'],
  components: {
    Popover,
    ConfirmModal
  },
  data () {
    return {
      expanded: false,
      showingDeleteDialog: false
    }
  },
  methods: {
    onShow () {
      this.expanded = true
    },
    onClose () {
      this.expanded = false
    },
    deleteStatus () {
      if (this.shouldConfirmDelete) {
        this.showDeleteStatusConfirmDialog()
      } else {
        this.doDeleteStatus()
      }
    },
    doDeleteStatus () {
      this.$store.dispatch('deleteStatus', { id: this.status.id })
      this.hideDeleteStatusConfirmDialog()
    },
    showDeleteStatusConfirmDialog () {
      this.showingDeleteDialog = true
    },
    hideDeleteStatusConfirmDialog () {
      this.showingDeleteDialog = false
    },
    pinStatus () {
      this.$store.dispatch('pinStatus', this.status.id)
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    unpinStatus () {
      this.$store.dispatch('unpinStatus', this.status.id)
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    muteConversation () {
      this.$store.dispatch('muteConversation', this.status.id)
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    unmuteConversation () {
      this.$store.dispatch('unmuteConversation', this.status.id)
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    copyLink () {
      navigator.clipboard.writeText(this.statusLink)
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    bookmarkStatus () {
      this.$store.dispatch('bookmark', { id: this.status.id })
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    unbookmarkStatus () {
      this.$store.dispatch('unbookmark', { id: this.status.id })
        .then(() => this.$emit('onSuccess'))
        .catch(err => this.$emit('onError', err.error.error))
    },
    reportStatus () {
      this.$store.dispatch('openUserReportingModal', { userId: this.status.user.id, statusIds: [this.status.id] })
    },
    editStatus () {
      this.$store.dispatch('fetchStatusSource', { id: this.status.id })
        .then(data => this.$store.dispatch('openEditStatusModal', {
          statusId: this.status.id,
          subject: data.spoiler_text,
          statusText: data.text,
          statusIsSensitive: this.status.nsfw,
          statusPoll: this.status.poll,
          statusFiles: [...this.status.attachments],
          visibility: this.status.visibility,
          statusContentType: data.content_type
        }))
    },
    showStatusHistory () {
      const originalStatus = { ...this.status }
      const stripFieldsList = ['attachments', 'created_at', 'emojis', 'text', 'raw_html', 'nsfw', 'poll', 'summary', 'summary_raw_html']
      stripFieldsList.forEach(p => delete originalStatus[p])
      this.$store.dispatch('openStatusHistoryModal', originalStatus)
    }
  },
  computed: {
    currentUser () { return this.$store.state.users.currentUser },
    canDelete () {
      if (!this.currentUser) { return }
      return this.currentUser.privileges.includes('messages_delete') || this.status.user.id === this.currentUser.id
    },
    ownStatus () {
      return this.status.user.id === this.currentUser.id
    },
    canPin () {
      return this.ownStatus && (this.status.visibility === 'public' || this.status.visibility === 'unlisted')
    },
    canMute () {
      return !!this.currentUser
    },
    canBookmark () {
      return !!this.currentUser
    },
    statusLink () {
      return `${this.$store.state.instance.server}${this.$router.resolve({ name: 'conversation', params: { id: this.status.id } }).href}`
    },
    isEdited () {
      return this.status.edited_at !== null
    },
    editingAvailable () { return this.$store.state.instance.editingAvailable },
    shouldConfirmDelete () {
      return this.$store.getters.mergedConfig.modalOnDelete
    }
  }
}

export default ExtraButtons