@hanzo/build 0.2.9 → 0.2.11

package/lib/api/turn.js

@@ -1,3 +1,24 @@
+/**
+ * What a run's events SAY, as text a person reads.
+ *
+ * A curated projection, never a dump: an event carries the machinery a run
+ * happened on — hosts, paths, whole file bodies — and printing it would put
+ * someone's filesystem in front of anyone who can read the run. Each kind gets a
+ * sentence built from the few fields that describe the outcome; the rest is
+ * dropped by omission, because a projection cannot leak a field it never reads.
+ *
+ * Every string here is rendered as TEXT by the transcript. Nothing is HTML.
+ *
+ * The coding plane's vocabulary (apps/coding): `status` for a lifecycle move
+ * (started, routed, done, error, stopped, paused), `tool-call` for a step,
+ * `log` for a free line. A person's steering is a `control` {command, message}.
+ *
+ * `cards` is the transcript as it is drawn: the run's steps, and the agent's own
+ * output read by what each part is (harness.ts). The output a card shows is what
+ * the run's Terminal log already prints; a command's working directory, which is
+ * the sandbox's layout, is dropped.
+ */
+import { harness } from './harness.js';
 const str = (v) => (typeof v === 'string' ? v : '');
 /** The payload as an object. A live frame may carry it as a JSON string. */
 export function decode(payload) {
@@ -34,8 +55,11 @@ function status(b, mode) {
             // A plan's answer IS its final status: the run read and wrote nothing.
             // Whether the run planned is the RECORD's word — any member of the org
             // can append an event saying `mode: plan`, and its text is not an answer.
+            // A setup is a plan put to one question, and answers the same way.
             if (mode === 'plan')
                 return str(b.plan) || 'Planned — the run answered with no plan';
+            if (mode === 'setup')
+                return str(b.plan) || 'Set up — the run answered with no environment';
             if (b.changed === false)
                 return 'Done — nothing to change';
             const pr = str(b.pr);
@@ -47,7 +71,10 @@ function status(b, mode) {
         case 'stopped':
             return branch && b.changed ? `Stopped — work kept on ${branch}` : 'Stopped';
         case 'paused':
-            return 'Paused';
+            return branch && b.changed ? `Paused — work kept on ${branch}` : 'Paused';
+        case 'followed':
+            // A run redirected from a chat thread is carried on by a follow-up (apps/coding steer.go).
+            return str(b.next) ? 'Continued in a follow-up run' : 'The follow-up run could not start';
     }
     return str(b.status);
 }
@@ -120,7 +147,12 @@ export function shell(events) {
     }
     return out.slice(-400);
 }
