@cortexkit/opencode-magic-context 0.42.5 → 0.43.0

package/src/v2/tui/sidebar-fallback.test.ts

@@ -0,0 +1,100 @@
+/**
+ * The v2 sidebar has two arms: the real OpenCode 1 component, and a plain-text
+ * projection for a host that registers no OpenTUI runtime modules. The real
+ * host lane proves the first arm paints. This file forces the second one and
+ * pins why it is reachable, so the fallback cannot quietly become dead code —
+ * or, worse, quietly become the arm every user gets because a genuine defect
+ * was mistaken for a missing runtime.
+ *
+ * Bare Bun is exactly that no-registry host: nothing registers the
+ * `opentui:runtime-module:*` virtual modules, so the compiled component's
+ * imports do not resolve here.
+ */
+import { expect, test } from "bun:test";
+import { setupWithJsx, sidebarText } from "./index";
+import { loadCompiledSidebar } from "./load-compiled-sidebar.mjs";
+import { isMissingOpenTuiRuntime, mountV1Sidebar } from "./sidebar-mount";
+import type { V2SlotClaim, V2TuiContext } from "./types";
+
+function fixture() {
+    const claims: V2SlotClaim[] = [];
+    const context: V2TuiContext = {
+        location: { directory: process.cwd() },
+        renderer: { requestRender() {} },
+        data: {
+            listen: () => () => {},
+            location: { default: () => ({ directory: process.cwd() }) },
+        },
+        keymap: { layer: () => {} },
+        storage: {
+            memory: <Value extends object>(_key: string, options: { initial: Value }) =>
+                [
+                    options.initial,
+                    (mutation: (draft: Value) => void) => mutation(options.initial),
+                ] as const,
+        },
+        ui: {
+            router: { current: () => ({ type: "session", sessionID: "ses-fallback" }) },
+            slot: (claim) => {
+                claims.push(claim);
+                return () => {};
+            },
+            toast: { show() {} },
+            dialog: {
+                async alert() {},
+                async confirm() {
+                    return false;
+                },
+            },
+        },
+    };
+    return { context, claims };
+}
+
+test("the compiled sidebar cannot load without the host's OpenTUI runtime registry", async () => {
+    const error = await loadCompiledSidebar().then(
+        () => undefined,
+        (reason: unknown) => reason,
+    );
+    // If this ever resolves, the fallback arm below is unreachable and the test
+    // that forces it is measuring nothing.
+    expect(error).toBeDefined();
+    expect(String((error as Error).message)).toContain("opentui:runtime-module:");
+    expect(isMissingOpenTuiRuntime(error)).toBe(true);
+});
+
+test("only a missing runtime registry counts as the fallback condition", () => {
+    expect(isMissingOpenTuiRuntime(new Error("Cannot find package 'left-pad'"))).toBe(false);
+    expect(isMissingOpenTuiRuntime(new Error("boom"))).toBe(false);
+    // A real defect inside the component would arrive as an ordinary error and
+    // must reach the host instead of degrading the sidebar to text.
+    expect(
+        isMissingOpenTuiRuntime(
+            new TypeError("undefined is not a function (opentui:runtime-module:)"),
+        ),
+    ).toBe(false);
+});
+
+test("mountV1Sidebar reports the missing registry as null instead of throwing", async () => {
+    const { context } = fixture();
+    expect(await mountV1Sidebar(context, process.cwd())).toBeNull();
+});
+
+test("the sidebar.content claim renders the text projection when the component cannot mount", async () => {
+    const { context, claims } = fixture();
+    const cleanup = await setupWithJsx(context, (type, props) => ({ type, props }));
+    try {
+        const claim = claims.find((entry) => entry.append === "sidebar.content");
+        if (claim?.append !== "sidebar.content") throw new Error("expected the sidebar claim");
+        // Spelled out rather than computed from sidebarText: an expectation
+        // built by the same function as the value under test agrees with it
+        // however wrong both are.
+        expect(claim.render({ sessionID: "ses-fallback" })).toEqual({
+            type: "text",
+            props: { children: "Magic Context · loading…" },
+        });
+        expect(sidebarText(undefined)).toBe("Magic Context · loading…");
+    } finally {
+        cleanup();
+    }
+});

