"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { useTranslations } from "next-intl";
import { AlertTriangle, Loader2 } from "lucide-react";
import {
  AlertDialog,
  AlertDialogAction,
  AlertDialogCancel,
  AlertDialogContent,
  AlertDialogDescription,
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
  AlertDialogTrigger
} from "@nextsparkjs/core/components/ui/alert-dialog";
import { Button } from "@nextsparkjs/core/components/ui/button";
import { usePatternUsages } from "@nextsparkjs/core/hooks/usePatternUsages";
import { sel } from "@nextsparkjs/core/lib/test";
function PatternDeleteDialog({
  patternId,
  patternTitle,
  onConfirm,
  trigger,
  isDeleting = false,
  open: controlledOpen,
  onOpenChange
}) {
  const [internalOpen, setInternalOpen] = useState(false);
  const isControlled = controlledOpen !== void 0;
  const open = isControlled ? controlledOpen : internalOpen;
  const setOpen = isControlled ? onOpenChange ?? (() => {
  }) : setInternalOpen;
  const t = useTranslations("admin.patterns.delete");
  const { data, isLoading, error } = usePatternUsages(patternId, {
    enabled: open,
    limit: 10
  });
  const usageCount = (data == null ? void 0 : data.total) ?? 0;
  const usages = (data == null ? void 0 : data.usages) ?? [];
  const handleConfirm = () => {
    onConfirm();
    setOpen(false);
  };
  const showTrigger = !isControlled || trigger;
  return /* @__PURE__ */ jsxs(AlertDialog, { open, onOpenChange: setOpen, children: [
    showTrigger && /* @__PURE__ */ jsx(AlertDialogTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ jsx(
      Button,
      {
        variant: "outline",
        className: "text-destructive hover:text-destructive",
        "data-cy": sel("patterns.deleteDialog.trigger"),
        children: t("trigger")
      }
    ) }),
    /* @__PURE__ */ jsxs(AlertDialogContent, { "data-cy": sel("patterns.deleteDialog.container"), children: [
      /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
        /* @__PURE__ */ jsxs(AlertDialogTitle, { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ jsx(AlertTriangle, { className: "h-5 w-5 text-destructive" }),
          t("title")
        ] }),
        /* @__PURE__ */ jsx(AlertDialogDescription, { asChild: true, children: /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
          /* @__PURE__ */ jsxs("p", { children: [
            t("confirm"),
            " ",
            /* @__PURE__ */ jsxs("strong", { className: "text-foreground", children: [
              '"',
              patternTitle,
              '"'
            ] }),
            "?"
          ] }),
          isLoading ? /* @__PURE__ */ jsxs(
            "div",
            {
              className: "flex items-center gap-2 text-muted-foreground",
              "data-cy": sel("patterns.deleteDialog.loading"),
              children: [
                /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }),
                t("loading")
              ]
            }
          ) : error ? /* @__PURE__ */ jsx(
            "div",
            {
              className: "text-sm text-destructive",
              "data-cy": sel("patterns.deleteDialog.error"),
              children: t("error")
            }
          ) : usageCount > 0 ? /* @__PURE__ */ jsxs(
            "div",
            {
              className: "rounded-md border border-destructive/20 bg-destructive/5 p-3",
              "data-cy": sel("patterns.deleteDialog.warning"),
              children: [
                /* @__PURE__ */ jsx("p", { className: "font-medium text-destructive", children: t("inUse", { count: usageCount }) }),
                /* @__PURE__ */ jsxs(
                  "ul",
                  {
                    className: "mt-2 space-y-1 text-sm text-muted-foreground",
                    "data-cy": sel("patterns.deleteDialog.usageList"),
                    children: [
                      usages.map((usage) => /* @__PURE__ */ jsxs("li", { children: [
                        "\u2022 ",
                        usage.entityTitle || usage.entitySlug || usage.entityId,
                        " (",
                        usage.entityType,
                        ")"
                      ] }, usage.entityId)),
                      usageCount > 10 && /* @__PURE__ */ jsx("li", { className: "text-muted-foreground/70", children: t("moreItems", { count: usageCount - 10 }) })
                    ]
                  }
                ),
                /* @__PURE__ */ jsx("p", { className: "mt-2 text-xs text-muted-foreground", children: t("cleanupNote") })
              ]
            }
          ) : /* @__PURE__ */ jsx(
            "p",
            {
              className: "text-muted-foreground",
              "data-cy": sel("patterns.deleteDialog.noUsage"),
              children: t("notInUse")
            }
          )
        ] }) })
      ] }),
      /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
        /* @__PURE__ */ jsx(AlertDialogCancel, { "data-cy": sel("patterns.deleteDialog.cancel"), children: t("cancel") }),
        /* @__PURE__ */ jsx(
          AlertDialogAction,
          {
            onClick: handleConfirm,
            disabled: isDeleting,
            className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
            "data-cy": sel("patterns.deleteDialog.confirm"),
            children: isDeleting ? /* @__PURE__ */ jsxs(Fragment, { children: [
              /* @__PURE__ */ jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
              t("deleting")
            ] }) : t("deleteAction")
          }
        )
      ] })
    ] })
  ] });
}
export {
  PatternDeleteDialog
};
