opencode-gh-ci 0.1.0

package/package.json

@@ -0,0 +1,44 @@
+{
+  "$schema": "https://json.schemastore.org/package.json",
+  "name": "opencode-gh-ci",
+  "version": "0.1.0",
+  "type": "module",
+  "description": "GitHub Actions CI status in the OpenCode sidebar with live elapsed timers.",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/antoinejeannot/opencode-gh-ci"
+  },
+  "keywords": [
+    "opencode",
+    "opencode-plugin",
+    "opencode-tui-plugin",
+    "github",
+    "actions",
+    "ci",
+    "sidebar"
+  ],
+  "exports": {
+    "./server": {
+      "import": "./server.ts"
+    },
+    "./tui": {
+      "import": "./tui.tsx"
+    }
+  },
+  "files": [
+    "server.ts",
+    "tui.tsx",
+    "shared.ts",
+    "README.md"
+  ],
+  "engines": {
+    "opencode": ">=1.3.13"
+  },
+  "peerDependencies": {
+    "@opencode-ai/plugin": "*",
+    "@opentui/core": "*",
+    "@opentui/solid": "*",
+    "solid-js": "*"
+  }
+}

package/server.ts

@@ -0,0 +1,217 @@
+// @ts-nocheck
+import { mkdir, readFile, writeFile } from "node:fs/promises"
+import { dirname } from "node:path"
+import type { Plugin } from "@opencode-ai/plugin"
+import {
+  PLUGIN_ID,
+  parseOptions,
+  buildCachePath,
+  buildRegistryPath,
+  registerSession,
+  deregisterSession,
+  cleanupOrphans,
+  cleanupSession,
+  emptyCache,
+  nowISO,
+} from "./shared"
+
+import type { WorkflowJob, WorkflowRun, CICache } from "./shared"
+
+// ---------------------------------------------------------------------------
+// Git branch detection
+// ---------------------------------------------------------------------------
+
+async function detectBranch(cwd: string): Promise<string> {
+  const proc = Bun.spawn(["git", "rev-parse", "--abbrev-ref", "HEAD"], {
+    cwd,
+    stdout: "pipe",
+    stderr: "pipe",
+  })
+  const out = await new Response(proc.stdout).text()
+  const code = await proc.exited
+  if (code !== 0) return ""
+  return out.trim()
+}
+
+// ---------------------------------------------------------------------------
+// GitHub CLI data fetching
+// ---------------------------------------------------------------------------
+
+async function runCmd(args: string[], cwd: string): Promise<string> {
+  const proc = Bun.spawn(args, { cwd, stdout: "pipe", stderr: "pipe" })
+  const out = await new Response(proc.stdout).text()
+  const code = await proc.exited
+  if (code !== 0) throw new Error(`exit ${code}: ${args.join(" ")}`)
+  return out.trim()
+}
+
+async function fetchJobsForRun(runId: number, cwd: string): Promise<WorkflowJob[]> {
+  const jobsRaw = await runCmd(
+    ["gh", "api",
+     `repos/{owner}/{repo}/actions/runs/${runId}/jobs`,
+     "--jq", ".jobs[] | {name,status,conclusion,started_at,completed_at}"],
+    cwd,
+  )
+  return jobsRaw
+    .split("\n")
+    .filter((l: string) => l.trim())
+    .map((l: string) => { try { return JSON.parse(l) } catch { return null } })
+    .filter(Boolean)
+}
+
+async function fetchRuns(
+  branch: string,
+  cwd: string,
+  maxRuns: number,
+  pushWindowMs: number,
+): Promise<WorkflowRun[]> {
+  const raw = await runCmd(
+    ["gh", "run", "list", "--branch", branch, "--limit", String(maxRuns),
+     "--json", "databaseId,name,status,conclusion,headBranch,createdAt"],
+    cwd,
+  )
+  const allRuns = JSON.parse(raw)
+  if (!allRuns?.length) return []
+
+  const latestTime = new Date(allRuns[0].createdAt).getTime()
+  const pushRuns = allRuns.filter(
+    (r: any) => Math.abs(new Date(r.createdAt).getTime() - latestTime) < pushWindowMs
+  )
+
+  const results: WorkflowRun[] = await Promise.all(
+    pushRuns.map(async (r: any) => {
+      const jobs = await fetchJobsForRun(r.databaseId, cwd)
+      return {
+        id: r.databaseId,
+        name: r.name,
+        status: r.status,
+        conclusion: r.conclusion,
+        head_branch: r.headBranch,
+        jobs,
+      }
+    })
+  )
+
+  return results
+}
+
+// ---------------------------------------------------------------------------
+// Cache I/O
+// ---------------------------------------------------------------------------
+
+async function readCache(filePath: string): Promise<CICache> {
+  try {
+    const text = await readFile(filePath, "utf8")
+    const parsed = JSON.parse(text)
+    if (!parsed || typeof parsed !== "object") return emptyCache()
+    return {
+      version: 1,
+      updatedAt: parsed.updatedAt || nowISO(),
+      branch: parsed.branch || "",
+      runs: parsed.runs || (parsed.run ? [parsed.run] : []),
+      error: parsed.error || null,
+    }
+  } catch {
+    return emptyCache()
+  }
+}
+
+async function writeCache(filePath: string, cache: CICache): Promise<void> {
+  await mkdir(dirname(filePath), { recursive: true })
+  await writeFile(filePath, `${JSON.stringify(cache, null, 2)}\n`, "utf8")
+}
+
+// ---------------------------------------------------------------------------
+// Plugin entry
+// ---------------------------------------------------------------------------
+
+const server: Plugin = async (input, options) => {
+  const opts = parseOptions(options)
+  if (!opts.enabled) return {}
+
+  const cwd = input.directory
+  const cachePath = buildCachePath()
+  const registryPath = buildRegistryPath(cwd)
+
+  // Clean up orphaned sessions from dead processes
+  await cleanupOrphans(registryPath)
+
+  // Register this session
+  await registerSession(registryPath, {
+    cachePath,
+    pid: process.pid,
+    startedAt: nowISO(),
+  })
+
+  // Global last-refresh timestamp — shared by poll timer and event handlers
+  let lastRefreshAt = 0
+
+  const refresh = async () => {
+    try {
+      const branch = await detectBranch(cwd)
+      if (!branch) {
+        await writeCache(cachePath, { ...emptyCache(), error: "Not a git repo" })
+        return
+      }
+
+      const runs = await fetchRuns(branch, cwd, opts.max_runs, opts.push_window_ms)
+      await writeCache(cachePath, {
+        version: 1,
+        updatedAt: nowISO(),
+        branch,
+        runs,
+        error: null,
+      })
+    } catch (e: any) {
+      const prev = await readCache(cachePath)
+      await writeCache(cachePath, {
+        ...prev,
+        updatedAt: nowISO(),
+        error: e?.message ?? "fetch failed",
+      })
+    }
+    lastRefreshAt = Date.now()
+  }
+
+  // Global debounce — skips if any source (poll or event) already refreshed recently
+  const maybeRefresh = () => {
+    if (Date.now() - lastRefreshAt >= opts.debounce_ms) {
+      void refresh()
+    }
+  }
+
+  // Initial fetch + periodic poll (also debounced)
+  void refresh()
+  const timer = setInterval(() => maybeRefresh(), opts.server_poll_ms)
+  timer.unref?.()
+
+  // Cleanup on graceful shutdown
+  const cleanup = async () => {
+    clearInterval(timer)
+    await cleanupSession(cachePath)
+    await deregisterSession(registryPath, cachePath)
+  }
+
+  const onExit = () => { void cleanup() }
+  process.on("exit", onExit)
+  process.on("SIGINT", onExit)
+  process.on("SIGTERM", onExit)
+
+  // Build return object with dynamic event handlers
+  const handlers: Record<string, unknown> = { dispose: cleanup }
+
+  if (opts.refresh_on_events) {
+    for (const event of opts.refresh_on_events) {
+      handlers[event] = async () => {
+        maybeRefresh()
+      }
+    }
+  }
+
+  return handlers
+}
+
+export default {
+  id: PLUGIN_ID,
+  server,
+}

