'use client';

import {
  useState,
  useContext,
  useCallback,
  ReactNode,
  createContext,
} from 'react';
import { Modal } from '@shared/ui/modal';

const ModalContext = createContext({
  hideModal: () => {},
  showModal: (content: ReactNode) => {},
});

const useModal = () => useContext(ModalContext);

const ModalProvider = ({ children }: { children: ReactNode }) => {
  const [modalContent, setModalContent] = useState<ReactNode>(null);

  const showModal = useCallback((content: ReactNode) => {
    setModalContent(content);
  }, []);

  const hideModal = useCallback(() => {
    setModalContent(null);
  }, []);

  return (
    <ModalContext.Provider value={{ hideModal, showModal }}>
      {children}
      {/* Ваш Modal компонент здесь */}
      <Modal isOpen={modalContent !== null} onClose={hideModal}>
        {modalContent}
      </Modal>
    </ModalContext.Provider>
  );
};

export { useModal, ModalProvider };
