HH-569: guard replayed frontend realtime messages (#144)

* fix(HH-569): guard replayed realtime messages

* fix(HH-569): gate dashboard message side effects

---------

Co-authored-by: Rogee <rogee@ipao.vip>

frontend/app/javascript/widget/helpers/actionCable.js

@@ -53,14 +53,18 @@ class ActionCableConnector extends BaseActionCableConnector {
     this.app.$store.dispatch('conversationAttributes/update', data);
   };
 
-  onMessageCreated = data => {
+  onMessageCreated = async data => {
     if (isMessageInActiveConversation(this.app.$store.getters, data)) {
       return;
     }
 
-    this.app.$store
-      .dispatch('conversation/addOrUpdateMessage', data)
-      .then(() => emitter.emit(ON_AGENT_MESSAGE_RECEIVED));
+    const { applied, isNew } = await this.app.$store.dispatch(
+      'conversation/addOrUpdateMessage',
+      data
+    );
+    if (!applied || !isNew) return;
+
+    emitter.emit(ON_AGENT_MESSAGE_RECEIVED);
 
     IFrameHelper.sendMessage({
       event: 'onEvent',
@@ -72,11 +76,17 @@ class ActionCableConnector extends BaseActionCableConnector {
     }
   };
 
-  onMessageUpdated = data => {
+  onMessageUpdated = async data => {
     if (isMessageInActiveConversation(this.app.$store.getters, data)) {
       return;
     }
 
+    const { applied } = await this.app.$store.dispatch(
+      'conversation/addOrUpdateMessage',
+      data
+    );
+    if (!applied) return;
+
     if (shouldTriggerMessageUpdateEvent(data)) {
       IFrameHelper.sendMessage({
         event: 'onEvent',
@@ -84,8 +94,6 @@ class ActionCableConnector extends BaseActionCableConnector {
         data,
       });
     }
-
-    this.app.$store.dispatch('conversation/addOrUpdateMessage', data);
   };
 
   onConversationCreated = () => {