-/** Tool calls, in the order they were first named. A later status for the same step wins. */
+/**
+ * Tool calls, in the order they were first named. A later status for the same
+ * step wins, and a run's steps follow one another, so a step another has
+ * followed is over. `exit` is not a step: it is how the sandbox says one command
+ * in it ended (apps/sandbox work.go).
+ */
 export function steps(events) {
     const order = [];
     const done = new Map();
@@ -131,14 +163,14 @@ export function steps(events) {
         if (!body || typeof body === 'string')
             continue;
         const name = str(body.step);
-        if (!name)
+        if (!name || name === 'exit')
             continue;
         if (!done.has(name))
             order.push(name);
         const status = str(body.status);
         done.set(name, status === 'ok' || status === 'done' || status === 'error');
     }
-    return order.map((name) => ({ name, done: done.get(name) === true }));
+    return order.map((name, i) => ({ name, done: i < order.length - 1 || done.get(name) === true }));
 }
 /**
  * What the run narrated about how it ended, latest winning. Status text only:
@@ -187,3 +219,191 @@ export function pull(url, repo) {
         return { href: '', label: '' };
     return { href: url, label: `#${m[3]}` };
 }
+/** The platform's own words for the step that starts the agent (apps/coding sandboxrunner.go). */
+const TASK = 'running the task';
+/** What the run's own steps are called on a card. */
+const NAMES = {
+    lease: 'Sandbox',
+    clone: 'Clone',
+    secrets: 'Secrets',
+    install: 'Install',
+    start: 'Start',
+    push: 'Push',
+    keep: 'Keep the work',
+};
+/** Steps another card already says: `leased` finishes the lease, `done` is the final status, `ended` is housekeeping. */
+const QUIET = new Set(['leased', 'done', 'ended']);
+const ranOf = (status) => (status === 'ok' || status === 'done' ? 'done' : status === 'error' ? 'error' : 'running');
+/**
+ * A run's events, as the cards its transcript draws. `mode` is the run's, from
+ * its record: a plan's final status is its plan, and nothing else draws a plan.
+ *
+ * The run's own steps arrive as `tool-call` {step, message, status}; each
+ * command in the sandbox narrates its output as `log` {message} chunks and ends
+ * with `tool-call` {step: "exit"}. The output after the step that starts the
+ * agent is the agent's, read by its harness's grammar (harness.ts); after any
+ * other step it is that step's. Once the agent has exited, the commands the run
+ * runs before it pushes commit its work.
+ */
+export function cards(events, mode = '') {
+    const out = [];
+    let seq = 0;
+    let n = 0;
+    const mint = () => `${seq}.${n++}`;
+    let phase = null;
+    let agent = null;
+    // The agent has run and exited: output with no step of its own is the run's.
+    let exited = false;
+    const settle = () => {
+        agent?.end();
+        agent = null;
+        phase = null;
+    };
+    const answers = new Set();
+    for (const e of [...events].sort((a, b) => a.seq - b.seq)) {
+        seq = e.seq;
+        n = 0;
+        const body = decode(e.payload);
+        const b = body && typeof body === 'object' ? body : null;
+        switch (e.kind) {
+            case 'log': {
+                const text = typeof body === 'string' ? body : str(b?.message) || str(b?.text);
+                if (!text)
+                    break;
+                if (!agent && !phase && exited) {
+                    phase = { kind: 'step', key: mint(), name: 'Commit', detail: 'committing the work', output: '', ran: 'running' };
+                    out.push(phase);
+                }
+                if (!agent && !phase)
+                    agent = harness(out, mint);
+                if (agent)
+                    agent.feed(text);
+                else if (phase)
+                    phase.output += text;
+                break;
+            }
+            case 'tool-call': {
+                if (!b)
+                    break;
+                const step = str(b.step);
+                const message = str(b.message);
+                if (step === 'exit') {
+                    // One command in the sandbox ended: `exit 0`, `exit 1`, or `ended: …`.
+                    if (agent) {
+                        settle();
+                        exited = true;
+                    }
+                    else if (phase && phase.ran === 'running')
+                        phase.ran = message === 'exit 0' ? 'done' : 'error';
+                    break;
+                }
+                if (message === TASK) {
+                    settle();
+                    exited = false;
+                    agent = harness(out, mint);
+                    break;
+                }
+                if (step === 'leased') {
+                    const lease = out.find((c) => c.kind === 'step' && c.name === NAMES.lease);
+                    if (lease)
+                        lease.ran = 'done';
+                }
+                if (!step || QUIET.has(step))
+                    break;
+                const name = NAMES[step] ?? step.charAt(0).toUpperCase() + step.slice(1);
+                if (phase && phase.name === name) {
+                    phase.ran = ranOf(str(b.status));
+                    if (message)
+                        phase.detail = message;
+                    break;
+                }
+                settle();
+                phase = { kind: 'step', key: mint(), name, detail: message, output: '', ran: ranOf(str(b.status)) };
+                out.push(phase);
+                break;
+            }
+            case 'status': {
+                settle();
+                if (!b)
+                    break;
+                const text = str(b.plan);
+                if (str(b.status) === 'done' && (mode === 'plan' || mode === 'setup') && text) {
+                    answers.add(text.trim());
+                    out.push(mode === 'plan' ? { kind: 'plan', key: mint(), text } : { kind: 'said', key: mint(), who: 'agent', text });
+                    break;
+                }
+                const line = status(b, mode);
+                if (line)
+                    out.push({ kind: 'note', key: mint(), text: line });
+                break;
+            }
+            case 'control': {
+                if (!b)
+                    break;
+                const command = str(b.command);
+                const said = str(b.message);
+                if (command === 'message' && said)
+                    out.push({ kind: 'said', key: mint(), who: 'person', text: said });
+                else if (command === 'pause')
+                    out.push({ kind: 'note', key: mint(), text: 'Pause asked' });
+                else if (command === 'resume')
+                    out.push({ kind: 'note', key: mint(), text: 'Resume asked' });
+                else if (command === 'stop')
+                    out.push({ kind: 'note', key: mint(), text: 'Stop asked' });
+                break;
+            }
+            case 'message': {
+                const text = typeof body === 'string' ? body : str(b?.text) || str(b?.content) || str(b?.message);
+                if (text)
+                    out.push({ kind: 'said', key: mint(), who: str(b?.role) === 'user' ? 'person' : 'agent', text });
+                break;
+            }
+        }
+    }
+    settle();
+    // The answer the final status carries is also the agent's last message: draw it once, as the answer.
+    let kept = false;
+    for (let i = out.length - 1; i >= 0; i--) {
+        const c = out[i];
+        if (!((c.kind === 'said' && c.who === 'agent') || c.kind === 'plan') || !answers.has(c.text.trim()))
+            continue;
+        if (kept)
+            out.splice(i, 1);
+        kept = true;
+    }
+    return out;
+}
+/** The plan a plan run answered with, from its final status, or ''. */
+export function answer(events) {
+    let out = '';
+    for (const e of [...events].sort((a, b) => a.seq - b.seq)) {
+        if (e.kind !== 'status')
+            continue;
+        const b = decode(e.payload);
+        if (b && typeof b === 'object' && str(b.status) === 'done')
+            out = str(b.plan);
+    }
+    return out;
+}
+/**
+ * Whether the run has kept its work yet, and whether that work is on its
+ * branch. A stop or a pause commits and pushes AFTER it is asked, and says so
+ * in its status (apps/coding coding.go interrupted): until then a follow-up
+ * would clone a branch the push has not reached.
+ */
+export function settled(events) {
+    const out = { settled: false, pushed: false };
+    for (const e of [...events].sort((a, b) => a.seq - b.seq)) {
+        if (e.kind !== 'status')
+            continue;
+        const b = decode(e.payload);
+        if (!b || typeof b === 'string')
+            continue;
+        const s = str(b.status);
+        if (s === 'done' || s === 'error' || s === 'stopped' || s === 'paused') {
+            out.settled = true;
+            out.pushed = b.changed === true;
+        }
+    }
+    return out;
+}

