import React, { useEffect } from "react";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogContentText from "@material-ui/core/DialogContentText";
import DialogTitle from "@material-ui/core/DialogTitle";
import useMediaQuery from "@material-ui/core/useMediaQuery";
import { useTheme } from "@material-ui/core/styles";
import { Translation } from "react-i18next";
export default function ConfirmDialog({ openModal, title, msg, content, doFunc, disagree, agree }) {
    const [open, setOpen] = React.useState(false);
    const theme = useTheme();
    const fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
    useEffect(() => {
        if (openModal < 1)
            return;
        setOpen(true);
    }, [openModal]);
    const handleClose = () => {
        setOpen(false);
    };
    const handleAgree = () => {
        doFunc();
        handleClose();
    };
    return (<div>
      <Dialog fullScreen={fullScreen} open={open} onClose={handleClose} aria-labelledby="responsive-dialog-title">
        <DialogTitle id="responsive-dialog-title">{title}</DialogTitle>
        <DialogContent>
          {content || <DialogContentText>{msg}</DialogContentText>}
        </DialogContent>
        <DialogActions>
          <Button autoFocus onClick={handleClose}>
            {disagree || <Translation>{t => t("Cancel")}</Translation>}
          </Button>
          <Button onClick={handleAgree} color="primary" autoFocus>
            {agree || <Translation>{t => t("Confirm")}</Translation>}
          </Button>
        </DialogActions>
      </Dialog>
    </div>);
}