Initial implementation of TriggerShell

A Python CLI (typer) that bootstraps Node/pnpm and launches a Next.js 16 web app for running configured shell scripts: YAML config validated by a shared Zod schema, dynamic per-script forms mapped to shadcn controls, argv-safe execa execution with live WebSocket streaming, SQLite/Drizzle run history, and optional argon2 session + API token auth. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-15 18:37:30 +02:00
commit ced99a8e75
117 changed files with 17367 additions and 0 deletions
@@ -0,0 +1,37 @@
+import { Badge } from "@/components/ui/badge";
+import type { RunStatus } from "@/lib/db/schema";
+import { cn } from "@/lib/utils";
+
+const styles: Record<RunStatus, string> = {
+  queued: "bg-muted text-muted-foreground",
+  running: "bg-blue-500/15 text-blue-600 dark:text-blue-400",
+  succeeded: "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400",
+  failed: "bg-destructive/15 text-destructive",
+  cancelled: "bg-muted text-muted-foreground",
+  timed_out: "bg-amber-500/15 text-amber-600 dark:text-amber-400",
+  interrupted: "bg-amber-500/15 text-amber-600 dark:text-amber-400",
+};
+
+const labels: Record<RunStatus, string> = {
+  queued: "Queued",
+  running: "Running",
+  succeeded: "Succeeded",
+  failed: "Failed",
+  cancelled: "Cancelled",
+  timed_out: "Timed out",
+  interrupted: "Interrupted",
+};
+
+export function RunStatusBadge({ status }: { status: RunStatus }) {
+  return (
+    <Badge
+      className={cn("border-transparent font-medium", styles[status])}
+      variant="outline"
+    >
+      {status === "running" && (
+        <span className="mr-1 inline-block size-1.5 animate-pulse rounded-full bg-current" />
+      )}
+      {labels[status]}
+    </Badge>
+  );
+}
@@ -0,0 +1,108 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+import { Square } from "lucide-react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { cn } from "@/lib/utils";
+import { useRunSocket } from "@/hooks/use-run-socket";
+import type { RunStatus } from "@/lib/db/schema";
+import type { ServerMessage } from "@/lib/ws/protocol";
+import { RunStatusBadge } from "./run-status-badge";
+
+interface RunTerminalProps {
+  runId: string;
+  initialStatus: RunStatus;
+  initialLog: string;
+  initialExitCode: number | null;
+}
+
+interface Line {
+  key: number;
+  stream: "stdout" | "stderr";
+  text: string;
+}
+
+export function RunTerminal({
+  runId,
+  initialStatus,
+  initialLog,
+  initialExitCode,
+}: RunTerminalProps) {
+  const [status, setStatus] = useState<RunStatus>(initialStatus);
+  const [exitCode, setExitCode] = useState<number | null>(initialExitCode);
+  const [lines, setLines] = useState<Line[]>(() =>
+    initialLog ? [{ key: -1, stream: "stdout", text: initialLog }] : [],
+  );
+  const bottomRef = useRef<HTMLDivElement>(null);
+  const nextKey = useRef(0);
+
+  const { cancel } = useRunSocket(runId, (message: ServerMessage) => {
+    if (message.type === "output") {
+      setLines((prev) => [
+        ...prev,
+        { key: nextKey.current++, stream: message.stream, text: message.chunk },
+      ]);
+    } else if (message.type === "status") {
+      setStatus(message.status);
+      setExitCode(message.exitCode ?? null);
+      if (message.status !== "queued" && message.status !== "running") {
+        toast.info(`Run ${message.status.replace("_", " ")}`);
+      }
+    } else if (message.type === "error") {
+      toast.error(message.message);
+    }
+  });
+
+  useEffect(() => {
+    bottomRef.current?.scrollIntoView({ behavior: "smooth", block: "end" });
+  }, [lines]);
+
+  const isActive = status === "queued" || status === "running";
+
+  async function handleCancel() {
+    cancel();
+    await fetch(`/api/runs/${runId}/cancel`, { method: "POST" }).catch(
+      () => {},
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-3">
+      <div className="flex items-center justify-between">
+        <div className="flex items-center gap-3">
+          <RunStatusBadge status={status} />
+          {exitCode !== null && (
+            <span className="text-muted-foreground text-xs">
+              exit code {exitCode}
+            </span>
+          )}
+        </div>
+        {isActive && (
+          <Button variant="destructive" size="sm" onClick={handleCancel}>
+            <Square className="size-3.5" />
+            Cancel
+          </Button>
+        )}
+      </div>
+      <div className="max-h-[60vh] overflow-y-auto rounded-lg bg-zinc-950 p-4 font-mono text-xs leading-relaxed text-zinc-100">
+        {lines.length === 0 ? (
+          <span className="text-zinc-500">Waiting for output...</span>
+        ) : (
+          lines.map((line) => (
+            <div
+              key={line.key}
+              className={cn(
+                "whitespace-pre-wrap break-all",
+                line.stream === "stderr" && "text-red-400",
+              )}
+            >
+              {line.text}
+            </div>
+          ))
+        )}
+        <div ref={bottomRef} />
+      </div>
+    </div>
+  );
+}