@mecha.im/cli 0.3.4

package/agent/dashboard/src/index.css

@@ -0,0 +1,126 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 240 10% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 240 10% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 240 10% 3.9%;
+    --primary: 240 5.9% 10%;
+    --primary-foreground: 0 0% 98%;
+    --secondary: 240 4.8% 95.9%;
+    --secondary-foreground: 240 5.9% 10%;
+    --muted: 240 4.8% 95.9%;
+    --muted-foreground: 240 3.8% 46.1%;
+    --accent: 240 4.8% 95.9%;
+    --accent-foreground: 240 5.9% 10%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+    --success: 142 76% 36%;
+    --success-foreground: 0 0% 98%;
+    --warning: 38 92% 50%;
+    --warning-foreground: 0 0% 98%;
+    --border: 240 5.9% 90%;
+    --input: 240 5.9% 90%;
+    --ring: 240 5.9% 64.9%;
+    --sidebar: 0 0% 98%;
+    --sidebar-foreground: 240 5.3% 26.1%;
+    --sidebar-border: 240 5.9% 90%;
+    --sidebar-accent: 240 4.8% 95.9%;
+    --sidebar-accent-foreground: 240 5.9% 10%;
+    --sidebar-muted: 240 3.8% 46.1%;
+    --radius: 0.5rem;
+
+    /* Conversation-specific */
+    --msg-user: 213 94% 95%;
+    --msg-user-foreground: 213 50% 20%;
+    --msg-assistant: 0 0% 97%;
+    --msg-assistant-foreground: 240 10% 3.9%;
+    --msg-tool: 240 4.8% 95.9%;
+    --msg-tool-border: 240 5.9% 90%;
+
+    /* Code blocks */
+    --code-bg: 240 5% 96%;
+    --code-border: 240 5.9% 90%;
+    --code-text: 240 10% 3.9%;
+  }
+
+  .dark {
+    --background: 240 10% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 240 10% 3.9%;
+    --card-foreground: 0 0% 98%;
+    --popover: 240 10% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 0 0% 98%;
+    --primary-foreground: 240 5.9% 10%;
+    --secondary: 240 3.7% 15.9%;
+    --secondary-foreground: 0 0% 98%;
+    --muted: 240 3.7% 15.9%;
+    --muted-foreground: 240 5% 64.9%;
+    --accent: 240 3.7% 15.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 0% 98%;
+    --success: 142 76% 36%;
+    --success-foreground: 0 0% 98%;
+    --warning: 38 92% 50%;
+    --warning-foreground: 0 0% 98%;
+    --border: 240 3.7% 15.9%;
+    --input: 240 3.7% 15.9%;
+    --ring: 240 4.9% 83.9%;
+    --sidebar: 240 5.9% 6%;
+    --sidebar-foreground: 240 4.8% 95.9%;
+    --sidebar-border: 240 3.7% 15.9%;
+    --sidebar-accent: 240 3.7% 15.9%;
+    --sidebar-accent-foreground: 0 0% 98%;
+    --sidebar-muted: 240 5% 64.9%;
+
+    /* Conversation-specific */
+    --msg-user: 213 50% 15%;
+    --msg-user-foreground: 213 40% 90%;
+    --msg-assistant: 240 3.7% 12%;
+    --msg-assistant-foreground: 0 0% 90%;
+    --msg-tool: 240 3.7% 10%;
+    --msg-tool-border: 240 3.7% 18%;
+
+    /* Code blocks */
+    --code-bg: 240 6% 8%;
+    --code-border: 240 3.7% 18%;
+    --code-text: 0 0% 90%;
+  }
+
+  * {
+    border-color: hsl(var(--border));
+  }
+
+  body {
+    background-color: hsl(var(--background));
+    color: hsl(var(--foreground));
+    font-feature-settings: "rlig" 1, "calt" 1;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+}
+
+/* Scrollbar styling */
+@layer utilities {
+  .scrollbar-thin {
+    scrollbar-width: thin;
+    scrollbar-color: hsl(var(--border)) transparent;
+  }
+  .scrollbar-thin::-webkit-scrollbar {
+    width: 6px;
+  }
+  .scrollbar-thin::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  .scrollbar-thin::-webkit-scrollbar-thumb {
+    background-color: hsl(var(--border));
+    border-radius: 3px;
+  }
+}

