import { Box, Button, Modal, Typography } from "@mui/material";

interface Props {
  openDelete: boolean;
  handleClose: () => void;
  onClick: () => void;
}

export const DeleteModal = ({ openDelete, handleClose, onClick }: Props) => {
  return (
    <Modal open={openDelete} onClose={handleClose}>
      <Box
        sx={{
          position: "absolute",
          top: "50%",
          left: "50%",
          transform: "translate(-50%, -50%)",
          padding: "30px",
          borderRadius: "10px",
          background: "#FFFFFF",
        }}
      >
        <Typography variant="h6" sx={{ textAlign: "center" }}>
          Вы уверены, что хотите удалить этот результат?
        </Typography>
        <Box
          sx={{
            marginTop: "30px",
            display: "flex",
            justifyContent: "center",
            gap: "15px",
          }}
        >
          <Button
            variant="contained"
            sx={{ minWidth: "150px" }}
            onClick={handleClose}
          >
            Отмена
          </Button>
          <Button
            variant="contained"
            sx={{ minWidth: "150px" }}
            onClick={onClick}
          >
            Подтвердить
          </Button>
        </Box>
      </Box>
    </Modal>
  );
};