CW-performance

Fixed subscription for DiscussionMessages
daostack · Oct 7, 2024 · a21a84e · a21a84e
1 parent 0608a19
commit a21a84e
Showing 1 changed file with 35 additions and 8 deletions.
diff --git a/src/shared/hooks/useCases/useDiscussionMessagesById.ts b/src/shared/hooks/useCases/useDiscussionMessagesById.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback } from "react";
+import { useState, useCallback, useEffect, useRef } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { useDeepCompareEffect, useUpdateEffect } from "react-use";
 import { trace } from "firebase/performance";
@@ -100,6 +100,8 @@ export const useDiscussionMessagesById = ({
   const [discussionMessagesWithOwners, setDiscussionMessagesWithOwners] =
     useState<any>();
 
+  const unsubscribeRef = useRef<firebase.Unsubscribe | null>(null);
+
   useUpdateEffect(() => {
     if (discussionId) {
       setDiscussionMessagesWithOwners([]);
@@ -251,7 +253,7 @@ export const useDiscussionMessagesById = ({
       const fetchDiscussionMessagesTrace = trace(perf, 'fetchDiscussionMessages');
       fetchDiscussionMessagesTrace.start();
 
-      DiscussionMessageService.subscribeToDiscussionMessagesByDiscussionId(
+      unsubscribeRef.current = DiscussionMessageService.subscribeToDiscussionMessagesByDiscussionId(
         discussionId,
         lastVisible && lastVisible[discussionId],
         async (
@@ -268,16 +270,16 @@ export const useDiscussionMessagesById = ({
             ...prevVisible,
             [discussionId]: lastVisibleDocument,
           }));
-  
+
           const hasLastVisibleDocument = !!lastVisibleDocument?.data();
-  
+
           const discussionsWithText = await Promise.all(
             updatedDiscussionMessages.map(async (discussionMessage) => {
               const isUserDiscussionMessage =
                 checkIsUserDiscussionMessage(discussionMessage);
               const isSystemMessage =
                 checkIsSystemDiscussionMessage(discussionMessage);
-  
+
               const parsedText = await getTextFromTextEditorString({
                 userId,
                 ownerId: isUserDiscussionMessage
@@ -294,7 +296,7 @@ export const useDiscussionMessagesById = ({
                 onFeedItemClick,
                 onInternalLinkClick,
               });
-  
+
               return {
                 ...discussionMessage,
                 parsedText,
@@ -321,10 +323,35 @@ export const useDiscussionMessagesById = ({
         },
       );
       fetchDiscussionMessagesTrace.stop();
-    } catch(err) {
+    } catch (err) {
       setIsBatchLoading(false);
     }
-  },[discussionId, isEndOfList, state.loading, state.data, isBatchLoading, lastVisible, userId, users, directParent, getCommonPagePath, getCommonPageAboutTabPath, onUserClick, onFeedItemClick, onInternalLinkClick, dispatch]);
+  }, [
+    discussionId,
+    isEndOfList,
+    state.loading,
+    state.data,
+    isBatchLoading,
+    lastVisible,
+    userId,
+    users,
+    directParent,
+    getCommonPagePath,
+    getCommonPageAboutTabPath,
+    onUserClick,
+    onFeedItemClick,
+    onInternalLinkClick,
+    dispatch,
+  ]);
+
+  useEffect(() => {
+    // Cleanup subscription on unmount or when discussionId changes
+    return () => {
+      if (unsubscribeRef.current) {
+        unsubscribeRef.current();
+      }
+    };
+  }, [discussionId]);
 
   useDeepCompareEffect(() => {
     (async () => {