feature/IO-3478-Mark-Conversation-Unread: Finished

client/src/components/chat-affix/registerMessagingSocketHandlers.js

@@ -13,68 +13,227 @@ const logLocal = (message, ...args) => {
   }
 };
 
-// Utility function to enrich conversation data
+const normalizeConversationForList = (raw, { isoutbound, isSystem } = {}) => {
-const enrichConversation = (conversation, isOutbound) => ({
+  const c = raw || {};
+  const id = c.id;
+
+  return {
+    __typename: "conversations",
+    id,
+    phone_num: c.phone_num ?? null,
+    updated_at: c.updated_at ?? safeIsoNow(),
+    unreadcnt: typeof c.unreadcnt === "number" ? c.unreadcnt : 0,
+    archived: c.archived ?? false,
+    label: c.label ?? null,
+
+    job_conversations: Array.isArray(c.job_conversations)
+      ? c.job_conversations.map((jc) => {
+          const job = jc?.job || {};
+          const jobId = jc?.jobid ?? job?.id ?? null;
+
+          return {
+            __typename: "job_conversations",
+            jobid: jobId,
+            conversationid: jc?.conversationid ?? id ?? null,
+            job: {
+              __typename: "jobs",
+              id: jobId,
+              ro_number: job?.ro_number ?? null,
+              ownr_fn: job?.ownr_fn ?? null,
+              ownr_ln: job?.ownr_ln ?? null,
+              ownr_co_nm: job?.ownr_co_nm ?? null
+            }
+          };
+        })
+      : [],
+
+    // This is the field your list badge reads (with args). We write it via a fragment with the same args.
+    messages_aggregate: c.messages_aggregate || {
+      __typename: "messages_aggregate",
+      aggregate: {
+        __typename: "messages_aggregate_fields",
+        count: isoutbound || isSystem ? 0 : 1
+      }
+    }
+  };
+};
+
+const CONVERSATION_LIST_ITEM_FRAGMENT = gql`
+  fragment _ConversationListItem on conversations {
+    id
+    phone_num
+    updated_at
+    unreadcnt
+    archived
+    label
+    job_conversations {
+      jobid
+      conversationid
+      job {
+        id
+        ro_number
+        ownr_fn
+        ownr_ln
+        ownr_co_nm
+      }
+    }
+    messages_aggregate(where: { read: { _eq: false }, isoutbound: { _eq: false }, is_system: { _eq: false } }) {
+      aggregate {
+        count
+      }
+    }
+  }
+`;
+
+const normalizeMessageForCache = (raw, fallbackConversationId) => {
+  const m = raw || {};
+
+  return {
+    __typename: "messages",
+    id: m.id,
+    conversationid: m.conversationid ?? m.conversation?.id ?? fallbackConversationId,
+
+    // Fields your UI queries expect
+    status: m.status ?? null,
+    text: m.text ?? "",
+    is_system: typeof m.is_system === "boolean" ? m.is_system : false,
+    isoutbound: typeof m.isoutbound === "boolean" ? m.isoutbound : false,
+    image: typeof m.image === "boolean" ? m.image : false,
+    image_path: m.image_path ?? null,
+    userid: m.userid ?? null,
+    created_at: m.created_at ?? new Date().toISOString(),
+    read: typeof m.read === "boolean" ? m.read : false
+  };
+};
+
+const isConversationDetailsCached = (client, conversationId) => {
+  try {
+    return !!client.cache.readQuery({
+      query: GET_CONVERSATION_DETAILS,
+      variables: { conversationId }
+    })?.conversations_by_pk;
+  } catch {
+    return false;
+  }
+};
+
+const isSystemMsid = (msid) => typeof msid === "string" && msid.startsWith("SYS_");
+
+const safeIsoNow = () => new Date().toISOString();
+
+const conversationDetailsCached = (client, conversationId) => {
+  try {
+    const res = client.cache.readQuery({
+      query: GET_CONVERSATION_DETAILS,
+      variables: { conversationId }
+    });
+    return !!res?.conversations_by_pk;
+  } catch {
+    return false;
+  }
+};
+
+const messageEntityCached = (client, messageId) => {
+  const cacheId = client.cache.identify({ __typename: "messages", id: messageId });
+  if (!cacheId) return false;
+
+  try {
+    client.cache.readFragment({
+      id: cacheId,
+      fragment: gql`
+        fragment _MsgExists on messages {
+          id
+        }
+      `
+    });
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+// Normalize/enrich conversation data so it matches what CONVERSATION_LIST_QUERY expects
+const enrichConversation = (conversation, { isoutbound, isSystem }) => ({
   ...conversation,
-  updated_at: conversation.updated_at || new Date().toISOString(),
+  updated_at: conversation.updated_at || safeIsoNow(),
-  unreadcnt: conversation.unreadcnt || 0,
+  unreadcnt: typeof conversation.unreadcnt === "number" ? conversation.unreadcnt : 0,
-  archived: conversation.archived || false,
+  archived: conversation.archived ?? false,
-  label: conversation.label || null,
+  label: conversation.label ?? null,
   job_conversations: conversation.job_conversations || [],
   messages_aggregate: conversation.messages_aggregate || {
     __typename: "messages_aggregate",
     aggregate: {
       __typename: "messages_aggregate_fields",
-      count: isOutbound ? 0 : 1
+      count: isoutbound || isSystem ? 0 : 1
     }
   },
   __typename: "conversations"
 });
 
-// Can be uncommonted to test the playback of the notification sound
+const upsertConversationIntoOffsetZeroList = (client, conversationObj, { isoutbound, isSystem } = {}) => {
-// window.testTone = () => {
+  const normalized = normalizeConversationForList(conversationObj, { isoutbound, isSystem });
-//   const notificationSound = new Audio(newMessageSound);
+  if (!normalized?.id) return;
-//   notificationSound.play().catch((error) => {
+
-//     console.error("Error playing notification sound:", error);
+  const convCacheId = client.cache.identify(normalized);
-//   });
+  if (!convCacheId) return;
-// };
+
+  // Seed the entity in the normalized store so we can safely reference it.
+  client.cache.writeFragment({
+    id: convCacheId,
+    fragment: CONVERSATION_LIST_ITEM_FRAGMENT,
+    data: normalized
+  });
+
+  // Insert/move it to top of the first page list (offset 0) only.
+  client.cache.modify({
+    id: "ROOT_QUERY",
+    fields: {
+      conversations(existing = [], { args, readField }) {
+        if (!args || args.offset !== 0) return existing;
+
+        const archivedEq = args?.where?.archived?._eq;
+        if (archivedEq === true) return existing;
+
+        const without = existing.filter((c) => readField("id", c) !== normalized.id);
+        return [{ __ref: convCacheId }, ...without];
+      }
+    }
+  });
+};
 
 export const registerMessagingHandlers = ({ socket, client, currentUser, bodyshop }) => {
   if (!(socket && client)) return;
 
   const handleNewMessageSummary = async (message) => {
-    const { conversationId, newConversation, existingConversation, isoutbound } = message;
+    const { conversationId, newConversation, existingConversation, isoutbound, msid, updated_at } = message;
 
-    // True only when DB value is strictly true; falls back to true on cache miss
+    const isSystem = isSystemMsid(msid);
-    const isNewMessageSoundEnabled = (client) => {
+
+    const isNewMessageSoundEnabled = (clientInstance) => {
       try {
         const email = currentUser?.email;
-        if (!email) return true; // default allow if we can't resolve user
+        if (!email) return true;
-        const res = client.readQuery({
+        const res = clientInstance.readQuery({
           query: QUERY_ACTIVE_ASSOCIATION_SOUND,
           variables: { email }
         });
         const flag = res?.associations?.[0]?.new_message_sound;
-        return flag === true; // strictly true => enabled
+        return flag === true;
       } catch {
-        // If the query hasn't been seeded in cache yet, default ON
         return true;
       }
     };
 
     logLocal("handleNewMessageSummary - Start", { message, isNew: !existingConversation });
 
-    const queryVariables = { offset: 0 };
-
     if (!isoutbound) {
-      // Play notification sound for new inbound message (scoped to bodyshop)
       if (isLeaderTab(bodyshop.id) && isNewMessageSoundEnabled(client)) {
         playNewMessageSound(bodyshop.id);
       }
     }
 
+    // If we think it's "new", sanity-check the cache: if conversation exists, treat as existing.
     if (!existingConversation && conversationId) {
-      // Attempt to read from the cache to determine if this is actually a new conversation
       try {
         const cachedConversation = client.cache.readFragment({
           id: client.cache.identify({ __typename: "conversations", id: conversationId }),
@@ -86,71 +245,57 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
         });
 
         if (cachedConversation) {
-          logLocal("handleNewMessageSummary - Existing Conversation inferred from cache", {
+          logLocal("handleNewMessageSummary - Existing Conversation inferred from cache", { conversationId });
-            conversationId
+          return handleNewMessageSummary({ ...message, existingConversation: true });
-          });
-          return handleNewMessageSummary({
-            ...message,
-            existingConversation: true
-          });
         }
       } catch {
-        logLocal("handleNewMessageSummary - Cache miss", { conversationId });
+        // Cache miss is normal
       }
     }
 
-    // Handle new conversation
+    // New conversation: upsert into offset-0 conversation list cache
     if (!existingConversation && newConversation?.phone_num) {
-      logLocal("handleNewMessageSummary - New Conversation", newConversation);
-
       try {
-        const queryResults = client.cache.readQuery({
+        upsertConversationIntoOffsetZeroList(client, newConversation, { isoutbound, isSystem });
-          query: CONVERSATION_LIST_QUERY,
-          variables: queryVariables
-        });
-
-        const existingConversations = queryResults?.conversations || [];
-        const enrichedConversation = enrichConversation(newConversation, isoutbound);
-
-        if (!existingConversations.some((conv) => conv.id === enrichedConversation.id)) {
-          client.cache.modify({
-            id: "ROOT_QUERY",
-            fields: {
-              conversations(existingConversations = []) {
-                return [enrichedConversation, ...existingConversations];
-              }
-            }
-          });
-        }
       } catch (error) {
         console.error("Error updating cache for new conversation:", error);
       }
       return;
     }
 
-    // Handle existing conversation
+    // Existing conversation: update updated_at and unread badge (only for inbound non-system)
-    if (existingConversation) {
+    if (existingConversation && conversationId) {
       try {
         client.cache.modify({
           id: client.cache.identify({ __typename: "conversations", id: conversationId }),
           fields: {
-            updated_at: () => new Date().toISOString(),
+            updated_at: () => updated_at || safeIsoNow(),
             archived: () => false,
-            messages_aggregate(cached = { aggregate: { count: 0 } }) {
+
-              const currentCount = cached.aggregate?.count || 0;
+            // Badge in your list uses messages_aggregate.aggregate.count with is_system excluded
-              if (!isoutbound) {
+            messages_aggregate(cached = null) {
-                return {
+              if (isoutbound || isSystem) return cached;
-                  __typename: "messages_aggregate",
+
-                  aggregate: {
+              const currentCount = cached?.aggregate?.count ?? 0;
-                    __typename: "messages_aggregate_fields",
+              return {
-                    count: currentCount + 1
+                __typename: "messages_aggregate",
-                  }
+                aggregate: {
-                };
+                  __typename: "messages_aggregate_fields",
-              }
+                  count: currentCount + 1
-              return cached;
+                }
+              };
+            },
+
+            // Keep legacy unreadcnt reasonably in sync (if you still display it anywhere)
+            unreadcnt(cached) {
+              if (isoutbound || isSystem) return cached;
+              const n = typeof cached === "number" ? cached : 0;
+              return n + 1;
             }
           }
         });
+
+        // Optional: bubble to top of offset-0 list by rewriting entity is enough
       } catch (error) {
         console.error("Error updating cache for existing conversation:", error);
       }
@@ -166,88 +311,82 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
 
     logLocal("handleNewMessageDetailed - Start", message);
 
-    try {
+    // If the conversation thread isn't open/cached, don't try to append messages
-      // Check if the conversation exists in the cache
+    if (!conversationId || !isConversationDetailsCached(client, conversationId)) return;
-      const queryResults = client.cache.readQuery({
-        query: GET_CONVERSATION_DETAILS,
-        variables: { conversationId }
-      });
 
-      if (!queryResults?.conversations_by_pk) {
+    try {
-        console.warn("Conversation not found in cache:", { conversationId });
+      const normalized = normalizeMessageForCache(newMessage, conversationId);
+
+      const messageCacheId = client.cache.identify(normalized);
+      if (!messageCacheId) {
+        console.warn("handleNewMessageDetailed - Could not identify message for cache", {
+          conversationId,
+          newMessageId: newMessage?.id
+        });
         return;
       }
 
-      // Append the new message to the conversation's message list using cache.modify
+      // Write the entity (no missing-field warnings because normalized includes is_system)
+      client.cache.writeFragment({
+        id: messageCacheId,
+        fragment: gql`
+          fragment _IncomingMessage on messages {
+            id
+            conversationid
+            status
+            text
+            is_system
+            isoutbound
+            image
+            image_path
+            userid
+            created_at
+            read
+          }
+        `,
+        data: normalized
+      });
+
+      // Append a ref (not a raw object) and avoid duplicates
       client.cache.modify({
         id: client.cache.identify({ __typename: "conversations", id: conversationId }),
         fields: {
-          messages(existingMessages = []) {
+          messages(existing = [], { readField }) {
-            return [...existingMessages, newMessage];
+            const already = existing.some((ref) => readField("id", ref) === normalized.id);
+            if (already) return existing;
+            return [...existing, { __ref: messageCacheId }];
+          },
+          updated_at() {
+            return normalized.created_at || new Date().toISOString();
           }
         }
       });
 
-      logLocal("handleNewMessageDetailed - Message appended successfully", {
+      logLocal("handleNewMessageDetailed - Message appended successfully", { conversationId });
-        conversationId,
-        newMessage
-      });
     } catch (error) {
       console.error("Error updating conversation messages in cache:", error);
     }
   };
 
   const handleMessageChanged = (message) => {
-    if (!message) {
+    if (!message?.id) return;
-      logLocal("handleMessageChanged - No message provided", message);
-      return;
-    }
 
     logLocal("handleMessageChanged - Start", message);
 
+    // Only update if the message entity exists locally
+    if (!messageEntityCached(client, message.id)) return;
+
     try {
+      const msgCacheId = client.cache.identify({ __typename: "messages", id: message.id });
+
       client.cache.modify({
-        id: client.cache.identify({ __typename: "conversations", id: message.conversationid }),
+        id: msgCacheId,
         fields: {
-          messages(existingMessages = [], { readField }) {
+          status(existing) {
-            return existingMessages.map((messageRef) => {
+            return message.type === "status-changed" ? (message.status ?? existing) : existing;
-              // Check if this is the message to update
+          },
-              if (readField("id", messageRef) === message.id) {
+          text(existing) {
-                const currentStatus = readField("status", messageRef);
+            return message.type === "text-updated" ? (message.text ?? existing) : existing;
-
-                // Handle known types of message changes
-                switch (message.type) {
-                  case "status-changed":
-                    // Prevent overwriting if the current status is already "delivered"
-                    if (currentStatus === "delivered") {
-                      logLocal("handleMessageChanged - Status already delivered, skipping update", {
-                        messageId: message.id
-                      });
-                      return messageRef;
-                    }
-
-                    // Update the status field
-                    return {
-                      ...messageRef,
-                      status: message.status
-                    };
-
-                  case "text-updated":
-                    // Handle changes to the message text
-                    return {
-                      ...messageRef,
-                      text: message.text
-                    };
-
-                  default:
-                    // Log a warning for unhandled message types
-                    logLocal("handleMessageChanged - Unhandled message type", { type: message.type });
-                    return messageRef;
-                }
-              }
-
-              return messageRef;
-            });
           }
         }
       });
@@ -262,110 +401,78 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
   };
 
   const handleConversationChanged = async (data) => {
-    if (!data) {
+    if (!data?.conversationId) return;
-      logLocal("handleConversationChanged - No data provided", data);
-      return;
-    }
 
     const {
       conversationId,
       type,
       job_conversations,
-      messageIds, // used by "conversation-marked-read"
+      messageIds,
-      messageIdsMarkedRead, // used by "conversation-marked-unread"
+      messageIdsMarkedRead,
-      lastUnreadMessageId, // used by "conversation-marked-unread"
+      lastUnreadMessageId,
-      unreadCount, // used by "conversation-marked-unread"
+      unreadCount,
       ...fields
     } = data;
 
     logLocal("handleConversationChanged - Start", data);
 
-    const updatedAt = new Date().toISOString();
+    const updatedAt = safeIsoNow();
+    const detailsCached = conversationDetailsCached(client, conversationId);
 
-    const updateConversationList = (newConversation) => {
-      try {
-        const existingList = client.cache.readQuery({
-          query: CONVERSATION_LIST_QUERY,
-          variables: { offset: 0 }
-        });
-
-        const updatedList = existingList?.conversations
-          ? [newConversation, ...existingList.conversations.filter((conv) => conv.id !== newConversation.id)]
-          : [newConversation]; // Prevent duplicates
-
-        client.cache.writeQuery({
-          query: CONVERSATION_LIST_QUERY,
-          variables: { offset: 0 },
-          data: {
-            conversations: updatedList
-          }
-        });
-
-        logLocal("handleConversationChanged - Conversation list updated successfully", newConversation);
-      } catch (error) {
-        console.error("Error updating conversation list in the cache:", error);
-      }
-    };
-
-    // Handle specific types
     try {
       switch (type) {
-        case "conversation-marked-read":
+        case "conversation-marked-read": {
-          if (conversationId && messageIds?.length > 0) {
+          // Update message entities only if details are cached, otherwise just update counters.
-            client.cache.modify({
+          if (detailsCached && Array.isArray(messageIds)) {
-              id: client.cache.identify({ __typename: "conversations", id: conversationId }),
+            messageIds.forEach((id) => {
-              fields: {
+              if (!messageEntityCached(client, id)) return;
-                messages(existingMessages = [], { readField }) {
+              client.cache.modify({
-                  return existingMessages.map((message) => {
+                id: client.cache.identify({ __typename: "messages", id }),
-                    if (messageIds.includes(readField("id", message))) {
+                fields: { read: () => true }
-                      return { ...message, read: true };
+              });
-                    }
-                    return message;
-                  });
-                },
-                // Keep unread badge in sync (badge uses messages_aggregate.aggregate.count)
-                messages_aggregate: () => ({
-                  __typename: "messages_aggregate",
-                  aggregate: { __typename: "messages_aggregate_fields", count: 0 }
-                }),
-                unreadcnt: () => 0
-              }
             });
           }
-          break;
-
-        case "conversation-marked-unread": {
-          if (!conversationId) break;
-
-          const safeUnreadCount = typeof unreadCount === "number" ? unreadCount : 1;
-          const idsMarkedRead = Array.isArray(messageIdsMarkedRead) ? messageIdsMarkedRead : [];
 
           client.cache.modify({
             id: client.cache.identify({ __typename: "conversations", id: conversationId }),
             fields: {
-              // Bubble the conversation up in the list (since UI sorts by updated_at)
+              messages_aggregate: () => ({
+                __typename: "messages_aggregate",
+                aggregate: { __typename: "messages_aggregate_fields", count: 0 }
+              }),
+              unreadcnt: () => 0,
+              updated_at: () => updatedAt
+            }
+          });
+
+          break;
+        }
+
+        case "conversation-marked-unread": {
+          const safeUnreadCount = typeof unreadCount === "number" ? unreadCount : 1;
+          const idsMarkedRead = Array.isArray(messageIdsMarkedRead) ? messageIdsMarkedRead : [];
+
+          if (detailsCached) {
+            idsMarkedRead.forEach((id) => {
+              if (!messageEntityCached(client, id)) return;
+              client.cache.modify({
+                id: client.cache.identify({ __typename: "messages", id }),
+                fields: { read: () => true }
+              });
+            });
+
+            if (lastUnreadMessageId && messageEntityCached(client, lastUnreadMessageId)) {
+              client.cache.modify({
+                id: client.cache.identify({ __typename: "messages", id: lastUnreadMessageId }),
+                fields: { read: () => false }
+              });
+            }
+          }
+
+          client.cache.modify({
+            id: client.cache.identify({ __typename: "conversations", id: conversationId }),
+            fields: {
               updated_at: () => updatedAt,
-
-              // If details are already cached, flip the read flags appropriately
-              messages(existingMessages = [], { readField }) {
-                if (!Array.isArray(existingMessages) || existingMessages.length === 0) return existingMessages;
-
-                return existingMessages.map((msg) => {
-                  const id = readField("id", msg);
-
-                  if (lastUnreadMessageId && id === lastUnreadMessageId) {
-                    return { ...msg, read: false };
-                  }
-
-                  if (idsMarkedRead.includes(id)) {
-                    return { ...msg, read: true };
-                  }
-
-                  return msg;
-                });
-              },
-
-              // Update unread badge
               messages_aggregate: () => ({
                 __typename: "messages_aggregate",
                 aggregate: {
@@ -373,8 +480,6 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
                   count: safeUnreadCount
                 }
               }),
-
-              // Optional: keep legacy/parallel unread field consistent if present
               unreadcnt: () => safeUnreadCount
             }
           });
@@ -382,89 +487,46 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
           break;
         }
 
-        case "conversation-created":
+        case "conversation-created": {
-          updateConversationList({ ...fields, job_conversations, updated_at: updatedAt });
+          const conv = enrichConversation(
+            { id: conversationId, job_conversations, ...fields, updated_at: updatedAt },
+            { isoutbound: false, isSystem: false }
+          );
+          upsertConversationIntoOffsetZeroList(client, conv);
           break;
+        }
 
         case "conversation-unarchived":
-        case "conversation-archived":
+        case "conversation-archived": {
-          try {
+          // Correct refetch usage: this refetches any ACTIVE watchers for these documents.
-            const listQueryVariables = { offset: 0 };
+          await client.refetchQueries({
-            const detailsQueryVariables = { conversationId };
+            include: [CONVERSATION_LIST_QUERY, GET_CONVERSATION_DETAILS]
-
+          });
-            // Check if conversation details exist in the cache
-            const detailsExist = !!client.cache.readQuery({
-              query: GET_CONVERSATION_DETAILS,
-              variables: detailsQueryVariables
-            });
-
-            // Refetch conversation list
-            await client.refetchQueries({
-              include: [CONVERSATION_LIST_QUERY, ...(detailsExist ? [GET_CONVERSATION_DETAILS] : [])],
-              variables: [
-                { query: CONVERSATION_LIST_QUERY, variables: listQueryVariables },
-                ...(detailsExist
-                  ? [
-                      {
-                        query: GET_CONVERSATION_DETAILS,
-                        variables: detailsQueryVariables
-                      }
-                    ]
-                  : [])
-              ]
-            });
-
-            logLocal("handleConversationChanged - Refetched queries after state change", {
-              conversationId,
-              type
-            });
-          } catch (error) {
-            console.error("Error refetching queries after conversation state change:", error);
-          }
           break;
+        }
 
         case "tag-added": {
-          // Ensure `job_conversations` is properly formatted
+          const formattedJobConversations = (job_conversations || []).map((jc) => ({
-          const formattedJobConversations = job_conversations.map((jc) => ({
             __typename: "job_conversations",
             jobid: jc.jobid || jc.job?.id,
             conversationid: conversationId,
-            job: jc.job || {
+            job: {
               __typename: "jobs",
-              id: data.selectedJob.id,
+              id: jc.job?.id,
-              ro_number: data.selectedJob.ro_number,
+              ro_number: jc.job?.ro_number,
-              ownr_co_nm: data.selectedJob.ownr_co_nm,
+              ownr_co_nm: jc.job?.ownr_co_nm,
-              ownr_fn: data.selectedJob.ownr_fn,
+              ownr_fn: jc.job?.ownr_fn,
-              ownr_ln: data.selectedJob.ownr_ln
+              ownr_ln: jc.job?.ownr_ln
             }
           }));
 
           client.cache.modify({
             id: client.cache.identify({ __typename: "conversations", id: conversationId }),
             fields: {
-              job_conversations: (existing = []) => {
+              job_conversations(existing = [], { readField }) {
-                // Ensure no duplicates based on both `conversationid` and `jobid`
+                const seen = new Set(existing.map((x) => readField("jobid", x)).filter(Boolean));
-                const existingLinks = new Set(
+                const incoming = formattedJobConversations.filter((x) => x.jobid && !seen.has(x.jobid));
-                  existing.map((jc) => {
+                return [...existing, ...incoming];
-                    const jobId = client.cache.readFragment({
-                      id: client.cache.identify(jc),
-                      fragment: gql`
-                        fragment JobConversationLinkAdded on job_conversations {
-                          jobid
-                          conversationid
-                        }
-                      `
-                    })?.jobid;
-                    return `${jobId}:${conversationId}`; // Unique identifier for a job-conversation link
-                  })
-                );
-
-                const newItems = formattedJobConversations.filter((jc) => {
-                  const uniqueLink = `${jc.jobid}:${jc.conversationid}`;
-                  return !existingLinks.has(uniqueLink);
-                });
-
-                return [...existing, ...newItems];
               }
             }
           });
@@ -472,46 +534,32 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
           break;
         }
 
-        case "tag-removed":
+        case "tag-removed": {
-          try {
+          const conversationCacheId = client.cache.identify({ __typename: "conversations", id: conversationId });
-            const conversationCacheId = client.cache.identify({ __typename: "conversations", id: conversationId });
-
-            // Evict the specific cache entry for job_conversations
-            client.cache.evict({
-              id: conversationCacheId,
-              fieldName: "job_conversations"
-            });
-
-            // Garbage collect evicted entries
-            client.cache.gc();
-
-            logLocal("handleConversationChanged - tag removed - Refetched conversation list after state change", {
-              conversationId,
-              type
-            });
-          } catch (error) {
-            console.error("Error refetching queries after conversation state change: (Tag Removed)", error);
-          }
 
+          client.cache.evict({
+            id: conversationCacheId,
+            fieldName: "job_conversations"
+          });
+          client.cache.gc();
           break;
+        }
 
-        default:
+        default: {
-          logLocal("handleConversationChanged - Unhandled type", { type });
+          // Safe partial updates to the conversation entity
           client.cache.modify({
             id: client.cache.identify({ __typename: "conversations", id: conversationId }),
-            fields: {
+            fields: Object.fromEntries(
-              ...Object.fromEntries(
+              Object.entries(fields).map(([key, value]) => [key, (cached) => (value !== undefined ? value : cached)])
-                Object.entries(fields).map(([key, value]) => [key, (cached) => (value !== undefined ? value : cached)])
+            )
-              )
-            }
           });
+        }
       }
     } catch (error) {
       console.error("Error handling conversation changes:", { type, error });
     }
   };
 
-  // Existing handler for phone number opt-out
   const handlePhoneNumberOptedOut = async (data) => {
     const { bodyshopid, phone_number } = data;
     logLocal("handlePhoneNumberOptedOut - Start", data);
@@ -521,22 +569,18 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
         id: "ROOT_QUERY",
         fields: {
           phone_number_opt_out(existing = [], { readField }) {
-            const phoneNumberExists = existing.some(
+            const exists = existing.some(
               (ref) => readField("phone_number", ref) === phone_number && readField("bodyshopid", ref) === bodyshopid
             );
-
+            if (exists) return existing;
-            if (phoneNumberExists) {
-              logLocal("handlePhoneNumberOptedOut - Phone number already in cache", { phone_number, bodyshopid });
-              return existing;
-            }
 
             const newOptOut = {
               __typename: "phone_number_opt_out",
               id: `temporary-${phone_number}-${Date.now()}`,
               bodyshopid,
               phone_number,
-              created_at: new Date().toISOString(),
+              created_at: safeIsoNow(),
-              updated_at: new Date().toISOString()
+              updated_at: safeIsoNow()
             };
 
             return [...existing, newOptOut];
@@ -551,46 +595,36 @@ export const registerMessagingHandlers = ({ socket, client, currentUser, bodysho
         args: { bodyshopid, search: phone_number }
       });
       client.cache.gc();
-
-      logLocal("handlePhoneNumberOptedOut - Cache updated successfully", data);
     } catch (error) {
       console.error("Error updating cache for phone number opt-out:", error);
-      logLocal("handlePhoneNumberOptedOut - Error", { error: error.message });
     }
   };
 
-  // New handler for phone number opt-in
   const handlePhoneNumberOptedIn = async (data) => {
     const { bodyshopid, phone_number } = data;
     logLocal("handlePhoneNumberOptedIn - Start", data);
 
     try {
-      // Update the Apollo cache for GET_PHONE_NUMBER_OPT_OUTS by removing the phone number
       client.cache.modify({
         id: "ROOT_QUERY",
         fields: {
           phone_number_opt_out(existing = [], { readField }) {
-            // Filter out the phone number from the opt-out list
             return existing.filter(
               (ref) => !(readField("phone_number", ref) === phone_number && readField("bodyshopid", ref) === bodyshopid)
             );
           }
         },
-        broadcast: true // Trigger UI updates
+        broadcast: true
       });
 
-      // Evict the cache entry to force a refetch on next query
       client.cache.evict({
         id: "ROOT_QUERY",
         fieldName: "phone_number_opt_out",
         args: { bodyshopid, search: phone_number }
       });
       client.cache.gc();
-
-      logLocal("handlePhoneNumberOptedIn - Cache updated successfully", data);
     } catch (error) {
       console.error("Error updating cache for phone number opt-in:", error);
-      logLocal("handlePhoneNumberOptedIn - Error", { error: error.message });
     }
   };
 

client/src/components/chat-mark-unread-button/chat-mark-unread-button.component.jsx

@@ -1,4 +1,3 @@
-import { MailOutlined } from "@ant-design/icons";
 import { Button, Tooltip } from "antd";
 import { useTranslation } from "react-i18next";
 
@@ -9,7 +8,9 @@ export default function ChatMarkUnreadButton({ disabled, loading, onMarkUnread }
     <Tooltip title={t("messaging.labels.mark_unread")}>
       <Button
         size="small"
-        icon={<MailOutlined />}
+        className="unread-button"
+        type="primary"
+        children={t("messaging.labels.mark_unread")}
         loading={loading}
         disabled={disabled}
         onMouseDown={(e) => e.stopPropagation()} // prevent parent mark-read handler

client/src/components/chat-messages-list/chat-message-list.styles.scss

@@ -10,6 +10,11 @@
   border-radius: 4px;
 }
 
+.unread-button {
+  height: 20px;
+  border-radius: 4px;
+}
+
 .chat-title {
   margin-bottom: 5px;
 }

client/src/translations/en_us/common.json

@@ -2431,7 +2431,7 @@
         "sentby": "Sent by {{by}} at {{time}}",
         "typeamessage": "Send a message...",
         "unarchive": "Unarchive",
-        "mark_unread": "Mark as Unread"
+        "mark_unread": "Mark as unread"
       },
       "render": {
         "conversation_list": "Conversation List"

client/src/utils/GraphQLClient.js

@@ -148,6 +148,26 @@ const cache = new InMemoryCache({
     Query: {
       fields: {
         // Note: This is required because we switch from a read to an unread state with a toggle,
+        conversations: {
+          keyArgs: ["where", "order_by"], // keep separate caches for archived/unarchived + sort
+          merge(existing = [], incoming = [], { args, readField }) {
+            const offset = args?.offset ?? 0;
+            const merged = existing ? existing.slice(0) : [];
+
+            for (let i = 0; i < incoming.length; i++) {
+              merged[offset + i] = incoming[i];
+            }
+
+            // Deduplicate by id (important when you also upsert via sockets)
+            const seen = new Set();
+            return merged.filter((ref) => {
+              const id = readField("id", ref);
+              if (!id || seen.has(id)) return false;
+              seen.add(id);
+              return true;
+            });
+          }
+        },
         notifications: {
           merge(existing = [], incoming = [], { readField }) {
             // Create a map to deduplicate by __ref

server/graphql-client/queries.js

@@ -123,7 +123,7 @@ mutation RECEIVE_MESSAGE($msg: [messages_insert_input!]!) {
 
 exports.INSERT_MESSAGE = `
 mutation INSERT_MESSAGE($msg: [messages_insert_input!]!, $conversationid: uuid!) {
-  update_conversations_by_pk(pk_columns: {id: $conversationid}, _set: {archived: false}) {
+  update_conversations_by_pk(pk_columns: { id: $conversationid }, _set: { archived: false }) {
     id
     archived
   }
@@ -147,6 +147,7 @@ mutation INSERT_MESSAGE($msg: [messages_insert_input!]!, $conversationid: uuid!)
       image_path
       image
       isoutbound
+      is_system
       msid
       read
       text

server/sms/send.js

@@ -61,7 +61,8 @@ const send = async (req, res) => {
       isoutbound: true,
       userid: req.user.email,
       image: selectedMedia.length > 0,
-      image_path: selectedMedia.length > 0 ? selectedMedia.map((i) => i.src) : []
+      image_path: selectedMedia.length > 0 ? selectedMedia.map((i) => i.src) : [],
+      is_system: false
     };
 
     try {