From b4058a2223c9c100c06a1597c29c2f91652226a1 Mon Sep 17 00:00:00 2001 From: DorraJaouad Date: Thu, 22 Feb 2024 15:44:29 +0100 Subject: [PATCH] fixup! fixup! Fix(MessagesList): skip soft update when needed and make editing a message softer --- src/components/MessagesList/MessagesList.vue | 28 ++++++++++++++++---- 1 file changed, 23 insertions(+), 5 deletions(-) diff --git a/src/components/MessagesList/MessagesList.vue b/src/components/MessagesList/MessagesList.vue index c95fd025295..3a051caffa1 100644 --- a/src/components/MessagesList/MessagesList.vue +++ b/src/components/MessagesList/MessagesList.vue @@ -281,14 +281,19 @@ export default { token(newToken, oldToken) { // Expire older messages when navigating to another conversation this.$store.dispatch('easeMessageList', { token: oldToken }) + this.messagesGroupedByDateByAuthor = this.prepareMessagesGroups(this.messagesList) }, messagesList: { immediate: true, handler(newMessages, oldMessages) { + // token watcher will handle the conversations change + if (oldMessages?.length && newMessages.length && newMessages[0].token !== oldMessages?.at(0)?.token) { + return + } const newGroups = this.prepareMessagesGroups(newMessages) - // Check if messages token has changed or if messages were just loaded - if (!oldMessages || (newMessages.length && newMessages[0].token !== oldMessages?.at(0)?.token)) { + // messages were just loaded + if (!oldMessages) { this.messagesGroupedByDateByAuthor = newGroups } else { this.softUpdateByDateGroups(this.messagesGroupedByDateByAuthor, newGroups) @@ -399,10 +404,10 @@ export default { softUpdateByDateGroups(oldGroups, newGroups) { const oldGroupsMap = new Map(Object.entries(oldGroups)) // Check if we have this group in the old list already and it is unchanged - return Object.keys(newGroups).forEach(dateTimestamp => { + Object.keys(newGroups).forEach(dateTimestamp => { if (oldGroupsMap.has(dateTimestamp)) { // the group by date has changed, we update its content (groups by author) - this.softUpdateAuthorGroups(oldGroupsMap.get(dateTimestamp), newGroups[dateTimestamp]) + this.softUpdateAuthorGroups(oldGroupsMap.get(dateTimestamp), newGroups[dateTimestamp], dateTimestamp) } else { // the group is new this.messagesGroupedByDateByAuthor[dateTimestamp] = newGroups[dateTimestamp] @@ -410,13 +415,26 @@ export default { }) }, - softUpdateAuthorGroups(oldGroups, newGroups) { + softUpdateAuthorGroups(oldGroups, newGroups, dateTimestamp) { const oldGroupsMap = new Map(Object.entries(oldGroups)) Object.entries(newGroups).forEach(([id, newGroup]) => { if (!oldGroupsMap.has(id) || (oldGroupsMap.has(id) && !this.areGroupsIdentical(newGroup, oldGroupsMap.get(id)))) { this.messagesGroupedByDateByAuthor[newGroup.dateTimestamp][id] = newGroup } }) + + // Remove temporary messages that are not in the new list + if (dateTimestamp == moment().startOf('day').unix()) { + const newGroupsMap = new Map(Object.entries(newGroups)) + for (const [id, oldGroup] of Object.entries(oldGroups).reverse()) { + if (!id.toString().startsWith('temp-')) { + break + } + if (!newGroupsMap.has(id)) { + delete this.messagesGroupedByDateByAuthor[oldGroup.dateTimestamp][id] + } + } + } }, areGroupsIdentical(group1, group2) {