package/lib/api/webhooks.d.ts

@@ -0,0 +1,60 @@
+/**
+ * The organization's webhooks: https endpoints that each matching platform event
+ * is POSTed to, signed.
+ *
+ *   GET    /v1/webhook                    {data: [endpoint]}, newest first, secrets withheld
+ *   POST   /v1/webhook                    {url, events, description} → 201, the secret shown this once
+ *   DELETE /v1/webhook/{id}               204
+ *   POST   /v1/webhook/{id}/test          one signed test event, sent now → {delivered, httpStatus, durationMs, error}
+ *   GET    /v1/webhook/{id}/deliveries    {data: [attempt]}, newest first
+ *
+ * The org is the caller's; an endpoint another org owns reads as not found.
+ * Events are subject patterns (`commerce.order.>`); none means every event.
+ */
+import { type Target } from './call.ts';
+export interface Endpoint {
+    id: string;
+    url: string;
+    /** Subject patterns; empty is every event. */
+    events: string[];
+    description: string;
+    /** active | disabled */
+    status: string;
+    /** The signing secret: present only in the answer to a create. */
+    secret: string;
+    created: string;
+    /** Settled in the last seven days, and how many of those failed. */
+    deliveries: number;
+    failures: number;
+}
+export declare function endpoint(raw: unknown): Endpoint;
+export declare function endpoints(t: Target): Promise<Endpoint[]>;
+/** The patterns in what a person typed: comma or space separated. */
+export declare function patterns(typed: string): string[];
+export interface Draft {
+    url: string;
+    events: string[];
+    description: string;
+}
+/** Why a draft cannot be sent, or ''. The platform refuses the same things. */
+export declare function refuse(d: Draft): string;
+export declare function add(t: Target, d: Draft): Promise<Endpoint>;
+export declare function remove(t: Target, id: string): Promise<void>;
+export interface Trial {
+    delivered: boolean;
+    /** 0 when the endpoint never answered. */
+    status: number;
+    ms: number;
+    error: string;
+}
+export declare function test(t: Target, id: string): Promise<Trial>;
+export interface Attempt {
+    subject: string;
+    /** ok | retrying | failed */
+    status: string;
+    code: number;
+    attempt: number;
+    error: string;
+    at: string;
+}
+export declare function deliveries(t: Target, id: string, limit?: number): Promise<Attempt[]>;

