import { createContext, useState, ReactNode, useContext } from 'react';

type TopModalContextType = {
  topModal: ReactNode | null;
  setTopModal: (modal: ReactNode | null) => void;
};

const TopModalContext = createContext({
  topModal: null,
  setTopModal: () => {},
} as TopModalContextType);

export const TopModalProvider = ({ children }) => {
  const [topModal, setTopModal] = useState(null);

  return (
    <TopModalContext.Provider value={{ topModal, setTopModal }}>
      {children}
    </TopModalContext.Provider>
  );
};

const useTopModal = () => useContext(TopModalContext);

export default useTopModal;