import useModalStore from "../stores/useModalStore";

function ModalContainer() {
  const [modal] = useModalStore((state) => [state.modal]);

  if (modal) {
    return (
      <div
        // onClick={() => setModal(null)}
        className={`fixed p-8 top-0 left-0 z-10 w-full h-full flex justify-center items-center bg-black bg-opacity-80 overflow-auto transition-opacity`}
      >
        <div onClick={(e) => e.stopPropagation()} className="cursor-default">
          {modal}
        </div>
      </div>
    );
  }
}

export default ModalContainer;
