import Button from "@mui/material/Button";
import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, DialogDescription, DialogBody } from '@/components/ui/dialog';
import { useState } from "react";

const ConfirmDialog = ({ open, onClose, title, content, onYes, onNo, onOpenChange }: any) => {
  const [a,setA] = useState(false);

  async function onClickYes() {
    setA(true)
    await onYes();
    setA(false)
  }
  
  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent>
        <DialogHeader>
          {title && <DialogTitle className="">{title}</DialogTitle>}
          <DialogBody>
            {content && <DialogDescription className="">{content}</DialogDescription>}
          </DialogBody>
        </DialogHeader>
        <DialogFooter className="flex justify-end gap-2 pt-4">
          <Button type="button" color="secondary" onClick={onNo}>No</Button>
          <Button type="button" color="primary" disabled={a} onClick={() => onClickYes()}>Yes</Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
};

export default ConfirmDialog;