package/agent/dashboard/src/lib/api.test.ts

@@ -0,0 +1,41 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { botUrl, setActiveBotName } from "./api";
+
+describe("botUrl", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+    setActiveBotName(null);
+  });
+
+  it("returns path as-is when no /dashboard/ in pathname", () => {
+    vi.stubGlobal("window", { location: { pathname: "/" } });
+    expect(botUrl("/api/sessions")).toBe("/api/sessions");
+  });
+
+  it("prepends prefix when /dashboard/ is found in pathname", () => {
+    vi.stubGlobal("window", { location: { pathname: "/bot1/dashboard/" } });
+    expect(botUrl("/api/sessions")).toBe("/bot1/api/sessions");
+  });
+
+  it("normalizes path without leading slash", () => {
+    vi.stubGlobal("window", { location: { pathname: "/" } });
+    expect(botUrl("api/sessions")).toBe("/api/sessions");
+  });
+
+  it("handles nested prefix paths", () => {
+    vi.stubGlobal("window", { location: { pathname: "/a/b/dashboard/settings" } });
+    expect(botUrl("/health")).toBe("/a/b/health");
+  });
+
+  it("uses /bot/:name prefix in fleet mode", () => {
+    vi.stubGlobal("window", { location: { pathname: "/" } });
+    setActiveBotName("posca");
+    expect(botUrl("/api/sessions")).toBe("/bot/posca/api/sessions");
+  });
+
+  it("fleet mode overrides URL-based detection", () => {
+    vi.stubGlobal("window", { location: { pathname: "/dashboard/" } });
+    setActiveBotName("mybot");
+    expect(botUrl("/api/config")).toBe("/bot/mybot/api/config");
+  });
+});

package/agent/dashboard/src/lib/api.ts

@@ -0,0 +1,53 @@
+/** Currently selected bot name for fleet-proxied requests. null = direct bot mode. */
+let _activeBotName: string | null = null;
+
+export function setActiveBotName(name: string | null) {
+  _activeBotName = name;
+}
+
+export function getActiveBotName(): string | null {
+  return _activeBotName;
+}
+
+function currentDashboardPrefix(): string {
+  if (typeof window === "undefined") return "";
+
+  // Fleet mode: proxy through /bot/:name
+  if (_activeBotName) {
+    return `/bot/${encodeURIComponent(_activeBotName)}`;
+  }
+
+  // Bot-direct mode: detect /bot/:name/dashboard/ prefix from URL
+  const marker = "/dashboard/";
+  const pathname = window.location.pathname;
+  const markerIndex = pathname.indexOf(marker);
+  if (markerIndex === -1) return "";
+  return pathname.slice(0, markerIndex);
+}
+
+export function botUrl(path: string): string {
+  const normalized = path.startsWith("/") ? path : `/${path}`;
+  return `${currentDashboardPrefix()}${normalized}`;
+}
+
+export function botFetch(path: string, init?: RequestInit): Promise<Response> {
+  return fetch(botUrl(path), { ...init, credentials: "same-origin" });
+}
+
+export interface SSECallbacks {
+  onEvent: (event: string, data: string) => void;
+  onError?: (err: Event) => void;
+}
+
+export function botSSE(path: string, callbacks: SSECallbacks): EventSource {
+  const es = new EventSource(botUrl(path));
+  for (const eventType of ["snapshot", "state", "tool", "subagent", "heartbeat"]) {
+    es.addEventListener(eventType, (e: MessageEvent) => {
+      callbacks.onEvent(eventType, e.data);
+    });
+  }
+  es.onerror = (e) => {
+    callbacks.onError?.(e);
+  };
+  return es;
+}

package/agent/dashboard/src/lib/fleet-context.tsx

