import { createContext, ReactNode, useContext } from "react"; import { useLocalObservable } from "mobx-react-lite"; import setTaehuiStore from "src/taehui/setTaehuiStore"; import setAvatarStore from "src/avatar/setAvatarStore"; import setForumStore from "src/forum/setForumStore"; type MainStore = { taehuiStore: ReturnType<typeof setTaehuiStore>; avatarStore: ReturnType<typeof setAvatarStore>; forumStore: ReturnType<typeof setForumStore>; }; const mainStore = createContext<MainStore>({} as MainStore); const { Provider } = mainStore; export const Stores = ({ children }: { children: ReactNode }) => ( <Provider value={{ taehuiStore: useLocalObservable(setTaehuiStore), avatarStore: useLocalObservable(setAvatarStore), forumStore: useLocalObservable(setForumStore), }} > {children} </Provider> ); export const useTaehuiStore = () => useContext(mainStore).taehuiStore; export const useAvatarStore = () => useContext(mainStore).avatarStore; export const useForumStore = () => useContext(mainStore).forumStore;