Last fixes

Signed-off-by: DorraJaouad <[email protected]>
nextcloud · Jan 17, 2024 · c3799f2 · c3799f2
1 parent f95bce0
commit c3799f2
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 113 deletions.
diff --git a/src/components/ChatView.vue b/src/components/ChatView.vue
@@ -174,11 +174,6 @@ export default {
 		this.containerId = this.container
 	},
 
-	beforeDestroy() {
-		EventBus.$off('editing-message')
-		EventBus.$off('message-edited')
-	},
-
 	methods: {
 
 		handleDragOver(event) {

diff --git a/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue b/src/components/MessagesList/MessagesGroup/Message/MessageButtonsBar/MessageButtonsBar.vue
@@ -48,27 +48,8 @@
 				@open="onMenuOpen"
 				@close="onMenuClose">
 				<template v-if="submenu === null">
-					<!-- Message timestamp is a menu for editing details -->
-					<NcActionButton v-if="messageObject.lastEditTimestamp"
-						class="action--nested"
-						@click.stop="submenu = 'edit-history'">
-						<template #icon>
-							<span v-if="showCommonReadIcon"
-								:title="commonReadIconTooltip"
-								:aria-label="commonReadIconTooltip">
-								<CheckAll :size="16" />
-							</span>
-							<span v-else-if="showSentIcon"
-								:title="sentIconTooltip"
-								:aria-label="sentIconTooltip">
-								<Check :size="16" />
-							</span>
-							<ClockOutline v-else :size="16" />
-						</template>
-						{{ messageDateTime }}
-					</NcActionButton>
-					<!-- Message timestamp if there is no editing history -->
-					<NcActionText v-else>
+					<!-- Message timestamp -->
+					<NcActionText>
 						<template #icon>
 							<span v-if="showCommonReadIcon"
 								:title="commonReadIconTooltip"
@@ -84,6 +65,19 @@
 						</template>
 						{{ messageDateTime }}
 					</NcActionText>
+					<!-- Edited message timestamp -->
+					<NcActionButtonGroup v-if="messageObject.lastEditTimestamp">
+						<NcActionText>
+							<template #icon>
+								<ClockEditOutline :size="16" />
+							</template>
+							{{ messageObject.lastEditActorDisplayName }}
+						</NcActionText>
+						<NcActionText>
+							{{ editedDateTime }}
+						</NcActionText>
+					</NcActionButtonGroup>
+					<NcActionSeparator />
 
 					<NcActionButton v-if="supportReminders"
 						class="action--nested"
@@ -93,8 +87,6 @@
 						</template>
 						{{ t('spreed', 'Set reminder') }}
 					</NcActionButton>
-
-					<NcActionSeparator />
 					<NcActionButton v-if="isPrivateReplyable"
 						close-after-click
 						@click.stop="handlePrivateReply">
@@ -236,24 +228,6 @@
 						{{ t('spreed', 'Set custom reminder') }}
 					</NcActionButton>
 				</template>
-
-				<template v-else-if="submenu === 'edit-history'">
-					<NcActionButton :aria-label="t('spreed', 'Back')"
-						@click.stop="submenu = null">
-						<template #icon>
-							<ArrowLeft />
-						</template>
-						{{ t('spreed', 'Back') }}
-					</NcActionButton>
-					<NcActionText>
-						{{ t('spreed', 'Edited by: {actor}',
-							{actor : messageObject.lastEditActorDisplayName}) }}
-					</NcActionText>
-					<NcActionSeparator />
-					<NcActionText>
-						{{ editedDateTime }}
-					</NcActionText>
-				</template>
 			</NcActions>
 		</template>
 
@@ -305,6 +279,7 @@ import ArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
 import CalendarClock from 'vue-material-design-icons/CalendarClock.vue'
 import Check from 'vue-material-design-icons/Check.vue'
 import CheckAll from 'vue-material-design-icons/CheckAll.vue'
+import ClockEditOutline from 'vue-material-design-icons/ClockEditOutline.vue'
 import ClockOutline from 'vue-material-design-icons/ClockOutline.vue'
 import CloseCircleOutline from 'vue-material-design-icons/CloseCircleOutline.vue'
 import ContentCopy from 'vue-material-design-icons/ContentCopy.vue'
@@ -325,6 +300,7 @@ import { showError, showSuccess } from '@nextcloud/dialogs'
 import moment from '@nextcloud/moment'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
+import NcActionButtonGroup from '@nextcloud/vue/dist/Components/NcActionButtonGroup.js'
 import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput.js'
 import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink.js'
 import NcActions from '@nextcloud/vue/dist/Components/NcActions.js'
@@ -349,6 +325,7 @@ export default {
 
 	components: {
 		MessageForwarder,
+		NcActionButtonGroup,
 		NcActionButton,
 		NcActionInput,
 		NcActionLink,
@@ -365,6 +342,7 @@ export default {
 		CloseCircleOutline,
 		Check,
 		CheckAll,
+		ClockEditOutline,
 		ClockOutline,
 		ContentCopy,
 		DeleteIcon,
@@ -538,12 +516,12 @@ export default {
 		},
 
 		isEditable() {
-			if (!this.isModifiable || this.isObjectShare) {
+			if (!this.isModifiable || this.isObjectShare
+					|| (!this.$store.getters.isModerator && !this.isMyMsg)) {
 				return false
 			}
 
 			return (moment(this.timestamp * 1000).add(1, 'd')) > moment()
-				&& (this.$store.getters.isModerator || this.isMyMsg)
 		},
 
 		isDeleteable() {
@@ -881,8 +859,4 @@ export default {
 		background: no-repeat center var(--icon-triangle-e-dark);
 	}
 }
-
-:deep(.action-text) {
-	padding-left: 5px;
-}
 </style>
diff --git a/src/components/MessagesList/MessagesGroup/MessagesGroup.vue b/src/components/MessagesList/MessagesGroup/MessagesGroup.vue
@@ -92,6 +92,19 @@ export default {
 			default: 0,
 		},
 
+		lastEditTimestamp: {
+			type: Number,
+			default: 0,
+		},
+		lastEditActorId: {
+			type: String,
+			default: '',
+		},
+		lastEditActorType: {
+			type: String,
+			default: '',
+		},
+
 		lastEditActorDisplayName: {
 			type: String,
 			default: ''

diff --git a/src/components/MessagesList/MessagesList.vue b/src/components/MessagesList/MessagesList.vue
@@ -635,54 +635,7 @@ export default {
 		},
 
 		handleMessageEdited(id) {
-			// regroup messagesGroupedByAuthor when a message is edited
-			// find the group that contains the id and split it into 3 groups
-			// 1. the messages before the edited message
-			// 2. the edited message
-			// 3. the messages after the edited message
-			const groups = this.messagesGroupedByAuthor
-			const groupIndex = groups.findIndex(group => group.messages.some(message => message.id === id))
-			if (groupIndex === -1) {
-				return
-			}
-			// split the group into 3 groups
-			const group = groups[groupIndex]
-			const messageIndex = group.messages.findIndex(message => message.id === id)
-			const beforeMessages = group.messages.slice(0, messageIndex)
-			const afterMessages = group.messages.slice(messageIndex + 1)
-			const editedMessage = group.messages[messageIndex]
-			// remove the old group and add the 3 new groups at the same index
-			groups.splice(groupIndex, 1,
-				...(beforeMessages.length
-					? [{
-						id: beforeMessages[0].id,
-						messages: beforeMessages,
-						dateSeparator: group.dateSeparator,
-						previousMessageId: group.previousMessageId,
-						nextMessageId: editedMessage.id,
-						isSystemMessagesGroup: group.isSystemMessagesGroup,
-					}]
-					: []),
-				{
-					id: editedMessage.id,
-					messages: [editedMessage],
-					dateSeparator: group.dateSeparator,
-					previousMessageId: beforeMessages.length ? beforeMessages.at(-1).id : group.previousMessageId,
-					nextMessageId: afterMessages.length ? afterMessages[0].id : group.nextMessageId,
-					isSystemMessagesGroup: group.isSystemMessagesGroup,
-				},
-				...(afterMessages.length
-					? [{
-						id: afterMessages[0].id,
-						messages: afterMessages,
-						dateSeparator: group.dateSeparator,
-						previousMessageId: editedMessage.id,
-						nextMessageId: group.nextMessageId,
-						isSystemMessagesGroup: group.isSystemMessagesGroup,
-					}]
-					: []),
-			)
-
+			this.messagesGroupedByAuthor = this.prepareMessagesGroups(this.messagesList)
 		},
 
 		/**

diff --git a/src/components/NewMessage/NewMessage.vue b/src/components/NewMessage/NewMessage.vue
@@ -675,12 +675,12 @@ export default {
 
 		async handleEdit() {
 			try {
-				await editMessage({
+				const response = await editMessage({
 					token: this.token,
 					messageId: this.messageToEdit.id,
 					updatedMessage: this.text.trim()
 				})
-				EventBus.$emit('message-edited', this.messageToEdit.id)
+				this.$store.dispatch('processMessage', { token: this.token, message: response.data.ocs.data })
 				this.chatExtrasStore.removeMessageIdToEdit(this.token)
 			} catch {
 				this.$emit('failure')

diff --git a/src/store/messagesStore.js b/src/store/messagesStore.js
@@ -32,6 +32,7 @@ import {
 	CONVERSATION,
 } from '../constants.js'
 import { fetchNoteToSelfConversation } from '../services/conversationsService.js'
+import { EventBus } from '../services/EventBus.js'
 import {
 	deleteMessage,
 	updateLastReadMessage,
@@ -536,7 +537,7 @@ const actions = {
 			if (Object.keys(parentInStore).length !== 0) {
 				context.commit('addMessage', { token, message: message.parent })
 				if (message.systemMessage === 'message_edited') {
-					// End of process for edited messages
+					EventBus.$emit('message-edited')
 					return
 				}
 			}
@@ -561,16 +562,6 @@ const actions = {
 			return
 		}
 
-		if (message.parent && message.systemMessage === 'message_edited') {
-			// If parent message is presented in store already, we update it
-			const parentInStore = context.getters.message(message.token, message.parent.id)
-			if (Object.keys(parentInStore).length !== 0) {
-				context.commit('addMessage', message.parent)
-				return
-			}
-			return
-		}
-
 		if (message.referenceId) {
 			const tempMessages = context.getters.getTemporaryReferences(token, message.referenceId)
 			tempMessages.forEach(tempMessage => {