text: import Box from '@mui/material/Box'
  import Typography from '@mui/material/Typography'
  import Modal from '@mui/material/Modal'
  
  const ModalDetail = ({ isModalOpen, handleModalClose, modalContent }) => {
    const style = {
      position: 'absolute',
      top: '50%',
      left: '50%',
      transform: 'translate(-50%, -50%)',
      width: 400,
      bgcolor: 'background.paper',
      border: '2px solid #000',
      boxShadow: 24,
      p: 4,
    }
  
    return (
      <Modal
        open={isModalOpen}
        onClose={handleModalClose}
        aria-labelledby="modal-modal-title"
        aria-describedby="modal-modal-description"
      >
        <Box sx={style}>
          <Typography id="modal-modal-description" sx={{ mt: 2 }}>
            {modalContent}
          </Typography>
        </Box>
      </Modal>
    )
  }
  
  export default ModalDetail
  