"use client";

import { useCallback, useEffect, useRef, useState } from "react";

import { Button } from "@/components/ui/button";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from "@/components/ui/dialog";
import { cn } from "@/lib/utils";

type ConfirmDialogOptions = {
  title?: string;
  description: string;
  confirmLabel?: string;
  cancelLabel?: string;
  destructive?: boolean;
};

type ConfirmDialogState = {
  open: boolean;
  options: ConfirmDialogOptions;
};

const DEFAULT_OPTIONS: ConfirmDialogOptions = {
  title: "Confirmer l'action",
  description: "",
  confirmLabel: "Confirmer",
  cancelLabel: "Annuler",
  destructive: false,
};

export function useConfirmDialog() {
  const [state, setState] = useState<ConfirmDialogState>({
    open: false,
    options: DEFAULT_OPTIONS,
  });
  const resolverRef = useRef<((value: boolean) => void) | null>(null);

  const closeWith = useCallback((value: boolean) => {
    setState((prev) => ({ ...prev, open: false }));
    if (resolverRef.current) {
      resolverRef.current(value);
      resolverRef.current = null;
    }
  }, []);

  const confirm = useCallback((options: ConfirmDialogOptions) => {
    return new Promise<boolean>((resolve) => {
      resolverRef.current = resolve;
      setState({
        open: true,
        options: {
          ...DEFAULT_OPTIONS,
          ...options,
        },
      });
    });
  }, []);

  useEffect(() => {
    return () => {
      if (resolverRef.current) {
        resolverRef.current(false);
      }
    };
  }, []);

  const confirmDialog = (
    <Dialog
      open={state.open}
      onOpenChange={(open) => {
        if (!open) {
          closeWith(false);
        }
      }}
    >
      <DialogContent className="sm:max-w-md">
        <DialogHeader>
          <DialogTitle>{state.options.title}</DialogTitle>
          <DialogDescription>{state.options.description}</DialogDescription>
        </DialogHeader>
        <DialogFooter>
          <Button type="button" variant="outline" onClick={() => closeWith(false)}>
            {state.options.cancelLabel}
          </Button>
          <Button
            type="button"
            onClick={() => closeWith(true)}
            className={cn(
              state.options.destructive &&
                "bg-destructive text-destructive-foreground hover:bg-destructive/90"
            )}
          >
            {state.options.confirmLabel}
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );

  return { confirm, confirmDialog };
}