feat: Refetch the latest messages on action cable reconnect in widget (#6996)

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

@@ -52,6 +52,10 @@ export const actions = {
     }
   },
 
+  setLastMessageId: async ({ commit }) => {
+    commit('setLastMessageId');
+  },
+
   sendAttachment: async ({ commit }, params) => {
     const {
       attachment: { thumbUrl, fileType },
@@ -99,6 +103,36 @@ export const actions = {
     }
   },
 
+  syncLatestMessages: async ({ state, commit }) => {
+    try {
+      const { lastMessageId, conversations } = state;
+
+      const {
+        data: { payload, meta },
+      } = await getMessagesAPI({ after: lastMessageId });
+
+      const { contact_last_seen_at: lastSeen } = meta;
+      const formattedMessages = getNonDeletedMessages({ messages: payload });
+      const missingMessages = formattedMessages.filter(
+        message => conversations?.[message.id] === undefined
+      );
+      if (!missingMessages.length) return;
+      missingMessages.forEach(message => {
+        conversations[message.id] = message;
+      });
+      // Sort conversation messages by created_at
+      const updatedConversation = Object.fromEntries(
+        Object.entries(conversations).sort(
+          (a, b) => a[1].created_at - b[1].created_at
+        )
+      );
+      commit('conversation/setMetaUserLastSeenAt', lastSeen, { root: true });
+      commit('setMissingMessagesInConversation', updatedConversation);
+    } catch (error) {
+      // IgnoreError
+    }
+  },
+
   clearConversations: ({ commit }) => {
     commit('clearConversations');
   },