package/src/v2/tui/sidebar-mount.ts

@@ -0,0 +1,164 @@
+/**
+ * Mounts the OpenCode 1 sidebar component on the OpenCode 2 `sidebar.content`
+ * slot, so both host generations render the same sidebar from the same
+ * RPC-backed data layer.
+ *
+ * The component itself is loaded from `src/tui-compiled/`, the Solid-transformed
+ * copy of `src/tui/` produced by `scripts/build-tui.ts`. Two properties of that
+ * copy are what make it usable here:
+ *
+ *  - OpenCode's bundler plugin skips the Solid compile-time transform for files
+ *    under `node_modules`, which is where an installed plugin lives. The raw
+ *    `.tsx` source would therefore evaluate its JSX children once and freeze on
+ *    the first paint; the precompiled copy has the transform already applied.
+ *  - Its runtime imports name the `opentui:runtime-module:*` virtual modules
+ *    that OpenCode registers process-wide, so the component binds the host's
+ *    single Solid/OpenTUI runtime instead of loading a second copy out of this
+ *    package. Two Solid instances in one process do not share reactive
+ *    ownership, and the renderables would not belong to the host's tree.
+ */
+import { eventSessionID } from "./events";
+import {
+    type CompiledSidebarComponent,
+    type CompiledSidebarData,
+    loadCompiledSidebar,
+    type V1SidebarApi,
+    type V1Theme,
+} from "./load-compiled-sidebar.mjs";
+import type { V2ResolvedTheme, V2TuiContext } from "./types";
+
+export interface V1SidebarMount {
+    /** Renders the v1 component for one paint of the v2 `sidebar.content` slot. */
+    render(input: { readonly sessionID: string }): unknown;
+    /** Asks the mounted component to fetch a snapshot now, out of band. */
+    refresh(): void;
+    dispose(): void;
+}
+
+/**
+ * Colour tokens moved between host generations: OpenCode 1 handed the sidebar a
+ * flat table (`theme.accent`, `theme.textMuted`, …) while OpenCode 2 resolves a
+ * token tree (`@opencode/theme/tui` `ResolvedThemeTokens`: `text.base`,
+ * `text.muted`, `text.feedback.error.base`, `hue.accent[500]`, …). This maps
+ * the eight tokens the sidebar reads. A token the host does not resolve falls
+ * back to a colour chosen for the host's theme mode: an earlier fallback of
+ * white text painted the section headers white-on-white on light themes when
+ * the mapping read key names the theme package never had.
+ *
+ * The accent is read at hue step 200, the step the host draws its own accent
+ * UI in. The ramp is ordered by distance from the page, not by lightness, so
+ * step 200 stays a readable accent in both modes (captured GA host: #9d7cd8 on
+ * #0a0a0a dark, #d68c27 on #ffffff light) where step 500 resolved to a dark
+ * purple on the dark page and a pale orange on the light one.
+ */
+export function flattenTheme(
+    theme: V2ResolvedTheme | undefined,
+    mode: "dark" | "light" = "dark",
+): V1Theme {
+    const light = mode === "light";
+    const feedback = theme?.text?.feedback;
+    return {
+        text: theme?.text?.base ?? (light ? "#1a1a1a" : "#ffffff"),
+        textMuted: theme?.text?.muted ?? (light ? "#6b6b6b" : "#9a9a9a"),
+        accent: theme?.hue?.accent?.[200] ?? "#5f87ff",
+        background: theme?.background?.base ?? (light ? "#ffffff" : "#000000"),
+        borderActive: theme?.border?.base ?? "#9a9a9a",
+        error: feedback?.error?.base ?? "#d13b3b",
+        warning: feedback?.warning?.base ?? "#c77d1a",
+        success: feedback?.success?.base ?? "#2e9a4e",
+    };
+}
+
+/**
+ * True when the import failed because the host does not register the OpenTUI
+ * runtime modules. That is the only failure this module is allowed to answer
+ * with the plain-text fallback; anything else is a real defect and rethrows.
+ */
+export function isMissingOpenTuiRuntime(error: unknown): boolean {
+    const message = error instanceof Error ? error.message : String(error);
+    return (
+        message.includes("opentui:runtime-module:") &&
+        /Cannot find|Could not resolve|Module not found|Unable to resolve/.test(message)
+    );
+}
+
+function createV1Api(context: V2TuiContext, directory: string): V1SidebarApi {
+    return {
+        state: { path: { directory } },
+        renderer: { requestRender: () => context.renderer.requestRender() },
+        event: {
+            // OpenCode 1's event names ("message.updated", "session.updated",
+            // "message.removed") do not exist on OpenCode 2, whose stream uses
+            // "session.status", "session.idle", "session.step.ended" and so on.
+            // Rather than guess a per-name mapping that would silently stop
+            // updating when the host renames an event, every subscription is fed
+            // every v2 event that carries a session id, projected into the v1
+            // shape. The component debounces its refresh, so the three
+            // subscriptions collapse into one fetch.
+            on: (_type, handler) =>
+                context.data.listen(({ details }) => {
+                    const sessionID = eventSessionID(details);
+                    if (!sessionID) return;
+                    handler({
+                        properties: { sessionID, info: { id: sessionID, sessionID } },
+                    });
+                }),
+        },
+    };
+}
+
+/**
+ * Loads and mounts the v1 sidebar, or returns `null` when the host provides no
+ * OpenTUI runtime registry to load it through.
+ */
+export async function mountV1Sidebar(
+    context: V2TuiContext,
+    directory: string,
+): Promise<V1SidebarMount | null> {
+    let compiled: CompiledSidebarComponent;
+    let data: CompiledSidebarData;
+    try {
+        ({ component: compiled, data } = await loadCompiledSidebar());
+    } catch (error) {
+        if (!isMissingOpenTuiRuntime(error)) throw error;
+        return null;
+    }
+
+    // The compiled tree carries its own copy of the RPC data layer, so its
+    // client has to be initialised separately from the one `setupWithJsx`
+    // creates for the status/recomp dialogs. Without this the component's
+    // fetches return the empty snapshot and every row reads zero.
+    data.initRpcClient(directory);
+
+    const slot = compiled.createSidebarContentSlot(createV1Api(context, directory));
+    return {
+        render: (input) =>
+            slot.slots.sidebar_content(
+                {
+                    // Read through a getter so a theme change repaints: the
+                    // component wraps this in a memo, and the host's theme is a
+                    // reactive store.
+                    get theme() {
+                        return {
+                            get current() {
+                                return flattenTheme(context.theme, context.themeMode);
+                            },
+                        };
+                    },
+                },
+                {
+                    // `input` is the slot's reactive props object; reading
+                    // `sessionID` lazily keeps the component subscribed to
+                    // session switches.
+                    get session_id() {
+                        return input.sessionID;
+                    },
+                },
+            ),
+        refresh: () => compiled.refreshSidebarSnapshot(),
+        dispose: () => {
+            slot.dispose();
+            data.closeRpc();
+        },
+    };
+}

