import {useCallback, useMemo, useState} from 'react';
import * as React from 'react';
import {Modal} from "antd";

export default function useModal(){
  const [modalContent, setModalContent] = useState(null);
  const [isOpen,setIsOpen]=useState(true)
  const onClose = useCallback(() => {
    setModalContent(null);
    setIsOpen(false)
  }, []);

  const modal = useMemo(() => {
    if (modalContent === null) {
      return null;
    }
    const {title, content, closeOnClickOutside} = modalContent;
    return (<div>
      <Modal
          open={isOpen}
          //onOk={handleOk}
          onCancel={onClose}
          title={title}
        // closeOnClickOutside={closeOnClickOutside}
      >

        {content}
      </Modal></div>
    );
  }, [modalContent, onClose,isOpen]);

  const showModal = useCallback((
      title,
      getContent,
      closeOnClickOutside = false,
    ) => {
      setModalContent({
        closeOnClickOutside,
        content: getContent(onClose),
        title,
      });
    },
    [onClose],
  );

  return [modal, showModal];
}