Merge pull request #3825 from nextcloud/feature/1788/unread-message-m…

…arker Add unread message marker in the chat view
nextcloud · Mar 9, 2021 · ec0d799 · ec0d799
2 parents 2a2a43a + c26d5e3
commit ec0d799
Show file tree

Hide file tree

Showing 16 changed files with 610 additions and 164 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -427,7 +427,6 @@ 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
@@ -264,7 +264,6 @@ export default {
 
 			const response = await fetchConversation(this.token)
 			this.$store.dispatch('addConversation', response.data.ocs.data)
-			this.$store.dispatch('markConversationRead', this.token)
 		},
 
 		/**

diff --git a/src/PublicShareAuthSidebar.vue b/src/PublicShareAuthSidebar.vue
@@ -167,7 +167,6 @@ export default {
 			try {
 				const response = await fetchConversation(this.token)
 				this.$store.dispatch('addConversation', response.data.ocs.data)
-				this.$store.dispatch('markConversationRead', this.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
@@ -203,7 +203,6 @@ export default {
 			try {
 				const response = await fetchConversation(this.token)
 				this.$store.dispatch('addConversation', response.data.ocs.data)
-				this.$store.dispatch('markConversationRead', this.token)
 
 				// Although the current participant is automatically added to
 				// the participants store it must be explicitly set in the

diff --git a/src/components/ChatView.vue b/src/components/ChatView.vue
@@ -47,6 +47,7 @@
 			:aria-label="t('spreed', 'Conversation messages')"
 			:is-chat-scrolled-to-bottom="isChatScrolledToBottom"
 			:token="token"
+			:is-visible="isVisible"
 			@setChatScrolledToBottom="setScrollStatus" />
 		<NewMessageForm
 			role="region"
@@ -70,6 +71,13 @@ export default {
 		NewMessageForm,
 	},
 
+	props: {
+		isVisible: {
+			type: Boolean,
+			default: true,
+		},
+	},
+
 	data: function() {
 		return {
 			isDraggingOver: false,

diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue
@@ -57,6 +57,11 @@
 				@click.stop.prevent="copyLinkToConversation">
 				{{ t('spreed', 'Copy link') }}
 			</ActionButton>
+			<ActionButton
+				:close-after-click="true"
+				@click.prevent.exact="markConversationAsRead">
+				{{ t('spreed', 'Mark as read') }}
+			</ActionButton>
 
 			<ActionSeparator />
 
@@ -313,6 +318,10 @@ export default {
 			}
 		},
 
+		markConversationAsRead() {
+			this.$store.dispatch('clearLastReadMessage', { token: this.item.token })
+		},
+
 		/**
 		 * Deletes the conversation.
 		 */

diff --git a/src/components/LeftSidebar/ConversationsList/ConversationsList.vue b/src/components/LeftSidebar/ConversationsList/ConversationsList.vue
@@ -115,7 +115,6 @@ export default {
 			}
 			if (to.name === 'conversation') {
 				joinConversation(to.params.token)
-				this.$store.dispatch('markConversationRead', to.params.token)
 			}
 		},
 

diff --git a/src/components/LeftSidebar/LeftSidebar.vue b/src/components/LeftSidebar/LeftSidebar.vue
@@ -442,9 +442,6 @@ 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