@zinn-dev/opencode 0.0.0-stage → 0.1.0

package/pkg/sidebar.tsx

@@ -0,0 +1,543 @@
+/** @jsxImportSource @opentui/solid */
+import type { JSX } from "@opentui/solid";
+import type { PanelSnapshot } from "./commands.ts";
+import type { InspectorOptions } from "./options.ts";
+import type { DisplayRow } from "./rows.ts";
+import type { ScanCache } from "./scan.ts";
+import type { Ctx, Loaded, Scan, TaskSummary } from "./types.ts";
+
+import {
+  For,
+  Show,
+  createEffect,
+  createMemo,
+  createSignal,
+  onCleanup,
+  onMount,
+  untrack,
+} from "solid-js";
+
+import { clearPanel, publishPanel } from "./commands.ts";
+import { Overflow, Row } from "./components.tsx";
+import {
+  BOARD_TTL_MS,
+  errorText,
+  flaggedFor,
+  loadKeyMap,
+  log,
+  refreshKeyMap,
+  shouldReadBoard,
+} from "./data.ts";
+import { openDetail, openPicker } from "./dialogs.tsx";
+import {
+  MARKER_COLUMNS,
+  PRIORITY_COLUMNS,
+  RAIL_COLUMNS,
+  RUNNING_FRAMES,
+  RUNNING_INTERVAL,
+  SECTION_ROWS,
+  SLOT_COLUMNS,
+} from "./options.ts";
+import { columnGlyph, rowTone, stableRows, truncate } from "./rows.ts";
+import { mentionCounts, newestIdleID, scanSession } from "./scan.ts";
+import {
+  PROBE_CONCURRENCY,
+  activityProbesSupported,
+  disableActivityProbes,
+  probeAnySession,
+  probeSessions,
+  runPool,
+  sessionRunning,
+} from "./session.ts";
+import { inspectorTheme } from "./theme.ts";
+
+export function Sidebar(props: {
+  ctx: Ctx;
+  sessionID: string;
+  options: InspectorOptions;
+}): JSX.Element {
+  const theme = () => inspectorTheme(props.ctx);
+  const [map, setMap] = createSignal<Loaded<Map<string, TaskSummary>>>({
+    ok: false,
+    error: "Zinn unavailable",
+  });
+  const [loading, setLoading] = createSignal(true);
+  const [boardSeq, setBoardSeq] = createSignal(0);
+  let alive = true;
+  let probeCycle = 0;
+  const [baselineReady, setBaselineReady] = createSignal(false);
+  let lastIdleID: string | undefined;
+  let lastBoardReadAt = 0;
+  let lastBoardReadZinn = 0;
+  const apply = (result: Loaded<Map<string, TaskSummary>>, reason: string) => {
+    if (!alive) {
+      return;
+    }
+
+    if (result.ok) {
+      log(props.ctx, "board keys loaded", { reason, keys: result.value.size });
+    } else {
+      log(props.ctx, "board keys failed", { reason, error: result.error });
+    }
+
+    setMap(result);
+    setLoading(false);
+    setBoardSeq((n) => n + 1);
+    if (result.ok) {
+      lastBoardReadAt = Date.now();
+      lastBoardReadZinn = untrack(() => scan().zinnCommands);
+    }
+  };
+  // Merge overlapping refresh requests into one read.
+  let refreshInflight: Promise<void> | undefined;
+  const refresh = (reason: string, showLoading: boolean, forceLabels = false): Promise<void> => {
+    if (!alive) {
+      return Promise.resolve();
+    }
+
+    if (refreshInflight !== undefined) {
+      return refreshInflight;
+    }
+
+    const run = (async () => {
+      if (showLoading) {
+        setLoading(true);
+      }
+
+      try {
+        await props.ctx.data.session.message.sync(props.sessionID);
+      } catch (error) {
+        log(props.ctx, "message sync failed", { reason, error: errorText(error) });
+      }
+
+      if (!alive) {
+        return;
+      }
+
+      const zinnTotal = untrack(() => scan().zinnCommands);
+      const msSinceRead = Date.now() - lastBoardReadAt;
+      const force = reason !== "turn ended";
+      if (
+        !shouldReadBoard({
+          force,
+          zinnTotal,
+          lastReadZinn: lastBoardReadZinn,
+          msSinceRead,
+          ttl: BOARD_TTL_MS,
+        })
+      ) {
+        log(props.ctx, "board read skipped", {
+          reason,
+          zinnTotal,
+          lastReadZinn: lastBoardReadZinn,
+          msSinceRead,
+        });
+        if (showLoading) {
+          setLoading(false);
+        }
+        return;
+      }
+      const result = await refreshKeyMap(forceLabels);
+      apply(result, reason);
+    })().finally(() => {
+      if (refreshInflight === run) {
+        refreshInflight = undefined;
+      }
+    });
+    refreshInflight = run;
+    return run;
+  };
+  const reload = () => {
+    void refresh("header click", true, true);
+  };
+  onMount(() => {
+    log(props.ctx, "sidebar mounted", { session: props.sessionID });
+    onCleanup(() => {
+      alive = false;
+      probeCycle += 1;
+      clearPanel(published);
+    });
+    void (async () => {
+      try {
+        await props.ctx.data.session.message.sync(props.sessionID);
+      } catch (error) {
+        log(props.ctx, "message sync failed", { reason: "mount", error: errorText(error) });
+      }
+      if (!alive) {
+        return;
+      }
+      lastIdleID = newestIdleID(props.ctx.data.session.message.list(props.sessionID));
+      setBaselineReady(true);
+      const result = await loadKeyMap();
+      apply(result, "mount");
+    })();
+  });
+
+  createEffect(() => {
+    if (!baselineReady()) {
+      return;
+    }
+    const newest = newestIdleID(props.ctx.data.session.message.list(props.sessionID));
+    if (newest === undefined || newest === lastIdleID) {
+      return;
+    }
+    lastIdleID = newest;
+    void refresh("turn ended", false);
+  });
+
+  const running = () => sessionRunning(props.ctx, props.sessionID);
+  const [frame, setFrame] = createSignal(0);
+
+  createEffect(() => {
+    void props.ctx.data.session.message.list(props.sessionID).length;
+    if (props.options.current !== "glyph" || !running()) {
+      setFrame(0);
+      return;
+    }
+
+    const timer = setInterval(() => {
+      if (!running()) {
+        clearInterval(timer);
+        setFrame(0);
+        return;
+      }
+      setFrame((current) => (current + 1) % RUNNING_FRAMES.length);
+    }, RUNNING_INTERVAL);
+    onCleanup(() => clearInterval(timer));
+  });
+  const scanCache: ScanCache = { byID: new Map(), computes: 0 };
+  const scan = createMemo<Scan>(() => {
+    const loaded = map();
+    if (!loaded.ok) {
+      return {
+        known: [],
+        unknown: [],
+        tokens: 0,
+        textParts: 0,
+        streamingParts: 0,
+        zinnCommands: 0,
+        ms: 0,
+      };
+    }
+    const result = scanSession(props.ctx, props.sessionID, loaded.value, scanCache);
+    const flagged = flaggedFor(props.sessionID);
+    for (const mention of result.unknown) {
+      flagged.add(mention.key);
+    }
+    return result;
+  });
+  let lastScanSig = "";
+  createEffect(() => {
+    const result = scan();
+    const sig = `${result.tokens}|${result.textParts}|${result.streamingParts}|${result.known.map((m) => m.key).join(",")}`;
+    if (sig === lastScanSig) {
+      return;
+    }
+
+    lastScanSig = sig;
+    log(props.ctx, "scan", {
+      tokens: result.tokens,
+      known: result.known.length,
+      unknown: result.unknown.length,
+      unknownKeys: result.unknown.map((m) => m.key),
+      textParts: result.textParts,
+      streamingParts: result.streamingParts,
+      ms: result.ms,
+    });
+  });
+  const createdKeys = createMemo<ReadonlySet<string>>(() => {
+    const loaded = map();
+    if (!loaded.ok) {
+      return new Set<string>();
+    }
+
+    const flagged = flaggedFor(props.sessionID);
+    const out = new Set<string>();
+
+    for (const key of flagged) {
+      if (loaded.value.has(key)) {
+        out.add(key);
+      }
+    }
+    return out;
+  });
+
+  const [mineKeyMap, setMineKeyMap] = createSignal<ReadonlyMap<string, boolean>>(new Map());
+  let lastProbeSig = "";
+  let lastSessionsSig = "";
+
+  createEffect(() => {
+    if (!activityProbesSupported) {
+      return;
+    }
+    if (props.options.current === "off") {
+      return;
+    }
+    const sessions = probeSessions(props.ctx, props.sessionID);
+    const sessionsSig = sessions.join(",");
+    if (sessionsSig !== lastSessionsSig) {
+      lastSessionsSig = sessionsSig;
+      log(props.ctx, "current-session probe set", { sessions });
+    }
+    const keys = visibleKnown().map((row) => row.key);
+    const sig = `${sessionsSig}|${boardSeq()}|${keys.join(",")}`;
+    if (sig === lastProbeSig) {
+      return;
+    }
+    lastProbeSig = sig;
+    // Activity matches persist for this session family. Recheck only unmarked tasks.
+    const marked = untrack(() => mineKeyMap());
+    const pending = keys.filter((key) => marked.get(key) !== true);
+    const cycle = ++probeCycle;
+    if (pending.length === 0) {
+      return;
+    }
+    // Keep existing marks while new reads settle, avoiding transient blank states.
+    const settled = new Map<string, boolean>();
+    for (const [key, value] of marked) {
+      if (value === true) {
+        settled.set(key, true);
+      }
+    }
+    let degraded = false;
+    void runPool(
+      pending,
+      PROBE_CONCURRENCY,
+      async (key) => {
+        const probe = await probeAnySession(sessions, key);
+        if (!alive || cycle !== probeCycle) {
+          return;
+        }
+        if (probe.unsupported) {
+          degraded = true;
+          return;
+        }
+        if (probe.mine) {
+          if (settled.get(key) === true) {
+            return;
+          }
+          settled.set(key, true);
+        } else {
+          if (settled.get(key) !== true) {
+            return;
+          }
+          settled.delete(key);
+        }
+        setMineKeyMap(new Map(settled));
+      },
+      () => !alive || cycle !== probeCycle,
+    ).then(() => {
+      if (!alive || cycle !== probeCycle) {
+        return;
+      }
+      log(props.ctx, "activity probes settled", { matches: [...settled.keys()] });
+      if (!degraded) {
+        return;
+      }
+      disableActivityProbes();
+      log(
+        props.ctx,
+        "Zinn rejected the activity session filter. The current-session mark requires Zinn 0.41.0 or newer.",
+        { sessions },
+      );
+    });
+  });
+  const knownRowCache = new Map<string, DisplayRow>();
+  const unknownRowCache = new Map<string, DisplayRow>();
+
+  const knownRows = createMemo<DisplayRow[]>(() => {
+    const loaded = map();
+    const created = createdKeys();
+    const mineKeys = mineKeyMap();
+    const candidates = scan().known.map((mention): DisplayRow => {
+      const summary = loaded.ok ? loaded.value.get(mention.key) : undefined;
+      const isCreated = created.has(mention.key);
+      const column = summary?.column ?? "";
+      const priority = summary?.priority ?? null;
+      const labels = summary?.labels ?? [];
+      const mine = mineKeys.get(mention.key) === true;
+      return {
+        key: mention.key,
+        title: summary?.title ?? "",
+        priority,
+        labels,
+        column,
+        glyph: isCreated ? "+" : columnGlyph(summary?.column ?? ""),
+        tone: rowTone(column, false, isCreated),
+        unknown: false,
+        created: isCreated,
+        mine,
+      };
+    });
+    return stableRows(knownRowCache, candidates);
+  });
+  const unknownRows = createMemo<DisplayRow[]>(() => {
+    const candidates = scan().unknown.map(
+      (mention): DisplayRow => ({
+        key: mention.key,
+        title: "",
+        glyph: "⚠",
+        tone: "warning",
+        unknown: true,
+        created: false,
+        mine: false,
+        priority: null,
+        labels: [],
+        column: "",
+      }),
+    );
+    return stableRows(unknownRowCache, candidates);
+  });
+  const mentionCountsByKey = createMemo(() => mentionCounts(scan().known));
+  const open = (key: string, unknown: boolean) =>
+    openDetail(props.ctx, key, unknown, mentionCountsByKey().get(key));
+  const visibleKnown = createMemo(() => knownRows().slice(0, SECTION_ROWS));
+  const knownOverflow = createMemo(() => knownRows().length - visibleKnown().length);
+  const visibleUnknown = createMemo(() => unknownRows().slice(0, SECTION_ROWS));
+  const unknownOverflow = createMemo(() => unknownRows().length - visibleUnknown().length);
+  const contentIndent = () => RAIL_COLUMNS + (props.options.current === "glyph" ? 1 : 0) + 1;
+  const titleColumns = createMemo(() => {
+    const rows = [...visibleKnown(), ...visibleUnknown()];
+    let key = 0;
+    for (const row of rows) {
+      key = Math.max(key, row.key.length);
+    }
+    const gaps = props.options.rows === 2 ? 3 : 4;
+    const priority = props.options.rows === 2 ? 0 : PRIORITY_COLUMNS;
+    return Math.max(8, SLOT_COLUMNS - RAIL_COLUMNS - MARKER_COLUMNS - priority - key - gaps);
+  });
+  const metaColumns = Math.max(8, SLOT_COLUMNS - RAIL_COLUMNS - MARKER_COLUMNS);
+  let published: PanelSnapshot | undefined;
+  createEffect(() => {
+    const loaded = map();
+    published = {
+      map: loaded.ok ? loaded.value : undefined,
+      known: scan().known,
+    };
+    publishPanel(published);
+  });
+  const headerDetail = createMemo(() => {
+    if (loading()) {
+      return "loading…";
+    }
+    const loaded = map();
+    if (!loaded.ok) {
+      return truncate(loaded.error, 32);
+    }
+    const count = loaded.value.size;
+    return `${count} ${count === 1 ? "task" : "tasks"}`;
+  });
+  const failure = createMemo(() => {
+    if (loading()) {
+      return undefined;
+    }
+    const loaded = map();
+    return loaded.ok ? undefined : loaded.error;
+  });
+  const knownKeys = () => scan().known.map((mention) => mention.key);
+  const unknownKeys = () => scan().unknown.map((mention) => mention.key);
+  const knownPicker = () => {
+    const loaded = map();
+    openPicker(
+      props.ctx,
+      "Zinn | keys in this chat",
+      knownKeys(),
+      loaded.ok ? loaded.value : undefined,
+      false,
+      mentionCountsByKey(),
+    );
+  };
+  const unknownPicker = () => {
+    const loaded = map();
+    openPicker(
+      props.ctx,
+      "Zinn | unknown keys in this chat",
+      unknownKeys(),
+      loaded.ok ? loaded.value : undefined,
+      true,
+      mentionCountsByKey(),
+    );
+  };
+
+  return (
+    <box flexDirection="column">
+      <box flexDirection="row" gap={1} paddingLeft={contentIndent()} onMouseDown={reload}>
+        <text fg={theme().text}>
+          <b>ZINN</b>
+        </text>
+        <text fg={theme().textMuted}>[{headerDetail()}]</text>
+      </box>
+      <Show when={failure()}>
+        <text fg={theme().error}>{truncate(failure() ?? "", 40)}</text>
+      </Show>
+      <Show when={!loading() && map().ok && knownRows().length === 0 && unknownRows().length === 0}>
+        <text fg={theme().textMuted}>no task keys in this chat</text>
+      </Show>
+      <For each={visibleKnown()}>
+        {(row, index) => (
+          <>
+            <Show when={props.options.rows === 2 && index() > 0}>
+              <box
+                height={1}
+                borderStyle="single"
+                border={["top"]}
+                borderColor={theme().borderSubtle}
+                marginLeft={contentIndent()}
+              />
+            </Show>
+            <Row
+              ctx={props.ctx}
+              row={row}
+              titleColumns={titleColumns()}
+              metaColumns={metaColumns}
+              dense={props.options.rows === 2}
+              current={props.options.current}
+              markGlyph={
+                props.options.current === "glyph" && row.mine && running()
+                  ? RUNNING_FRAMES[frame() % RUNNING_FRAMES.length]
+                  : undefined
+              }
+              onOpen={() => open(row.key, row.unknown)}
+            />
+          </>
+        )}
+      </For>
+      <Show when={knownOverflow() > 0}>
+        <Overflow ctx={props.ctx} count={knownOverflow()} label="more" onOpen={knownPicker} />
+      </Show>
+      <Show when={createdKeys().size > 0}>
+        <text fg={theme().info}>{`+ created this session (${createdKeys().size})`}</text>
+      </Show>
+      <Show when={unknownRows().length > 0}>
+        <text fg={theme().warning}>unknown keys (not in store)</text>
+        <For each={visibleUnknown()}>
+          {(row) => (
+            <Row
+              ctx={props.ctx}
+              row={row}
+              titleColumns={titleColumns()}
+              metaColumns={metaColumns}
+              dense={props.options.rows === 2 && !row.unknown}
+              current={props.options.current}
+              onOpen={() => open(row.key, row.unknown)}
+            />
+          )}
+        </For>
+        <Show when={unknownOverflow() > 0}>
+          <Overflow
+            ctx={props.ctx}
+            count={unknownOverflow()}
+            label="more unknown"
+            onOpen={unknownPicker}
+          />
+        </Show>
+      </Show>
+
+      <Show when={!loading() && map().ok && knownRows().length + unknownRows().length > 0}>
+        <box paddingLeft={contentIndent()}>
+          <text fg={theme().textMuted}>recent mentions</text>
+        </box>
+      </Show>
+    </box>
+  );
+}