package/src/v2/tui/sidebar-text.test.ts

@@ -0,0 +1,70 @@
+import { expect, test } from "bun:test";
+import { COMPACTION_ENABLED_PATH } from "../../config/agent-disable";
+import type { SidebarSnapshot, StatusDetail } from "../../shared/rpc-types";
+import { sidebarText, statusText } from "./index";
+
+function snapshot(overrides: Partial<SidebarSnapshot>): SidebarSnapshot {
+    return {
+        sessionId: "ses-test",
+        usagePercentage: 42,
+        inputTokens: 4200,
+        contextLimit: 10000,
+        systemPromptTokens: 0,
+        compartmentCount: 3,
+        memoryCount: 7,
+        memoryBlockCount: 2,
+        pendingOpsCount: 1,
+        historianRunning: false,
+        lastTransformError: null,
+        ...overrides,
+    } as SidebarSnapshot;
+}
+
+test("compaction-off sidebar mirrors the v1 rows and native context label", () => {
+    const text = sidebarText(
+        snapshot({
+            compaction_enabled: false,
+            archivedCompartmentCount: 4,
+            sessionNoteCount: 2,
+            readySmartNoteCount: 1,
+        }),
+    );
+    expect(text).toContain("Context: 42.0% · native compaction");
+    expect(text).toContain("Memories 7");
+    expect(text).toContain("Notes 2");
+    expect(text).toContain("Archived compartments 4");
+    expect(text).toContain("Smart Notes 1 ready");
+    expect(text).not.toContain("Historian");
+});
+
+test("compaction-on sidebar keeps the historian/compartment line", () => {
+    const text = sidebarText(snapshot({ compaction_enabled: true }));
+    expect(text).toContain("Historian idle · C:3");
+    expect(text).toContain("Memories 2/7 · Q:1");
+    expect(text).not.toContain("native compaction");
+});
+
+test("status dialog prefixes the compaction-off notice", () => {
+    const detail = {
+        ...snapshot({ compaction_enabled: false }),
+    } as unknown as StatusDetail;
+    expect(statusText(detail)).toContain(
+        `Compaction: disabled (${COMPACTION_ENABLED_PATH}: false) — native compaction owns the context window.`,
+    );
+    expect(statusText({ ...detail, compaction_enabled: true } as StatusDetail)).not.toContain(
+        "Compaction: disabled",
+    );
+});
+
+test("OpenCode 2 status reports the live config generation and parse failure", () => {
+    const detail = {
+        ...snapshot({}),
+        configGeneration: 4,
+        configAdoptedAt: 1730000000000,
+        configReloadFailure: { path: "/tmp/magic-context.jsonc", message: "malformed" },
+    } as StatusDetail;
+    expect(statusText(detail)).toContain("Config generation: 4 (adopted ");
+    expect(statusText(detail)).toContain(
+        "Config reload failed /tmp/magic-context.jsonc: malformed",
+    );
+});

