added memoization to stop rerenders

RocketChat · Oct 26, 2024 · 3cecd0c · 3cecd0c
1 parent 9187d95
commit 3cecd0c
Showing 1 changed file with 6 additions and 8 deletions.
diff --git a/packages/react/src/hooks/useSetMessageList.js b/packages/react/src/hooks/useSetMessageList.js
@@ -1,16 +1,14 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
 
 export const useSetMessageList = (messages, shouldRender) => {
   const [loading, setLoading] = useState(true);
-  const [messageList, setMessageList] = useState([]);
 
-  useEffect(() => {
-    setLoading(true);
-    const filteredMessages = messages.filter((message) =>
-      shouldRender(message)
-    );
+  const messageList = useMemo(
+    () => messages.filter(shouldRender),
+    [messages, shouldRender]
+  );
 
-    setMessageList(filteredMessages);
+  useEffect(() => {
     setLoading(false);
   }, [messages, shouldRender]);