fix: remove stale message status for the last loaded message on returnAllReadData false (#2881)

Author: MartinCupela

src/components/MessageList/hooks/useLastDeliveredData.ts

@@ -13,9 +13,9 @@ export const useLastDeliveredData = (
 ): Record<string, UserResponse[]> => {
   const { channel, lastOwnMessage, messages, returnAllReadData } = props;
 
-  const calculate = useCallback(() => {
-    if (returnAllReadData) {
-      return messages.reduce(
+  const calculateForAll = useCallback(
+    () =>
+      messages.reduce(
         (acc, msg) => {
           acc[msg.id] = channel.messageReceiptsTracker.deliveredForMessage({
             msgId: msg.id,
@@ -24,24 +24,37 @@ export const useLastDeliveredData = (
           return acc;
         },
         {} as Record<string, UserResponse[]>,
-      );
-    }
+      ),
+    [channel, messages],
+  );
+
+  const calculateForLastOwn = useCallback(() => {
     if (!lastOwnMessage) return {};
     return {
       [lastOwnMessage.id]: channel.messageReceiptsTracker.deliveredForMessage({
         msgId: lastOwnMessage.id,
         timestampMs: lastOwnMessage.created_at.getTime(),
       }),
     };
-  }, [channel, lastOwnMessage, messages, returnAllReadData]);
-
-  const [deliveredTo, setDeliveredTo] =
-    useState<Record<string, UserResponse[]>>(calculate);
+  }, [channel, lastOwnMessage]);
 
-  useEffect(
-    () => channel.on('message.delivered', () => setDeliveredTo(calculate)).unsubscribe,
-    [channel, calculate],
+  const [deliveredTo, setDeliveredTo] = useState<Record<string, UserResponse[]>>(
+    returnAllReadData ? calculateForAll : calculateForLastOwn,
   );
 
+  useEffect(() => {
+    if (!returnAllReadData) return;
+    setDeliveredTo(calculateForAll);
+    return channel.on('message.delivered', () => setDeliveredTo(calculateForAll))
+      .unsubscribe;
+  }, [channel, calculateForAll, returnAllReadData]);
+
+  useEffect(() => {
+    if (returnAllReadData) return;
+    else setDeliveredTo(calculateForLastOwn);
+    return channel.on('message.delivered', () => setDeliveredTo(calculateForLastOwn))
+      .unsubscribe;
+  }, [channel, calculateForLastOwn, returnAllReadData]);
+
   return deliveredTo;
 };