@hanzo/build 0.2.4 → 0.2.6

package/lib/host.d.ts

@@ -26,24 +26,24 @@ export interface Host {
     person: Person | null;
     /** Whether the person administers `org`: an admin publishes to main, anyone else opens a review. */
     admin: boolean;
-    /** The address under the mount: '' | a session id | a project slug | '-/<screen>'. */
+    /** The address under the mount: '' | a session id | a slug | '-/codebases' | '-/projects' | '-/issues' | '-/artifacts' | '-/templates'. */
     path: string;
     /** Move under the mount. */
     go: (path: string, how?: {
         replace?: boolean;
     }) => void;
-    /** Where the builder links out to. Same-window addresses on the host, or https. */
+    /** Where the builder links out. On hanzo.build these are addresses of this page. */
     links: {
-        /** Troubleshoot GitHub connection: the GitHub pane of the platform's plugins. */
+        /** GitHub for this page: bringing repositories onto the forge. */
         github: string;
-        /** Customize: the platform's plugins (skills, MCP, connectors). */
+        /** Customize, an address of this host. */
         customize: string;
-        /** Account settings. */
+        /** Account settings, an address of this host. */
         settings: string;
-        /** The platform itself, where the mark leads. */
+        /** This host's home. On hanzo.build it is the page itself. */
         home: string;
     };
-    /** Leave the builder for a host address, same window. */
+    /** Open a host address in this window. hanzo.build keeps the window on its own origin. */
     open: (href: string) => void;
     signIn?: () => void;
     signOut?: () => void;

package/lib/landing.js

@@ -10,19 +10,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { Cloud, Monitor } from '@hanzogui/lucide-icons-2';
-import { Button } from '@hanzo/ui';
 import { ModeSelect } from '@hanzo/ui/agents';
 import { Composer, EmptyPrompt } from '@hanzo/ui/chat';
 import { BranchSelect, ChipSelect, HanzoMark, RepoSelect } from '@hanzo/ui/product';
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { start, unhonoured } from './api/coding.js';
-import { branches, connect, repos } from './api/github.js';
+import { asRepo, chosen, codebases, one } from './api/codebases.js';
 import { ENSO, models } from './api/models.js';
 import { ready, SANDBOX } from './api/places.js';
-import { clone } from './api/platform.js';
+import { isForge } from './choice.js';
 import { useKept, usePlaces, useRead } from './data.js';
 import { useHost, useTarget } from './host.js';
 import { Publish } from './publish.js';
+import { path } from './route.js';
 import { Attach, compose, Dictate, Files } from './tools.js';
 /** One vocabulary for the mode, on New and in a workspace. */
 export const MODES = [
@@ -34,7 +34,7 @@ const EFFORTS = [
     { id: 'medium', label: 'Medium' },
     { id: 'high', label: 'High' },
 ];
-const FIRST = { repo: null, branch: '', place: '', mode: 'build', model: ENSO, effort: 'medium' };
+const FIRST = { repo: null, branch: '', place: '', mode: 'build', model: ENSO, effort: 'medium', ask: '' };
 const COLUMN = 768;
 export function Landing({ onStarted }) {
     const host = useHost();
@@ -42,43 +42,38 @@ export function Landing({ onStarted }) {
     const signed = Boolean(host.person);
     const [kept, keep] = useKept(`hanzo.build.new.${host.org ?? 'none'}`, FIRST);
     const set = (patch) => keep({ ...kept, ...patch });
-    const [draft, setDraft] = useState('');
+    const [draft, setDraft] = useState(kept.ask || '');
     const [files, setFiles] = useState([]);
     const [busy, setBusy] = useState(false);
     const [note, setNote] = useState('');
-    const [connected, setConnected] = useState(true);
     const [adding, setAdding] = useState(null);
+    // A codebase or an issue hands its words over once. Left in the kept choice,
+    // every later visit to New would put them back.
+    useEffect(() => {
+        if (kept.ask)
+            set({ ask: '' });
+        // The handover is read on this mount only.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
     const places = usePlaces(t, signed);
     const catalog = useRead(signed ? () => models(t) : null, [], [t, signed]);
     const place = places.value.find((p) => p.id === kept.place) ?? SANDBOX;
-    const loadRepos = useCallback(async (q, after) => {
-        const page = await repos(t, { q, after: after ?? undefined });
-        setConnected(page.connected);
-        return { repos: page.repos, next: page.next || null };
+    const known = useRef(new Map());
+    const loadRepos = useCallback(async (q) => {
+        const page = await codebases(t, q);
+        const repos = page.map(asRepo);
+        for (const r of repos)
+            known.current.set(r.name, r);
+        return { repos, next: null };
     }, [t]);
-    const loadBranches = useCallback(async (q, after) => {
+    const loadBranches = useCallback(async (q) => {
         if (!kept.repo)
             return { branches: [], next: null };
-        const page = await branches(t, kept.repo.owner, kept.repo.name, { q, after: after ?? undefined });
-        return { branches: page.branches.map((b) => ({ name: b.name })), next: page.next || null };
+        const found = await one(t, kept.repo.name);
+        const needle = q.trim().toLowerCase();
+        const names = (found?.branches ?? [kept.repo.default_branch || 'main']).filter((b) => !needle || b.toLowerCase().includes(needle));
+        return { branches: names.map((name) => ({ name })), next: null };
     }, [t, kept.repo]);
-    const link = async () => {
-        try {
-            const to = await connect(t);
-            // The console completes the connection at /connectors and brings the
-            // person back here: a path, never an origin.
-            try {
-                window.sessionStorage.setItem('hanzo.return', window.location.pathname + window.location.search);
-            }
-            catch {
-                /* they land on the connectors page and come back themselves */
-            }
-            window.location.assign(to);
-        }
-        catch (e) {
-            setNote(e instanceof Error ? e.message : 'Could not start the GitHub connection');
-        }
-    };
     const send = async () => {
         const prompt = draft.trim();
         if (!prompt || busy)
@@ -87,13 +82,18 @@ export function Landing({ onStarted }) {
             host.signIn?.();
             return;
         }
+        if (!isForge(kept.repo)) {
+            setNote('Choose a codebase on the forge.');
+            return;
+        }
         setBusy(true);
         setNote('');
         try {
             const run = await start(t, {
                 prompt: compose(prompt, files),
-                repo: kept.repo ? `${kept.repo.owner}/${kept.repo.name}` : undefined,
-                base: kept.repo ? kept.branch || kept.repo.default_branch || undefined : undefined,
+                // The name alone. The org rides the request, and a slash is not a repo name.
+                repo: isForge(kept.repo) ? kept.repo.name : undefined,
+                base: isForge(kept.repo) ? kept.branch || kept.repo.default_branch || undefined : undefined,
                 targetId: place.id || undefined,
                 mode: kept.mode,
                 model: kept.model === ENSO ? undefined : kept.model,
@@ -118,15 +118,24 @@ export function Landing({ onStarted }) {
         place: p,
     })), [places.value]);
     const branch = kept.branch || kept.repo?.default_branch || 'main';
-    const head = (_jsxs(XStack, { gap: 6, items: "center", flexWrap: "wrap", children: [_jsx(ChipSelect, { name: "Where the run runs", icon: place.id ? _jsx(Monitor, { size: 13 }) : _jsx(Cloud, { size: 13 }), label: place.id ? place.label : 'Default', chosen: placeItems.find((i) => i.place.id === place.id) ?? null, items: placeItems, onChange: (i) => set({ place: i.place.id }), placeholder: "Search machines\u2026", loading: places.loading, error: places.error?.message ?? null, footer: _jsx(SizableText, { size: "$1", color: "$soft", children: "A run on a machine uses that machine\u2019s checkout and credentials." }) }), _jsx(RepoSelect, { value: kept.repo, onChange: (r) => set({ repo: r, branch: r.default_branch || 'main' }), load: loadRepos, troubleshoot: { label: 'Troubleshoot GitHub connection', onPress: () => host.open(host.links.github) }, note: "Not all repositories are shown. Type to search.", connect: !connected && !host.admin ? (_jsx(Button, { size: "sm", onPress: () => void link(), children: "Connect GitHub" })) : undefined, action: {
+    const head = (_jsxs(XStack, { gap: 6, items: "center", flexWrap: "wrap", children: [_jsx(ChipSelect, { name: "Where the run runs", icon: place.id ? _jsx(Monitor, { size: 13 }) : _jsx(Cloud, { size: 13 }), label: place.id ? place.label : 'Default', chosen: placeItems.find((i) => i.place.id === place.id) ?? null, items: placeItems, onChange: (i) => set({ place: i.place.id }), placeholder: "Search machines\u2026", loading: places.loading, error: places.error?.message ?? null, footer: _jsx(SizableText, { size: "$1", color: "$soft", children: "A run on a machine uses that machine\u2019s checkout and credentials." }) }), _jsx(RepoSelect, { value: isForge(kept.repo) ? kept.repo : null, onChange: (r) => {
+                    const row = known.current.get(r.name) ?? chosen(r);
+                    set({ repo: row, branch: row.default_branch });
+                }, load: loadRepos, troubleshoot: {
+                    label: 'Browse codebases',
+                    onPress: () => host.go(path({ kind: 'screen', screen: 'codebases' })),
+                }, note: "Repositories on the forge. Type to search.", action: {
                     label: 'Add to project',
-                    onPress: (r) => setAdding({
-                        repo: clone(`${r.owner}/${r.name}`),
-                        title: `${r.owner}/${r.name}`,
-                        ref: r.default_branch || 'main',
-                        name: r.name,
-                    }),
-                }, placeholder: "Repository", disabled: !signed }), kept.repo ? _jsx(BranchSelect, { value: branch, onChange: (b) => set({ branch: b }), load: loadBranches }) : null, _jsx(Files, { files: files, onFiles: setFiles })] }));
+                    onPress: (r) => {
+                        const row = known.current.get(r.name);
+                        setAdding({
+                            repo: row?.clone || `${t.api}/v1/git/${r.owner}/${r.name}.git`,
+                            title: row?.full_name || `${r.owner}/${r.name}`,
+                            ref: r.default_branch || 'main',
+                            name: r.name,
+                        });
+                    },
+                }, placeholder: "Codebase", disabled: !signed }), isForge(kept.repo) ? _jsx(BranchSelect, { value: branch, onChange: (b) => set({ branch: b }), load: loadBranches }) : null, _jsx(Files, { files: files, onFiles: setFiles })] }));
     const foot = (_jsxs(XStack, { flex: 1, items: "center", gap: "$2", flexWrap: "wrap", rowGap: "$1", children: [_jsx(Attach, { files: files, onFiles: setFiles, onNote: setNote }), _jsx(Dictate, { onText: (said) => setDraft((d) => (d ? `${d} ${said}` : said)), onNote: setNote }), _jsx(ModeSelect, { modes: MODES, value: kept.mode, onChange: (m) => set({ mode: m }), bg: "transparent", minH: 24, px: "$1.5", self: "center" }), _jsx(XStack, { flex: 1 }), _jsx(ChipSelect, { quiet: true, name: "Model", label: catalog.value.find((m) => m.id === kept.model)?.label ?? 'Enso', chosen: catalog.value.find((m) => m.id === kept.model) ?? null, items: catalog.value, onChange: (m) => set({ model: m.id }), placeholder: "Search models\u2026", placement: "top-end", loading: catalog.loading, error: catalog.error?.message ?? null }), _jsx(ChipSelect, { quiet: true, name: "Effort", label: EFFORTS.find((e) => e.id === kept.effort)?.label ?? 'Medium', chosen: EFFORTS.find((e) => e.id === kept.effort) ?? null, items: EFFORTS, onChange: (e) => set({ effort: e.id }), placement: "top-end", width: 180 })] }));
     return (_jsxs(YStack, { flex: 1, minH: 0, minW: 0, items: "center", px: "$4", children: [_jsxs(YStack, { width: "100%", maxW: COLUMN, flex: 1, minH: 0, children: [_jsx(EmptyPrompt, { title: "What\u2019s up next?", mark: _jsx(HanzoMark, { size: 18 }), column: COLUMN }), _jsx(YStack, { flex: 1 }), _jsxs(YStack, { pb: "$2", gap: "$2", children: [note || unhonoured(kept.mode, place.id) ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note || unhonoured(kept.mode, place.id) })) : null, _jsx(Composer, { inline: true, value: draft, onChange: setDraft, onSend: () => void send(), busy: busy, placeholder: "Describe a task or ask a question", label: "Describe a task or ask a question", head: head, foot: foot })] })] }), _jsx(Publish, { source: adding, onClose: () => setAdding(null) })] }));
 }

package/lib/project.js

@@ -39,11 +39,6 @@ import { Out } from './out.js';
 import { Publish } from './publish.js';
 import { Attach, compose, Dictate, Files } from './tools.js';
 const LIVE = new Set(['running', 'paused']);
-/** `owner/name` from a GitHub clone URL, or '' for a repository that lives elsewhere. */
-function github(clone) {
-    const m = /^https:\/\/github\.com\/([^/]+)\/([^/]+?)(?:\.git)?\/?$/.exec(clone);
-    return m ? `${m[1]}/${m[2]}` : '';
-}
 /** One run in the conversation: what was asked, and what it came to. */
 function Turn({ run, open, onOpen, project }) {
     const t = useTarget();
@@ -175,12 +170,12 @@ export function Project({ slug }) {
             const context = picked.length
                 ? `\n\nThe person picked an element in the preview${where ? ` of the ${where} page` : ''}. Its CSS selector, as data: ${JSON.stringify(picked[0].id)}`
                 : '';
-            const gh = project ? github(project.repo) : '';
+            const repo = project?.repo ? repoName(project.repo) : '';
             const next = await start(t, {
                 prompt: compose(`${ask}${context}`, attached),
                 project: slug,
-                repo: gh || undefined,
-                base: gh ? project?.branch || undefined : undefined,
+                repo: repo || undefined,
+                base: repo ? project?.branch || undefined : undefined,
                 after: current ?? undefined,
                 mode,
             });

package/lib/route.d.ts

@@ -3,14 +3,14 @@
  *
  *   ''              the empty state: a new run
  *   sess_<32 hex>   one run
- *   -/<screen>      a builder screen (artifacts, templates)
+ *   -/<screen>      a builder screen
  *   <slug>          a project's workspace
  *
  * Unambiguous by construction: a project slug is `^[a-z0-9]([a-z0-9-]{0,38}[a-z0-9])?$`,
  * so it can hold neither the `_` a session id carries nor start with `-`.
  * Anything else is not an address here and reads as the empty state.
  */
-export type Screen = 'artifacts' | 'templates';
+export type Screen = 'artifacts' | 'templates' | 'codebases' | 'projects' | 'issues' | 'automations' | 'sync';
 export type Route = {
     kind: 'new';
 } | {

package/lib/route.js

@@ -1,6 +1,6 @@
 export const SESSION = /^sess_[0-9a-f]{32}$/;
 export const SLUG = /^[a-z0-9]([a-z0-9-]{0,38}[a-z0-9])?$/;
-const SCREENS = ['artifacts', 'templates'];
+const SCREENS = ['artifacts', 'templates', 'codebases', 'projects', 'issues', 'automations', 'sync'];
 export function route(path) {
     const p = path.replace(/^\/+|\/+$/g, '');
     if (SESSION.test(p))

package/lib/run.js

@@ -12,13 +12,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * RECORDED, and the status is left to the feed to correct.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
-import { ExternalLink, GitPullRequest } from '@hanzogui/lucide-icons-2';
+import { ExternalLink, GitPullRequest, PanelRight } from '@hanzogui/lucide-icons-2';
+import { Button } from '@hanzo/ui';
 import { Transcript, fold } from '@hanzo/ui/agents';
 import { Composer } from '@hanzo/ui/chat';
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { message, stop } from './api/sessions.js';
-import { outcome, pull, said, who } from './api/turn.js';
-import { useRun } from './data.js';
+import { outcome, pull, said, steps, who } from './api/turn.js';
+import { useKept, useRun } from './data.js';
+import { Desk } from './desk.js';
 import { useTarget } from './host.js';
 import { Out } from './out.js';
 const LIVE = new Set(['running', 'paused', '']);
@@ -28,13 +30,39 @@ export function Run({ id }) {
     const [draft, setDraft] = useState('');
     const [note, setNote] = useState('');
     const [busy, setBusy] = useState(false);
+    const [notify, setNotify] = useState(false);
+    const [desk, setDesk] = useKept('hanzo.build.desk', true);
     const blocks = useMemo(() => fold(events
         .map((e) => ({ kind: e.kind, actor: who(e.actor), seq: e.seq, id: e.id, text: said(e, record?.mode) }))
         .filter((b) => b.text)), [events, record?.mode]);
     const end = outcome(events);
+    const plan = useMemo(() => steps(events), [events]);
     const state = status || end.status;
     const pr = pull(record?.pr ?? '', record?.repo ?? '');
     const running = LIVE.has(state) && !detail.error;
+    const title = detail.value?.title || (detail.loading ? '' : 'Untitled run');
+    useEffect(() => {
+        if (!notify || running)
+            return;
+        if (typeof Notification === 'undefined' || Notification.permission !== 'granted')
+            return;
+        const n = new Notification(title || 'Run finished', { body: 'This run has finished.' });
+        setNotify(false);
+        return () => n.close();
+    }, [notify, running, title]);
+    const ask = async () => {
+        if (typeof Notification === 'undefined') {
+            setNote('This browser cannot send a notification.');
+            return;
+        }
+        const perm = Notification.permission === 'granted' ? 'granted' : await Notification.requestPermission();
+        if (perm !== 'granted') {
+            setNote('Notifications stay off until this browser allows them.');
+            return;
+        }
+        setNotify(true);
+        setNote('');
+    };
     const send = async () => {
         if (!draft.trim() || busy)
             return;
@@ -62,6 +90,8 @@ export function Run({ id }) {
             setNote(e instanceof Error ? e.message : 'Could not stop this run');
         }
     };
-    const title = detail.value?.title || (detail.loading ? '' : 'Untitled run');
-    return (_jsx(YStack, { flex: 1, minH: 0, minW: 0, width: "100%", items: "center", children: _jsxs(YStack, { flex: 1, minH: 0, width: "100%", maxW: 816, px: "$6", children: [_jsxs(XStack, { pt: "$3", pb: "$2", gap: "$3", items: "center", minH: 44, children: [_jsxs(YStack, { flex: 1, minW: 0, children: [_jsx(SizableText, { render: "h1", size: "$5", color: "$ink", numberOfLines: 1, children: title }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: [state || (detail.loading ? 'reading' : ''), record?.repo, record?.branch].filter(Boolean).join(' · ') })] }), pr.href ? (_jsx(Out, { href: pr.href, label: `Open pull request ${pr.label}`, children: _jsxs(XStack, { items: "center", gap: "$1.5", px: "$2.5", py: "$1.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, children: [_jsx(GitPullRequest, { size: 14 }), _jsx(SizableText, { size: "$2", color: "$ink", children: pr.label }), _jsx(ExternalLink, { size: 12, opacity: 0.6 })] }) })) : null] }), _jsx(Transcript, { blocks: blocks, empty: _jsx(SizableText, { size: "$2", color: "$soft", children: detail.error ? detail.error.message : detail.loading ? 'Reading this run…' : 'Waiting for the run’s first step…' }) }), _jsxs(YStack, { pb: "$4", pt: "$2", gap: "$2", children: [end.problem ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "The branch is pushed, and the pull request could not be opened." })) : null, note || refused ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note || refused })) : null, _jsx(Composer, { inline: true, value: draft, onChange: setDraft, onSend: () => void send(), onStop: () => void halt(), busy: running && !draft.trim(), disabled: !running || busy, placeholder: running ? 'Steer this run' : 'This run has finished', label: "Steer this run" })] })] }) }));
+    return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, width: "100%", children: [_jsxs(YStack, { flex: 1, minH: 0, minW: 0, width: "100%", px: "$6", children: [_jsxs(XStack, { pt: "$3", pb: "$2", gap: "$3", items: "center", minH: 44, children: [_jsxs(YStack, { flex: 1, minW: 0, children: [_jsx(SizableText, { render: "h1", size: "$5", color: "$ink", numberOfLines: 1, children: title }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: [state || (detail.loading ? 'reading' : ''), record?.repo, record?.branch].filter(Boolean).join(' · ') })] }), desk ? null : (_jsx(XStack, { render: "button", "aria-label": "Show the side pane", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, onPress: () => setDesk(true), children: _jsx(PanelRight, { size: 16 }) })), pr.href ? (_jsx(Out, { href: pr.href, label: `Open pull request ${pr.label}`, children: _jsxs(XStack, { items: "center", gap: "$1.5", px: "$2.5", py: "$1.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, children: [_jsx(GitPullRequest, { size: 14 }), _jsx(SizableText, { size: "$2", color: "$ink", children: pr.label }), _jsx(ExternalLink, { size: 12, opacity: 0.6 })] }) })) : null] }), _jsx(Transcript, { blocks: blocks, empty: _jsx(SizableText, { size: "$2", color: "$soft", children: detail.error ? detail.error.message : detail.loading ? 'Reading this run…' : running ? 'Setting up environment' : 'Waiting for the run’s first step…' }) }), _jsxs(YStack, { pb: "$4", pt: "$2", gap: "$2", children: [end.problem ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "The branch is pushed, and the pull request could not be opened." })) : null, note || refused ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note || refused })) : null, plan.length ? (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: [_jsxs(XStack, { px: "$3", py: "$2", justify: "space-between", items: "center", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: "Steps" }), _jsx(SizableText, { size: "$1", color: "$soft", children: String(plan.length) })] }), plan.map((s, i) => {
+                                        const current = !s.done && plan.findIndex((x) => !x.done) === i;
+                                        return (_jsxs(XStack, { items: "center", gap: "$2", px: "$3", py: "$1.5", borderTopWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$2", color: s.done || current ? '$ink' : '$soft', children: s.done ? '✓' : current ? '●' : '○' }), _jsx(SizableText, { size: "$2", color: s.done ? '$soft' : '$ink', numberOfLines: 1, children: s.name })] }, s.name));
+                                    })] })) : null, running ? (_jsxs(XStack, { items: "center", justify: "space-between", gap: "$3", px: "$3", py: "$2", rounded: "$10", borderWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: "Environment setup takes several minutes." }), _jsx(Button, { size: "sm", disabled: notify, onPress: () => void ask(), children: notify ? 'You will be notified' : 'Notify me' })] })) : null, _jsx(Composer, { inline: true, value: draft, onChange: setDraft, onSend: () => void send(), onStop: () => void halt(), busy: running && !draft.trim(), disabled: !running || busy, placeholder: running ? 'Add a follow up' : 'This run has finished', label: "Steer this run" })] })] }), desk ? _jsx(Desk, { id: id, repo: record?.repo ?? '', branch: record?.branch ?? '', base: record?.base ?? '', environment: record?.environment ?? '', mode: record?.mode ?? '', pr: pr, events: events, live: running, refused: refused || (detail.error ? detail.error.message : ''), onRetry: detail.reload, onHide: () => setDesk(false) }) : null] }));
 }

package/lib/section.d.ts

@@ -8,9 +8,10 @@ export declare const DOTS: Record<string, SessionStatus>;
 /** The org's coding runs, newest first, kept live by the org's feed. */
 export declare function useSessions(host: Host): Read<Session[]>;
 /**
- * New, Artifacts, Templates, then the runs. `children` sit between the places
- * and the runs — where a host lists its projects. `onPick` fires after a move,
- * so a host that draws its rail as a drawer on a phone can close it.
+ * New, Automations, the forge (Codebase, Projects, Issues), Artifacts, Templates, then the
+ * runs. `children` sit between the places and the runs — where a host lists its
+ * own. `onPick` fires after a move, so a host that draws its rail as a drawer
+ * on a phone can close it.
  */
 export declare function DevSection({ host, onPick, label, children, }: {
     host: Host;

package/lib/section.js

@@ -11,9 +11,10 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * host's own `go`.
  */
 import { SizableText } from '@hanzo/gui';
-import { Blocks, LayoutTemplate, SquarePen } from '@hanzogui/lucide-icons-2';
+import { Blocks, CircleDot, FolderGit2, Kanban, LayoutTemplate, SquarePen, Workflow } from '@hanzogui/lucide-icons-2';
 import { SidebarItem, SidebarSection, StatusDot } from '@hanzo/ui/chat';
 import { useMemo } from 'react';
+import { pinBoard } from './choice.js';
 import { useRecents } from './data.js';
 import { path, route } from './route.js';
 /** A run's status, as the rail's dot draws it. Anything else is idle. */
@@ -31,9 +32,10 @@ export function useSessions(host) {
 }
 const Note = ({ children }) => (_jsx(SizableText, { size: "$1", color: "$soft", px: "$2", py: "$1", children: children }));
 /**
- * New, Artifacts, Templates, then the runs. `children` sit between the places
- * and the runs — where a host lists its projects. `onPick` fires after a move,
- * so a host that draws its rail as a drawer on a phone can close it.
+ * New, Automations, the forge (Codebase, Projects, Issues), Artifacts, Templates, then the
+ * runs. `children` sit between the places and the runs — where a host lists its
+ * own. `onPick` fires after a move, so a host that draws its rail as a drawer
+ * on a phone can close it.
  */
 export function DevSection({ host, onPick, label = 'Runs', children, }) {
     const sessions = useSessions(host);
@@ -43,5 +45,8 @@ export function DevSection({ host, onPick, label = 'Runs', children, }) {
         onPick?.();
     };
     const screen = r.kind === 'screen' ? r.screen : '';
-    return (_jsxs(_Fragment, { children: [_jsx(SidebarItem, { icon: _jsx(SquarePen, { size: 16, "aria-hidden": true }), active: r.kind === 'new', onPress: () => go(''), children: "New run" }), _jsx(SidebarItem, { icon: _jsx(Blocks, { size: 16, "aria-hidden": true }), active: screen === 'artifacts', onPress: () => go(path({ kind: 'screen', screen: 'artifacts' })), children: "Artifacts" }), _jsx(SidebarItem, { icon: _jsx(LayoutTemplate, { size: 16, "aria-hidden": true }), active: screen === 'templates', onPress: () => go(path({ kind: 'screen', screen: 'templates' })), children: "Templates" }), children, _jsx(SidebarSection, { label: label, children: !host.person ? (_jsx(Note, { children: "Sign in to see your runs." })) : sessions.value.length ? (sessions.value.map((s) => (_jsx(SidebarItem, { icon: _jsx(StatusDot, { status: DOTS[s.status] ?? 'idle' }), active: r.kind === 'run' && r.id === s.id, onPress: () => go(s.id), children: s.title || 'Untitled run' }, s.id)))) : (_jsx(Note, { children: sessions.error ? sessions.error.message : sessions.loading ? 'Reading…' : 'No runs yet. Say what to build and it lands here.' })) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(SidebarItem, { icon: _jsx(SquarePen, { size: 16, "aria-hidden": true }), active: r.kind === 'new', onPress: () => go(''), children: "New run" }), _jsx(SidebarItem, { icon: _jsx(Workflow, { size: 16, "aria-hidden": true }), active: screen === 'automations', onPress: () => go(path({ kind: 'screen', screen: 'automations' })), children: "Automations" }), _jsx(SidebarItem, { icon: _jsx(FolderGit2, { size: 16, "aria-hidden": true }), active: screen === 'codebases', onPress: () => go(path({ kind: 'screen', screen: 'codebases' })), children: "Codebase" }), _jsx(SidebarItem, { icon: _jsx(Kanban, { size: 16, "aria-hidden": true }), active: screen === 'projects', onPress: () => go(path({ kind: 'screen', screen: 'projects' })), children: "Projects" }), _jsx(SidebarItem, { icon: _jsx(CircleDot, { size: 16, "aria-hidden": true }), active: screen === 'issues', onPress: () => {
+                    pinBoard(host.org, '');
+                    go(path({ kind: 'screen', screen: 'issues' }));
+                }, children: "Issues" }), _jsx(SidebarItem, { icon: _jsx(Blocks, { size: 16, "aria-hidden": true }), active: screen === 'artifacts', onPress: () => go(path({ kind: 'screen', screen: 'artifacts' })), children: "Artifacts" }), _jsx(SidebarItem, { icon: _jsx(LayoutTemplate, { size: 16, "aria-hidden": true }), active: screen === 'templates', onPress: () => go(path({ kind: 'screen', screen: 'templates' })), children: "Templates" }), children, _jsx(SidebarSection, { label: label, children: !host.person ? (_jsx(Note, { children: "Sign in to see your runs." })) : sessions.value.length ? (sessions.value.map((s) => (_jsx(SidebarItem, { icon: _jsx(StatusDot, { status: DOTS[s.status] ?? 'idle' }), active: r.kind === 'run' && r.id === s.id, onPress: () => go(s.id), children: s.title || 'Untitled run' }, s.id)))) : (_jsx(Note, { children: sessions.error ? sessions.error.message : sessions.loading ? 'Reading…' : 'No runs yet. Say what to build and it lands here.' })) })] }));
 }

package/lib/sync.d.ts

@@ -0,0 +1 @@
+export declare function Sync(): import("react").JSX.Element;

package/lib/sync.js

@@ -0,0 +1,124 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Bring repositories the GitHub connection already grants onto the forge.
+ *
+ * The list is GET /v1/provider/github/repos. The queue is POST
+ * /v1/provider/github/repos/import, which mirrors `owner/name` into this
+ * organization's forge in the background. An account named unread and holding
+ * no repositories is shown as needing an organization admin.
+ */
+import { SizableText, XStack, YStack } from '@hanzo/gui';
+import { Check, ChevronLeft, ChevronRight, Plus, X } from '@hanzogui/lucide-icons-2';
+import { Button, Input } from '@hanzo/ui';
+import { useEffect, useMemo, useState } from 'react';
+import { accounts, bring, connect, grants } from './api/github.js';
+import { readPending, writePending } from './choice.js';
+import { useRead } from './data.js';
+import { useHost, useTarget } from './host.js';
+import { path } from './route.js';
+const EMPTY = { repos: [], unread: [] };
+function noteOf(e, fallback) {
+    return e instanceof Error ? e.message : fallback;
+}
+export function Sync() {
+    const host = useHost();
+    const t = useTarget();
+    const signed = Boolean(host.person);
+    const [q, setQ] = useState('');
+    const [owner, setOwner] = useState('');
+    const [step, setStep] = useState('pick');
+    const [picked, setPicked] = useState([]);
+    const [busy, setBusy] = useState(false);
+    const [syncing, setSyncing] = useState(false);
+    const [error, setError] = useState('');
+    const list = useRead(signed ? () => grants(t) : null, EMPTY, [t, signed]);
+    const rows = list.value.repos;
+    const orgs = useMemo(() => accounts(list.value), [list.value]);
+    const needle = q.trim().toLowerCase();
+    const shownOrgs = orgs.filter((a) => !needle || a.name.toLowerCase().includes(needle));
+    const ofOwner = rows.filter((r) => r.owner === owner);
+    const shownRepos = ofOwner.filter((r) => !needle || r.name.toLowerCase().includes(needle) || r.fullName.toLowerCase().includes(needle));
+    const chosen = rows.filter((r) => picked.includes(r.fullName));
+    const lead = chosen[0]?.name ?? '';
+    const more = Math.max(0, chosen.length - 1);
+    const dest = host.org || 'Forge';
+    const toggle = (fullName) => {
+        setPicked((cur) => (cur.includes(fullName) ? cur.filter((n) => n !== fullName) : [...cur, fullName]));
+    };
+    const selectShown = () => {
+        const names = shownRepos.map((r) => r.fullName);
+        const all = names.every((n) => picked.includes(n));
+        setPicked((cur) => (all ? cur.filter((n) => !names.includes(n)) : [...new Set([...cur, ...names])]));
+    };
+    const addOrg = async () => {
+        setError('');
+        try {
+            const url = await connect(t);
+            host.open(url);
+        }
+        catch (e) {
+            setError(noteOf(e, 'Could not open the GitHub connection'));
+        }
+    };
+    const send = async () => {
+        setBusy(true);
+        setError('');
+        try {
+            await bring(t, picked);
+            const next = [
+                ...readPending(host.org).filter((p) => !picked.includes(p.fullName)),
+                ...chosen.map((r) => ({ fullName: r.fullName, name: r.name })),
+            ];
+            writePending(host.org, next);
+            setSyncing(true);
+        }
+        catch (e) {
+            setError(noteOf(e, 'Could not queue those repositories'));
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const back = () => {
+        host.go(path({ kind: 'screen', screen: 'codebases' }));
+    };
+    useEffect(() => {
+        if (!syncing)
+            return;
+        let stop = false;
+        const tick = async () => {
+            try {
+                const g = await grants(t);
+                const landed = new Set(g.repos.filter((r) => r.imported).map((r) => r.fullName));
+                const left = readPending(host.org).filter((p) => !landed.has(p.fullName));
+                writePending(host.org, left);
+                if (!stop && picked.every((n) => landed.has(n)))
+                    back();
+            }
+            catch {
+                /* the button stays on Syncing until the next look */
+            }
+        };
+        const id = window.setInterval(() => void tick(), 4000);
+        return () => {
+            stop = true;
+            window.clearInterval(id);
+        };
+    }, [syncing, t, host.org, host.go, picked]);
+    return (_jsxs(YStack, { flex: 1, minH: 0, overflow: "scroll", children: [_jsxs(XStack, { px: "$6", pt: "$5", pb: "$2", gap: "$2", items: "center", children: [_jsx(XStack, { render: "button", "aria-label": "Back to codebases", onPress: back, children: _jsx(SizableText, { size: "$2", color: "$soft", children: "Codebase" }) }), _jsx(SizableText, { size: "$2", color: "$soft", children: "/" }), _jsx(SizableText, { size: "$2", color: "$ink", children: "Sync" })] }), _jsxs(YStack, { flex: 1, items: "center", justify: "center", px: "$6", pb: "$10", gap: "$5", children: [_jsxs(XStack, { justify: "center", gap: "$6", children: [_jsx(Step, { label: "Select repositories", done: step === 'access', current: step === 'pick' }), _jsx(Step, { label: "Repository access", done: false, current: step === 'access' })] }), _jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$5", bg: "$panel", px: "$6", py: "$6", gap: "$4", width: "100%", maxW: 460, children: [step === 'pick' && !owner ? (_jsxs(_Fragment, { children: [_jsxs(YStack, { gap: "$1", items: "center", children: [_jsx(SizableText, { size: "$5", color: "$ink", children: "Select repositories" }), _jsxs(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center' }, children: ["Choose repositories to bring into ", dest] })] }), _jsxs(Panel, { children: [_jsx(Input, { value: q, onChangeText: setQ, placeholder: "Search organizations", "aria-label": "Search organizations", disabled: !signed }), signed ? (_jsx(SizableText, { size: "$1", color: "$soft", children: `${orgs.length} ${orgs.length === 1 ? 'organization' : 'organizations'}` })) : null, list.error ? _jsx(Soft, { children: list.error.message }) : null, !signed ? (_jsx(Soft, { children: "Sign in to choose repositories the GitHub connection can read." })) : list.loading && rows.length === 0 && orgs.length === 0 ? (_jsx(Soft, { children: "Reading the connection\u2026" })) : shownOrgs.length === 0 ? (_jsx(Soft, { children: orgs.length === 0 ? 'No organizations on this connection yet.' : 'Nothing matches.' })) : (shownOrgs.map((a) => (_jsxs(XStack, { render: "button", "aria-label": a.blocked ? `${a.name} needs an organization admin` : `Open ${a.name}`, disabled: a.blocked, items: "center", gap: "$2", py: "$2", borderTopWidth: 1, borderColor: "$borderColor", onPress: () => {
+                                                    setOwner(a.name);
+                                                    setQ('');
+                                                }, children: [_jsx(SizableText, { flex: 1, size: "$2", color: a.blocked ? '$soft' : '$ink', numberOfLines: 1, children: a.name }), a.blocked ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "Needs organization admin" })) : (_jsx(ChevronRight, { size: 14 }))] }, a.name)))), _jsxs(XStack, { render: "button", "aria-label": "Add organization", items: "center", gap: "$2", py: "$2", onPress: () => void addOrg(), disabled: !signed, children: [_jsx(Plus, { size: 14 }), _jsx(SizableText, { size: "$2", color: "$ink", children: "Add organization" })] })] })] })) : null, step === 'pick' && owner ? (_jsxs(_Fragment, { children: [_jsxs(YStack, { gap: "$1", items: "center", children: [_jsx(SizableText, { size: "$5", color: "$ink", children: "Select repositories" }), _jsxs(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center' }, children: ["Choose repositories to bring into ", dest] })] }), _jsxs(Panel, { children: [_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(XStack, { render: "button", "aria-label": "All organizations", onPress: () => setOwner(''), children: _jsx(ChevronLeft, { size: 16 }) }), _jsx(SizableText, { flex: 1, size: "$2", color: "$ink", numberOfLines: 1, children: owner })] }), _jsx(Input, { value: q, onChangeText: setQ, placeholder: "Search repositories", "aria-label": "Search repositories" }), _jsxs(XStack, { justify: "space-between", items: "center", children: [_jsxs(SizableText, { size: "$1", color: "$soft", children: [ofOwner.length, " ", ofOwner.length === 1 ? 'repository' : 'repositories'] }), _jsx(XStack, { render: "button", "aria-label": "Select all", onPress: selectShown, disabled: shownRepos.length === 0, children: _jsx(SizableText, { size: "$1", color: "$ink", children: "Select all" }) })] }), shownRepos.length === 0 ? (_jsx(Soft, { children: "Nothing matches." })) : (shownRepos.map((r) => (_jsx(RepoRow, { repo: r, on: picked.includes(r.fullName), onPress: () => toggle(r.fullName) }, r.fullName)))), _jsxs(XStack, { render: "button", "aria-label": "Grant more repositories", items: "center", gap: "$2", py: "$2", onPress: () => void addOrg(), children: [_jsx(Plus, { size: 14 }), _jsx(SizableText, { size: "$2", color: "$ink", children: "Add repositories" })] })] })] })) : null, step === 'access' ? (_jsxs(_Fragment, { children: [_jsxs(YStack, { gap: "$1", items: "center", children: [_jsx(SizableText, { size: "$5", color: "$ink", children: "Repository access" }), _jsx(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center' }, children: "Review who can read these repositories" })] }), _jsxs(XStack, { gap: "$2", items: "center", children: [_jsxs(XStack, { flex: 1, items: "center", gap: "$2", px: "$3", py: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", children: [_jsx(XStack, { render: "button", "aria-label": "Clear the selection", onPress: () => { setPicked([]); setStep('pick'); }, children: _jsx(X, { size: 12 }) }), _jsx(SizableText, { flex: 1, size: "$2", color: "$ink", numberOfLines: 1, children: more ? `${lead}, +${more} more` : lead })] }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => setStep('pick'), children: "Edit" })] }), _jsxs(XStack, { justify: "space-between", gap: "$4", children: [_jsxs(YStack, { gap: "$1", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Who gets access" }), _jsxs(SizableText, { size: "$2", color: "$ink", children: [host.person?.name || host.person?.email || 'You', " \u00B7 You"] })] }), _jsxs(YStack, { gap: "$1", items: "flex-end", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Role" }), _jsx(SizableText, { size: "$2", color: "$ink", children: host.admin ? 'Repository admin' : 'Member' })] })] }), _jsxs(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center' }, children: ["Anyone with access to ", dest] })] })) : null, error ? _jsx(Soft, { children: error }) : null, step === 'pick' ? (_jsx(Button, { width: "100%", disabled: !owner || picked.length === 0, onPress: () => setStep('access'), children: "Continue" })) : (_jsxs(YStack, { gap: "$3", items: "center", width: "100%", children: [_jsx(Button, { width: "100%", disabled: busy || syncing || picked.length === 0, onPress: () => void send(), children: syncing || busy ? 'Syncing…' : `Sync ${picked.length} ${picked.length === 1 ? 'repository' : 'repositories'} to ${dest}` }), syncing ? null : (_jsx(XStack, { render: "button", "aria-label": "Sync later", onPress: back, children: _jsx(SizableText, { size: "$2", color: "$soft", children: "Sync later" }) }))] })), !signed ? (_jsx(Button, { width: "100%", onPress: () => host.signIn?.(), children: "Sign in" })) : null] })] })] }));
+}
+function Step({ label, done, current }) {
+    return (_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(YStack, { width: 14, height: 14, rounded: 999, bg: done ? '$green10' : 'transparent', borderWidth: 1, borderColor: done || current ? '$ink' : '$borderColor', items: "center", justify: "center", children: done ? _jsx(Check, { size: 10, color: "white" }) : null }), _jsx(SizableText, { size: "$1", color: current || done ? '$ink' : '$soft', children: label })] }));
+}
+function Panel({ children }) {
+    return (_jsx(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", px: "$3", py: "$2", gap: "$2", maxH: 360, overflow: "scroll", children: children }));
+}
+function Soft({ children }) {
+    return (_jsx(SizableText, { size: "$2", color: "$soft", children: children }));
+}
+function RepoRow({ repo, on, onPress }) {
+    return (_jsxs(XStack, { render: "button", "aria-label": on ? `Selected ${repo.name}` : `Select ${repo.name}`, "aria-pressed": on, items: "center", gap: "$2", py: "$2", borderTopWidth: 1, borderColor: "$borderColor", onPress: onPress, children: [_jsx(YStack, { width: 14, height: 14, rounded: "$1", borderWidth: 1, borderColor: on ? '$ink' : '$borderColor', bg: on ? '$ink' : 'transparent' }), _jsx(SizableText, { flex: 1, size: "$2", color: "$ink", numberOfLines: 1, children: repo.name }), repo.imported ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "On Forge" })) : null] }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/build",
-  "version": "0.2.4",
+  "version": "0.2.6",
   "type": "module",
   "license": "Apache-2.0 OR MIT",
   "description": "Hanzo Build — say what you want, watch it built, deployed and running. The builder as a page (hanzo.build) and as a component (hanzo.ai/dev).",
@@ -65,6 +65,7 @@
     "build:lib": "rm -rf lib && tsc -p tsconfig.lib.json",
     "typecheck": "tsc --noEmit",
     "preview": "vite preview",
-    "test": "vitest run"
+    "test": "vitest run",
+    "e2e": "HANZO_E2E=1 vitest run src/e2e"
   }
 }