"use client"; import setAvatarStore from "@/app/[language]/avatar/state/setAvatarStore"; import setHallStore from "@/app/[language]/hall/state/setHallStore"; import setNoteStore from "@/app/[language]/note/state/setNoteStore"; import setSiteStore from "@/app/[language]/site/state/setSiteStore"; import { useLocalObservable } from "mobx-react-lite"; import { createContext, FC, PropsWithChildren, useContext } from "react"; type MainStore = { noteStore: ReturnType<typeof setNoteStore>; siteStore: ReturnType<typeof setSiteStore>; avatarStore: ReturnType<typeof setAvatarStore>; hallStore: ReturnType<typeof setHallStore>; }; const mainStore = createContext<MainStore>({} as MainStore); const { Provider } = mainStore; export const Stores: FC<PropsWithChildren> = ({ children }) => ( <Provider value={{ noteStore: useLocalObservable(setNoteStore), siteStore: useLocalObservable(setSiteStore), avatarStore: useLocalObservable(setAvatarStore), hallStore: useLocalObservable(setHallStore), }} > {children} </Provider> ); export const useSiteStore = () => useContext(mainStore).siteStore; export const useNoteStore = () => useContext(mainStore).noteStore; export const useAvatarStore = () => useContext(mainStore).avatarStore; export const useHallStore = () => useContext(mainStore).hallStore;