"use client";

import { useState, useTransition } from "react";
import { Trash2 } from "lucide-react";
import { useRouter } from "next/navigation";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
  DialogTrigger,
} from "@/components/ui/dialog";
import { deleteFichaAction } from "@/server/actions/fichas";

export function FichaDeleteDialog({ fichaId }: { fichaId: string }) {
  const router = useRouter();
  const [open, setOpen] = useState(false);
  const [pending, startTransition] = useTransition();

  function handleDelete() {
    startTransition(() => {
      void deleteFichaAction(fichaId)
        .then(() => {
          toast.success("Ficha eliminada correctamente.");
          setOpen(false);
          router.refresh();
        })
        .catch((error: unknown) => {
          toast.error(error instanceof Error ? error.message : "No fue posible eliminar la ficha.");
        });
    });
  }

  return (
    <Dialog open={open} onOpenChange={setOpen}>
      <DialogTrigger asChild>
        <Button
          size="icon"
          variant="ghost"
          type="button"
          title="Eliminar ficha"
          aria-label="Eliminar ficha"
          className="h-8 w-8 text-destructive hover:bg-danger-subtle hover:text-destructive"
        >
          <Trash2 className="h-4 w-4" />
        </Button>
      </DialogTrigger>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>Eliminar ficha</DialogTitle>
          <DialogDescription>
            ¿Está seguro de eliminar la ficha? Esta acción quitará la ficha del listado principal, pero se mantendrá
            registro en auditoría.
          </DialogDescription>
        </DialogHeader>
        <DialogFooter className="flex-col gap-2 sm:flex-row sm:justify-end">
          <Button type="button" variant="outline" onClick={() => setOpen(false)} disabled={pending}>
            Cancelar
          </Button>
          <Button type="button" variant="destructive" onClick={handleDelete} disabled={pending}>
            Sí, eliminar
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}