@@ -0,0 +1,92 @@
+import { createContext, useContext, useState, useEffect, useCallback, useRef } from "react";
+import type { ReactNode } from "react";
+
+export interface FleetBot {
+  name: string;
+  status: string;
+  model: string;
+  containerId: string;
+  ports: string;
+}
+
+interface FleetContextValue {
+  /** null = detection in progress, false = bot-direct mode, true = fleet mode */
+  isFleet: boolean | null;
+  bots: FleetBot[];
+  selectedBot: string | null;
+  selectBot: (name: string | null) => void;
+  refreshBots: () => void;
+}
+
+const FleetContext = createContext<FleetContextValue>({
+  isFleet: null,
+  bots: [],
+  selectedBot: null,
+  selectBot: () => {},
+  refreshBots: () => {},
+});
+
+export function useFleet() {
+  return useContext(FleetContext);
+}
+
+/** Fetch wrapper for fleet-level APIs (always hits host, no bot prefix) */
+export function fleetFetch(path: string, init?: RequestInit): Promise<Response> {
+  return fetch(path, { ...init, credentials: "same-origin" });
+}
+
+export function FleetProvider({ children }: { children: ReactNode }) {
+  const [isFleet, setIsFleet] = useState<boolean | null>(null);
+  const [bots, setBots] = useState<FleetBot[]>([]);
+  const [selectedBot, setSelectedBot] = useState<string | null>(null);
+  const pollRef = useRef<ReturnType<typeof setInterval>>(undefined);
+
+  const isFleetRef = useRef(isFleet);
+  isFleetRef.current = isFleet;
+
+  const retryCountRef = useRef(0);
+  const refreshBots = useCallback(() => {
+    fleetFetch("/api/bots")
+      .then((r) => {
+        if (r.status === 404) {
+          // Definitive "not fleet" — single bot mode
+          if (isFleetRef.current === null) setIsFleet(false);
+          return;
+        }
+        if (!r.ok) throw new Error("transient");
+        return r.json();
+      })
+      .then((data) => {
+        if (!data) return;
+        retryCountRef.current = 0;
+        setBots(data as FleetBot[]);
+        if (isFleetRef.current === null) setIsFleet(true);
+      })
+      .catch(() => {
+        // Transient error — retry up to 3 times before giving up
+        retryCountRef.current++;
+        if (isFleetRef.current === null && retryCountRef.current >= 3) setIsFleet(false);
+      });
+  }, []);
+
+  useEffect(() => {
+    refreshBots();
+  }, [refreshBots]);
+
+  // Poll bots list in fleet mode
+  useEffect(() => {
+    if (isFleet !== true) return;
+    pollRef.current = setInterval(refreshBots, 5000);
+    return () => clearInterval(pollRef.current);
+  }, [isFleet, refreshBots]);
+
+  const selectBot = useCallback((name: string | null) => {
+    setSelectedBot(name);
+  }, []);
+
+  return (
+    <FleetContext.Provider value={{ isFleet, bots, selectedBot, selectBot, refreshBots }}>
+      {children}
+    </FleetContext.Provider>
+  );
+}

package/agent/dashboard/src/lib/format.test.ts