package/lib/api/webhooks.js

@@ -0,0 +1,81 @@
+/**
+ * The organization's webhooks: https endpoints that each matching platform event
+ * is POSTed to, signed.
+ *
+ *   GET    /v1/webhook                    {data: [endpoint]}, newest first, secrets withheld
+ *   POST   /v1/webhook                    {url, events, description} → 201, the secret shown this once
+ *   DELETE /v1/webhook/{id}               204
+ *   POST   /v1/webhook/{id}/test          one signed test event, sent now → {delivered, httpStatus, durationMs, error}
+ *   GET    /v1/webhook/{id}/deliveries    {data: [attempt]}, newest first
+ *
+ * The org is the caller's; an endpoint another org owns reads as not found.
+ * Events are subject patterns (`commerce.order.>`); none means every event.
+ */
+import { call, query, seg } from './call.js';
+const str = (v) => (typeof v === 'string' ? v : '');
+const num = (v) => (typeof v === 'number' && Number.isFinite(v) ? v : 0);
+const obj = (v) => (v && typeof v === 'object' ? v : {});
+const arr = (v) => (Array.isArray(v) ? v : []);
+export function endpoint(raw) {
+    const e = obj(raw);
+    return {
+        id: str(e.id),
+        url: str(e.url),
+        events: arr(e.events).filter((s) => typeof s === 'string' && s !== ''),
+        description: str(e.description),
+        status: str(e.status) || 'active',
+        secret: str(e.secret),
+        created: str(e.created),
+        deliveries: num(e.deliveries7d),
+        failures: num(e.failures7d),
+    };
+}
+export async function endpoints(t) {
+    const raw = obj(await call(t, 'GET', '/v1/webhook'));
+    return arr(raw.data).map(endpoint).filter((e) => e.id);
+}
+/** The patterns in what a person typed: comma or space separated. */
+export function patterns(typed) {
+    return [...new Set(typed.split(/[\s,]+/).map((s) => s.trim()).filter(Boolean))];
+}
+/** Why a draft cannot be sent, or ''. The platform refuses the same things. */
+export function refuse(d) {
+    let u;
+    try {
+        u = new URL(d.url.trim());
+    }
+    catch {
+        return 'Enter the https address to deliver to';
+    }
+    if (u.protocol !== 'https:')
+        return 'A webhook is delivered over https only';
+    if (d.events.length > 64)
+        return 'At most 64 event patterns';
+    return '';
+}
+export async function add(t, d) {
+    const why = refuse(d);
+    if (why)
+        throw new Error(why);
+    return endpoint(await call(t, 'POST', '/v1/webhook', { url: d.url.trim(), events: d.events, description: d.description.trim() }));
+}
+export async function remove(t, id) {
+    await call(t, 'DELETE', `/v1/webhook/${seg(id)}`);
+}
+export async function test(t, id) {
+    const r = obj(await call(t, 'POST', `/v1/webhook/${seg(id)}/test`, {}));
+    return { delivered: r.delivered === true, status: num(r.httpStatus), ms: num(r.durationMs), error: str(r.error) };
+}
+export async function deliveries(t, id, limit = 10) {
+    const raw = obj(await call(t, 'GET', `/v1/webhook/${seg(id)}/deliveries${query({ limit })}`));
+    return arr(raw.data)
+        .map(obj)
+        .map((a) => ({
+        subject: str(a.subject),
+        status: str(a.status),
+        code: num(a.httpStatus),
+        attempt: num(a.attempt),
+        error: str(a.error),
+        at: str(a.created),
+    }));
+}

