fix: optimize the message list store usage

Author: khushal87

package/src/components/Channel/Channel.tsx

@@ -771,7 +771,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
   const [thread, setThread] = useState<LocalMessage | null>(threadProps || null);
   const [threadHasMore, setThreadHasMore] = useState(true);
   const [threadLoadingMore, setThreadLoadingMore] = useState(false);
-  const channelUnreadStateStore = useMemo(() => new ChannelUnreadStateStore(), []);
+  const [channelUnreadStateStore] = useState(new ChannelUnreadStateStore());
   const setChannelUnreadState = useCallback(
     (data: ChannelUnreadStateStoreType['channelUnreadState']) => {
       channelUnreadStateStore.channelUnreadState = data;

package/src/components/MessageList/hooks/useMessageList.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 
 import type { LocalMessage } from 'stream-chat';
 
@@ -70,6 +70,9 @@ export const useMessageList = (params: UseMessageListParams) => {
   const { messages, viewabilityChangedCallback } = usePaginatedMessageListContext();
   const { threadMessages } = useThreadContext();
   const messageList = threadList ? threadMessages : messages;
+  const [messageListPreviousAndNextMessageStore] = useState(
+    () => new MessagePreviousAndNextMessageStore(),
+  );
 
   const filteredMessageList = useMemo(() => {
     const filteredMessages = [];
@@ -86,11 +89,6 @@ export const useMessageList = (params: UseMessageListParams) => {
     return filteredMessages;
   }, [messageList, deletedMessagesVisibilityType, client.userID]);
 
-  const messageListPreviousAndNextMessageStore = useMemo(
-    () => new MessagePreviousAndNextMessageStore(),
-    [],
-  );
-
   useEffect(() => {
     messageListPreviousAndNextMessageStore.setMessageListPreviousAndNextMessage(
       filteredMessageList,