gigaclaw 1.4.0

package/lib/chat/components/swarm-page.jsx

@@ -0,0 +1,210 @@
+'use client';
+
+import { useState, useEffect, useCallback } from 'react';
+import { PageLayout } from './page-layout.js';
+import { SpinnerIcon, RefreshIcon } from './icons.js';
+import { getSwarmStatus } from '../actions.js';
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Utilities
+// ─────────────────────────────────────────────────────────────────────────────
+
+function formatDuration(seconds) {
+  if (seconds < 60) return `${seconds}s`;
+  const minutes = Math.floor(seconds / 60);
+  const secs = seconds % 60;
+  if (minutes < 60) return `${minutes}m ${secs}s`;
+  const hours = Math.floor(minutes / 60);
+  const mins = minutes % 60;
+  return `${hours}h ${mins}m`;
+}
+
+function timeAgo(timestamp) {
+  const seconds = Math.floor((Date.now() - new Date(timestamp).getTime()) / 1000);
+  if (seconds < 60) return 'just now';
+  const minutes = Math.floor(seconds / 60);
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days < 30) return `${days}d ago`;
+  const months = Math.floor(days / 30);
+  return `${months}mo ago`;
+}
+
+function LoadingSkeleton() {
+  return (
+    <div className="flex flex-col gap-4">
+      {[...Array(5)].map((_, i) => (
+        <div key={i} className="h-14 animate-pulse rounded-md bg-border/50" />
+      ))}
+    </div>
+  );
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Workflow List
+// ─────────────────────────────────────────────────────────────────────────────
+
+const conclusionBadgeStyles = {
+  success: 'bg-green-500/10 text-green-500',
+  failure: 'bg-red-500/10 text-red-500',
+  cancelled: 'bg-yellow-500/10 text-yellow-500',
+  skipped: 'bg-muted text-muted-foreground',
+};
+
+function SwarmWorkflowList({ runs }) {
+  if (!runs || runs.length === 0) {
+    return (
+      <div className="text-sm text-muted-foreground py-4 text-center">
+        No workflow runs.
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col divide-y divide-border">
+      {runs.map((run) => {
+        const isActive = run.status === 'in_progress' || run.status === 'queued';
+        const isRunning = run.status === 'in_progress';
+        const isQueued = run.status === 'queued';
+
+        return (
+          <a
+            key={run.run_id}
+            href={run.html_url}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-3 py-3 px-2 -mx-2 rounded-md hover:bg-accent transition-colors no-underline text-inherit"
+          >
+            {/* Status indicator */}
+            {isRunning && (
+              <span className="inline-block h-2.5 w-2.5 shrink-0 rounded-full bg-green-500 animate-pulse" />
+            )}
+            {isQueued && (
+              <span className="inline-block h-2.5 w-2.5 shrink-0 rounded-full bg-yellow-500" />
+            )}
+            {!isActive && (
+              <span
+                className={`inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium uppercase shrink-0 ${
+                  conclusionBadgeStyles[run.conclusion] || 'bg-muted text-muted-foreground'
+                }`}
+              >
+                {run.conclusion || 'unknown'}
+              </span>
+            )}
+
+            {/* Workflow name */}
+            <span className="text-sm font-medium truncate">
+              {run.workflow_name || run.branch}
+            </span>
+
+            {/* Duration or time ago */}
+            <span className="text-xs text-muted-foreground shrink-0">
+              {isActive
+                ? formatDuration(run.duration_seconds)
+                : timeAgo(run.updated_at || run.started_at)}
+            </span>
+
+            {/* Spacer */}
+            <div className="flex-1" />
+
+            {/* Link label */}
+            <span className="text-xs text-blue-500 shrink-0">
+              View
+            </span>
+          </a>
+        );
+      })}
+    </div>
+  );
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Main Page
+// ─────────────────────────────────────────────────────────────────────────────
+
+export function SwarmPage({ session }) {
+  const [runs, setRuns] = useState([]);
+  const [hasMore, setHasMore] = useState(false);
+  const [page, setPage] = useState(1);
+  const [loading, setLoading] = useState(true);
+  const [refreshing, setRefreshing] = useState(false);
+
+  const fetchPage = useCallback(async (p) => {
+    try {
+      const data = await getSwarmStatus(p);
+      setRuns(data.runs || []);
+      setHasMore(data.hasMore || false);
+      setPage(p);
+    } catch (err) {
+      console.error('Failed to fetch swarm status:', err);
+    } finally {
+      setLoading(false);
+      setRefreshing(false);
+    }
+  }, []);
+
+  // Initial load
+  useEffect(() => { fetchPage(1); }, [fetchPage]);
+
+  // Auto-refresh current page every 10s
+  useEffect(() => {
+    const interval = setInterval(() => fetchPage(page), 10000);
+    return () => clearInterval(interval);
+  }, [fetchPage, page]);
+
+  return (
+    <PageLayout session={session}>
+      {/* Header */}
+      <div className="flex items-center justify-between mb-6">
+        <h1 className="text-2xl font-semibold">Swarm</h1>
+        {!loading && (
+          <button
+            onClick={() => { setRefreshing(true); fetchPage(1); }}
+            disabled={refreshing}
+            className="inline-flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-xs font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+          >
+            {refreshing ? (
+              <>
+                <SpinnerIcon size={14} />
+                Refreshing...
+              </>
+            ) : (
+              <>
+                <RefreshIcon size={14} />
+                Refresh
+              </>
+            )}
+          </button>
+        )}
+      </div>
+
+      {loading ? (
+        <LoadingSkeleton />
+      ) : (
+        <div>
+          <SwarmWorkflowList runs={runs} />
+          {/* Pagination */}
+          <div className="flex items-center justify-between mt-4 pt-4 border-t border-border">
+            <button
+              onClick={() => { setRefreshing(true); fetchPage(page - 1); }}
+              disabled={page <= 1 || refreshing}
+              className="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+            >
+              Previous
+            </button>
+            <span className="text-sm text-muted-foreground">Page {page}</span>
+            <button
+              onClick={() => { setRefreshing(true); fetchPage(page + 1); }}
+              disabled={!hasMore || refreshing}
+              className="inline-flex items-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium border border-border bg-background text-muted-foreground hover:bg-accent hover:text-foreground disabled:opacity-50 disabled:pointer-events-none"
+            >
+              Next
+            </button>
+          </div>
+        </div>
+      )}
+    </PageLayout>
+  );
+}

package/lib/chat/components/tool-call.js

@@ -0,0 +1,89 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { WrenchIcon, SpinnerIcon, CheckIcon, XIcon, ChevronDownIcon } from "./icons.js";
+import { cn } from "../utils.js";
+const TOOL_DISPLAY_NAMES = {
+  create_job: "Create Job",
+  get_job_status: "Check Job Status",
+  get_system_technical_specs: "Read Tech Docs",
+  get_skill_building_guide: "Read Skill Docs",
+  get_skill_details: "Get Skill",
+  start_coding: "Start Coding",
+  get_repository_details: "Get Repository Details"
+};
+function getToolDisplayName(toolName) {
+  return TOOL_DISPLAY_NAMES[toolName] || toolName.replace(/_/g, " ");
+}
+function formatContent(content) {
+  if (content == null) return null;
+  if (typeof content === "string") {
+    try {
+      const parsed = JSON.parse(content);
+      return JSON.stringify(parsed, null, 2);
+    } catch {
+      return content;
+    }
+  }
+  return JSON.stringify(content, null, 2);
+}
+function ToolCall({ part }) {
+  const [expanded, setExpanded] = useState(false);
+  const toolName = part.toolName || (part.type?.startsWith("tool-") ? part.type.slice(5) : "tool");
+  const displayName = getToolDisplayName(toolName);
+  const state = part.state || "input-available";
+  const isRunning = state === "input-streaming" || state === "input-available";
+  const isDone = state === "output-available";
+  const isError = state === "output-error";
+  return /* @__PURE__ */ jsxs("div", { className: "my-1 rounded-lg border border-border bg-background", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        onClick: () => setExpanded(!expanded),
+        className: "flex w-full items-center gap-2 px-3 py-2 text-left text-sm hover:bg-muted/50 rounded-lg",
+        children: [
+          /* @__PURE__ */ jsx(WrenchIcon, { size: 14, className: "text-muted-foreground shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: displayName }),
+          /* @__PURE__ */ jsxs("span", { className: "ml-auto flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+            isRunning && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(SpinnerIcon, { size: 12 }),
+              /* @__PURE__ */ jsx("span", { children: "Running..." })
+            ] }),
+            isDone && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(CheckIcon, { size: 12, className: "text-green-500" }),
+              /* @__PURE__ */ jsx("span", { children: "Done" })
+            ] }),
+            isError && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(XIcon, { size: 12, className: "text-red-500" }),
+              /* @__PURE__ */ jsx("span", { children: "Error" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(
+            ChevronDownIcon,
+            {
+              size: 14,
+              className: cn(
+                "text-muted-foreground transition-transform shrink-0",
+                expanded && "rotate-180"
+              )
+            }
+          )
+        ]
+      }
+    ),
+    expanded && /* @__PURE__ */ jsxs("div", { className: "border-t border-border px-3 py-2 text-xs", children: [
+      part.input != null && /* @__PURE__ */ jsxs("div", { className: "mb-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "font-medium text-muted-foreground mb-1", children: "Input" }),
+        /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap break-all rounded bg-muted p-2 text-foreground overflow-x-auto", children: formatContent(part.input) })
+      ] }),
+      part.output != null && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("div", { className: "font-medium text-muted-foreground mb-1", children: "Output" }),
+        /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap break-all rounded bg-muted p-2 text-foreground overflow-x-auto max-h-64 overflow-y-auto", children: formatContent(part.output) })
+      ] }),
+      part.input == null && part.output == null && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground italic", children: "Waiting for data..." })
+    ] })
+  ] });
+}
+export {
+  ToolCall
+};

