From e404a417f7c077ab022b80a35f23a3eabcdfc99f Mon Sep 17 00:00:00 2001 From: Marco Ambrosini Date: Tue, 4 Feb 2020 09:05:23 +0100 Subject: [PATCH 1/3] Immediately update last message preview Signed-off-by: Marco Ambrosini --- .../ConversationsList/Conversation.vue | 37 ++++++++++++++----- 1 file changed, 28 insertions(+), 9 deletions(-) diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue index 1b2593635..635be0fd1 100644 --- a/src/components/LeftSidebar/ConversationsList/Conversation.vue +++ b/src/components/LeftSidebar/ConversationsList/Conversation.vue @@ -176,7 +176,7 @@ export default { }, conversationInformation() { - if (!Object.keys(this.item.lastMessage).length) { + if (!Object.keys(this.lastChatMessage).length) { return '' } @@ -184,7 +184,7 @@ export default { return this.simpleLastChatMessage } - if (this.item.lastMessage.actorId === this.$store.getters.getUserId()) { + if (this.lastChatMessage.actorId === this.$store.getters.getUserId()) { return t('spreed', 'You: {lastMessage}', { lastMessage: this.simpleLastChatMessage, }, undefined, { @@ -205,6 +205,25 @@ export default { }) }, + // The messages array for this conversation + messages() { + return this.$store.getters.messages(this.item.token) + }, + + // Get the last message for this conversation from the message store instead + // of the conversateions store. The message store is updated immediately, + // while the conversations store is refreshed every 30 seconds. This allows + // to display message previews in this component as soon as new messages are + // received by the server. + lastChatMessage() { + if (Object.keys(this.messages).length > 0) { + const messagesKeys = Object.keys(this.messages) + const lastMessageId = messagesKeys[messagesKeys.length - 1] + return this.messages[lastMessageId] + } + return this.item.lastMessage + }, + /** * This is a simplified version of the last chat message. * Parameters are parsed without markup (just replaced with the name), @@ -212,12 +231,12 @@ export default { * @returns {string} A simple message to show below the conversation name */ simpleLastChatMessage() { - if (!Object.keys(this.item.lastMessage).length) { + if (!Object.keys(this.lastChatMessage).length) { return '' } - const params = this.item.lastMessage.messageParameters - let subtitle = this.item.lastMessage.message.trim() + const params = this.lastChatMessage.messageParameters + let subtitle = this.lastChatMessage.message.trim() // We don't really use rich objects in the subtitle, instead we fall back to the name of the item Object.keys(params).forEach((parameterKey) => { @@ -230,18 +249,18 @@ export default { * @returns {string} Part of the name until the first space */ shortLastChatMessageAuthor() { - if (!Object.keys(this.item.lastMessage).length - || this.item.lastMessage.systemMessage.length) { + if (!Object.keys(this.lastChatMessage).length + || this.lastChatMessage.systemMessage.length) { return '' } - let author = this.item.lastMessage.actorDisplayName.trim() + let author = this.lastChatMessage.actorDisplayName.trim() const spacePosition = author.indexOf(' ') if (spacePosition !== -1) { author = author.substring(0, spacePosition) } - if (author.length === 0 && this.item.lastMessage.actorType === 'guests') { + if (author.length === 0 && this.lastChatMessage.actorType === 'guests') { return t('spreed', 'Guest') } From dc994d22727468058c7912d8377f39395c5b1886 Mon Sep 17 00:00:00 2001 From: Joas Schilling Date: Fri, 7 Feb 2020 14:40:17 +0100 Subject: [PATCH 2/3] Also mark the chat read immediatelly Signed-off-by: Joas Schilling --- src/App.vue | 1 + src/FilesSidebarTabApp.vue | 1 + src/PublicShareAuthSidebar.vue | 1 + src/PublicShareSidebar.vue | 1 + .../LeftSidebar/ConversationsList/Conversation.vue | 3 ++- .../ConversationsList/ConversationsList.vue | 4 ++++ src/store/conversationsStore.js | 12 ++++++++++++ 7 files changed, 22 insertions(+), 1 deletion(-) diff --git a/src/App.vue b/src/App.vue index b469fc2fb..61c78e077 100644 --- a/src/App.vue +++ b/src/App.vue @@ -349,6 +349,7 @@ export default { // this.$store.dispatch('purgeConversationsStore') this.$store.dispatch('addConversation', response.data.ocs.data) + this.$store.dispatch('markConversationRead', token) /** * Emits a global event that is used in App.vue to update the page title once the diff --git a/src/FilesSidebarTabApp.vue b/src/FilesSidebarTabApp.vue index ad84863f8..00412a413 100644 --- a/src/FilesSidebarTabApp.vue +++ b/src/FilesSidebarTabApp.vue @@ -243,6 +243,7 @@ export default { const response = await fetchConversation(this.token) this.$store.dispatch('addConversation', response.data.ocs.data) + this.$store.dispatch('markConversationRead', this.item.token) }, /** diff --git a/src/PublicShareAuthSidebar.vue b/src/PublicShareAuthSidebar.vue index 888730021..c35f8bb6a 100644 --- a/src/PublicShareAuthSidebar.vue +++ b/src/PublicShareAuthSidebar.vue @@ -156,6 +156,7 @@ export default { try { const response = await fetchConversation(this.token) this.$store.dispatch('addConversation', response.data.ocs.data) + this.$store.dispatch('markConversationRead', this.item.token) // Although the current participant is automatically added to // the participants store it must be explicitly set in the diff --git a/src/PublicShareSidebar.vue b/src/PublicShareSidebar.vue index 6cf714a93..949fec662 100644 --- a/src/PublicShareSidebar.vue +++ b/src/PublicShareSidebar.vue @@ -193,6 +193,7 @@ export default { try { const response = await fetchConversation(this.token) this.$store.dispatch('addConversation', response.data.ocs.data) + this.$store.dispatch('markConversationRead', this.item.token) // Although the current participant is automatically added to // the participants store it must be explicitly set in the diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue index 635be0fd1..a734af8ea 100644 --- a/src/components/LeftSidebar/ConversationsList/Conversation.vue +++ b/src/components/LeftSidebar/ConversationsList/Conversation.vue @@ -211,7 +211,7 @@ export default { }, // Get the last message for this conversation from the message store instead - // of the conversateions store. The message store is updated immediately, + // of the conversations store. The message store is updated immediately, // while the conversations store is refreshed every 30 seconds. This allows // to display message previews in this component as soon as new messages are // received by the server. @@ -278,6 +278,7 @@ export default { }, async joinConversation() { await joinConversation(this.item.token) + this.$store.dispatch('markConversationRead', this.item.token) }, /** * Deletes the conversation. diff --git a/src/components/LeftSidebar/ConversationsList/ConversationsList.vue b/src/components/LeftSidebar/ConversationsList/ConversationsList.vue index 4cd7b0129..d7ef1f3be 100644 --- a/src/components/LeftSidebar/ConversationsList/ConversationsList.vue +++ b/src/components/LeftSidebar/ConversationsList/ConversationsList.vue @@ -99,6 +99,7 @@ export default { } if (to.name === 'conversation') { joinConversation(to.params.token) + this.$store.dispatch('markConversationRead', to.params.token) } }, sortConversations(conversation1, conversation2) { @@ -123,6 +124,9 @@ export default { this.$store.dispatch('purgeConversationsStore') conversations.data.ocs.data.forEach(conversation => { this.$store.dispatch('addConversation', conversation) + if (conversation.token === this.$store.getters.getToken()) { + this.$store.dispatch('markConversationRead', this.$store.getters.getToken()) + } }) /** * Emits a global event that is used in App.vue to update the page title once the diff --git a/src/store/conversationsStore.js b/src/store/conversationsStore.js index 597c50691..5b83ae8b5 100644 --- a/src/store/conversationsStore.js +++ b/src/store/conversationsStore.js @@ -176,6 +176,18 @@ const actions = { commit('addConversation', conversation) }, + + async markConversationRead({ commit, getters }, token) { + const conversation = Object.assign({}, getters.conversations[token]) + if (!conversation) { + return + } + + conversation.unreadMessages = 0 + conversation.unreadMention = false + + commit('addConversation', conversation) + }, } export default { state, mutations, getters, actions } From ef7377e95adcf073e2bd8e1ff2524969213b6b89 Mon Sep 17 00:00:00 2001 From: Joas Schilling Date: Fri, 7 Feb 2020 14:51:22 +0100 Subject: [PATCH 3/3] Only use the last item from the message list, when it is newer Signed-off-by: Joas Schilling --- .../LeftSidebar/ConversationsList/Conversation.vue | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue index a734af8ea..f6f7c1922 100644 --- a/src/components/LeftSidebar/ConversationsList/Conversation.vue +++ b/src/components/LeftSidebar/ConversationsList/Conversation.vue @@ -216,10 +216,15 @@ export default { // to display message previews in this component as soon as new messages are // received by the server. lastChatMessage() { + const lastMessageTimestamp = this.item.lastMessage ? this.item.lastMessage.timestamp : 0 + if (Object.keys(this.messages).length > 0) { const messagesKeys = Object.keys(this.messages) const lastMessageId = messagesKeys[messagesKeys.length - 1] - return this.messages[lastMessageId] + + if (this.messages[lastMessageId].timestamp > lastMessageTimestamp) { + return this.messages[lastMessageId] + } } return this.item.lastMessage },