import * as React from "react";
import Button from "@mui/material/Button";
import Dialog from "@mui/material/Dialog";
import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";
import {
  ReportContactCheckInfo,
  ReportContactInfo,
  StyleCommonChatDialog,
} from "@/components/Chat/style";
import Checkbox from "@mui/material/Checkbox";
import { Box, Typography } from "@mui/material";
import {
  Blackoutlinebtn,
  Redoutlinebtn,
} from "@/components/common/buttons/ButtonsVariations";
import { AlertDialogProps } from "@/hooks/Interface";

const AlertDialog: React.FC<AlertDialogProps> = ({
  isOpen,
  handleCloseBlockDailog,
  handleUnblock,
  title = '',
  description = '',
  type = '',
  children
}) => {
  // const [open, setOpen] = React.useState(isOpen);

  const handleClose = () => {
    handleCloseBlockDailog(false);
    // setOpen(false);
  };

  const handleUnblockUser = () => {
    // handleUnblock();
    handleCloseBlockDailog(false);
  };
  const label = { inputProps: { "aria-label": "Checkbox demo" } };

  return (
    <React.Fragment>
      <StyleCommonChatDialog
        style={{ zIndex: "9999" }}
        open={isOpen}
        onClose={handleClose}
        aria-labelledby="alert-dialog-title"
        aria-describedby="alert-dialog-description"
      >
        <DialogTitle id="alert-dialog-title">
          {title}
        </DialogTitle>
        <DialogContent>
          <DialogContentText id="alert-dialog-description">
            {description}
          </DialogContentText>
          {children}
          {type === "block" && <ReportContactCheckInfo>
            <span>
              <Checkbox {...label} defaultChecked size="small" />
            </span>
            <ReportContactInfo>
              <Typography variant="h5">Report Contact</Typography>
              <Typography variant="body2">
                The last 5 messages will be forwarded to powercozmo
              </Typography>
            </ReportContactInfo>
          </ReportContactCheckInfo>}
        </DialogContent>
        <DialogActions>
          <Redoutlinebtn onClick={handleClose}>Cancel</Redoutlinebtn>

          <Blackoutlinebtn onClick={handleUnblockUser} autoFocus>
            Ok
          </Blackoutlinebtn>
        </DialogActions>
      </StyleCommonChatDialog>
    </React.Fragment>
  );
}


export default AlertDialog;