@@ -0,0 +1,119 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { timeAgo, modelShort, formatToolLabel } from "./format";
+
+describe("timeAgo", () => {
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("returns 'just now' for < 1 minute", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-01-01T12:00:30Z"));
+    expect(timeAgo("2026-01-01T12:00:00Z")).toBe("just now");
+  });
+
+  it("returns minutes for < 60 minutes", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-01-01T12:05:00Z"));
+    expect(timeAgo("2026-01-01T12:00:00Z")).toBe("5m ago");
+  });
+
+  it("returns hours for < 24 hours", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-01-01T15:00:00Z"));
+    expect(timeAgo("2026-01-01T12:00:00Z")).toBe("3h ago");
+  });
+
+  it("returns 'yesterday' for 1 day", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-01-02T12:00:00Z"));
+    expect(timeAgo("2026-01-01T12:00:00Z")).toBe("yesterday");
+  });
+
+  it("returns days for > 1 day", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-01-04T12:00:00Z"));
+    expect(timeAgo("2026-01-01T12:00:00Z")).toBe("3d ago");
+  });
+
+  it("returns 'unknown' for empty string", () => {
+    expect(timeAgo("")).toBe("unknown");
+  });
+
+  it("returns 'unknown' for invalid date", () => {
+    expect(timeAgo("not-a-date")).toBe("unknown");
+  });
+});
+
+describe("modelShort", () => {
+  it("shortens opus model", () => {
+    expect(modelShort("claude-opus-4-6")).toBe("opus");
+  });
+
+  it("shortens sonnet model", () => {
+    expect(modelShort("claude-sonnet-4-6")).toBe("sonnet");
+  });
+
+  it("shortens haiku model", () => {
+    expect(modelShort("claude-haiku-4-5-20251001")).toBe("haiku");
+  });
+
+  it("falls back to last segment for unknown model", () => {
+    expect(modelShort("gpt-4o-mini")).toBe("mini");
+  });
+
+  it("returns model as-is if no dashes", () => {
+    expect(modelShort("custom")).toBe("custom");
+  });
+
+  it("returns 'unknown' for empty string", () => {
+    expect(modelShort("")).toBe("unknown");
+  });
+});
+
+describe("formatToolLabel", () => {
+  it("returns empty string for null input", () => {
+    expect(formatToolLabel("Read", null)).toBe("");
+  });
+
+  it("returns empty string for non-object input", () => {
+    expect(formatToolLabel("Read", "string")).toBe("");
+  });
+
+  it("extracts file_path for Read", () => {
+    expect(formatToolLabel("Read", { file_path: "/src/app.ts" })).toBe("/src/app.ts");
+  });
+
+  it("extracts file_path for Edit", () => {
+    expect(formatToolLabel("Edit", { file_path: "/src/lib.ts", old_string: "a" })).toBe("/src/lib.ts");
+  });
+
+  it("extracts file_path for Write", () => {
+    expect(formatToolLabel("Write", { file_path: "/new.ts", content: "x" })).toBe("/new.ts");
+  });
+
+  it("extracts and truncates command for Bash", () => {
+    const long = "a".repeat(100);
+    expect(formatToolLabel("Bash", { command: long })).toBe("a".repeat(80));
+  });
+
+  it("extracts pattern for Grep", () => {
+    expect(formatToolLabel("Grep", { pattern: "TODO" })).toBe("TODO");
+  });
+
+  it("extracts pattern for Glob", () => {
+    expect(formatToolLabel("Glob", { pattern: "**/*.ts" })).toBe("**/*.ts");
+  });
+
+  it("extracts query for WebSearch", () => {
+    expect(formatToolLabel("WebSearch", { query: "vitest setup" })).toBe("vitest setup");
+  });
+
+  it("falls back to first two keys for unknown tool", () => {
+    expect(formatToolLabel("CustomTool", { alpha: 1, beta: 2, gamma: 3 })).toBe("alpha, beta");
+  });
+
+  it("returns empty string when file_path is missing", () => {
+    expect(formatToolLabel("Read", { other: "value" })).toBe("");
+  });
+});

package/agent/dashboard/src/lib/format.ts

@@ -0,0 +1,41 @@
+export function timeAgo(iso: string): string {
+  const ts = new Date(iso).getTime();
+  if (!iso || isNaN(ts)) return "unknown";
+  const diff = Date.now() - ts;
+  const mins = Math.floor(diff / 60_000);
+  if (mins < 1) return "just now";
+  if (mins < 60) return `${mins}m ago`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days === 1) return "yesterday";
+  return `${days}d ago`;
+}
+
+export function modelShort(model: string): string {
+  if (!model) return "unknown";
+  if (model.includes("opus")) return "opus";
+  if (model.includes("sonnet")) return "sonnet";
+  if (model.includes("haiku")) return "haiku";
+  return model.split("-").pop() ?? model;
+}
+
+export function formatToolLabel(toolName: string, input: unknown): string {
+  if (!input || typeof input !== "object") return "";
+  const obj = input as Record<string, unknown>;
+  switch (toolName) {
+    case "Read":
+    case "Edit":
+    case "Write":
+      return String(obj.file_path ?? "");
+    case "Bash":
+      return String(obj.command ?? "").slice(0, 80);
+    case "Grep":
+    case "Glob":
+      return String(obj.pattern ?? "");
+    case "WebSearch":
+      return String(obj.query ?? "");
+    default:
+      return Object.keys(obj).slice(0, 2).join(", ");
+  }
+}