package/src/v2/tui/status-dialog-fallback.test.ts

@@ -0,0 +1,97 @@
+/**
+ * The v2 `/ctx-status` has two arms: the real OpenCode 1 dialog component, and
+ * the plain-text dialog for a host that cannot render a component. The real
+ * host lane proves the first arm paints. This file forces the second one and
+ * pins why it is reachable, so the text projection cannot quietly become dead
+ * code — or, worse, quietly become what every user gets because a genuine
+ * defect was mistaken for a missing runtime.
+ *
+ * Bare Bun is exactly that no-registry host: nothing registers the
+ * `opentui:runtime-module:*` virtual modules, so the compiled component's
+ * imports do not resolve here.
+ */
+import { expect, test } from "bun:test";
+import type { StatusDetail } from "../../shared/rpc-types";
+import { statusText } from "./index";
+import { loadCompiledStatusDialog } from "./load-compiled-status-dialog.mjs";
+import { isMissingOpenTuiRuntime } from "./sidebar-mount";
+import { mountV1StatusDialog } from "./status-dialog-mount";
+import type { V2TuiContext } from "./types";
+
+function context(dialog: Partial<V2TuiContext["ui"]["dialog"]>): V2TuiContext {
+    return {
+        location: { directory: process.cwd() },
+        renderer: { requestRender() {} },
+        data: {
+            listen: () => () => {},
+            location: { default: () => ({ directory: process.cwd() }) },
+        },
+        keymap: { layer: () => {} },
+        storage: {
+            memory: <Value extends object>(_key: string, options: { initial: Value }) =>
+                [
+                    options.initial,
+                    (mutation: (draft: Value) => void) => mutation(options.initial),
+                ] as const,
+        },
+        ui: {
+            router: { current: () => ({ type: "session", sessionID: "ses-status" }) },
+            slot: () => () => {},
+            toast: { show() {} },
+            dialog: {
+                async alert() {},
+                async confirm() {
+                    return false;
+                },
+                ...dialog,
+            },
+        },
+    };
+}
+
+test("the compiled status dialog cannot load without the host's OpenTUI runtime registry", async () => {
+    const error = await loadCompiledStatusDialog().then(
+        () => undefined,
+        (reason: unknown) => reason,
+    );
+    // If this ever resolves, the fallback arm below is unreachable and the test
+    // that forces it is measuring nothing.
+    expect(error).toBeDefined();
+    expect(String((error as Error).message)).toContain("opentui:runtime-module:");
+    expect(isMissingOpenTuiRuntime(error)).toBe(true);
+});
+
+test("mountV1StatusDialog reports the missing registry as null instead of throwing", async () => {
+    expect(await mountV1StatusDialog(context({ show: () => {} }))).toBeNull();
+});
+
+test("mountV1StatusDialog declines a host that publishes no component dialog surface", async () => {
+    expect(await mountV1StatusDialog(context({}))).toBeNull();
+});
+
+test("the text dialog carries the status a component dialog would have drawn", () => {
+    const detail = {
+        usagePercentage: 42.5,
+        inputTokens: 85_000,
+        contextLimit: 200_000,
+        historianRunning: false,
+        compartmentCount: 3,
+        memoryBlockCount: 2,
+        memoryCount: 7,
+        pendingOpsCount: 1,
+        lastTransformError: null,
+    } as StatusDetail;
+    // Spelled out rather than computed from statusText: an expectation built by
+    // the same function as the value under test agrees with it however wrong
+    // both are.
+    expect(statusText(detail)).toBe(
+        [
+            "Context: 42.5% (85K/200K tokens)",
+            "Historian: idle",
+            "Compartments: 3",
+            "Memories: 2 injected / 7 stored",
+            "Pending reductions: 1",
+            "Harness: opencode2",
+        ].join("\n"),
+    );
+});

