"use client";

import setForumStore from "@/app/[language]/forum/store/setForumStore";
import setWantStore from "@/app/[language]/want/store/setWantStore";
import setAvatarStore from "@/avatar/setAvatarStore";
import setTaehuiStore from "@/store/setTaehuiStore";
import { useLocalObservable } from "mobx-react-lite";
import { createContext, FC, PropsWithChildren, useContext } from "react";

type MainStore = {
  taehuiStore: ReturnType<typeof setTaehuiStore>;
  wantStore: ReturnType<typeof setWantStore>;
  avatarStore: ReturnType<typeof setAvatarStore>;
  forumStore: ReturnType<typeof setForumStore>;
};

const mainStore = createContext<MainStore>({} as MainStore);
const { Provider } = mainStore;

export const Stores: FC<PropsWithChildren> = ({ children }) => (
  <Provider
    value={{
      taehuiStore: useLocalObservable(setTaehuiStore),
      wantStore: useLocalObservable(setWantStore),
      avatarStore: useLocalObservable(setAvatarStore),
      forumStore: useLocalObservable(setForumStore),
    }}
  >
    {children}
  </Provider>
);

export const useTaehuiStore = () => useContext(mainStore).taehuiStore;

export const useWantStore = () => useContext(mainStore).wantStore;

export const useAvatarStore = () => useContext(mainStore).avatarStore;

export const useForumStore = () => useContext(mainStore).forumStore;