package/agent/dashboard/src/lib/login-gate.tsx

@@ -0,0 +1,117 @@
+import { useState, useEffect, useCallback } from "react";
+import type { ReactNode, ChangeEvent, KeyboardEvent } from "react";
+import { Button, Input, Alert, Card } from "../components";
+
+interface LoginGateProps {
+  children: ReactNode;
+}
+
+export default function LoginGate({ children }: LoginGateProps) {
+  const [status, setStatus] = useState<"checking" | "open" | "locked" | "authenticated">("checking");
+  const [code, setCode] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [busy, setBusy] = useState(false);
+
+  const checkStatus = useCallback(() => {
+    fetch("/api/totp/status", { credentials: "same-origin" })
+      .then((r) => {
+        if (!r.ok) { setStatus("locked"); return; }
+        return r.json();
+      })
+      .then((data: { enabled?: boolean } | undefined) => {
+        if (!data) return;
+        if (!data.enabled) {
+          setStatus("open");
+          return;
+        }
+        // TOTP enabled — check if we already have a valid session
+        return fetch("/api/session", { credentials: "same-origin" }).then((r) => {
+          setStatus(r.ok ? "authenticated" : "locked");
+        });
+      })
+      .catch(() => setStatus("locked"));
+  }, []);
+
+  useEffect(() => { checkStatus(); }, [checkStatus]);
+
+  async function handleVerify() {
+    if (code.length !== 6) return;
+    setBusy(true);
+    setError(null);
+    try {
+      const resp = await fetch("/api/totp/verify", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "same-origin",
+        body: JSON.stringify({ code }),
+      });
+      if (resp.ok) {
+        setStatus("authenticated");
+      } else {
+        const data = await resp.json() as { error?: string };
+        setError(data.error ?? "Invalid code");
+        setCode("");
+      }
+    } catch {
+      setError("Network error");
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  if (status === "checking") {
+    return (
+      <div className="h-screen flex items-center justify-center bg-background">
+        <div className="text-muted-foreground text-sm">Loading...</div>
+      </div>
+    );
+  }
+
+  if (status === "open" || status === "authenticated") {
+    return <>{children}</>;
+  }
+
+  // Locked — show login
+  return (
+    <div className="h-screen flex items-center justify-center bg-background">
+      <div className="w-full max-w-sm px-4">
+        <Card spacing={4} className="text-center">
+          <div className="w-12 h-12 rounded-xl bg-primary flex items-center justify-center text-primary-foreground font-bold text-xl mx-auto">
+            M
+          </div>
+          <h1 className="text-lg font-semibold text-foreground">Mecha Dashboard</h1>
+          <p className="text-sm text-muted-foreground">
+            Enter the 6-digit code from your authenticator app.
+          </p>
+
+          <Input
+            mono
+            value={code}
+            onChange={(e: ChangeEvent<HTMLInputElement>) => {
+              const v = e.target.value.replace(/\D/g, "").slice(0, 6);
+              setCode(v);
+            }}
+            onKeyDown={(e: KeyboardEvent) => { if (e.key === "Enter") handleVerify(); }}
+            placeholder="000000"
+            className="w-full text-center text-2xl tracking-[0.5em]"
+            autoComplete="one-time-code"
+            inputMode="numeric"
+            autoFocus
+          />
+
+          {error && <Alert variant="error">{error}</Alert>}
+
+          <Button
+            variant="primary"
+            size="lg"
+            onClick={handleVerify}
+            disabled={code.length !== 6 || busy}
+            className="w-full"
+          >
+            {busy ? "Verifying..." : "Verify"}
+          </Button>
+        </Card>
+      </div>
+    </div>
+  );
+}

package/agent/dashboard/src/lib/sanitize.test.ts

@@ -0,0 +1,86 @@
+import { describe, it, expect } from "vitest";
+import { sanitizeMarkdown } from "./sanitize";
+
+describe("sanitizeMarkdown", () => {
+  it("renders basic markdown to HTML", () => {
+    const html = sanitizeMarkdown("**bold** and *italic*");
+    expect(html).toContain("<strong>bold</strong>");
+    expect(html).toContain("<em>italic</em>");
+  });
+
+  it("renders code blocks", () => {
+    const html = sanitizeMarkdown("```js\nconsole.log('hi');\n```");
+    expect(html).toContain("<code");
+    expect(html).toContain("console.log");
+  });
+
+  it("renders inline code", () => {
+    const html = sanitizeMarkdown("use `foo()` here");
+    expect(html).toContain("<code>foo()</code>");
+  });
+
+  it("strips iframe tags", () => {
+    const html = sanitizeMarkdown('<iframe src="https://evil.com"></iframe>');
+    expect(html).not.toContain("iframe");
+    expect(html).not.toContain("evil.com");
+  });
+
+  it("strips img tags (prevents tracking beacons)", () => {
+    const html = sanitizeMarkdown('<img src="https://tracker.com/pixel.png">');
+    expect(html).not.toContain("img");
+    expect(html).not.toContain("tracker.com");
+  });
+
+  it("strips markdown image syntax (rendered as img then stripped)", () => {
+    const html = sanitizeMarkdown("![alt](https://tracker.com/pixel.png)");
+    expect(html).not.toContain("<img");
+    expect(html).not.toContain("tracker.com");
+  });
+
+  it("strips object and embed tags", () => {
+    const html = sanitizeMarkdown('<object data="x"></object><embed src="y">');
+    expect(html).not.toContain("object");
+    expect(html).not.toContain("embed");
+  });
+
+  it("strips form tags", () => {
+    const html = sanitizeMarkdown('<form action="/steal"><input></form>');
+    expect(html).not.toContain("form");
+    expect(html).not.toContain("/steal");
+  });
+
+  it("strips data attributes", () => {
+    const html = sanitizeMarkdown('<div data-secret="key123">text</div>');
+    expect(html).not.toContain("data-secret");
+    expect(html).not.toContain("key123");
+  });
+
+  it("strips srcset attributes", () => {
+    const html = sanitizeMarkdown('<img srcset="a.png 1x, b.png 2x">');
+    expect(html).not.toContain("srcset");
+  });
+
+  it("allows safe HTML: links, lists, headings", () => {
+    const html = sanitizeMarkdown("# Title\n\n- item 1\n- item 2\n\n[link](https://example.com)");
+    expect(html).toContain("<h1");
+    expect(html).toContain("<li>");
+    expect(html).toContain('<a href="https://example.com"');
+  });
+
+  it("strips script tags (XSS)", () => {
+    const html = sanitizeMarkdown('<script>alert("xss")</script>');
+    expect(html).not.toContain("script");
+    expect(html).not.toContain("alert");
+  });
+
+  it("strips onerror attributes (XSS)", () => {
+    const html = sanitizeMarkdown('<div onerror="alert(1)">test</div>');
+    expect(html).not.toContain("onerror");
+    expect(html).not.toContain("alert");
+  });
+
+  it("handles empty string", () => {
+    const html = sanitizeMarkdown("");
+    expect(html).toBe("");
+  });
+});

package/agent/dashboard/src/lib/sanitize.ts

@@ -0,0 +1,13 @@
+import { marked } from "marked";
+import DOMPurify from "dompurify";
+
+marked.setOptions({ breaks: true, gfm: true });
+
+export function sanitizeMarkdown(text: string): string {
+  const raw = marked.parse(text) as string;
+  return DOMPurify.sanitize(raw, {
+    FORBID_TAGS: ["iframe", "object", "embed", "form", "img"],
+    FORBID_ATTR: ["srcset"],
+    ALLOW_DATA_ATTR: false,
+  } as Parameters<typeof DOMPurify.sanitize>[1]);
+}