import React, { FC } from "react";
import {
  Button,
  Dialog,
  DialogHeader,
  DialogBody,
  DialogFooter,
} from "@material-tailwind/react";
import { CheckIcon, ExclamationTriangleIcon } from "@heroicons/react/24/solid";
interface ModalProps {
  handleOpen: () => void;
  message: string;
  open: boolean;
}
export const ModalSuccess: FC<ModalProps> = ({ handleOpen, message, open }) => {
  // const handleOpen = () => setOpen(!open);
  return (
    <Dialog
      className=""
      size="xs"
      open={open}
      handler={handleOpen}
      animate={{
        mount: { scale: 1, y: 0 },
        unmount: { scale: 0.9, y: -100 },
      }}
    >
      <DialogHeader className="flex flex-col">
        <div className="rounded-full p-5 bg-green-100">
          <CheckIcon height={50} color="green" />
        </div>
        Inscription reussie!
      </DialogHeader>
      <DialogBody className="flex justify-center text-lg text-center">
        Vous faites desormais parti de Promillys Academy, Vous allez etre
        rediriger vers la page de connexion.
      </DialogBody>
      <DialogFooter className="flex items-center justify-center">
        <Button
          className="w-full bg-vert_fonce"
          variant="gradient"
          color="green"
          onClick={handleOpen}
        >
          <span>Compris</span>
        </Button>
      </DialogFooter>
    </Dialog>
  );
};