"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { useState } from "react";
import {
  Check,
  Copy,
  ChevronDown,
  Tag,
  Zap,
  TestTube2,
  Terminal,
  CheckCircle2,
  XCircle,
  SkipForward,
  Clock,
  PlayCircle,
  AlertTriangle
} from "lucide-react";
import { cn } from "../../../lib/utils/index.js";
import { Button } from "../../ui/button.js";
import { Badge } from "../../ui/badge.js";
import {
  Collapsible,
  CollapsibleContent,
  CollapsibleTrigger
} from "../../ui/collapsible.js";
import { GherkinHighlighter } from "./GherkinHighlighter.js";
function BDDTestCard({ test, index, isOpen, onToggle, language }) {
  var _a, _b, _c;
  const [copied, setCopied] = useState(false);
  const currentScenario = ((_a = test.scenarios) == null ? void 0 : _a[language]) || ((_b = test.scenarios) == null ? void 0 : _b.en) || ((_c = test.scenarios) == null ? void 0 : _c.es) || test.scenario;
  const copyScenario = async () => {
    await navigator.clipboard.writeText(currentScenario);
    setCopied(true);
    setTimeout(() => setCopied(false), 2e3);
  };
  const getPriorityColor = (priority) => {
    switch (priority) {
      case "high":
        return "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400";
      case "medium":
        return "bg-yellow-100 text-yellow-700 dark:bg-yellow-900/30 dark:text-yellow-400";
      case "low":
        return "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400";
      default:
        return "bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-400";
    }
  };
  const getTypeIcon = (type) => {
    switch (type) {
      case "smoke":
        return /* @__PURE__ */ jsx(Zap, { className: "h-3 w-3" });
      case "regression":
      case "integration":
      case "e2e":
        return /* @__PURE__ */ jsx(TestTube2, { className: "h-3 w-3" });
      default:
        return null;
    }
  };
  const getStatusColor = (status) => {
    switch (status) {
      case "passing":
        return "bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-400";
      case "failing":
        return "bg-red-100 text-red-700 dark:bg-red-900/30 dark:text-red-400";
      case "skipped":
        return "bg-amber-100 text-amber-700 dark:bg-amber-900/30 dark:text-amber-400";
      case "pending":
        return "bg-slate-100 text-slate-600 dark:bg-slate-800 dark:text-slate-400";
      case "active":
        return "bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-400";
      default:
        return "bg-slate-100 text-slate-600 dark:bg-slate-800";
    }
  };
  const getStatusIcon = (status) => {
    switch (status) {
      case "passing":
        return /* @__PURE__ */ jsx(CheckCircle2, { className: "h-3 w-3" });
      case "failing":
        return /* @__PURE__ */ jsx(XCircle, { className: "h-3 w-3" });
      case "skipped":
        return /* @__PURE__ */ jsx(SkipForward, { className: "h-3 w-3" });
      case "pending":
        return /* @__PURE__ */ jsx(Clock, { className: "h-3 w-3" });
      case "active":
        return /* @__PURE__ */ jsx(PlayCircle, { className: "h-3 w-3" });
      default:
        return null;
    }
  };
  const copyGrepCommand = async (tag) => {
    const command = `pnpm cy:tags "${tag}"`;
    await navigator.clipboard.writeText(command);
    setCopied(true);
    setTimeout(() => setCopied(false), 2e3);
  };
  return /* @__PURE__ */ jsx(Collapsible, { open: isOpen, onOpenChange: onToggle, children: /* @__PURE__ */ jsxs(
    "div",
    {
      className: cn(
        "border rounded-lg transition-colors",
        isOpen ? "border-violet-300 dark:border-violet-700 bg-violet-50/50 dark:bg-violet-950/20" : "border-border hover:border-violet-200 dark:hover:border-violet-800"
      ),
      "data-cy": `bdd-test-${test.id}`,
      children: [
        /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
          "button",
          {
            className: "w-full px-4 py-3 flex items-center gap-3 text-left",
            "data-cy": `bdd-test-trigger-${test.id}`,
            children: [
              /* @__PURE__ */ jsx("span", { className: "text-xs font-mono text-muted-foreground min-w-[2rem]", children: String(index + 1).padStart(2, "0") }),
              /* @__PURE__ */ jsx(
                ChevronDown,
                {
                  className: cn(
                    "h-4 w-4 text-muted-foreground transition-transform",
                    isOpen && "rotate-180"
                  )
                }
              ),
              /* @__PURE__ */ jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
                /* @__PURE__ */ jsx("span", { className: "font-mono text-xs text-violet-600 dark:text-violet-400", children: test.id }),
                /* @__PURE__ */ jsx("span", { className: "font-medium truncate", children: test.title })
              ] }) }),
              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [
                test.metadata.type && /* @__PURE__ */ jsxs(Badge, { variant: "outline", className: "text-xs gap-1", children: [
                  getTypeIcon(test.metadata.type),
                  test.metadata.type
                ] }),
                test.metadata.priority && /* @__PURE__ */ jsx(Badge, { className: cn("text-xs", getPriorityColor(test.metadata.priority)), children: test.metadata.priority }),
                test.metadata.status && /* @__PURE__ */ jsxs(Badge, { className: cn("text-xs gap-1", getStatusColor(test.metadata.status)), children: [
                  getStatusIcon(test.metadata.status),
                  test.metadata.status
                ] })
              ] })
            ]
          }
        ) }),
        /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxs("div", { className: "px-4 pb-4 space-y-4", children: [
          test.metadata.tags && test.metadata.tags.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
            /* @__PURE__ */ jsx(Tag, { className: "h-3 w-3 text-muted-foreground" }),
            test.metadata.tags.map((tag) => /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "text-xs", children: tag }, tag))
          ] }),
          test.metadata.grepTags && test.metadata.grepTags.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
            /* @__PURE__ */ jsx(Terminal, { className: "h-3 w-3 text-emerald-500" }),
            test.metadata.grepTags.map((tag) => /* @__PURE__ */ jsx(
              Badge,
              {
                className: "text-xs bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-400 cursor-pointer hover:bg-emerald-200 dark:hover:bg-emerald-900/50 transition-colors",
                onClick: () => copyGrepCommand(tag),
                title: `Click to copy: pnpm cy:tags "${tag}"`,
                children: tag
              },
              tag
            ))
          ] }),
          test.metadata.statusReason && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 text-sm text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 rounded-md px-3 py-2", children: [
            /* @__PURE__ */ jsx(AlertTriangle, { className: "h-4 w-4 mt-0.5 shrink-0" }),
            /* @__PURE__ */ jsx("span", { children: test.metadata.statusReason })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
            /* @__PURE__ */ jsx("div", { className: "absolute top-2 right-2 z-10", children: /* @__PURE__ */ jsx(
              Button,
              {
                variant: "ghost",
                size: "sm",
                onClick: copyScenario,
                className: "h-8 px-2 text-slate-400 hover:text-slate-200",
                "data-cy": `bdd-copy-${test.id}`,
                children: copied ? /* @__PURE__ */ jsx(Check, { className: "h-4 w-4 text-green-400" }) : /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" })
              }
            ) }),
            /* @__PURE__ */ jsx(GherkinHighlighter, { code: currentScenario })
          ] }),
          test.expectedResults && test.expectedResults.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
            /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-muted-foreground", children: "Expected Results" }),
            /* @__PURE__ */ jsx("ul", { className: "space-y-1", children: test.expectedResults.map((result, idx) => /* @__PURE__ */ jsxs(
              "li",
              {
                className: "flex items-start gap-2 text-sm text-muted-foreground",
                children: [
                  /* @__PURE__ */ jsx("span", { className: "text-green-500 mt-0.5", children: "\u2713" }),
                  result
                ]
              },
              idx
            )) })
          ] }),
          test.notes && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted-foreground bg-muted/50 rounded-md p-3", children: test.notes })
        ] }) })
      ]
    }
  ) });
}
export {
  BDDTestCard
};
