fix: rerender chat when opened with existing messages

100mslive · Mar 18, 2024 · 54faa73 · 54faa73
1 parent c9957ee
commit 54faa73
Showing 1 changed file with 10 additions and 0 deletions.
diff --git a/packages/roomkit-react/src/Prebuilt/components/Chat/ChatBody.tsx b/packages/roomkit-react/src/Prebuilt/components/Chat/ChatBody.tsx
@@ -410,6 +410,7 @@ export const ChatBody = React.forwardRef<VariableSizeList, { scrollToBottom: (co
     }, [blacklistedMessageIDs, messages]);
 
     const vanillaStore = useHMSVanillaStore();
+    const rerenderOnFirstMount = useRef(false);
 
     useEffect(() => {
       const unsubscribe = vanillaStore.subscribe(() => {
@@ -426,6 +427,15 @@ export const ChatBody = React.forwardRef<VariableSizeList, { scrollToBottom: (co
       return unsubscribe;
     }, [vanillaStore, listRef, scrollToBottom]);
 
+    useEffect(() => {
+      // @ts-ignore
+      if (filteredMessages.length > 0 && listRef?.current && !rerenderOnFirstMount.current) {
+        rerenderOnFirstMount.current = true;
+        // @ts-ignore
+        listRef.current.resetAfterIndex(0);
+      }
+    }, [listRef, filteredMessages]);
+
     return filteredMessages.length === 0 ? (
       <EmptyChat />
     ) : (