package/lib/ask.d.ts

@@ -0,0 +1,18 @@
+export declare function Confirm({ open, onOpenChange, title, says, act, run, }: {
+    open: boolean;
+    onOpenChange: (o: boolean) => void;
+    title: string;
+    /** The whole consequence, stated plainly. */
+    says: string;
+    /** The button's word: Delete, Remove, Forget. */
+    act: string;
+    run: () => Promise<void>;
+}): import("react").JSX.Element;
+export declare function Rename({ open, onOpenChange, title, name, run, }: {
+    open: boolean;
+    onOpenChange: (o: boolean) => void;
+    title: string;
+    /** The name it has now. */
+    name: string;
+    run: (next: string) => Promise<void>;
+}): import("react").JSX.Element;

package/lib/ask.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Asking one thing before an act: to confirm one that cannot be undone, or the
+ * new name for something. A refusal is said in the dialog, which stays open, so
+ * the reason is read where the act was asked for.
+ */
+import { SizableText, XStack } from '@hanzo/gui';
+import { Button, Dialog, DialogContent, DialogTitle, Input } from '@hanzo/ui';
+import { useEffect, useState } from 'react';
+/** One act in flight, and what refused it. */
+function useAct(onDone) {
+    const [working, setWorking] = useState(false);
+    const [note, setNote] = useState('');
+    const go = async (run) => {
+        setWorking(true);
+        setNote('');
+        try {
+            await run();
+            setWorking(false);
+            onDone();
+        }
+        catch (e) {
+            setNote(e instanceof Error ? e.message : 'That did not work');
+            setWorking(false);
+        }
+    };
+    return { working, note, setNote, go };
+}
+function Said({ note }) {
+    if (!note)
+        return null;
+    return (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note }));
+}
+export function Confirm({ open, onOpenChange, title, says, act, run, }) {
+    const { working, note, setNote, go } = useAct(() => onOpenChange(false));
+    const close = (o) => {
+        if (working)
+            return;
+        setNote('');
+        onOpenChange(o);
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: close, children: _jsxs(DialogContent, { maxW: 420, showCloseButton: false, children: [_jsx(DialogTitle, { children: title }), _jsx(SizableText, { size: "$2", color: "$soft", children: says }), _jsx(Said, { note: note }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", disabled: working, onPress: () => close(false), children: "Cancel" }), _jsx(Button, { size: "sm", variant: "destructive", disabled: working, onPress: () => void go(run), children: act })] })] }) }));
+}
+export function Rename({ open, onOpenChange, title, name, run, }) {
+    const [value, setValue] = useState(name);
+    const { working, note, setNote, go } = useAct(() => onOpenChange(false));
+    useEffect(() => {
+        if (open)
+            setValue(name);
+    }, [open, name]);
+    const close = (o) => {
+        if (working)
+            return;
+        setNote('');
+        onOpenChange(o);
+    };
+    const save = () => {
+        const next = value.trim();
+        if (!next)
+            return setNote('It needs a name');
+        if (next === name)
+            return close(false);
+        void go(() => run(next));
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: close, children: _jsxs(DialogContent, { maxW: 420, showCloseButton: false, children: [_jsx(DialogTitle, { children: title }), _jsx(Input, { autoFocus: true, value: value, onChangeText: setValue, "aria-label": "Name", onKeyDown: (e) => {
+                        if ((e.key ?? e.nativeEvent?.key) === 'Enter')
+                            save();
+                    } }), _jsx(Said, { note: note }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", disabled: working, onPress: () => close(false), children: "Cancel" }), _jsx(Button, { size: "sm", disabled: working, onPress: save, children: "Save" })] })] }) }));
+}

package/lib/builder.js

@@ -11,12 +11,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *   /-/issues    the forge's issues
  *   /-/artifacts what this org has built
  *   /-/templates the public starters
- *   /-/mcp       the fleet's native MCP servers
+ *   /-/customize skills, connectors, plugins and agents
  *   /<slug>      a deployed project's workspace, in this same window
  *
  * The rail is the sessions rail every Hanzo surface shares: New, the builder's
- * places, the org's coding runs newest first with a live status dot, and the
- * account. Its collapse is an explicit toggle kept per browser.
+ * places with the rest under More, the org's coding runs newest first with a
+ * live status dot, and at the foot the offer of Hanzo in Slack and the account,
+ * whose menu opens Settings, Usage, the plans, help and logging out (foot.tsx).
+ * Its collapse is an explicit toggle kept per browser.
  *
  * A project's workspace takes the whole window — it has its own chat column,
  * bar and panes — and its mark leads back here.
@@ -26,22 +28,27 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * left column, never two.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
-import { Blocks, BookOpen, CircleDot, Cpu, FolderGit2, Kanban, LayoutTemplate, Menu, Puzzle, Workflow } from '@hanzogui/lucide-icons-2';
+import { Blocks, BookOpen, CircleDot, Cpu, FolderGit2, Kanban, LayoutTemplate, Menu, SlidersHorizontal, Workflow } from '@hanzogui/lucide-icons-2';
 import { Button } from '@hanzo/ui';
 import { SessionRail } from '@hanzo/ui/chat';
 import { HanzoMark } from '@hanzo/ui/product';
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { pinBoard } from './choice.js';
+import { Customize } from './customize/index.js';
 import { useKept, useRecents } from './data.js';
 import { Forge } from './forge.js';
 import { HostProvider, useHost, useTarget } from './host.js';
 import { Landing } from './landing.js';
+import { PrefsProvider } from './prefs.js';
 import { Project } from './project.js';
+import { Plans } from './plans.js';
 import { path, route } from './route.js';
 import { Run } from './run.js';
 import { DOTS } from './section.js';
 import { Artifacts, Templates } from './shelf.js';
-import { Account, Find, onAccount } from './account.js';
+import { Find } from './find.js';
+import { DOCS, Slack, Who } from './foot.js';
+import { Settings } from './settings/index.js';
 import { Where } from './switch.js';
 function Shell() {
     const host = useHost();
@@ -51,9 +58,9 @@ function Shell() {
     const [collapsed, setCollapsed] = useKept('hanzo.build.rail', false);
     const [drawer, setDrawer] = useState(false);
     const [order, setOrder] = useState('newest');
-    const [account, setAccount] = useState(false);
     const [finding, setFinding] = useState(false);
-    useEffect(() => onAccount(() => setAccount(true)), []);
+    const [menu, setMenu] = useState(false);
+    const [slack, setSlack] = useKept('hanzo.build.slack', false);
     const go = (p) => {
         setDrawer(false);
         host.go(p);
@@ -70,9 +77,13 @@ function Shell() {
     const switcher = Boolean(host.person && (host.org || (host.memberships?.length ?? 0) > 0));
     const top = switcher ? (_jsx(Where, {})) : (_jsx(XStack, { render: "button", "aria-label": "Hanzo", items: "center", onPress: () => go(''), children: _jsx(HanzoMark, { size: 18 }) }));
     const links = [
+        { id: 'projects', label: 'Projects', icon: _jsx(Kanban, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'projects' })), active: screen === 'projects' },
+        { id: 'artifacts', label: 'Artifacts', icon: _jsx(Blocks, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'artifacts' })), active: screen === 'artifacts' },
+        { id: 'customize', label: 'Customize', icon: _jsx(SlidersHorizontal, { size: 16 }), onPress: () => go(path({ kind: 'customize', tab: 'skills' })), active: r.kind === 'customize' || screen === 'mcp' },
         { id: 'automations', label: 'Automations', icon: _jsx(Workflow, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'automations' })), active: screen === 'automations' },
+    ];
+    const more = [
         { id: 'codebases', label: 'Codebase', icon: _jsx(FolderGit2, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'codebases' })), active: screen === 'codebases' },
-        { id: 'projects', label: 'Projects', icon: _jsx(Kanban, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'projects' })), active: screen === 'projects' },
         {
             id: 'issues',
             label: 'Issues',
@@ -83,22 +94,25 @@ function Shell() {
             },
             active: screen === 'issues',
         },
-        { id: 'artifacts', label: 'Artifacts', icon: _jsx(Blocks, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'artifacts' })), active: screen === 'artifacts' },
-        { id: 'mcp', label: 'MCP', icon: _jsx(Puzzle, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'mcp' })), active: screen === 'mcp' },
-    ];
-    const more = [
         { id: 'templates', label: 'Templates', icon: _jsx(LayoutTemplate, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'templates' })), active: screen === 'templates' },
         {
             id: 'machines',
             label: 'Machines',
             icon: _jsx(Cpu, { size: 16 }),
-            onPress: () => host.go(''),
+            onPress: () => go(path({ kind: 'settings', section: 'machines' })),
+            active: r.kind === 'settings' && r.section === 'machines',
         },