package/lib/chat/components/tool-call.jsx

@@ -0,0 +1,107 @@
+'use client';
+
+import { useState } from 'react';
+import { WrenchIcon, SpinnerIcon, CheckIcon, XIcon, ChevronDownIcon } from './icons.js';
+import { cn } from '../utils.js';
+
+const TOOL_DISPLAY_NAMES = {
+  create_job: 'Create Job',
+  get_job_status: 'Check Job Status',
+  get_system_technical_specs: 'Read Tech Docs',
+  get_skill_building_guide: 'Read Skill Docs',
+  get_skill_details: 'Get Skill',
+  start_coding: 'Start Coding',
+  get_repository_details: 'Get Repository Details',
+};
+
+function getToolDisplayName(toolName) {
+  return TOOL_DISPLAY_NAMES[toolName] || toolName.replace(/_/g, ' ');
+}
+
+function formatContent(content) {
+  if (content == null) return null;
+  if (typeof content === 'string') {
+    try {
+      const parsed = JSON.parse(content);
+      return JSON.stringify(parsed, null, 2);
+    } catch {
+      return content;
+    }
+  }
+  return JSON.stringify(content, null, 2);
+}
+
+export function ToolCall({ part }) {
+  const [expanded, setExpanded] = useState(false);
+
+  const toolName = part.toolName || (part.type?.startsWith('tool-') ? part.type.slice(5) : 'tool');
+  const displayName = getToolDisplayName(toolName);
+  const state = part.state || 'input-available';
+
+  const isRunning = state === 'input-streaming' || state === 'input-available';
+  const isDone = state === 'output-available';
+  const isError = state === 'output-error';
+
+  return (
+    <div className="my-1 rounded-lg border border-border bg-background">
+      <button
+        onClick={() => setExpanded(!expanded)}
+        className="flex w-full items-center gap-2 px-3 py-2 text-left text-sm hover:bg-muted/50 rounded-lg"
+      >
+        <WrenchIcon size={14} className="text-muted-foreground shrink-0" />
+        <span className="font-medium text-foreground">{displayName}</span>
+        <span className="ml-auto flex items-center gap-1.5 text-xs text-muted-foreground">
+          {isRunning && (
+            <>
+              <SpinnerIcon size={12} />
+              <span>Running...</span>
+            </>
+          )}
+          {isDone && (
+            <>
+              <CheckIcon size={12} className="text-green-500" />
+              <span>Done</span>
+            </>
+          )}
+          {isError && (
+            <>
+              <XIcon size={12} className="text-red-500" />
+              <span>Error</span>
+            </>
+          )}
+        </span>
+        <ChevronDownIcon
+          size={14}
+          className={cn(
+            'text-muted-foreground transition-transform shrink-0',
+            expanded && 'rotate-180'
+          )}
+        />
+      </button>
+
+      {expanded && (
+        <div className="border-t border-border px-3 py-2 text-xs">
+          {part.input != null && (
+            <div className="mb-2">
+              <div className="font-medium text-muted-foreground mb-1">Input</div>
+              <pre className="whitespace-pre-wrap break-all rounded bg-muted p-2 text-foreground overflow-x-auto">
+                {formatContent(part.input)}
+              </pre>
+            </div>
+          )}
+          {part.output != null && (
+            <div>
+              <div className="font-medium text-muted-foreground mb-1">Output</div>
+              <pre className="whitespace-pre-wrap break-all rounded bg-muted p-2 text-foreground overflow-x-auto max-h-64 overflow-y-auto">
+                {formatContent(part.output)}
+              </pre>
+            </div>
+          )}
+          {part.input == null && part.output == null && (
+            <div className="text-muted-foreground italic">Waiting for data...</div>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}

package/lib/chat/components/triggers-page.js

@@ -0,0 +1,153 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { ZapIcon, ChevronDownIcon } from "./icons.js";
+import { getSwarmConfig } from "../actions.js";
+const typeBadgeStyles = {
+  agent: "bg-purple-500/10 text-purple-500",
+  command: "bg-blue-500/10 text-blue-500",
+  webhook: "bg-orange-500/10 text-orange-500"
+};
+const typeOrder = { agent: 0, command: 1, webhook: 2 };
+function sortByType(items) {
+  return [...items].sort((a, b) => {
+    const actions_a = a.actions || [];
+    const actions_b = b.actions || [];
+    const ta = typeOrder[actions_a[0]?.type || "agent"] ?? 99;
+    const tb = typeOrder[actions_b[0]?.type || "agent"] ?? 99;
+    return ta - tb;
+  });
+}
+function GroupHeader({ label, count }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 pt-2 pb-1", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide", children: label }),
+    /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+      "(",
+      count,
+      ")"
+    ] })
+  ] });
+}
+function ActionCard({ action, index }) {
+  const type = action.type || "agent";
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-md border bg-background p-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
+      /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground font-medium", children: [
+        "Action ",
+        index + 1
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium ${typeBadgeStyles[type] || typeBadgeStyles.agent}`, children: type })
+    ] }),
+    type === "agent" && action.job && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("pre", { className: "text-xs bg-muted rounded-md p-3 whitespace-pre-wrap break-words font-mono overflow-auto max-h-48", children: action.job }),
+      (action.llm_provider || action.llm_model) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-muted-foreground", children: "LLM:" }),
+        /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full bg-purple-500/10 text-purple-500 px-2 py-0.5 text-[10px] font-medium", children: [action.llm_provider, action.llm_model].filter(Boolean).join(" / ") })
+      ] })
+    ] }),
+    type === "command" && action.command && /* @__PURE__ */ jsx("pre", { className: "text-xs bg-muted rounded-md p-3 whitespace-pre-wrap break-words font-mono overflow-auto max-h-48", children: action.command }),
+    type === "webhook" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxs("pre", { className: "text-xs bg-muted rounded-md p-3 whitespace-pre-wrap break-words font-mono overflow-auto", children: [
+        action.method && action.method !== "POST" ? `${action.method} ` : "",
+        action.url
+      ] }),
+      action.vars && Object.keys(action.vars).length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Variables" }),
+        /* @__PURE__ */ jsx("pre", { className: "text-xs bg-muted rounded-md p-3 whitespace-pre-wrap break-words font-mono overflow-auto max-h-48", children: JSON.stringify(action.vars, null, 2) })
+      ] })
+    ] })
+  ] });
+}
+function TriggerCard({ trigger }) {
+  const [expanded, setExpanded] = useState(false);
+  const disabled = trigger.enabled === false;
+  const actions = trigger.actions || [];
+  const actionTypes = actions.map((a) => a.type || "agent").filter((v, i, arr) => arr.indexOf(v) === i);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `rounded-lg border bg-card transition-opacity ${disabled ? "opacity-60" : ""}`,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => setExpanded(!expanded),
+            className: "flex items-center gap-3 w-full text-left p-4 hover:bg-accent/50 rounded-lg",
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "shrink-0 rounded-md bg-muted p-2", children: /* @__PURE__ */ jsx(ZapIcon, { size: 16 }) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-sm font-medium truncate", children: trigger.name }),
+                /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground mt-0.5", children: [
+                  /* @__PURE__ */ jsx("span", { className: "font-mono", children: trigger.watch_path }),
+                  /* @__PURE__ */ jsx("span", { className: "mx-1.5 text-border", children: "|" }),
+                  actions.length,
+                  " action",
+                  actions.length !== 1 ? "s" : "",
+                  actionTypes.length > 0 && /* @__PURE__ */ jsxs("span", { className: "ml-1", children: [
+                    "(",
+                    actionTypes.join(", "),
+                    ")"
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 shrink-0", children: [
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium ${disabled ? "bg-muted text-muted-foreground" : "bg-green-500/10 text-green-500"}`,
+                    children: disabled ? "disabled" : "enabled"
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: `transition-transform ${expanded ? "rotate-180" : ""}`, children: /* @__PURE__ */ jsx(ChevronDownIcon, { size: 14 }) })
+              ] })
+            ]
+          }
+        ),
+        expanded && /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-3 flex flex-col gap-2", children: actions.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "No actions defined." }) : actions.map((action, i) => /* @__PURE__ */ jsx(ActionCard, { action, index: i }, i)) })
+      ]
+    }
+  );
+}
+function TriggersPage() {
+  const [triggers, setTriggers] = useState([]);
+  const [loading, setLoading] = useState(true);
+  useEffect(() => {
+    getSwarmConfig().then((data) => {
+      if (data?.triggers) setTriggers(data.triggers);
+    }).catch(() => {
+    }).finally(() => setLoading(false));
+  }, []);
+  const enabled = sortByType(triggers.filter((t) => t.enabled !== false));
+  const disabled = sortByType(triggers.filter((t) => t.enabled === false));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    !loading && /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground mb-4", children: [
+      triggers.length,
+      " trigger",
+      triggers.length !== 1 ? "s" : "",
+      " configured, ",
+      enabled.length,
+      " enabled"
+    ] }),
+    loading ? /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3", children: [...Array(3)].map((_, i) => /* @__PURE__ */ jsx("div", { className: "h-20 animate-pulse rounded-lg bg-border/50" }, i)) }) : triggers.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+      /* @__PURE__ */ jsx("div", { className: "rounded-full bg-muted p-4 mb-4", children: /* @__PURE__ */ jsx(ZapIcon, { size: 24 }) }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium mb-1", children: "No triggers configured" }),
+      /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground max-w-sm", children: [
+        "Add webhook triggers by editing ",
+        /* @__PURE__ */ jsx("span", { className: "font-mono", children: "config/TRIGGERS.json" }),
+        " in your project."
+      ] })
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+      enabled.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(GroupHeader, { label: "Enabled", count: enabled.length }),
+        enabled.map((trigger, i) => /* @__PURE__ */ jsx(TriggerCard, { trigger }, `enabled-${i}`))
+      ] }),
+      disabled.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(GroupHeader, { label: "Disabled", count: disabled.length }),
+        disabled.map((trigger, i) => /* @__PURE__ */ jsx(TriggerCard, { trigger }, `disabled-${i}`))
+      ] })
+    ] })
+  ] });
+}
+export {
+  TriggersPage
+};