package/src/v2/tui/status-dialog-mount.ts

@@ -0,0 +1,76 @@
+/**
+ * Mounts the OpenCode 1 `/ctx-status` dialog component on the OpenCode 2 dialog
+ * surface, so both host generations show the same status view instead of one
+ * host getting a plain-text summary of it.
+ *
+ * It is the same arrangement as `sidebar-mount.ts`, for the same reasons: the
+ * component is loaded from `src/tui-compiled/` (Solid transform already applied,
+ * runtime imports pointing at the host's `opentui:runtime-module:*` registry) so
+ * it binds the host's single Solid/OpenTUI runtime rather than a second copy out
+ * of this package.
+ *
+ * Unlike the sidebar, this component fetches nothing: the caller passes the
+ * status snapshot it already loaded over RPC, so no second data layer is
+ * initialised here.
+ */
+import type { StatusDetail } from "../../shared/rpc-types";
+import {
+    type CompiledStatusDialog,
+    loadCompiledStatusDialog,
+} from "./load-compiled-status-dialog.mjs";
+import { flattenTheme, isMissingOpenTuiRuntime } from "./sidebar-mount";
+import type { V2TuiContext } from "./types";
+
+export interface V1StatusDialogMount {
+    /** Replaces the host's dialog surface with the status view for one snapshot. */
+    show(detail: StatusDetail): void;
+}
+
+/**
+ * Loads and mounts the v1 status dialog, or returns `null` when this host
+ * cannot render it: either it publishes no component dialog surface, or it
+ * registers no OpenTUI runtime modules to load the component through. Both
+ * cases are answered by the caller's plain-text dialog.
+ */
+export async function mountV1StatusDialog(
+    context: V2TuiContext,
+): Promise<V1StatusDialogMount | null> {
+    if (typeof context.ui.dialog.show !== "function") return null;
+    let compiled: CompiledStatusDialog;
+    try {
+        compiled = await loadCompiledStatusDialog();
+    } catch (error) {
+        if (!isMissingOpenTuiRuntime(error)) throw error;
+        return null;
+    }
+    return {
+        show: (detail) => {
+            context.ui.dialog.show?.(() =>
+                compiled.StatusDialog({
+                    // Read through getters so a theme change repaints: the
+                    // component wraps this in a memo, and the host's theme is a
+                    // reactive store.
+                    get api() {
+                        return {
+                            get theme() {
+                                return {
+                                    get current() {
+                                        return flattenTheme(context.theme, context.themeMode);
+                                    },
+                                };
+                            },
+                        };
+                    },
+                    get s() {
+                        return detail;
+                    },
+                }),
+            );
+            // After `show`, which replaces the surface and resets it to the
+            // host's default width. "large" is the widest the host offers (88
+            // columns on GA 2.0.5); the component lays its sections out against
+            // whatever width it ends up with.
+            context.ui.dialog.set?.({ size: "large", centered: true });
+        },
+    };
+}