package/pkg/theme.ts

@@ -0,0 +1,51 @@
+import type { RGBA } from "@opentui/core";
+import type { RowTone } from "./rows.ts";
+import type { Ctx } from "./types.ts";
+
+export type InspectorTheme = {
+  text: RGBA;
+  textMuted: RGBA;
+  error: RGBA;
+  warning: RGBA;
+  success: RGBA;
+  info: RGBA;
+  borderSubtle: RGBA;
+  backgroundElement: RGBA;
+  accent: RGBA;
+};
+// Alpha suffixes for tinted backgrounds: about 10% at rest and 20% when active.
+export const TINT_ALPHA_SUBTLE = "1a";
+export const TINT_ALPHA_STRONG = "33";
+
+// Read theme values inside a reactive computation so theme changes repaint.
+export function inspectorTheme(ctx: Ctx): InspectorTheme {
+  const t = ctx.theme;
+  return {
+    text: t.text.base,
+    textMuted: t.text.muted,
+    error: t.text.feedback.error.base,
+    warning: t.text.feedback.warning.base,
+    success: t.text.feedback.success.base,
+    info: t.text.feedback.info.base,
+    borderSubtle: t.border.base,
+    backgroundElement: t.background.raised.high,
+    accent: t.text.action.primary.base,
+  };
+}
+
+export function toneColor(ctx: Ctx, tone: () => RowTone): () => RGBA {
+  const theme = () => inspectorTheme(ctx);
+  return () => {
+    const value = tone();
+    if (value === "warning" || value === "blocked") {
+      return theme().warning;
+    }
+    if (value === "created") {
+      return theme().info;
+    }
+    if (value === "done") {
+      return theme().success;
+    }
+    return theme().text;
+  };
+}

