109 lines
2.9 KiB
JavaScript
109 lines
2.9 KiB
JavaScript
import { mapState, mapGetters } from 'vuex'
|
|
import Popover from '../popover/popover.vue'
|
|
import Attachment from '../attachment/attachment.vue'
|
|
import UserAvatar from '../user_avatar/user_avatar.vue'
|
|
import Gallery from '../gallery/gallery.vue'
|
|
import LinkPreview from '../link-preview/link-preview.vue'
|
|
import StatusContent from '../status_content/status_content.vue'
|
|
import ChatMessageDate from '../chat_message_date/chat_message_date.vue'
|
|
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
|
|
import { library } from '@fortawesome/fontawesome-svg-core'
|
|
import {
|
|
faTimes,
|
|
faEllipsisH
|
|
} from '@fortawesome/free-solid-svg-icons'
|
|
|
|
library.add(
|
|
faTimes,
|
|
faEllipsisH
|
|
)
|
|
|
|
const ChatMessage = {
|
|
name: 'ChatMessage',
|
|
props: [
|
|
'author',
|
|
'edited',
|
|
'noHeading',
|
|
'chatViewItem',
|
|
'hoveredMessageChain'
|
|
],
|
|
emits: ['hover'],
|
|
components: {
|
|
Popover,
|
|
Attachment,
|
|
StatusContent,
|
|
UserAvatar,
|
|
Gallery,
|
|
LinkPreview,
|
|
ChatMessageDate
|
|
},
|
|
computed: {
|
|
// Returns HH:MM (hours and minutes) in local time.
|
|
createdAt () {
|
|
const time = this.chatViewItem.data.created_at
|
|
return time.toLocaleTimeString('en', { hour: '2-digit', minute: '2-digit', hour12: false })
|
|
},
|
|
isCurrentUser () {
|
|
return this.message.account_id === this.currentUser.id
|
|
},
|
|
message () {
|
|
return this.chatViewItem.data
|
|
},
|
|
userProfileLink () {
|
|
return generateProfileLink(this.author.id, this.author.screen_name, this.$store.state.instance.restrictedNicknames)
|
|
},
|
|
isMessage () {
|
|
return this.chatViewItem.type === 'message'
|
|
},
|
|
messageForStatusContent () {
|
|
return {
|
|
summary: '',
|
|
emojis: this.message.emojis,
|
|
raw_html: this.message.content || '',
|
|
text: this.message.content || '',
|
|
attachments: this.message.attachments
|
|
}
|
|
},
|
|
hasAttachment () {
|
|
return this.message.attachments.length > 0
|
|
},
|
|
...mapState({
|
|
betterShadow: state => state.interface.browserSupport.cssFilter,
|
|
currentUser: state => state.users.currentUser,
|
|
restrictedNicknames: state => state.instance.restrictedNicknames
|
|
}),
|
|
popoverMarginStyle () {
|
|
if (this.isCurrentUser) {
|
|
return {}
|
|
} else {
|
|
return { left: 50 }
|
|
}
|
|
},
|
|
...mapGetters(['mergedConfig', 'findUser'])
|
|
},
|
|
data () {
|
|
return {
|
|
hovered: false,
|
|
menuOpened: false
|
|
}
|
|
},
|
|
methods: {
|
|
onHover (bool) {
|
|
this.$emit('hover', { isHovered: bool, messageChainId: this.chatViewItem.messageChainId })
|
|
},
|
|
async deleteMessage () {
|
|
const confirmed = window.confirm(this.$t('chats.delete_confirm'))
|
|
if (confirmed) {
|
|
await this.$store.dispatch('deleteChatMessage', {
|
|
messageId: this.chatViewItem.data.id,
|
|
chatId: this.chatViewItem.data.chat_id
|
|
})
|
|
}
|
|
this.hovered = false
|
|
this.menuOpened = false
|
|
}
|
|
}
|
|
}
|
|
|
|
export default ChatMessage
|