package/src/v2/tui/theme-mapping.test.ts

@@ -0,0 +1,57 @@
+import { describe, expect, it } from "bun:test";
+import captured from "./__fixtures__/ga-host-theme.json";
+import { flattenTheme } from "./sidebar-mount";
+import type { V2ResolvedTheme } from "./types";
+
+// The fixture is a recording taken off a running @opencode/cli GA host, not a
+// hand-written object: an earlier mapping read `text.default` / `text.subdued`
+// / `*.default`, names the theme package never had, and a fixture written in
+// that same invented shape agreed with the mapping while every token fell to
+// its hex fallback on the real host. A recorded shape fails instead.
+type Mode = "dark" | "light";
+const modes = captured.modes as Record<Mode, V2ResolvedTheme>;
+const rgba = (r: number, g: number, b: number) => ({ r, g, b, a: 1 });
+
+describe("OpenCode 2 theme mapping", () => {
+    for (const mode of ["dark", "light"] as const) {
+        it(`reads the host's resolved tokens on the ${mode} recording, not fallbacks`, () => {
+            const host = modes[mode];
+            const flat = flattenTheme(host, mode);
+            expect(flat.text).toEqual(host.text?.base);
+            expect(flat.textMuted).toEqual(host.text?.muted);
+            expect(flat.background).toEqual(host.background?.base);
+            expect(flat.borderActive).toEqual(host.border?.base);
+            expect(flat.error).toEqual(host.text?.feedback?.error?.base);
+            expect(flat.warning).toEqual(host.text?.feedback?.warning?.base);
+            expect(flat.success).toEqual(host.text?.feedback?.success?.base);
+            // Every mapped value must be a resolved colour object, never one of
+            // the string fallbacks: a renamed key would fall through silently.
+            for (const value of Object.values(flat)) expect(typeof value).toBe("object");
+        });
+    }
+
+    it("takes the accent from hue step 200, the step the host draws its own accent in", () => {
+        // On the recording, step 500 is a dark purple on the dark page and a pale
+        // orange on the light page; step 200 is the readable accent in both.
+        expect(flattenTheme(modes.dark, "dark").accent).toEqual(modes.dark.hue?.accent?.[200]);
+        expect(flattenTheme(modes.light, "light").accent).toEqual(modes.light.hue?.accent?.[200]);
+        expect(modes.dark.hue?.accent?.[200]).not.toEqual(modes.dark.hue?.accent?.[500]);
+    });
+
+    it("never falls back to white text on a light host", () => {
+        const flat = flattenTheme(undefined, "light");
+        expect(flat.text).not.toBe("#ffffff");
+        expect(flat.background).toBe("#ffffff");
+        expect(flattenTheme(undefined, "dark").text).toBe("#ffffff");
+    });
+
+    it("a hand-written object in the old invented shape gets fallbacks, proving the recording is load-bearing", () => {
+        const invented = {
+            text: { default: rgba(0, 0, 0), subdued: rgba(0.5, 0.5, 0.5) },
+            background: { default: rgba(1, 1, 1) },
+        } as unknown as V2ResolvedTheme;
+        const flat = flattenTheme(invented, "light");
+        expect(typeof flat.text).toBe("string");
+        expect(typeof flat.background).toBe("string");
+    });
+});