FIX: triggers update last read when message is not staged (#19565)

plugins/chat/assets/javascripts/discourse/services/chat-message-visibility-observer.js

@@ -5,17 +5,26 @@ import { bind } from "discourse-common/utils/decorators";
 export default class ChatMessageVisibilityObserver extends Service {
   @service chat;
 
-  observer = new IntersectionObserver(this._observerCallback, {
+  intersectionObserver = new IntersectionObserver(
+    this._intersectionObserverCallback,
+    {
+      root: document,
+      rootMargin: "-10px",
+    }
+  );
+
+  mutationObserver = new MutationObserver(this._mutationObserverCallback, {
     root: document,
     rootMargin: "-10px",
   });
 
   willDestroy() {
-    this.observer.disconnect();
+    this.intersectionObserver.disconnect();
+    this.mutationObserver.disconnect();
   }
 
   @bind
-  _observerCallback(entries) {
+  _intersectionObserverCallback(entries) {
     entries.forEach((entry) => {
       entry.target.dataset.visible = entry.isIntersecting;
 
@@ -29,11 +38,26 @@ export default class ChatMessageVisibilityObserver extends Service {
     });
   }
 
+  @bind
+  _mutationObserverCallback(mutationList) {
+    mutationList.forEach((mutation) => {
+      const data = mutation.target.dataset;
+      if (data.id && data.visible && !data.stagedId) {
+        this.chat.updateLastReadMessage();
+      }
+    });
+  }
+
   observe(element) {
-    this.observer.observe(element);
+    this.intersectionObserver.observe(element);
+    this.mutationObserver.observe(element, {
+      attributes: true,
+      attributeOldValue: true,
+      attributeFilter: ["data-staged-id"],
+    });
   }
 
   unobserve(element) {
-    this.observer.unobserve(element);
+    this.intersectionObserver.unobserve(element);
   }
 }

plugins/chat/assets/javascripts/discourse/services/chat-subscriptions-manager.js

@@ -144,7 +144,7 @@ export default class ChatSubscriptionsManager extends Service {
   _onUserTrackingStateUpdate(busData) {
     this.chatChannelsManager.find(busData.chat_channel_id).then((channel) => {
       if (
-        channel?.currentUserMembership?.last_read_message_id <
+        channel?.currentUserMembership?.last_read_message_id <=
         busData.chat_message_id
       ) {
         channel.currentUserMembership.last_read_message_id =

plugins/chat/assets/javascripts/discourse/services/chat.js

@@ -432,9 +432,14 @@ export default class Chat extends Service {
       10
     );
 
+    const membership = channel.currentUserMembership;
     const hasUnreadMessages =
-      latestUnreadMsgId > channel.currentUserMembership.last_read_message_id;
+      latestUnreadMsgId > membership.last_read_message_id;
-    if (hasUnreadMessages) {
+    if (
+      hasUnreadMessages ||
+      membership.unread_count > 0 ||
+      membership.unread_mentions > 0
+    ) {
       channel.updateLastReadMessage(latestUnreadMsgId);
     }
   }