fix: properly sync own reads while offline mode is enabled

Author: isekovanic

package/src/components/ChannelList/hooks/useCreateChannelsContext.ts

@@ -41,7 +41,9 @@ export const useCreateChannelsContext = <
   const channelValueString = channels
     ?.map(
       (channel) =>
-        `${channel.data?.name ?? ''}${channel.id ?? ''}${Object.values(channel.state.members)
+        `${channel.data?.name ?? ''}${channel.id ?? ''}${
+          channel?.state?.unreadCount ?? ''
+        }${Object.values(channel.state.members)
           .map((member) => member.user?.online)
           .join()}`,
     )

package/src/components/ChannelPreview/hooks/useChannelPreviewData.ts

@@ -47,8 +47,7 @@ export const useChannelPreviewData = <
     }
     const newUnreadCount = channel.countUnread();
     setUnread(newUnreadCount);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [channel, channelLastMessageString, channelListForceUpdate]);
+  }, [channel, channelLastMessage, channelLastMessageString, channelListForceUpdate, lastMessage]);
 
   /**
    * This effect listens for the `notification.mark_read` event and sets the unread count to 0

package/src/components/Chat/hooks/handleEventToSyncDB.ts

@@ -120,15 +120,33 @@ export const handleEventToSyncDB = async <
   }
 
   if (type === 'message.new') {
-    const message = event.message;
+    const { cid, message, user } = event;
 
     if (message && (!message.parent_id || message.show_in_channel)) {
-      return await queriesWithChannelGuard((flushOverride) =>
-        upsertMessages({
+      return await queriesWithChannelGuard(async (flushOverride) => {
+        let queries = await upsertMessages({
           flush: flushOverride,
           messages: [message],
-        }),
-      );
+        });
+        if (cid && client.user && client.user.id !== user?.id) {
+          const userId = client.user.id;
+          const ownReads = client.activeChannels[cid]?.state.read[userId];
+          const upsertReadsQueries = await upsertReads({
+            cid,
+            flush: flushOverride,
+            reads: [
+              {
+                last_read: ownReads.last_read.toString() as string,
+                last_read_message_id: ownReads.last_read_message_id,
+                unread_messages: ownReads?.unread_messages,
+                user: client.user,
+              },
+            ],
+          });
+          queries = [...queries, ...upsertReadsQueries];
+        }
+        return queries;
+      });
     }
   }