[CLNP-7360]Multiple Chat Windows cause unexpected behavior

src/modules/GroupChannel/context/GroupChannelProvider.tsx

@@ -33,7 +33,7 @@ import useSendbird from '../../../lib/Sendbird/context/hooks/useSendbird';
 import useDeepCompareEffect from '../../../hooks/useDeepCompareEffect';
 import { deleteNullish } from '../../../utils/utils';
 
-const initialState = {
+const initialState = () => ({
   currentChannel: null,
   channelUrl: '',
   fetchChannelError: null,
@@ -60,12 +60,12 @@ const initialState = {
   disableMarkAsRead: false,
   scrollBehavior: 'auto',
   scrollPubSub: null,
-} as GroupChannelState;
+} as GroupChannelState);
 
 export const GroupChannelContext = createContext<ReturnType<typeof createStore<GroupChannelState>> | null>(null);
 
 const createGroupChannelStore = (props?: Partial<GroupChannelState>) => createStore({
-  ...initialState,
+  ...initialState(),
   ...props,
 });
 
@@ -378,7 +378,7 @@ const GroupChannelProvider: React.FC<GroupChannelProviderProps> = (props) => {
  * @returns {ReturnType<typeof createStore<GroupChannelState>>}
  */
 const useGroupChannelStore = () => {
-  return useStore(GroupChannelContext, state => state, initialState);
+  return useStore(GroupChannelContext, state => state, initialState());
 };
 
 // Keep this function for backward compatibility.

src/modules/GroupChannelList/context/GroupChannelListProvider.tsx

@@ -62,7 +62,7 @@ export const GroupChannelListContext = React.createContext<ReturnType<typeof cre
 export interface GroupChannelListState extends GroupChannelListContextType {
 }
 
-const initialState: GroupChannelListState = {
+const initialState = () => ({
   className: '',
   selectedChannelUrl: '',
   disableAutoSelect: false,
@@ -82,13 +82,13 @@ const initialState: GroupChannelListState = {
   refresh: null,
   loadMore: null,
   scrollRef: { current: null },
-};
+} as GroupChannelListState);
 
 /**
  * @returns {ReturnType<typeof createStore<GroupChannelListState>>}
  */
 export const useGroupChannelListStore = () => {
-  return useStore(GroupChannelListContext, state => state, initialState);
+  return useStore(GroupChannelListContext, state => state, initialState());
 };
 
 export const GroupChannelListManager: React.FC<GroupChannelListProviderProps> = ({
@@ -229,7 +229,7 @@ export const GroupChannelListManager: React.FC<GroupChannelListProviderProps> =
 };
 
 const createGroupChannelListStore = (props?: Partial<GroupChannelListState>) => createStore({
-  ...initialState,
+  ...initialState(),
   ...props,
 });
 

src/modules/Thread/context/ThreadProvider.tsx

@@ -59,7 +59,7 @@ export interface ThreadState extends ThreadProviderProps {
   nicknamesMap: Map<string, string>;
 }
 
-const initialState: ThreadState = {
+const initialState = () => ({
   channelUrl: '',
   message: null,
   onHeaderActionClick: undefined,
@@ -86,12 +86,12 @@ const initialState: ThreadState = {
   currentUserId: '',
   typingMembers: [],
   nicknamesMap: null,
-};
+} as ThreadState);
 
 export const ThreadContext = React.createContext<ReturnType<typeof createStore<ThreadState>> | null>(null);
 
 const createThreadStore = (props?: Partial<ThreadState>) => createStore({
-  ...initialState,
+  ...initialState(),
   ...props,
 });
 
@@ -248,5 +248,5 @@ export const useThreadContext = () => {
 };
 
 const useThreadStore = () => {
-  return useStore(ThreadContext, state => state, initialState);
+  return useStore(ThreadContext, state => state, initialState());
 };