package/pkg/tui.tsx

@@ -0,0 +1,32 @@
+/** @jsxImportSource @opentui/solid */
+import { Plugin } from "@opencode/plugin/tui";
+
+import { registerCommands } from "./commands.ts";
+import { errorText, log } from "./data.ts";
+import { readOptions } from "./options.ts";
+import { Sidebar } from "./sidebar.tsx";
+
+const tui = Plugin.define({
+  id: "zinn.tasks",
+  setup(ctx) {
+    const settings = readOptions(ctx.options);
+    log(ctx, "plugin options", {
+      rows: settings.rows,
+      raw: ctx.options === undefined ? null : "present",
+    });
+    registerCommands(ctx);
+    try {
+      log(ctx, "keymap commands", { ids: ctx.keymap.commands().map((c) => c.id) });
+    } catch (error) {
+      log(ctx, "keymap commands failed", { error: errorText(error) });
+    }
+    const dispose = ctx.ui.slot({
+      append: "sidebar.content",
+      render: (input) => <Sidebar ctx={ctx} sessionID={input.sessionID} options={settings} />,
+    });
+    return () => {
+      dispose();
+    };
+  },
+});
+export default tui;

package/pkg/types.ts

@@ -0,0 +1,66 @@
+import type { Plugin } from "@opencode/plugin/tui";
+
+export type Ctx = Plugin.Context;
+export type TaskSummary = {
+  key: string;
+  title: string;
+  status: string;
+  column: string;
+  priority: string | null;
+  labels: string[];
+};
+export type Relation = {
+  type: string;
+  direction: string;
+  task: {
+    key: string;
+    title: string;
+    status: string;
+  };
+};
+export type TaskDetail = {
+  key: string;
+  title: string;
+  status: string;
+  column: string;
+  priority: string | null;
+  labels: string[];
+  relations: Relation[];
+  comments: number;
+  description: string;
+};
+export type Loaded<T> =
+  | {
+      ok: true;
+      value: T;
+    }
+  | {
+      ok: false;
+      error: string;
+      code?: string;
+    };
+export type Mention = {
+  key: string;
+  count: number;
+};
+export type Scan = {
+  known: Mention[];
+  unknown: Mention[];
+  tokens: number;
+  textParts: number;
+  streamingParts: number;
+  zinnCommands: number;
+  ms: number;
+};
+export type DetailState =
+  | {
+      kind: "loading";
+    }
+  | {
+      kind: "ready";
+      detail: TaskDetail;
+    }
+  | {
+      kind: "error";
+      error: string;
+    };