-        { id: 'docs', label: 'Docs', icon: _jsx(BookOpen, { size: 16 }), onPress: () => window.open('https://docs.hanzo.ai/docs/dev', '_blank', 'noopener,noreferrer') },
+        { id: 'docs', label: 'Docs', icon: _jsx(BookOpen, { size: 16 }), onPress: () => window.open(DOCS, '_blank', 'noopener,noreferrer') },
     ];
-    return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, bg: "$background", children: [_jsxs(YStack, { position: "relative", shrink: 0, children: [_jsx(SessionRail, { onNew: () => go(''), fresh: r.kind === 'new', links: links, more: more, recents: rows, active: r.kind === 'run' ? r.id : null, onOpen: (id) => go(id), onSort: () => setOrder(order === 'newest' ? 'running' : 'newest'), sortLabel: order === 'newest' ? 'Show running first' : 'Show newest first', empty: _jsx(SizableText, { size: "$1", color: "$soft", px: "$2", children: !host.person ? 'Sign in to see your runs.' : recents.error ? recents.error.message : recents.loading ? 'Reading…' : 'No runs yet.' }), account: host.person
-                            ? { name: host.person.email || host.person.name, onPress: () => setAccount(true) }
-                            : { name: 'Sign in', onPress: () => host.signIn?.() }, onSettings: () => setAccount(true), onSearch: () => setFinding(true), collapsed: collapsed, onCollapse: setCollapsed, mark: _jsx(Brand, { org: host.org }), pt: collapsed ? undefined : switcher ? 80 : 40, open: drawer, onOpenChange: setDrawer, label: "Runs" }), collapsed ? null : (_jsx(XStack, { position: "absolute", t: 8, l: 8, r: 8, z: 2, items: "center", "$max-md": { display: 'none' }, children: top }))] }), _jsxs(YStack, { flex: 1, minW: 0, minH: 0, position: "relative", children: [_jsxs(XStack, { height: 44, px: "$2", gap: "$2", items: "center", shrink: 0, $md: { display: 'none' }, children: [_jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setDrawer(true), "aria-label": "Open runs", children: _jsx(Menu, { size: 18 }) }), top] }), _jsx(Pane, { onStarted: () => recents.reload() })] }), _jsx(Account, { open: account, onOpenChange: setAccount }), _jsx(Find, { open: finding, onOpenChange: setFinding, recents: rows, onOpen: (id) => { setFinding(false); go(id); } })] }));
+    return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, bg: "$background", children: [_jsxs(YStack, { position: "relative", shrink: 0, children: [_jsx(SessionRail, { onNew: () => go(''), fresh: r.kind === 'new', links: links, more: more, recents: rows, active: r.kind === 'run' ? r.id : null, onOpen: (id) => go(id), onSort: () => setOrder(order === 'newest' ? 'running' : 'newest'), sortLabel: order === 'newest' ? 'Show running first' : 'Show newest first', empty: _jsx(SizableText, { size: "$1", color: "$soft", px: "$2", children: !host.person ? 'Sign in to see your runs.' : recents.error ? recents.error.message : recents.loading ? 'Reading…' : 'No runs yet.' }), notice: host.person && !slack ? (_jsx(Slack, { onOpen: () => go(path({ kind: 'settings', section: 'integrations' })), onDismiss: () => setSlack(true) })) : undefined, account: host.person
+                            ? {
+                                name: host.person.email || host.person.name,
+                                onPress: () => {
+                                    setDrawer(false);
+                                    setMenu(true);
+                                },
+                            }
+                            : { name: 'Sign in', onPress: () => host.signIn?.() }, onSettings: () => go(path({ kind: 'settings', section: 'general' })), onSearch: () => setFinding(true), collapsed: collapsed, onCollapse: setCollapsed, mark: _jsx(Brand, { org: host.org }), pt: collapsed ? undefined : switcher ? 80 : 40, open: drawer, onOpenChange: setDrawer, label: "Runs" }), collapsed ? null : (_jsx(XStack, { position: "absolute", t: 8, l: 8, r: 8, z: 2, items: "center", "$max-md": { display: 'none' }, children: top })), host.person ? _jsx(Who, { open: menu, onOpenChange: setMenu, narrow: collapsed }) : null] }), _jsxs(YStack, { flex: 1, minW: 0, minH: 0, position: "relative", children: [_jsxs(XStack, { height: 44, px: "$2", gap: "$2", items: "center", shrink: 0, $md: { display: 'none' }, children: [_jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setDrawer(true), "aria-label": "Open runs", children: _jsx(Menu, { size: 18 }) }), top] }), _jsx(Pane, { onStarted: () => recents.reload() })] }), _jsx(Find, { open: finding, onOpenChange: setFinding, recents: rows, onOpen: (id) => { setFinding(false); go(id); } })] }));
 }
 /** Whichever pane the address names, beside a rail — the builder's or the host's. */
 function Pane({ onStarted }) {
@@ -106,11 +120,17 @@ function Pane({ onStarted }) {
     const r = route(host.path);
     if (r.kind === 'run')
         return _jsx(Run, { id: r.id }, r.id);
+    if (r.kind === 'settings')
+        return _jsx(Settings, { section: r.section });
+    if (r.kind === 'customize')
+        return _jsx(Customize, { tab: r.tab });
     if (r.kind === 'screen') {
         if (r.screen === 'artifacts')
             return _jsx(Artifacts, {});
         if (r.screen === 'templates')
             return _jsx(Templates, {});
+        if (r.screen === 'plans')
+            return _jsx(Plans, {});
         return _jsx(Forge, { screen: r.screen }, r.screen);
     }
     return (_jsx(Landing, { onStarted: (id) => {
@@ -139,5 +159,5 @@ function Screens({ rail }) {
  * places and runs in its own rail with `DevSection`.
  */
 export function Builder({ host, rail = true }) {
-    return (_jsx(HostProvider, { host: host, children: _jsx(YStack, { flex: 1, minH: 0, minW: 0, height: "100%", bg: "$background", children: _jsx(Screens, { rail: rail }) }) }));
+    return (_jsx(HostProvider, { host: host, children: _jsx(PrefsProvider, { children: _jsx(YStack, { flex: 1, minH: 0, minW: 0, height: "100%", bg: "$background", children: _jsx(Screens, { rail: rail }) }) }) }));
 }

package/lib/customize/agents.d.ts

@@ -0,0 +1,2 @@
+import { type Pane } from './ui.tsx';
+export declare function Agents({ view, q, adding, onAdding, onView }: Pane): import("react").JSX.Element;