package/shared.ts

@@ -0,0 +1,317 @@
+import { createHash, randomUUID } from "node:crypto"
+import { mkdir, readFile, writeFile, rm } from "node:fs/promises"
+import os from "node:os"
+import path from "node:path"
+
+export const PLUGIN_ID = "gh-ci"
+
+const BASE_DIR = path.join(os.tmpdir(), "opencode-gh-ci")
+
+// ---------------------------------------------------------------------------
+// Options
+// ---------------------------------------------------------------------------
+
+// All plugin trigger events that can be subscribed to
+const ALL_EVENTS = [
+  "chat.message",
+  "tool.execute.before",
+  "tool.execute.after",
+  "command.execute.before",
+  "shell.env",
+] as const
+
+const DEFAULT_EVENTS = [...ALL_EVENTS] as string[]
+
+const DEFAULTS = {
+  enabled: true,
+  server_poll_ms: 10_000,
+  tui_poll_ms: 5_000,
+  debounce_ms: 10_000,
+  push_window_ms: 60_000,
+  max_runs: 10,
+} as const
+
+export interface HideFilters {
+  workflows: RegExp[]
+  jobs: RegExp[]
+}
+
+export interface PluginOptions {
+  enabled: boolean
+  server_poll_ms: number
+  tui_poll_ms: number
+  debounce_ms: number
+  push_window_ms: number
+  max_runs: number
+  refresh_on_events: string[] | false
+  hide: HideFilters
+  collapse_single_workflow: boolean
+}
+
+const toRecord = (v: unknown): Record<string, unknown> | undefined =>
+  v && typeof v === "object" && !Array.isArray(v)
+    ? Object.fromEntries(Object.entries(v))
+    : undefined
+
+const toBool = (v: unknown, fallback: boolean): boolean =>
+  typeof v === "boolean" ? v : fallback
+
+const toRegexList = (v: unknown): RegExp[] => {
+  if (!Array.isArray(v)) return []
+  return v
+    .filter((s): s is string => typeof s === "string")
+    .map((s) => { try { return new RegExp(s, "i") } catch { return null } })
+    .filter((r): r is RegExp => r !== null)
+}
+
+const toNum = (v: unknown, fallback: number, min = 0): number => {
+  if (typeof v !== "number" || !Number.isFinite(v)) return fallback
+  return Math.max(min, v)
+}
+
+export function parseOptions(raw: unknown): PluginOptions {
+  const rec = toRecord(raw)
+  if (!rec) return { ...DEFAULTS, refresh_on_events: [...DEFAULT_EVENTS], hide: { workflows: [], jobs: [] }, collapse_single_workflow: true }
+
+  // Parse refresh_on_events:
+  //   false                          → disabled
+  //   true                           → all available events
+  //   undefined                      → default events (chat.message)
+  //   ["chat.message", "tool.execute.after"]  → specific events
+  let refreshOnEvents: string[] | false
+  const roe = rec.refresh_on_events
+  if (roe === false) {
+    refreshOnEvents = false
+  } else if (roe === true) {
+    refreshOnEvents = [...ALL_EVENTS]
+  } else if (Array.isArray(roe)) {
+    refreshOnEvents = roe.filter((e): e is string => typeof e === "string")
+  } else {
+    refreshOnEvents = [...DEFAULT_EVENTS]
+  }
+
+  // Parse hide: { workflows: [...], jobs: [...] }
+  const hideRec = toRecord(rec.hide)
+  const hide: HideFilters = {
+    workflows: toRegexList(hideRec?.workflows),
+    jobs: toRegexList(hideRec?.jobs),
+  }
+
+  return {
+    enabled: toBool(rec.enabled, DEFAULTS.enabled),
+    server_poll_ms: toNum(rec.server_poll_ms, DEFAULTS.server_poll_ms, 5000),
+    tui_poll_ms: toNum(rec.tui_poll_ms, DEFAULTS.tui_poll_ms, 1000),
+    debounce_ms: toNum(rec.debounce_ms, DEFAULTS.debounce_ms, 1000),
+    push_window_ms: toNum(rec.push_window_ms, DEFAULTS.push_window_ms, 10_000),
+    max_runs: toNum(rec.max_runs, DEFAULTS.max_runs, 1),
+    refresh_on_events: refreshOnEvents,
+    hide,
+    collapse_single_workflow: toBool(rec.collapse_single_workflow, true),
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Filtering
+// ---------------------------------------------------------------------------
+
+/** Filter runs and jobs based on hide regexes. Returns a new array (no mutation). */
+export function filterRuns(runs: WorkflowRun[] | undefined, hide: HideFilters): WorkflowRun[] {
+  if (!runs?.length) return []
+  if (!hide.workflows.length && !hide.jobs.length) return runs
+
+  return runs
+    .filter((r) => !hide.workflows.some((re) => re.test(r.name)))
+    .map((r) => {
+      if (!hide.jobs.length) return r
+      const filteredJobs = r.jobs.filter((j) => !hide.jobs.some((re) => re.test(j.name)))
+      return filteredJobs.length === r.jobs.length ? r : { ...r, jobs: filteredJobs }
+    })
+}
+
+// ---------------------------------------------------------------------------
+// Domain types
+// ---------------------------------------------------------------------------
+
+export interface WorkflowJob {
+  name: string
+  status: "queued" | "in_progress" | "completed" | "waiting"
+  conclusion: string | null
+  started_at: string | null
+  completed_at: string | null
+}
+
+export interface WorkflowRun {
+  id: number
+  name: string
+  status: string
+  conclusion: string | null
+  head_branch: string
+  jobs: WorkflowJob[]
+}
+
+export interface CICache {
+  version: 1
+  updatedAt: string
+  branch: string
+  runs: WorkflowRun[]
+  error: string | null
+}
+
+export interface RegistryEntry {
+  cachePath: string
+  pid: number
+  startedAt: string
+}
+
+// ---------------------------------------------------------------------------
+// Cache path helpers
+// ---------------------------------------------------------------------------
+
+export const nowISO = () => new Date().toISOString()
+
+export const emptyCache = (): CICache => ({
+  version: 1,
+  updatedAt: nowISO(),
+  branch: "",
+  runs: [],
+  error: null,
+})
+
+/** Random per-session cache directory: <tmpdir>/opencode-gh-ci/<uuid>/ci.json */
+export function buildCachePath(): string {
+  return path.join(BASE_DIR, randomUUID(), "ci.json")
+}
+
+/** Deterministic registry file per project: <tmpdir>/opencode-gh-ci/<hash>.registry.json */
+export function buildRegistryPath(root: string): string {
+  const digest = createHash("sha1").update(path.resolve(root)).digest("hex").slice(0, 12)
+  return path.join(BASE_DIR, `${digest}.registry.json`)
+}
+
+// ---------------------------------------------------------------------------
+// Registry helpers
+// ---------------------------------------------------------------------------
+
+export async function readRegistry(registryPath: string): Promise<RegistryEntry[]> {
+  try {
+    const text = await readFile(registryPath, "utf8")
+    const parsed = JSON.parse(text)
+    return Array.isArray(parsed) ? parsed : []
+  } catch {
+    return []
+  }
+}
+
+async function writeRegistry(registryPath: string, entries: RegistryEntry[]): Promise<void> {
+  await mkdir(path.dirname(registryPath), { recursive: true })
+  await writeFile(registryPath, JSON.stringify(entries, null, 2) + "\n", "utf8")
+}
+
+function isPidAlive(pid: number): boolean {
+  try {
+    process.kill(pid, 0)
+    return true
+  } catch {
+    return false
+  }
+}
+
+/** Register this session in the registry */
+export async function registerSession(
+  registryPath: string,
+  entry: RegistryEntry,
+): Promise<void> {
+  const entries = await readRegistry(registryPath)
+  entries.push(entry)
+  await writeRegistry(registryPath, entries)
+}
+
+/** Remove this session from the registry */
+export async function deregisterSession(
+  registryPath: string,
+  cachePath: string,
+): Promise<void> {
+  const entries = await readRegistry(registryPath)
+  const filtered = entries.filter((e) => e.cachePath !== cachePath)
+  await writeRegistry(registryPath, filtered)
+}
+
+/** Scan registry, remove entries with dead PIDs, delete their cache directories */
+export async function cleanupOrphans(registryPath: string): Promise<void> {
+  const entries = await readRegistry(registryPath)
+  const alive: RegistryEntry[] = []
+
+  for (const entry of entries) {
+    if (isPidAlive(entry.pid)) {
+      alive.push(entry)
+    } else {
+      try {
+        const dir = path.dirname(entry.cachePath)
+        await rm(dir, { recursive: true, force: true })
+      } catch {
+        // ignore
+      }
+    }
+  }
+
+  await writeRegistry(registryPath, alive)
+}
+
+/** Delete this session's cache directory */
+export async function cleanupSession(cachePath: string): Promise<void> {
+  try {
+    const dir = path.dirname(cachePath)
+    await rm(dir, { recursive: true, force: true })
+  } catch {
+    // ignore
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Cache read/parse
+// ---------------------------------------------------------------------------
+
+export function readCacheText(text: string): CICache {
+  try {
+    const parsed = JSON.parse(text)
+    if (!parsed || typeof parsed !== "object") return emptyCache()
+    return {
+      version: 1,
+      updatedAt: parsed.updatedAt || nowISO(),
+      branch: parsed.branch || "",
+      runs: parsed.runs || (parsed.run ? [parsed.run] : []),
+      error: parsed.error || null,
+    }
+  } catch {
+    return emptyCache()
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Display helpers
+// ---------------------------------------------------------------------------
+
+export const DOT = "\u2022"
+export const PULSE_FRAMES = ["\u2022", "\u25E6"]
+
+export function formatElapsed(seconds: number): string {
+  if (seconds < 0) seconds = 0
+  const m = Math.floor(seconds / 60)
+  const s = seconds % 60
+  if (m > 0) return `${m}m ${s}s`
+  return `${s}s`
+}
+
+export function getJobElapsed(job: WorkflowJob, nowSec: number): string {
+  if (!job.started_at) return ""
+  const started = Math.floor(new Date(job.started_at).getTime() / 1000)
+  if (job.completed_at) {
+    const completed = Math.floor(new Date(job.completed_at).getTime() / 1000)
+    return formatElapsed(completed - started)
+  }
+  return formatElapsed(nowSec - started)
+}
+
+export function truncate(s: string, max: number): string {
+  return s.length > max ? s.slice(0, max - 1) + "\u2026" : s
+}

package/tui.tsx

@@ -0,0 +1,327 @@
+// @ts-nocheck
+/** @jsxImportSource @opentui/solid */
+import { readFile } from "node:fs/promises"
+import type { TuiPlugin, TuiPluginModule } from "@opencode-ai/plugin/tui"
+import { Show, Index, For } from "solid-js"
+import { createSignal, createEffect, onCleanup, onMount, createMemo } from "solid-js"
+import {
+  PLUGIN_ID,
+  parseOptions,
+  filterRuns,
+  DOT,
+  PULSE_FRAMES,
+  buildRegistryPath,
+  readRegistry,
+  emptyCache,
+  readCacheText,
+  getJobElapsed,
+  truncate,
+} from "./shared"
+import type { CICache, HideFilters, WorkflowJob, WorkflowRun } from "./shared"
+
+type Api = Parameters<TuiPlugin>[0]
+
+// ---------------------------------------------------------------------------
+// Color helpers
+// ---------------------------------------------------------------------------
+
+function dotColor(theme: any, status: string, conclusion: string | null) {
+  if (status === "completed" && conclusion === "success") return theme.success
+  if (status === "completed" && conclusion === "failure") return theme.error
+  if (status === "completed" && conclusion === "skipped") return theme.textMuted
+  if (status === "completed" && conclusion === "cancelled") return theme.textMuted
+  if (status === "in_progress") return theme.warning
+  if (status === "queued" || status === "waiting") return theme.textMuted
+  return theme.textMuted
+}
+
+function overallStatus(runs: WorkflowRun[]): { status: string; conclusion: string | null } {
+  if (runs.some((r) => r.status === "in_progress")) return { status: "in_progress", conclusion: null }
+  if (runs.some((r) => r.status === "queued")) return { status: "queued", conclusion: null }
+  if (runs.every((r) => r.status === "completed" && r.conclusion === "success"))
+    return { status: "completed", conclusion: "success" }
+  if (runs.some((r) => r.status === "completed" && r.conclusion === "failure"))
+    return { status: "completed", conclusion: "failure" }
+  return { status: "completed", conclusion: runs[0]?.conclusion ?? null }
+}
+
+// ---------------------------------------------------------------------------
+// Read cache from disk
+// ---------------------------------------------------------------------------
+
+async function readCache(filePath: string): Promise<CICache> {
+  try {
+    return readCacheText(await readFile(filePath, "utf8"))
+  } catch {
+    return emptyCache()
+  }
+}
+
+/** Find this session's cache file via the registry (matched by PID) */
+async function discoverCachePath(registryPath: string): Promise<string | null> {
+  const entries = await readRegistry(registryPath)
+  const mine = entries.find((e) => e.pid === process.pid)
+  return mine?.cachePath ?? null
+}
+
+// ---------------------------------------------------------------------------
+// Per-workflow row (stateless — toggle state lifted to parent)
+// ---------------------------------------------------------------------------
+
+const WorkflowRow = (props: {
+  run: WorkflowRun
+  theme: any
+  nowSec: number
+  pulseFrame: number
+  expanded: boolean
+  onToggle: () => void
+}) => {
+  const arrowColor = () => dotColor(props.theme, props.run.status, props.run.conclusion)
+
+  return (
+    <box flexDirection="column" gap={0}>
+      <text onMouseDown={() => props.onToggle()}>
+        {"  "}
+        <span style={{ fg: arrowColor() }}>
+          {props.expanded ? "▼" : "▶"}
+        </span>
+        <span style={{ fg: props.theme.text }}>
+          {" "}{truncate(props.run.name, 28)}
+        </span>
+      </text>
+      <Show when={props.expanded}>
+        <Index each={props.run.jobs}>
+          {(job) => {
+            const elapsed = () => getJobElapsed(job(), props.nowSec)
+            const isJobActive = () => job().status === "in_progress"
+            const jobDot = () => isJobActive() ? PULSE_FRAMES[props.pulseFrame % PULSE_FRAMES.length] : DOT
+            return (
+              <box flexDirection="row" width="100%" gap={0}>
+                <text flexGrow={1}>
+                  <span style={{ fg: dotColor(props.theme, job().status, job().conclusion) }}>
+                    {"    "}{jobDot()}
+                  </span>
+                  <span style={{ fg: props.theme.text }}>
+                    {" "}{truncate(job().name, 22)}
+                  </span>
+                </text>
+                <Show when={elapsed()}>
+                  <text fg={props.theme.textMuted}>{elapsed()}</text>
+                </Show>
+              </box>
+            )
+          }}
+        </Index>
+      </Show>
+    </box>
+  )
+}
+
+// ---------------------------------------------------------------------------
+// Main sidebar card
+// ---------------------------------------------------------------------------
+
+const CICard = (props: { api: Api; theme: any; tuiPollMs: number; hide: HideFilters; collapseSingleWorkflow: boolean }) => {
+  const [cache, setCache] = createSignal<CICache>(emptyCache())
+  const [nowSec, setNowSec] = createSignal(Math.floor(Date.now() / 1000))
+  const [collapsed, setCollapsed] = createSignal(false)
+  const [pulseFrame, setPulseFrame] = createSignal(0)
+  const [cachePath, setCachePath] = createSignal<string | null>(null)
+
+  // Toggle state keyed by run ID — persists across cache updates
+  const [expandedMap, setExpandedMap] = createSignal<Record<number, boolean>>({})
+
+  const toggleRun = (runId: number) => {
+    setExpandedMap((prev) => ({
+      ...prev,
+      [runId]: prev[runId] === undefined ? false : !prev[runId],
+    }))
+  }
+
+  const isRunExpanded = (runId: number) => {
+    const map = expandedMap()
+    return map[runId] === undefined ? true : map[runId]
+  }
+
+  const registryPath = buildRegistryPath(props.api.state.path.directory)
+
+  const load = async () => {
+    // Discover cache path if not yet found
+    let path = cachePath()
+    if (!path) {
+      path = await discoverCachePath(registryPath)
+      if (path) setCachePath(path)
+    }
+    if (!path) return
+
+    setCache(await readCache(path))
+  }
+
+  onMount(() => {
+    void load()
+    const pollTimer = setInterval(() => void load(), props.tuiPollMs)
+    const tickTimer = setInterval(() => setNowSec(Math.floor(Date.now() / 1000)), 1000)
+    onCleanup(() => {
+      clearInterval(pollTimer)
+      clearInterval(tickTimer)
+    })
+  })
+
+  // Pulse animation — only runs when something is in progress
+  const hasActive = createMemo(() =>
+    (cache().runs ?? []).some((r) =>
+      r.status === "in_progress" || r.jobs.some((j) => j.status === "in_progress")
+    )
+  )
+
+  createEffect(() => {
+    if (!hasActive()) return
+    const id = setInterval(() => setPulseFrame((f) => f + 1), 500)
+    onCleanup(() => clearInterval(id))
+  })
+
+  const runs = createMemo(() => filterRuns(cache().runs, props.hide))
+  const error = createMemo(() => cache().error)
+  const hasRuns = createMemo(() => runs().length > 0)
+  const overall = createMemo(() => hasRuns() ? overallStatus(runs()) : null)
+
+  const isSingleCollapsed = createMemo(() =>
+    props.collapseSingleWorkflow && runs().length === 1
+  )
+
+  function countItems(items: { status: string; conclusion: string | null }[]) {
+    const pending = items.filter((i) => i.status === "in_progress" || i.status === "queued" || i.status === "waiting").length
+    const success = items.filter((i) => i.status === "completed" && i.conclusion === "success").length
+    const failed = items.filter((i) => i.status === "completed" && i.conclusion === "failure").length
+    const skipped = items.filter((i) => i.status === "completed" && (i.conclusion === "skipped" || i.conclusion === "cancelled")).length
+    const parts: string[] = []
+    if (pending) parts.push(`${pending} pending`)
+    if (success) parts.push(`${success} passed`)
+    if (failed) parts.push(`${failed} failed`)
+    if (skipped) parts.push(`${skipped} skipped`)
+    return parts.join(", ")
+  }
+
+  const summary = createMemo(() => {
+    const all = runs()
+    if (!all.length) return ""
+    const text = isSingleCollapsed() ? countItems(all[0].jobs) : countItems(all)
+    return `(${text})`
+  })
+
+  // Global status icon: checkmark, cross, or spinner
+  const globalStatusIcon = createMemo(() => {
+    const o = overall()
+    if (!o) return { icon: "", color: "" }
+    if (o.status === "in_progress" || o.status === "queued")
+      return { icon: PULSE_FRAMES[pulseFrame() % PULSE_FRAMES.length], color: props.theme.warning }
+    if (o.status === "completed" && o.conclusion === "success")
+      return { icon: "\u2713", color: props.theme.success }
+    if (o.status === "completed" && o.conclusion === "failure")
+      return { icon: "\u2717", color: props.theme.error }
+    if (o.status === "completed" && (o.conclusion === "skipped" || o.conclusion === "cancelled"))
+      return { icon: "-", color: props.theme.textMuted }
+    return { icon: "?", color: props.theme.textMuted }
+  })
+
+  // Flat list of displayable jobs for single-collapsed mode
+  const flatJobs = createMemo(() => {
+    if (!hasRuns() || collapsed() || !isSingleCollapsed()) return []
+    return runs()[0]?.jobs ?? []
+  })
+
+  // Runs to display in multi-workflow mode
+  const displayRuns = createMemo(() => {
+    if (!hasRuns() || collapsed() || isSingleCollapsed()) return []
+    return runs()
+  })
+
+  // Status messages as a computed array (empty = no node rendered)
+  const statusMessages = createMemo(() => {
+    if (error()) return [{ text: ` ${error()}`, color: props.theme.error }]
+    if (!hasRuns()) return [{ text: " waiting...", color: props.theme.textMuted }]
+    return [] as { text: string; color: any }[]
+  })
+
+  return (
+    <box flexDirection="column" gap={0}>
+      <box flexDirection="row" width="100%" gap={0} onMouseDown={() => hasRuns() && setCollapsed((c) => !c)}>
+        <text flexGrow={1} fg={props.theme.text}>
+          <Show when={hasRuns()} fallback={<b>CI</b>}>
+            <span>
+              {collapsed() ? "▶" : "▼"}{" "}<b>CI</b>
+              <span style={{ fg: props.theme.textMuted }}>
+                {" "}{summary()}
+              </span>
+            </span>
+          </Show>
+        </text>
+        <Show when={hasRuns()}>
+          <text fg={globalStatusIcon().color}>{globalStatusIcon().icon}</text>
+        </Show>
+      </box>
+      <Index each={statusMessages()}>
+        {(msg) => <text fg={msg().color}>{msg().text}</text>}
+      </Index>
+      <Index each={flatJobs()}>
+        {(job) => {
+          const elapsed = () => getJobElapsed(job(), nowSec())
+          const isJobActive = () => job().status === "in_progress"
+          const jobDot = () => isJobActive() ? PULSE_FRAMES[pulseFrame() % PULSE_FRAMES.length] : DOT
+          return (
+            <box flexDirection="row" width="100%" gap={0}>
+              <text flexGrow={1}>
+                <span style={{ fg: dotColor(props.theme, job().status, job().conclusion) }}>
+                  {jobDot()}
+                </span>
+                <span style={{ fg: props.theme.text }}>
+                  {" "}{truncate(job().name, 28)}
+                </span>
+              </text>
+              <Show when={elapsed()}>
+                <text fg={props.theme.textMuted}>{elapsed()}</text>
+              </Show>
+            </box>
+          )
+        }}
+      </Index>
+      <For each={displayRuns()}>
+        {(run) => (
+          <WorkflowRow
+            run={run}
+            theme={props.theme}
+            nowSec={nowSec()}
+            pulseFrame={pulseFrame()}
+            expanded={isRunExpanded(run.id)}
+            onToggle={() => toggleRun(run.id)}
+          />
+        )}
+      </For>
+    </box>
+  )
+}
+
+// ---------------------------------------------------------------------------
+// Plugin entry
+// ---------------------------------------------------------------------------
+
+const tui: TuiPlugin = async (api, options) => {
+  const opts = parseOptions(options)
+  if (!opts.enabled) return
+
+  api.slots.register({
+    order: 350,
+    slots: {
+      sidebar_content(ctx) {
+        return <CICard api={api} theme={ctx.theme.current} tuiPollMs={opts.tui_poll_ms} hide={opts.hide} collapseSingleWorkflow={opts.collapse_single_workflow} />
+      },
+    },
+  })
+}
+
+const plugin: TuiPluginModule & { id: string } = {
+  id: PLUGIN_ID,
+  tui,
+}
+
+export default plugin