"use client";

import { Button, Dialog, DialogClose, DialogContent, DialogFooter } from "@common/components";

import { useAlertStore } from "../lib/use-alert-store";

function AlertDialog() {
  const { message, callback, setMessage } = useAlertStore((state) => state);
  const handleOpenChange = () => {
    setMessage("");
    callback?.();
  };
  return (
    <Dialog open={!!message} onOpenChange={handleOpenChange}>
      <DialogContent aria-describedby={undefined}>
        <div className="py-10">
          <p className="whitespace-pre-line break-keep text-center text-[1.4rem] text-foreground">
            {message}
          </p>
        </div>
        <DialogFooter className="!justify-center">
          <DialogClose asChild>
            <Button>확인</Button>
          </DialogClose>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}

export { AlertDialog };