import {FC} from 'react';
import ReactModal from 'react-modal';
import ChildMenu from '@pages/menu-id';

type Props = {
  visible: boolean
  id: string
  onClose: () => void
};

const styles: ReactModal.Styles = {
  content: {
    width: '80%',
    height: '90%',
  },
};

const ChildMenuModal: FC<Props> = function({visible, id, onClose}) {
  return (
    <ReactModal isOpen={visible} ariaHideApp={false} style={styles} closeTimeoutMS={200}>
      <ChildMenu id={id} onClose={onClose} />
    </ReactModal>
  );
};

export default ChildMenuModal;
