Never show read marker on the very last message

src/components/MessagesList/MessagesGroup/Message/Message.spec.js

@@ -424,6 +424,7 @@ describe('Message.vue', () => {
 
 		test('displays unread message marker that marks the message seen when visible', () => {
 			messageProps.lastReadMessageId = 123
+			messageProps.nextMessageId = 333
 			const observeVisibility = jest.fn()
 
 			const wrapper = shallowMount(Message, {
@@ -453,6 +454,24 @@ describe('Message.vue', () => {
 			directiveValue.value(false)
 			expect(wrapper.vm.seen).toEqual(true)
 		})
+
+		test('does not display read marker on the very last message', () => {
+			messageProps.lastReadMessageId = 123
+			messageProps.nextMessageId = null // last message
+			const observeVisibility = jest.fn()
+
+			const wrapper = shallowMount(Message, {
+				localVue,
+				store,
+				directives: {
+					observeVisibility,
+				},
+				propsData: messageProps,
+			})
+
+			const marker = wrapper.find('.new-message-marker')
+			expect(marker.exists()).toBe(false)
+		})
 	})
 
 	describe('author rendering', () => {

src/components/MessagesList/MessagesGroup/Message/Message.vue

@@ -402,6 +402,10 @@ export default {
 
 	computed: {
 		isLastReadMessage() {
+			if (!this.nextMessageId) {
+				// never display indicator on the very last message
+				return false
+			}
 			// note: not reading lastReadMessage from the conversation as we want to define it externally
 			// to have closer control on marker's visibility behavior
 			return this.id === this.lastReadMessageId