fix: Hide deleted messages on widget side (#2614)

app/javascript/widget/store/modules/specs/conversation/actions.spec.js

@@ -8,21 +8,6 @@ jest.mock('widget/helpers/axios');
 const commit = jest.fn();
 
 describe('#actions', () => {
-  describe('#addMessage', () => {
-    it('sends correct mutations', () => {
-      actions.addMessage({ commit }, { id: 1 });
-      expect(commit).toBeCalledWith('pushMessageToConversation', { id: 1 });
-    });
-
-    it('plays audio when agent sends a message', () => {
-      actions.addMessage({ commit }, { id: 1, message_type: 1 });
-      expect(commit).toBeCalledWith('pushMessageToConversation', {
-        id: 1,
-        message_type: 1,
-      });
-    });
-  });
-
   describe('#createConversation', () => {
     it('sends correct mutations', async () => {
       API.post.mockResolvedValue({
@@ -60,10 +45,40 @@ describe('#actions', () => {
     });
   });
 
-  describe('#updateMessage', () => {
-    it('sends correct mutations', () => {
-      actions.updateMessage({ commit }, { id: 1 });
-      expect(commit).toBeCalledWith('pushMessageToConversation', { id: 1 });
+  describe('#addOrUpdateMessage', () => {
+    it('sends correct actions for non-deleted message', () => {
+      actions.addOrUpdateMessage(
+        { commit },
+        {
+          id: 1,
+          content: 'Hey',
+          content_attributes: {},
+        }
+      );
+      expect(commit).toBeCalledWith('pushMessageToConversation', {
+        id: 1,
+        content: 'Hey',
+        content_attributes: {},
+      });
+    });
+    it('sends correct actions for non-deleted message', () => {
+      actions.addOrUpdateMessage(
+        { commit },
+        {
+          id: 1,
+          content: 'Hey',
+          content_attributes: { deleted: true },
+        }
+      );
+      expect(commit).toBeCalledWith('deleteMessage', 1);
+    });
+
+    it('plays audio when agent sends a message', () => {
+      actions.addOrUpdateMessage({ commit }, { id: 1, message_type: 1 });
+      expect(commit).toBeCalledWith('pushMessageToConversation', {
+        id: 1,
+        message_type: 1,
+      });
     });
   });
 
@@ -160,4 +175,38 @@ describe('#actions', () => {
       expect(commit).toBeCalledWith('clearConversations');
     });
   });
+
+  describe('#fetchOldConversations', () => {
+    it('sends correct actions', async () => {
+      API.get.mockResolvedValue({
+        data: [
+          {
+            id: 1,
+            text: 'hey',
+            content_attributes: {},
+          },
+          {
+            id: 2,
+            text: 'welcome',
+            content_attributes: { deleted: true },
+          },
+        ],
+      });
+      await actions.fetchOldConversations({ commit }, {});
+      expect(commit.mock.calls).toEqual([
+        ['setConversationListLoading', true],
+        [
+          'setMessagesInConversation',
+          [
+            {
+              id: 1,
+              text: 'hey',
+              content_attributes: {},
+            },
+          ],
+        ],
+        ['setConversationListLoading', false],
+      ]);
+    });
+  });
 });

app/javascript/widget/store/modules/specs/conversation/helpers.spec.js

@@ -1,6 +1,7 @@
 import {
   findUndeliveredMessage,
   createTemporaryMessage,
+  getNonDeletedMessages,
 } from '../../conversation/helpers';
 
 describe('#findUndeliveredMessage', () => {
@@ -35,3 +36,37 @@ describe('#createTemporaryMessage', () => {
     expect(message.status).toBe('in_progress');
   });
 });
+
+describe('#getNonDeletedMessages', () => {
+  it('returns non-deleted messages', () => {
+    const messages = [
+      {
+        id: 1,
+        content: 'Hello',
+        content_attributes: {},
+      },
+      {
+        id: 2,
+        content: 'Hey',
+        content_attributes: { deleted: true },
+      },
+      {
+        id: 3,
+        content: 'How may I help you',
+        content_attributes: {},
+      },
+    ];
+    expect(getNonDeletedMessages({ messages })).toStrictEqual([
+      {
+        id: 1,
+        content: 'Hello',
+        content_attributes: {},
+      },
+      {
+        id: 3,
+        content: 'How may I help you',
+        content_attributes: {},
+      },
+    ]);
+  });
+});

app/javascript/widget/store/modules/specs/conversation/mutations.spec.js

@@ -175,4 +175,12 @@ describe('#mutations', () => {
       expect(state.conversations).toEqual({});
     });
   });
+
+  describe('#deleteMessage', () => {
+    it('delete the message from conversation', () => {
+      const state = { conversations: { 1: { id: 1 } } };
+      mutations.deleteMessage(state, 1);
+      expect(state.conversations).toEqual({});
+    });
+  });
 });