@hanzo/build 0.2.51 → 0.2.52

package/README.md

@@ -99,18 +99,18 @@ hanzo.id token for `Host.admin`. One left column, never two.
 | `-/automations` | repeating work, read from `/v1/auto/flows` |
 | `-/customize` · `-/customize/connectors` · `/plugins` · `/agents` | Customize: skills, connectors, plugins, agents |
 | `-/mcp` | Connectors → Discover, where the fleet's native MCP servers now live |
-| `-/codebases` | the forge's repositories |
-| `-/sync` | bring granted repositories onto the forge |
-| `-/projects` | the forge's boards |
+| `-/projects` | the org's projects: its repositories on the forge |
+| `-/sync` | link repositories from GitHub onto the forge |
 | `-/issues` | the forge's issues |
 | `-/artifacts` | what the org has built |
 | `-/templates` | the public starters |
 | `-/plans` | the plans this brand sells, and the move to another |
 | `-/settings/<section>` | Billing, Usage, Members, Integrations, Notifications, … |
-| `<slug>` | a project's workspace |
+| `<org>/<repo>` | a project's workspace: the repository, and its site when it has one |
+| `<slug>` | a deployed site's workspace |
 
-A project slug holds no `_` and never starts with `-`, so the forms cannot
-collide.
+A project slug holds no `_` and never starts with `-`, and a repository is the
+one address of two segments, so the forms cannot collide.
 
 ## What is on the screen
 

package/lib/api/github.d.ts

@@ -8,6 +8,7 @@
  *   POST /v1/provider/github/user/complete     {grant} → the connection
  *   POST /v1/provider/github/user/disconnect
  *   GET  /v1/provider/github/installations     the accounts this org has bound the App on
+ *   POST /v1/provider/github/issues/backfill   {state, repo?} → mirror GitHub issues onto the board
  *
  * Paged by an opaque `after` cursor; `next` is the cursor for the page after
  * this one, or empty on the last. Rows are read defensively: a field the
@@ -128,3 +129,20 @@ export declare function accounts(g: Grants): Account[];
 export declare function grants(t: Target, signal?: AbortSignal): Promise<Grants>;
 /** Queue a mirror of the named repositories onto the forge. The names are `owner/name`. */
 export declare function bring(t: Target, repos: string[]): Promise<number>;
+/** What one issue sync did. */
+export interface Synced {
+    repos: number;
+    issues: number;
+    created: number;
+    updated: number;
+    failed: number;
+    /** The pass stopped at its budget; syncing again continues where it stopped. */
+    truncated: boolean;
+}
+/**
+ * Mirror GitHub issues onto the board — open and closed, so a closed one reads as
+ * closed here too. `repo` (`name` or `owner/name`) syncs one project; empty syncs
+ * every repository the connection grants. Idempotent: a second sync updates and
+ * never duplicates, and the App's webhook keeps them live afterwards.
+ */
+export declare function syncIssues(t: Target, repo?: string): Promise<Synced>;

package/lib/api/github.js

@@ -8,6 +8,7 @@
  *   POST /v1/provider/github/user/complete     {grant} → the connection
  *   POST /v1/provider/github/user/disconnect
  *   GET  /v1/provider/github/installations     the accounts this org has bound the App on
+ *   POST /v1/provider/github/issues/backfill   {state, repo?} → mirror GitHub issues onto the board
  *
  * Paged by an opaque `after` cursor; `next` is the cursor for the page after
  * this one, or empty on the last. Rows are read defensively: a field the
@@ -143,3 +144,21 @@ export async function bring(t, repos) {
     const raw = obj(await call(t, 'POST', '/v1/provider/github/repos/import', { repos: names }));
     return num(raw.queued);
 }
+/**
+ * Mirror GitHub issues onto the board — open and closed, so a closed one reads as
+ * closed here too. `repo` (`name` or `owner/name`) syncs one project; empty syncs
+ * every repository the connection grants. Idempotent: a second sync updates and
+ * never duplicates, and the App's webhook keeps them live afterwards.
+ */
+export async function syncIssues(t, repo = '') {
+    const name = repo.trim();
+    const raw = obj(await call(t, 'POST', '/v1/provider/github/issues/backfill', name ? { state: 'all', repo: name } : { state: 'all' }));
+    return {
+        repos: num(raw.repos),
+        issues: num(raw.issues),
+        created: num(raw.created),
+        updated: num(raw.updated),
+        failed: num(raw.failed),
+        truncated: raw.truncated === true,
+    };
+}

package/lib/api/work.d.ts

@@ -31,7 +31,21 @@ export interface Work {
     assignee: string;
     /** The repository the item is bound to, or ''. */
     repo: string;
+    /** Where it was opened: `git` (the forge, or mirrored from GitHub), `team`, `agent`, … */
+    source: string;
+    labels: string[];
+    /** Its page upstream (a GitHub issue for a mirrored one), https only, or ''. */
+    url: string;
+    /** Unix milliseconds, or 0 when the platform did not say. */
+    created: number;
+    updated: number;
 }
+/** The project an item is filed under: its repository, else its board. */
+export declare const projectOf: (w: Work) => string;
+/** Done and canceled are closed; every other column is open work. */
+export declare const closed: (w: Work) => boolean;
+/** Whether `w` belongs to the project `key` — by repository or by board, either case. */
+export declare function inProject(w: Work, key: string): boolean;
 export declare function board(raw: unknown): Board | null;
 export declare function work(raw: unknown): Work | null;
 export declare function boards(t: Target): Promise<Board[]>;

package/lib/api/work.js

@@ -12,7 +12,19 @@
  * reads the work and opens a run against it.
  */
 import { call, seg } from './call.js';
+/** The project an item is filed under: its repository, else its board. */
+export const projectOf = (w) => w.repo || w.project;
+/** Done and canceled are closed; every other column is open work. */
+export const closed = (w) => w.status === 'done' || w.status === 'canceled';
+/** Whether `w` belongs to the project `key` — by repository or by board, either case. */
+export function inProject(w, key) {
+    const k = key.toLowerCase();
+    return w.repo.toLowerCase() === k || w.project.toLowerCase() === k;
+}
 const str = (v) => (typeof v === 'string' ? v : '');
+/** The platform states seconds; a value already in milliseconds is kept. */
+const when = (v) => (typeof v === 'number' && Number.isFinite(v) && v > 0 ? (v < 1e12 ? v * 1000 : v) : 0);
+const https = (v) => (typeof v === 'string' && /^https:\/\//.test(v) ? v : '');
 const obj = (v) => v && typeof v === 'object' ? v : {};
 function rows(raw) {
     if (Array.isArray(raw))
@@ -49,6 +61,11 @@ export function work(raw) {
         priority: str(o.priority) || 'none',
         assignee: str(o.assignee),
         repo: str(o.repo),
+        source: str(o.source),
+        labels: Array.isArray(o.labels) ? o.labels.filter((l) => typeof l === 'string' && l !== '') : [],
+        url: https(o.url) || https(o.extRef),
+        created: when(o.createdAt),
+        updated: when(o.updatedAt),
     };
 }
 export async function boards(t) {

package/lib/builder.js

@@ -5,14 +5,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  *   /            New — the empty state, a composer over the codebase it works on
  *   /sess_…      one run, live
  *   /-/automations work that runs itself; /-/automations/<id> one, to edit and run
-   /-/codebases the forge's repositories
- *   /-/sync      bring granted repositories onto the forge
- *   /-/projects  the forge's boards
+ *   /-/projects  the org's repositories on the forge: a project is a repository
+ *   /-/sync      link repositories from GitHub onto the forge
  *   /-/issues    the forge's issues
  *   /-/artifacts what this org has built
  *   /-/templates the public starters
  *   /-/customize skills, connectors, plugins and agents
- *   /<slug>      a deployed project's workspace, in this same window
+ *   /<org>/<repo> a repository's workspace, in this same window
+ *   /<slug>      a deployed site's workspace
  *
  * The rail is the sessions rail every Hanzo surface shares: New, the builder's
  * places with the rest under More, the org's coding runs newest first with a
@@ -20,15 +20,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * 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.
+ * A workspace takes the whole window — it has its own chat column, bar and
+ * panes — and its mark leads back here.
  *
  * A host with a rail of its own mounts `<Builder rail={false}>` and draws the
  * builder's places (`nav`) and runs in that rail (`useSessions`, or `DevSection`,
  * section.tsx): one left column, never two.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
-import { Blocks, BookOpen, CircleDot, Cpu, FolderGit2, Kanban, LayoutTemplate, Menu, Search, SlidersHorizontal, Workflow } from '@hanzogui/lucide-icons-2';
+import { Blocks, BookOpen, CircleDot, Cpu, FolderGit2, LayoutTemplate, Menu, Search, SlidersHorizontal, Workflow } from '@hanzogui/lucide-icons-2';
 import { Button } from '@hanzo/ui';
 import { SessionRail } from '@hanzo/ui/chat';
 import { HanzoMark } from '@hanzo/ui/product';
@@ -98,13 +98,18 @@ export function nav(host, go) {
     const r = route(host.path);
     const screen = r.kind === 'screen' ? r.screen : '';
     const links = [
-        { id: 'projects', label: 'Projects', icon: _jsx(Kanban, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'projects' })), active: screen === 'projects' },
+        {
+            id: 'projects',
+            label: 'Projects',
+            icon: _jsx(FolderGit2, { size: 16 }),
+            onPress: () => go(path({ kind: 'screen', screen: 'projects' })),
+            active: screen === 'projects' || screen === 'sync' || r.kind === 'repo',
+        },
         { 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' || r.kind === 'automation' },
     ];
     const more = [
-        { id: 'codebases', label: 'Codebase', icon: _jsx(FolderGit2, { size: 16 }), onPress: () => go(path({ kind: 'screen', screen: 'codebases' })), active: screen === 'codebases' },
         {
             id: 'issues',
             label: 'Issues',
@@ -172,7 +177,9 @@ function Screens({ rail }) {
     const host = useHost();
     const r = route(host.path);
     if (r.kind === 'project')
-        return _jsx(Project, { slug: r.slug }, r.slug);
+        return _jsx(Project, { at: { slug: r.slug } }, r.slug);
+    if (r.kind === 'repo')
+        return _jsx(Project, { at: { org: r.org, name: r.name } }, `${r.org}/${r.name}`);
     if (!rail)
         return _jsx(Pane, {});
     return _jsx(Shell, {});

package/lib/forge.js

@@ -1,33 +1,30 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * Codebases, projects and issues, read from the forge and opened in this window.
+ * Projects and issues, read from the forge and opened in this window.
  *
- * A codebase is a repository. Choosing one is choosing what the next run works
- * on. A project is a board of issues on one of those repositories. Choosing an
- * issue opens New with that codebase and the issue as the ask.
+ * A project is a repository, linked from GitHub or started from a template;
+ * choosing one opens its workspace, where every run works on it. Issues are
+ * the forge's, filed under a board or a repository, and a repository's GitHub
+ * issues sync onto it. Choosing an issue opens New with that repository and
+ * the issue as the ask.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
-import { ChevronDown, GitBranch, Plus, Settings } from '@hanzogui/lucide-icons-2';
-import { Button, Dialog, DialogContent, DialogTitle, Input } from '@hanzo/ui';
+import { ArrowRight, Check, ChevronDown, CircleCheck, CircleDot, CircleSlash, ExternalLink, FolderGit2, GitBranch, Github, GitPullRequest, LayoutTemplate, RefreshCw, } from '@hanzogui/lucide-icons-2';
+import { Button, DropdownMenu, Input } from '@hanzo/ui';
 import { useEffect, useState } from 'react';
 import { ago } from './ago.js';
-import { codebases, create } from './api/codebases.js';
+import { codebases } from './api/codebases.js';
 import { Automations } from './automations.js';
-import { environments } from './api/environment.js';
-import { boards, issues } from './api/work.js';
-import { boardKey, pinBoard, pinCodebase, readPending, writePending } from './choice.js';
+import { boards, closed, inProject, issues, projectOf } from './api/work.js';
+import { boardKey, pinCodebase, readPending, writePending } from './choice.js';
 import { useKept, useRead } from './data.js';
 import { useHost, useTarget } from './host.js';
 import { path } from './route.js';
 import { Customize } from './customize/index.js';
 import { Sync } from './sync.js';
-import { grants } from './api/github.js';
-function Head({ title, says }) {
-    return (_jsxs(YStack, { gap: "$1", pb: "$4", children: [_jsx(SizableText, { render: "h1", size: "$6", color: "$ink", children: title }), _jsx(SizableText, { size: "$2", color: "$soft", children: says })] }));
-}
-function Row({ label, onPress, children }) {
-    return (_jsx(XStack, { render: "button", onPress: onPress, "aria-label": label, items: "center", gap: "$3", px: "$3", py: "$2.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", hoverStyle: { borderColor: '$edge', bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: children }));
-}
+import { connect, connection, grants, syncIssues } from './api/github.js';
+import { here, useBack } from './back.js';
+import { Out } from './out.js';
 function Note({ children }) {
     return (_jsx(SizableText, { size: "$2", color: "$soft", children: children }));
 }
@@ -46,34 +43,34 @@ export function Forge({ screen }) {
     // The fleet's native servers are Connectors → Discover now; the old address lands there.
     if (screen === 'mcp')
         return _jsx(Customize, { tab: "connectors", view: "discover" });
-    if (screen === 'codebases')
-        return _jsx(Codebases, {});
     if (screen === 'projects')
         return _jsx(Projects, {});
     return _jsx(Issues, {});
 }
 const PAGE = 25;
-function Codebases() {
+/**
+ * The organization's projects: its repositories on the forge, which arrive one
+ * of two ways — linked from GitHub, or started from a template. A project is a
+ * repository; opening one opens its workspace at `<org>/<repo>`, and every run
+ * there works on that repository. There is no project without one.
+ */
+function Projects() {
     const host = useHost();
     const t = useTarget();
     const signed = Boolean(host.person);
     const [q, setQ] = useState('');
-    const [making, setMaking] = useState(false);
-    const [sort, setSort] = useState('name');
-    const [filter, setFilter] = useState('all');
+    const [sort, setSort] = useState('updated');
     const [page, setPage] = useState(0);
     const [landed, setLanded] = useState(0);
     useEffect(() => {
         setPage(0);
-    }, [q, sort, filter]);
-    const list = useRead(signed ? () => codebases(t) : null, [], [t, signed, making, landed]);
-    // Which codebases have an environment. A codebase absent here has none.
-    const envs = useRead(signed ? () => environments(t) : null, [], [t, signed]);
-    const envOf = new Map(envs.value.map((e) => [e.repo, e.state]));
+    }, [q, sort]);
+    const list = useRead(signed ? () => codebases(t) : null, [], [t, signed, landed]);
     const needle = q.trim().toLowerCase();
     const pending = readPending(host.org);
     const pendingKey = pending.map((p) => p.fullName).join('\n');
     const syncing = new Set(pending.map((p) => p.name));
+    // A repository asked for from GitHub is listed as syncing until the forge holds it.
     useEffect(() => {
         const waiting = readPending(host.org);
         if (!signed || waiting.length === 0)
@@ -110,19 +107,12 @@ function Codebases() {
             branches: ['main'],
         })),
     ]
-        .filter((c) => {
-        if (filter === 'ready')
-            return envOf.get(c.name) === 'ready';
-        if (filter === 'syncing')
-            return syncing.has(c.name);
-        return true;
-    })
         .filter((c) => !needle || `${c.org}/${c.name} ${c.description}`.toLowerCase().includes(needle))
         .slice()
         .sort((a, b) => {
         if (sort === 'updated') {
-            const d = Date.parse(b.updated) - Date.parse(a.updated);
-            if (Number.isFinite(d) && d !== 0)
+            const d = (Date.parse(b.updated) || 0) - (Date.parse(a.updated) || 0);
+            if (d !== 0)
                 return d;
         }
         return a.name.localeCompare(b.name);
@@ -132,69 +122,158 @@ function Codebases() {
     const slice = shown.slice(safePage * PAGE, safePage * PAGE + PAGE);
     const from = shown.length === 0 ? 0 : safePage * PAGE + 1;
     const to = safePage * PAGE + slice.length;
-    const open = (c) => {
-        pinCodebase(host.org, c);
-        host.go('');
-    };
-    return (_jsxs(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", children: [_jsxs(YStack, { width: "100%", maxW: 1040, mx: "auto", gap: "$4", children: [_jsxs(XStack, { justify: "space-between", items: "flex-start", gap: "$4", children: [_jsxs(YStack, { gap: "$1", flex: 1, minW: 0, children: [_jsx(SizableText, { size: "$6", fontWeight: "500", color: "$ink", children: host.org || 'Forge' }), _jsx(SizableText, { size: "$2", color: "$soft", children: "Create and browse this organization\u2019s repositories." })] }), _jsxs(XStack, { render: "button", "aria-label": "Settings", shrink: 0, items: "center", gap: "$1.5", px: "$2", py: "$1", rounded: "$3", hoverStyle: { bg: '$hover' }, onPress: () => host.go('-/settings/environments'), children: [_jsx(Settings, { size: 14 }), _jsx(SizableText, { size: "$2", color: "$soft", children: "Settings" })] })] }), _jsxs(XStack, { gap: "$2", items: "center", children: [_jsx(XStack, { render: "button", "aria-label": "Filter repositories", onPress: () => setFilter((f) => (f === 'all' ? 'ready' : f === 'ready' ? 'syncing' : 'all')), px: "$2.5", py: "$1.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", shrink: 0, hoverStyle: { bg: '$hover' }, "$max-md": { display: 'none' }, children: _jsx(SizableText, { size: "$2", color: "$ink", children: filter === 'ready' ? 'Ready env' : filter === 'syncing' ? 'Syncing' : 'All repos' }) }), _jsx(YStack, { flex: 1, "$max-md": { display: 'none' } }), _jsx(YStack, { width: 240, minW: 0, shrink: 1, "$max-md": { width: 'auto', flex: 1 }, children: _jsx(Input, { value: q, onChangeText: setQ, placeholder: "Find repo\u2026", "aria-label": "Find a repository", disabled: !signed }) }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'sync' })), children: "Sync" }), _jsxs(Button, { size: "sm", disabled: !signed, onPress: () => setMaking(true), children: [_jsx(Plus, { size: 14 }), "New"] })] }), list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Note, { children: "Sign in to see this organization's repositories." })) : list.loading && list.value.length === 0 ? (_jsx(Note, { children: "Reading the forge\u2026" })) : shown.length === 0 ? (_jsxs(YStack, { gap: "$3", py: "$2", children: [_jsx(Note, { children: list.value.length === 0 ? 'No repositories yet.' : 'Nothing matches.' }), list.value.length === 0 ? (_jsxs(XStack, { gap: "$2", pt: "$1", children: [_jsxs(Button, { size: "sm", disabled: !signed, onPress: () => setMaking(true), children: [_jsx(Plus, { size: 14 }), "Create repository"] }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'sync' })), children: "Sync from GitHub" }), _jsx(Button, { size: "sm", variant: "ghost", onPress: () => host.go('-/templates'), children: "Start from template" })] })) : null] })) : (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: [_jsxs(XStack, { px: "$3", py: "$2", gap: "$3", items: "center", children: [_jsxs(XStack, { flex: 1, render: "button", "aria-label": "Sort by name", items: "center", gap: "$1", onPress: () => setSort('name'), children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Name" }), sort === 'name' ? _jsx(ChevronDown, { size: 12 }) : null] }), _jsx(SizableText, { size: "$1", color: "$soft", width: 96, "$max-md": { display: 'none' }, children: "Environment" }), _jsxs(XStack, { render: "button", "aria-label": "Sort by last updated", items: "center", justify: "flex-end", gap: "$1", width: 140, onPress: () => setSort('updated'), children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Last updated" }), sort === 'updated' ? _jsx(ChevronDown, { size: 12 }) : null] })] }), slice.map((c) => (_jsxs(XStack, { render: "button", "aria-label": `Work on ${c.name}`, onPress: () => open(c), items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: [_jsx(GitBranch, { size: 14 }), _jsx(SizableText, { flex: 1, size: "$2", color: "$ink", numberOfLines: 1, children: c.name }), _jsx(SizableText, { size: "$1", color: "$soft", width: 96, "$max-md": { display: 'none' }, children: envOf.get(c.name) === 'ready' ? 'Ready' : envOf.get(c.name) === 'proposed' ? 'To review' : '—' }), _jsx(SizableText, { size: "$1", color: "$soft", width: 140, style: { textAlign: 'right' }, children: syncing.has(c.name) ? 'Syncing…' : ago(c.updated) })] }, `${c.org}/${c.name}`))), _jsxs(XStack, { px: "$3", py: "$2", justify: "space-between", items: "center", borderTopWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: `Showing ${from}–${to} of ${shown.length}` }), _jsxs(XStack, { gap: "$3", items: "center", children: [_jsx(XStack, { render: "button", "aria-label": "Previous page", disabled: safePage === 0, onPress: () => setPage(safePage - 1), children: _jsx(SizableText, { size: "$1", color: safePage === 0 ? '$soft' : '$ink', children: "Prev" }) }), _jsx(SizableText, { size: "$1", color: "$soft", children: `${safePage + 1} / ${pages}` }), _jsx(XStack, { render: "button", "aria-label": "Next page", disabled: safePage >= pages - 1, onPress: () => setPage(safePage + 1), children: _jsx(SizableText, { size: "$1", color: safePage >= pages - 1 ? '$soft' : '$ink', children: "Next" }) })] })] })] }))] }), _jsx(NewRepo, { open: making, onOpenChange: setMaking, onCreate: async (name, description) => {
-                    const row = await create(t, name, description);
-                    pinCodebase(host.org, row);
-                    setMaking(false);
-                    host.go('');
-                } })] }));
+    const none = !list.loading && !list.error && list.value.length === 0 && pending.length === 0;
+    const open = (c) => host.go(path({ kind: 'repo', org: c.org || host.org || '', name: c.name }));
+    const link = () => host.go(path({ kind: 'screen', screen: 'sync' }));
+    const template = () => host.go(path({ kind: 'screen', screen: 'templates' }));
+    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", "$max-md": { px: '$4' }, children: _jsxs(YStack, { width: "100%", maxW: 1040, mx: "auto", gap: "$4", children: [_jsxs(XStack, { justify: "space-between", items: "flex-start", gap: "$4", flexWrap: "wrap", children: [_jsxs(YStack, { gap: "$1", flex: 1, minW: 240, children: [_jsx(SizableText, { render: "h1", size: "$6", fontWeight: "500", color: "$ink", children: "Projects" }), _jsx(SizableText, { size: "$2", color: "$soft", children: `${host.org ? `${host.org}’s` : 'This organization’s'} repositories on the forge. Open one to work on it.` })] }), _jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", children: [_jsxs(Button, { size: "sm", variant: "outline", onPress: template, children: [_jsx(LayoutTemplate, { size: 14 }), "Create from template"] }), _jsxs(Button, { size: "sm", variant: "primary", onPress: link, children: [_jsx(Github, { size: 14 }), "Link a GitHub repo"] })] })] }), signed ? _jsx(GitHubLink, { onSync: link }) : null, list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Note, { children: "Sign in to see this organization's projects." })) : list.loading && list.value.length === 0 && pending.length === 0 ? (_jsx(Note, { children: "Reading the forge\u2026" })) : none ? (_jsxs(YStack, { gap: "$3", py: "$2", children: [_jsx(Note, { children: "No projects yet. A project is a repository: link one from GitHub, or start one from a template." }), _jsxs(XStack, { gap: "$3", flexWrap: "wrap", children: [_jsx(Choice, { label: "Link a GitHub repo", icon: _jsx(Github, { size: 20 }), says: "Mirror repositories you already have. They stay in step with GitHub, and their issues can come too.", onPress: link }), _jsx(Choice, { label: "Create from template", icon: _jsx(LayoutTemplate, { size: 20 }), says: "Start from a finished product \u2014 a site, an app, a store \u2014 and make it yours.", onPress: template })] })] })) : (_jsxs(_Fragment, { children: [_jsxs(XStack, { gap: "$2", items: "center", children: [_jsx(YStack, { flex: 1, "$max-md": { display: 'none' } }), _jsx(YStack, { width: 320, minW: 0, shrink: 1, "$max-md": { width: 'auto', flex: 1 }, children: _jsx(Input, { value: q, onChangeText: setQ, placeholder: "Find a project\u2026", "aria-label": "Find a project" }) })] }), shown.length === 0 ? (_jsx(Note, { children: "Nothing matches." })) : (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: [_jsxs(XStack, { px: "$3", py: "$2", gap: "$3", items: "center", bg: "$panel", children: [_jsxs(XStack, { flex: 1, render: "button", "aria-label": "Sort by name", items: "center", gap: "$1", onPress: () => setSort('name'), children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Name" }), sort === 'name' ? _jsx(ChevronDown, { size: 12 }) : null] }), _jsx(SizableText, { size: "$1", color: "$soft", width: 120, "$max-md": { display: 'none' }, children: "Branch" }), _jsxs(XStack, { render: "button", "aria-label": "Sort by last updated", items: "center", justify: "flex-end", gap: "$1", width: 120, onPress: () => setSort('updated'), children: [_jsx(SizableText, { size: "$1", color: "$soft", children: "Updated" }), sort === 'updated' ? _jsx(ChevronDown, { size: 12 }) : null] })] }), slice.map((c) => (_jsxs(XStack, { render: "button", "aria-label": `Open ${c.org ? `${c.org}/` : ''}${c.name}`, onPress: () => open(c), style: { textAlign: 'left' }, items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: [_jsx(FolderGit2, { size: 15, color: "$soft" }), _jsxs(YStack, { flex: 1, minW: 0, children: [_jsxs(XStack, { minW: 0, items: "baseline", children: [c.org ? (_jsx(SizableText, { size: "$2", color: "$soft", numberOfLines: 1, shrink: 0, children: `${c.org}/` })) : null, _jsx(SizableText, { size: "$2", color: "$ink", fontWeight: "500", numberOfLines: 1, shrink: 1, children: c.name })] }), c.description ? (_jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: c.description })) : null] }), _jsxs(XStack, { width: 120, items: "center", gap: "$1.5", minW: 0, "$max-md": { display: 'none' }, children: [_jsx(GitBranch, { size: 12, color: "$soft" }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: c.branch })] }), _jsx(SizableText, { size: "$1", color: "$soft", width: 120, style: { textAlign: 'right' }, children: syncing.has(c.name) ? 'Syncing…' : ago(c.updated) })] }, `${c.org}/${c.name}`))), _jsxs(XStack, { px: "$3", py: "$2", justify: "space-between", items: "center", borderTopWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: `Showing ${from}–${to} of ${shown.length}` }), _jsxs(XStack, { gap: "$3", items: "center", children: [_jsx(XStack, { render: "button", "aria-label": "Previous page", disabled: safePage === 0, onPress: () => setPage(safePage - 1), children: _jsx(SizableText, { size: "$1", color: safePage === 0 ? '$soft' : '$ink', children: "Prev" }) }), _jsx(SizableText, { size: "$1", color: "$soft", children: `${safePage + 1} / ${pages}` }), _jsx(XStack, { render: "button", "aria-label": "Next page", disabled: safePage >= pages - 1, onPress: () => setPage(safePage + 1), children: _jsx(SizableText, { size: "$1", color: safePage >= pages - 1 ? '$soft' : '$ink', children: "Next" }) })] })] })] }))] }))] }) }));
+}
+/** One of the two ways in, as a card you press. */
+function Choice({ label, icon, says, onPress }) {
+    return (_jsxs(YStack, { render: "button", "aria-label": label, onPress: onPress, flex: 1, minW: 240, gap: "$2", p: "$4", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", items: "flex-start", hoverStyle: { borderColor: '$edge', bg: '$hover' }, focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: [icon, _jsxs(XStack, { items: "center", gap: "$1.5", children: [_jsx(SizableText, { size: "$4", color: "$ink", fontWeight: "500", children: label }), _jsx(ArrowRight, { size: 14 })] }), _jsx(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'left' }, children: says })] }));
 }
-function NewRepo({ open, onOpenChange, onCreate, }) {
-    const [name, setName] = useState('');
-    const [description, setDescription] = useState('');
+/**
+ * The person's GitHub connection, in one line: who it is connected as and the
+ * way to sync, or the one press that connects it. GitHub returns here, and this
+ * page finishes the connect (../back.ts).
+ */
+function GitHubLink({ onSync }) {
+    const host = useHost();
+    const t = useTarget();
+    const me = useRead(() => connection(t), null, [t]);
+    const [note, setNote] = useState('');
     const [busy, setBusy] = useState(false);
-    const [error, setError] = useState('');
-    useEffect(() => {
-        if (!open) {
-            setName('');
-            setDescription('');
-            setError('');
-        }
-    }, [open]);
-    const submit = async () => {
+    useBack(t, true, setNote, me.reload);
+    const c = me.value;
+    // A connection that cannot be read says nothing here: Sync from GitHub above still works.
+    if (me.error || !c || !c.configured)
+        return note ? _jsx(Note, { children: note }) : null;
+    const link = async () => {
         setBusy(true);
-        setError('');
+        setNote('');
         try {
-            await onCreate(name, description);
-            setName('');
-            setDescription('');
+            host.open(await connect(t, here()));
         }
         catch (e) {
-            setError(e.message);
-        }
-        finally {
+            setNote(e.message);
             setBusy(false);
         }
     };
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { children: [_jsx(DialogTitle, { children: "New repository" }), _jsxs(YStack, { gap: "$3", pt: "$3", children: [_jsx(Input, { value: name, onChangeText: setName, placeholder: "Name", "aria-label": "Repository name" }), _jsx(Input, { value: description, onChangeText: setDescription, placeholder: "Description", "aria-label": "Description" }), error ? _jsx(Note, { children: error }) : null, _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "outline", disabled: busy, onPress: () => onOpenChange(false), children: "Cancel" }), _jsx(Button, { size: "sm", disabled: busy || !name.trim(), onPress: () => void submit(), children: busy ? 'Creating…' : 'Create' })] })] })] }) }));
+    return (_jsxs(XStack, { items: "center", gap: "$3", px: "$3", py: "$2.5", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", flexWrap: "wrap", children: [_jsx(Github, { size: 16 }), _jsxs(YStack, { flex: 1, minW: 200, children: [_jsx(SizableText, { size: "$2", color: "$ink", children: c.connected ? `GitHub connected as @${c.login}` : 'Connect GitHub to bring your repositories here' }), _jsx(SizableText, { size: "$1", color: "$soft", children: note || (c.connected ? 'Choose repositories to mirror; each stays in step with GitHub.' : 'One step on GitHub, then pick the repositories to sync.') })] }), c.connected ? (_jsxs(Button, { size: "sm", variant: "outline", onPress: onSync, children: [_jsx(RefreshCw, { size: 14 }), "Sync repositories"] })) : (_jsxs(Button, { size: "sm", variant: "primary", disabled: busy, onPress: () => void link(), children: [_jsx(Github, { size: 14 }), busy ? 'Opening GitHub…' : 'Connect GitHub'] }))] }));
 }
-function Projects() {
-    const host = useHost();
-    const t = useTarget();
-    const signed = Boolean(host.person);
-    const list = useRead(signed ? () => boards(t) : null, [], [t, signed]);
-    const open = (b) => {
-        pinBoard(host.org, b.key);
-        host.go(path({ kind: 'screen', screen: 'issues' }));
-    };
-    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", items: "center", children: _jsxs(YStack, { width: "100%", maxW: 720, gap: "$3", children: [_jsx(Head, { title: "Projects", says: "Boards on the forge. A board is a repository that has work on it." }), list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Note, { children: "Sign in to see this organization's boards." })) : list.loading && list.value.length === 0 ? (_jsx(Note, { children: "Reading the forge\u2026" })) : list.value.length === 0 ? (_jsxs(YStack, { gap: "$3", py: "$2", children: [_jsx(Note, { children: "No boards yet. A repository shows up here once it has an issue." }), _jsxs(XStack, { gap: "$2", pt: "$1", children: [_jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'codebases' })), children: "View repositories" }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'sync' })), children: "Sync from GitHub" })] })] })) : (_jsx(YStack, { gap: "$2", children: list.value.map((b) => (_jsx(Row, { label: `Open ${b.name}`, onPress: () => open(b), children: _jsxs(YStack, { flex: 1, minW: 0, gap: "$1", children: [_jsx(SizableText, { size: "$3", color: "$ink", numberOfLines: 1, children: b.name }), b.description ? (_jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: b.description })) : (_jsx(SizableText, { size: "$1", color: "$soft", children: b.key }))] }) }, b.key))) }))] }) }));
+const KINDS = { all: 'Issues and pull requests', issue: 'Issues', pr: 'Pull requests' };
+const ORIGINS = { all: 'Every source', github: 'GitHub', hanzo: 'Hanzo' };
+const ORDERS = { newest: 'Newest', oldest: 'Oldest', updated: 'Recently updated' };
+/** Mirrored from GitHub: filed by the forge's `git` source with its page on github.com. */
+const fromGitHub = (w) => /^https:\/\/github\.com\//.test(w.url);
+/** A dropdown that picks one of `options`, its trigger naming the choice. */
+function Pick({ label, value, options, onPick }) {
+    return (_jsx(DropdownMenu, { trigger: _jsxs(XStack, { render: "button", "aria-label": label, items: "center", gap: "$1", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, children: [_jsx(SizableText, { size: "$2", color: "$soft", numberOfLines: 1, children: options[value] }), _jsx(ChevronDown, { size: 12 })] }), items: Object.keys(options).map((k) => ({
+            key: k,
+            label: options[k],
+            icon: k === value ? _jsx(Check, { size: 14 }) : _jsx(YStack, { width: 14 }),
+            onSelect: () => onPick(k),
+        })) }));
+}
+function Mark({ w }) {
+    if (w.kind === 'pr')
+        return _jsx(GitPullRequest, { size: 16, color: closed(w) ? '$soft' : '$ink' });
+    if (w.status === 'canceled')
+        return _jsx(CircleSlash, { size: 16, color: "$soft" });
+    if (w.status === 'done')
+        return _jsx(CircleCheck, { size: 16, color: "$soft" });
+    return _jsx(CircleDot, { size: 16, color: "$ink" });
 }
+function Tag({ children }) {
+    return (_jsx(XStack, { px: "$2", py: 1, rounded: 999, borderWidth: 1, borderColor: "$borderColor", shrink: 0, children: _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: children }) }));
+}
+/**
+ * Every project's issues, read the way GitHub reads them: open or closed, one
+ * project or all of them, narrowed by words, kind, source and order. Each project
+ * syncs its own issues from GitHub; choosing an issue starts the next run on its
+ * codebase with the issue as the ask.
+ */
 function Issues() {
     const host = useHost();
     const t = useTarget();
     const signed = Boolean(host.person);
     const [board, setBoard] = useKept(boardKey(host.org), '');
-    const list = useRead(signed ? () => issues(t, board) : null, [], [t, signed, board]);
+    const [state, setState] = useState('open');
+    const [kind, setKind] = useState('all');
+    const [origin, setOrigin] = useState('all');
+    const [order, setOrder] = useState('newest');
+    const [q, setQ] = useState('');
+    const [pulled, setPulled] = useState(0);
+    const [busy, setBusy] = useState(false);
+    const [said, setSaid] = useState(null);
+    const list = useRead(signed ? () => issues(t) : null, [], [t, signed, pulled]);
+    const known = useRead(signed ? () => boards(t) : null, [], [t, signed]);
     // Another screen chose the board (the rail's Issues chooses every board) while this one is open.
     useEffect(() => {
         const on = (e) => setBoard(e.detail);
         window.addEventListener('hanzo-board', on);
         return () => window.removeEventListener('hanzo-board', on);
     }, [setBoard]);
+    useEffect(() => setSaid(null), [board]);
+    // The projects: every board the forge names, and every repository an issue is filed under.
+    const projects = new Map();
+    for (const b of known.value)
+        projects.set(b.key.toLowerCase(), { key: b.key, name: b.name, open: 0 });
+    for (const w of list.value) {
+        const key = projectOf(w);
+        if (!key)
+            continue;
+        const p = projects.get(key.toLowerCase()) ?? { key, name: key, open: 0 };
+        if (!closed(w))
+            p.open++;
+        projects.set(key.toLowerCase(), p);
+    }
+    const rows = [...projects.values()].sort((a, b) => a.name.localeCompare(b.name));
+    const current = board ? projects.get(board.toLowerCase()) : undefined;
+    const title = current?.name ?? board;
+    const needle = q.trim().toLowerCase();
+    const scoped = list.value
+        .filter((w) => !board || inProject(w, board))
+        .filter((w) => kind === 'all' || (kind === 'pr' ? w.kind === 'pr' : w.kind !== 'pr'))
+        .filter((w) => origin === 'all' || (origin === 'github') === fromGitHub(w))
+        .filter((w) => !needle || [w.title, w.identifier, w.assignee, projectOf(w), ...w.labels].join(' ').toLowerCase().includes(needle));
+    const opened = scoped.filter((w) => !closed(w));
+    const shut = scoped.filter(closed);
+    const shown = (state === 'open' ? opened : shut).slice().sort((a, b) => {
+        if (order === 'updated')
+            return (b.updated || b.created) - (a.updated || a.created);
+        if (order === 'oldest')
+            return a.created - b.created;
+        return b.created - a.created;
+    });
+    const pull = async () => {
+        setBusy(true);
+        setSaid(null);
+        try {
+            const s = await syncIssues(t, board);
+            const where = board ? title : `${s.repos} ${s.repos === 1 ? 'repository' : 'repositories'}`;
+            const parts = [`${s.issues} ${s.issues === 1 ? 'issue' : 'issues'} synced from ${where}`, `${s.created} new`, `${s.updated} updated`];
+            if (s.failed)
+                parts.push(`${s.failed} failed`);
+            setSaid({ text: `${parts.join(' · ')}.${s.truncated ? ' More remain — sync again to continue.' : ''}` });
+            setPulled((n) => n + 1);
+        }
+        catch (e) {
+            const text = e.message;
+            setSaid({ text, connect: /not connected/i.test(text) });
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const link = async () => {
+        try {
+            host.open(await connect(t, here()));
+        }
+        catch (e) {
+            setSaid({ text: e.message });
+        }
+    };
     const open = (w) => {
         const name = w.repo || w.project;
         if (name) {
@@ -211,5 +290,21 @@ function Issues() {
         }
         host.go('');
     };
-    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", items: "center", children: _jsxs(YStack, { width: "100%", maxW: 720, gap: "$3", children: [_jsx(Head, { title: "Issues", says: board ? `Open work on ${board}. Choosing one starts the next run on that codebase.` : 'Open work across every board. Choosing one starts the next run on that codebase.' }), board ? (_jsx(XStack, { render: "button", onPress: () => setBoard(''), "aria-label": "Show every board", self: "flex-start", children: _jsx(SizableText, { size: "$1", color: "$soft", children: "All boards" }) })) : null, list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Note, { children: "Sign in to see this organization's issues." })) : list.loading && list.value.length === 0 ? (_jsx(Note, { children: "Reading the forge\u2026" })) : list.value.length === 0 ? (_jsxs(YStack, { gap: "$3", py: "$2", children: [_jsx(Note, { children: "Nothing open." }), _jsxs(XStack, { gap: "$2", pt: "$1", children: [_jsx(Button, { size: "sm", variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'codebases' })), children: "View repositories" }), _jsx(Button, { size: "sm", onPress: () => host.go(''), children: "Start a new run" })] })] })) : (_jsx(YStack, { gap: "$2", children: list.value.map((w) => (_jsxs(Row, { label: `Build ${w.identifier || w.title}`, onPress: () => open(w), children: [_jsx(SizableText, { size: "$1", color: "$soft", width: 88, numberOfLines: 1, children: w.identifier || w.kind }), _jsx(SizableText, { size: "$3", color: "$ink", flex: 1, minW: 0, numberOfLines: 1, children: w.title }), _jsx(SizableText, { size: "$1", color: "$soft", children: STATUS[w.status] ?? w.status })] }, w.id))) }))] }) }));
+    const chip = (key, name, count) => {
+        const on = key.toLowerCase() === board.toLowerCase();
+        return (_jsxs(XStack, { render: "button", "aria-label": key ? `Show ${name}` : 'Show every project', "aria-pressed": on, onPress: () => setBoard(key), items: "center", gap: "$2", px: "$2.5", py: "$1.5", rounded: "$3", bg: on ? '$hover' : 'transparent', hoverStyle: { bg: '$hover' }, shrink: 0, children: [_jsx(SizableText, { flex: 1, size: "$2", color: on ? '$ink' : '$soft', numberOfLines: 1, style: { textAlign: 'left' }, children: name }), count ? (_jsx(SizableText, { size: "$1", color: "$soft", children: count })) : null] }, key || '*'));
+    };
+    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", "$max-md": { px: '$4' }, children: _jsxs(YStack, { width: "100%", maxW: 1120, mx: "auto", gap: "$4", children: [_jsxs(XStack, { justify: "space-between", items: "flex-start", gap: "$4", flexWrap: "wrap", children: [_jsxs(YStack, { gap: "$1", flex: 1, minW: 240, children: [_jsx(SizableText, { render: "h1", size: "$6", fontWeight: "500", color: "$ink", children: board ? `Issues · ${title}` : 'Issues' }), _jsx(SizableText, { size: "$2", color: "$soft", children: board ? `Work on ${title}. Choosing an issue starts the next run on that codebase.` : 'Work across every project. Choosing an issue starts the next run on that codebase.' })] }), _jsxs(Button, { size: "sm", variant: "outline", disabled: !signed || busy, onPress: () => void pull(), children: [_jsx(Github, { size: 14 }), busy ? 'Syncing…' : board ? `Sync ${title} from GitHub` : 'Sync all from GitHub'] })] }), said ? (_jsxs(XStack, { items: "center", gap: "$3", flexWrap: "wrap", children: [_jsx(Note, { children: said.text }), said.connect ? (_jsxs(Button, { size: "sm", variant: "primary", onPress: () => void link(), children: [_jsx(Github, { size: 14 }), "Connect GitHub"] })) : null] })) : null, _jsxs(XStack, { gap: "$5", items: "flex-start", "$max-md": { flexDirection: 'column', gap: '$3' }, children: [_jsxs(YStack, { render: "nav", "aria-label": "Projects", width: 220, shrink: 0, gap: "$0.5", "$max-md": { width: '100%', flexDirection: 'row', overflow: 'scroll', gap: '$1' }, children: [_jsx(SizableText, { size: "$1", color: "$soft", px: "$2.5", pb: "$1", "$max-md": { display: 'none' }, children: "Projects" }), chip('', 'All projects', list.value.filter((w) => !closed(w)).length), rows.map((p) => chip(p.key, p.name, p.open))] }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$3", width: "100%", children: [_jsx(Input, { value: q, onChangeText: setQ, placeholder: "Search issues", "aria-label": "Search issues", disabled: !signed }), list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Note, { children: "Sign in to see this organization's issues." })) : list.loading && list.value.length === 0 ? (_jsx(Note, { children: "Reading the forge\u2026" })) : (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: [_jsxs(XStack, { px: "$3", py: "$2", gap: "$3", items: "center", bg: "$panel", flexWrap: "wrap", children: [_jsxs(XStack, { gap: "$3", items: "center", flex: 1, minW: 0, children: [_jsxs(XStack, { render: "button", "aria-label": "Open issues", "aria-pressed": state === 'open', items: "center", gap: "$1.5", onPress: () => setState('open'), children: [_jsx(CircleDot, { size: 14, color: state === 'open' ? '$ink' : '$soft' }), _jsx(SizableText, { size: "$2", color: state === 'open' ? '$ink' : '$soft', fontWeight: state === 'open' ? '500' : '400', children: `${opened.length} Open` })] }), _jsxs(XStack, { render: "button", "aria-label": "Closed issues", "aria-pressed": state === 'closed', items: "center", gap: "$1.5", onPress: () => setState('closed'), children: [_jsx(Check, { size: 14, color: state === 'closed' ? '$ink' : '$soft' }), _jsx(SizableText, { size: "$2", color: state === 'closed' ? '$ink' : '$soft', fontWeight: state === 'closed' ? '500' : '400', children: `${shut.length} Closed` })] })] }), _jsxs(XStack, { gap: "$1", items: "center", flexWrap: "wrap", shrink: 1, minW: 0, children: [_jsx(Pick, { label: "Kind", value: kind, options: KINDS, onPick: setKind }), _jsx(Pick, { label: "Source", value: origin, options: ORIGINS, onPick: setOrigin }), _jsx(Pick, { label: "Sort", value: order, options: ORDERS, onPick: setOrder })] })] }), shown.length === 0 ? (_jsxs(YStack, { px: "$3", py: "$6", gap: "$3", items: "center", borderTopWidth: 1, borderColor: "$borderColor", children: [_jsx(Note, { children: state === 'open'
+                                                        ? needle || kind !== 'all' || origin !== 'all'
+                                                            ? 'No open issues match.'
+                                                            : 'Nothing open.'
+                                                        : 'Nothing closed.' }), list.value.length === 0 ? (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", justify: "center", children: [_jsxs(Button, { size: "sm", variant: "outline", disabled: busy, onPress: () => void pull(), children: [_jsx(Github, { size: 14 }), "Sync from GitHub"] }), _jsx(Button, { size: "sm", onPress: () => host.go(''), children: "Start a new run" })] })) : null] })) : (shown.map((w) => (_jsxs(XStack, { items: "center", gap: "$2", pr: "$3", borderTopWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, children: [_jsxs(XStack, { render: "button", "aria-label": `Build ${w.identifier || w.title}`, onPress: () => open(w), flex: 1, minW: 0, items: "flex-start", gap: "$3", pl: "$3", py: "$2.5", focusVisibleStyle: { outlineWidth: 2, outlineStyle: 'solid', outlineColor: '$outlineColor' }, children: [_jsx(YStack, { pt: 2, children: _jsx(Mark, { w: w }) }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$1", items: "flex-start", children: [_jsxs(XStack, { gap: "$2", items: "center", flexWrap: "wrap", maxW: "100%", children: [_jsx(SizableText, { size: "$3", color: "$ink", fontWeight: "500", numberOfLines: 1, shrink: 1, children: w.title }), STATUS[w.status] && !closed(w) && w.status !== 'todo' ? _jsx(Tag, { children: STATUS[w.status] }) : null, !STATUS[w.status] ? _jsx(Tag, { children: w.status }) : null, w.priority !== 'none' && w.priority ? _jsx(Tag, { children: w.priority }) : null, w.labels.slice(0, 4).map((l) => (_jsx(Tag, { children: l }, l)))] }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: [
+                                                                        w.identifier || w.kind,
+                                                                        !board && projectOf(w) ? projectOf(w) : '',
+                                                                        w.created ? `opened ${ago(new Date(w.created).toISOString())}` : '',
+                                                                        w.assignee ? `assigned to ${w.assignee}` : '',
+                                                                        fromGitHub(w) ? 'GitHub' : '',
+                                                                    ]
+                                                                        .filter(Boolean)
+                                                                        .join(' · ') })] })] }), w.url ? (_jsx(Out, { href: w.url, label: `Open ${w.identifier || w.title} on ${fromGitHub(w) ? 'GitHub' : 'the forge'}`, children: _jsx(ExternalLink, { size: 14, opacity: 0.6 }) })) : null] }, w.id))))] }))] })] })] }) }));
 }

package/lib/host.d.ts

@@ -39,7 +39,7 @@ export interface Host {
     person: Person | null;
     /** Whether the person administers `org` (its owner or an admin): they publish to main and change its money; anyone else opens a review and reads. */
     admin: boolean;
-    /** The address under the mount: '' | a session id | a slug | '-/codebases' | '-/projects' | '-/issues' | '-/artifacts' | '-/templates'. */
+    /** The address under the mount, in route.ts's grammar: '' | a session id | `<org>/<repo>` | a slug | '-/projects' | '-/issues' | … */
     path: string;
     /** Move under the mount. */
     go: (path: string, how?: {

package/lib/landing.js

@@ -6,11 +6,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * which repository and branch it starts from, and the ask itself.
  * Under it: attach, dictate, the mode, and the model and effort on the right.
  *
- * Sending starts a coding run and opens it. The codebase is optional: in the
- * sandbox a run with none starts a new project named from the ask, as the
- * platform does for a run that names no repository; a machine works in its own
- * checkout, so a run there names one. The choices a person made here are kept in
- * this browser, per org, so the next New starts where the last one did.
+ * Sending starts a coding run on a project and opens it. A project is a
+ * repository — the org's on the forge, or one its GitHub grants — so a run
+ * names one, and an ask with none chosen opens the picker rather than making a
+ * project up from its words. The choices a person made here are kept in this
+ * browser, per org, so the next New starts where the last one did.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { Cloud, Monitor } from '@hanzogui/lucide-icons-2';
@@ -144,8 +144,9 @@ export function Landing({ onStarted }) {
         }
         const repo = isForge(kept.repo) ? kept.repo : null;
         const hub = isHub(kept.repo) ? kept.repo : null;
-        if (!repo && !hub && place.id) {
-            setNote(`A run on ${place.label} works in its own checkout: choose the codebase, or run it in Cloud.`);
+        if (!repo && !hub) {
+            setNote('Choose the project this run works on: a repository of this organization, or one on its GitHub.');
+            setPicking(true);
             return;
         }
         setBusy(true);
@@ -154,7 +155,6 @@ export function Landing({ onStarted }) {
             const run = await start(t, {
                 prompt: compose(draft.trim(), files),
                 // The name alone. The org rides the request, and a slash is not a repo name.
-                // No codebase is not sent, and the run starts a new project.
                 // An empty base or place is not sent: the default branch, and the sandbox.
                 repo: repo?.name ?? hub?.full_name,
                 base: repo ? kept.branch : hub ? kept.branch || hub.default_branch : undefined,
@@ -227,7 +227,7 @@ export function Landing({ onStarted }) {
                             name: r.name,
                         });
                     },
-                }, placeholder: "New project", disabled: !signed }, round), isForge(kept.repo) ? _jsx(BranchSelect, { value: branch, onChange: (b) => set({ branch: b }), load: loadBranches }) : null, _jsx(Files, { files: files, onFiles: setFiles })] }));
+                }, placeholder: "Choose a project", disabled: !signed }, round), 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(ModelPicker, { quiet: true, size: "sm", name: "Model", models: catalog.value, scope: "chat", limits: limits, value: model, onChange: pickModel, 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", justify: "center", px: "$4", pb: "$10", overflow: "scroll", children: [_jsxs(YStack, { width: "100%", maxW: COLUMN, gap: "$5", children: [_jsxs(XStack, { role: "heading", "aria-level": 1, justify: "center", items: "center", gap: "$3", flexWrap: "wrap", children: [_jsx(HanzoMark, { size: 26 }), _jsx(SizableText, { size: "$8", color: "$ink", style: { textAlign: 'center' }, children: prefs.callName ? `What’s up next, ${prefs.callName}?` : 'What’s up next?' })] }), _jsxs(YStack, { gap: "$2", children: [env.value && env.value.state !== 'ready' && !place.id ? (_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", flex: 1, minW: 0, children: env.value.state === 'proposed'
                                             ? `A proposed environment for ${codebase} is waiting for review.`

package/lib/project.d.ts

@@ -1,3 +1,18 @@
-export declare function Project({ slug }: {
+import { type Project as Row } from './api/projects.ts';
+/** What a workspace is opened on: a repository on the forge, or a deployed site by its slug. */
+export type Where = {
     slug: string;
+} | {
+    org: string;
+    name: string;
+};
+/** Whether the site `p` is the repository `r`'s: built from it, or named as it is. */
+export declare function siteOf(p: Row, r: {
+    org: string;
+    name: string;
+}): boolean;
+/** A site's slug for a repository's name: lowercase letters, digits and hyphens, at most 40. */
+export declare function slugOf(name: string): string;
+export declare function Project({ at }: {
+    at: Where;
 }): import("react").JSX.Element;

package/lib/project.js

@@ -3,6 +3,11 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * A project's workspace, in the same window: the chat on the left, what it
  * built on the right.
  *
+ * A project is a repository on the forge, addressed `<org>/<repo>`; the site it
+ * publishes to, when it has one, is the org's project row on that repository
+ * (or of the same name). A deployed site with no repository on the forge is
+ * opened by its slug (Artifacts), and works the same way.
+ *
  *   bar     mark · project · history · chat toggle | Preview Files Code Layers |
  *           Share · Publish
  *   left    the project's runs as a conversation, suggestions, and the ask
@@ -41,10 +46,11 @@ import { Button, Dialog, DialogContent, DialogTitle } from '@hanzo/ui';
 import { HanzoMark } from '@hanzo/ui/product';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { read as pushed } from './api/changes.js';
+import { codebases, one } from './api/codebases.js';
 import { start } from './api/coding.js';
 import { blob, tree } from './api/git.js';
 import { declare } from './api/platform.js';
-import { deployments, name as repoName, ours, templates } from './api/projects.js';
+import { address, deployments, name as repoName, ours, templates } from './api/projects.js';
 import { list, message, stop } from './api/sessions.js';
 import { decode, outcome, pull, said, who } from './api/turn.js';
 import { verdict as record } from './api/verdict.js';
@@ -54,8 +60,8 @@ import { Grip } from './grip.js';
 import { useHost, useTarget } from './host.js';
 import { MODES } from './landing.js';
 import { Out } from './out.js';
-import { pane as cut } from './pane.js';
 import { Publish } from './publish.js';
+import { path } from './route.js';
 import { Attach, compose, Dictate, Files } from './tools.js';
 const LIVE = new Set(['running', 'paused']);
 /** How often a project being published is read again, ms. */
@@ -70,6 +76,20 @@ const CHAT_CEIL = 640;
 const GUTTER = 12;
 /** What the work keeps beside the chat however wide the chat was asked to be, px. */
 const WORK = 400 + 2 * GUTTER;
+/** Whether the site `p` is the repository `r`'s: built from it, or named as it is. */
+export function siteOf(p, r) {
+    const want = `${r.org}/${r.name}`.toLowerCase();
+    return (p.repo !== '' && address(p.repo).toLowerCase() === want) || p.slug === r.name.toLowerCase();
+}
+/** A site's slug for a repository's name: lowercase letters, digits and hyphens, at most 40. */
+export function slugOf(name) {
+    return name
+        .toLowerCase()
+        .replace(/[^a-z0-9]+/g, '-')
+        .replace(/^-+|-+$/g, '')
+        .slice(0, 40)
+        .replace(/-+$/, '');
+}
 /** One run in the conversation: what was asked, and what it came to. */
 function Turn({ run, open, onOpen, project }) {
     const t = useTarget();
@@ -83,12 +103,18 @@ function Turn({ run, open, onOpen, project }) {
                                 });
                             } }), note ? (_jsx(SizableText, { size: "$1", color: "$soft", children: note })) : null, !open ? (_jsx(XStack, { render: "button", onPress: onOpen, hitSlop: 8, children: _jsx(SizableText, { size: "$1", color: "$soft", textDecorationLine: "underline", children: "Show steps" }) })) : null] }), children: _jsx(SizableText, { size: "$2", color: "$ink", children: run.status === 'done' ? 'Done.' : run.status === 'error' ? 'This run hit an error.' : run.status === 'stopped' ? 'Stopped.' : 'Working…' }) })] }));
 }
-export function Project({ slug }) {
+export function Project({ at }) {
     const host = useHost();
     const t = useTarget();
     const signed = Boolean(host.person);
     const all = useProjects(t, signed);
-    const project = all.value.find((p) => p.slug === slug) ?? null;
+    // The repository the address names, and the forge's record of it.
+    const named = 'slug' in at ? null : at;
+    const forge = useRead(named && signed ? () => one(t, named.name) : null, null, [t, signed, named?.name]);
+    const project = all.value.find((p) => (named ? siteOf(p, named) : 'slug' in at && p.slug === at.slug)) ?? null;
+    // The site this workspace publishes to: the project's, or the repository's name as one.
+    const slug = project?.slug ?? ('slug' in at ? at.slug : slugOf(named?.name ?? ''));
+    const title = project?.name ?? named?.name ?? slug;
     // A project that has never served reads `building` while it is published, and
     // is read again until it is live or its build failed.
     const building = project?.status === 'building';
@@ -113,12 +139,15 @@ export function Project({ slug }) {
     const stalled = building && ran > STALL;
     // Publish again: the project's repository, built at its branch, the way Publish builds it.
     const [redo, setRedo] = useState({ busy: false, error: '' });
+    // The repository's clone address: the forge's for a repository, the site's own otherwise.
+    const clone = named ? (forge.value?.clone ?? '') : (project?.repo ?? '');
+    const home = named ? (forge.value?.branch ?? 'main') : project?.branch || 'main';
     const retry = async () => {
-        if (!project?.repo || redo.busy)
+        if (!clone || redo.busy)
             return;
         setRedo({ busy: true, error: '' });
         try {
-            await declare(t, { repo: project.repo, ref: project.branch || 'main', name: slug, project: slug, mode: 'branch' });
+            await declare(t, { repo: clone, ref: home, name: slug, project: slug, mode: 'branch' });
             setNow(Date.now());
             again();
             setRedo({ busy: false, error: '' });
@@ -127,11 +156,14 @@ export function Project({ slug }) {
             setRedo({ busy: false, error: e.message });
         }
     };
-    const listed = useRead(signed ? () => list(t, { kind: 'coding', project: slug, limit: 50 }) : null, [], [t, signed, slug]);
+    // The site's runs, or the org's when the repository has no site yet.
+    const sited = !named || Boolean(project);
+    const listed = useRead(signed ? () => list(t, sited ? { kind: 'coding', project: slug, limit: 50 } : { kind: 'coding', limit: 50 }) : null, [], [t, signed, slug, sited]);
     // Only the runs on this project's own repository: a record can be moved into
     // any project, and a run's branch is what Files, Code and Publish read.
-    const runs = { ...listed, value: listed.value.filter((r) => ours(r.repo, project?.repo ?? '')) };
-    const ordered = useMemo(() => [...runs.value].reverse(), [listed.value, project?.repo]);
+    const mine = (r) => (named ? ours(r.repo, `${named.org}/${named.name}`) && Boolean(r.repo) : ours(r.repo, project?.repo ?? ''));
+    const runs = { ...listed, value: listed.value.filter(mine) };
+    const ordered = useMemo(() => [...runs.value].reverse(), [listed.value, project?.repo, named?.org, named?.name]);
     const [chosen, setChosen] = useState(null);
     const current = chosen ?? runs.value[0]?.id ?? null;
     const run = useRun(t, current);
@@ -149,6 +181,12 @@ export function Project({ slug }) {
     // Below md the chat and the work take turns, and Chat is one more view to switch back to.
     const [pane, setPane] = useState('chat');
     const wide = useMedia().md;
+    // A workspace too narrow for the chat at its floor and the work at its room
+    // (a tablet beside the host's column) shows the work, and the chat when asked:
+    // never both cut. Asked here is for this visit; the kept choice is the wide one's.
+    const cramped = wide && room > 0 && room < CHAT_FLOOR + WORK;
+    const [asked, setAsked] = useState(false);
+    const shut = cramped ? !asked : collapsed;
     const [dock, setDock] = useKept('hanzo.build.dock', 36);
     const [dismissed, setDismissed] = useKept(`hanzo.build.hints.${slug}`, false);
     const [mode, setMode] = useKept('hanzo.build.mode', 'build');
@@ -164,6 +202,7 @@ export function Project({ slug }) {
     const [history, setHistory] = useState(false);
     const [publish, setPublish] = useState(null);
     const [switcher, setSwitcher] = useState(false);
+    const repos = useRead(switcher && signed ? () => codebases(t) : null, [], [t, switcher, signed]);
     const frame = useRef(null);
     // What was published may be new files at the same address: the project is read
     // for its address, and the frame loads again.
@@ -196,8 +235,8 @@ export function Project({ slug }) {
     // Files is drawn again after a merge, from what the forge holds now.
     const [round, setRound] = useState(0);
     // Files and Code: native git, at the branch the open run pushed (or the project's own).
-    const repo = project?.repo ? repoName(project.repo) : '';
-    const ref = run.record?.branch || project?.branch || 'main';
+    const repo = named ? named.name : project?.repo ? repoName(project.repo) : '';
+    const ref = run.record?.branch || home;
     const [files, setFiles] = useState([]);
     const [file, setFile] = useState(null);
     useEffect(() => {
@@ -294,9 +333,10 @@ export function Project({ slug }) {
             // A project with no repository yet sends neither, and its first run makes one.
             const next = await start(t, {
                 prompt: compose(`${ask}${context}`, attached),
-                project: slug,
+                // A repository with no site yet runs on the repository alone.
+                project: project?.slug,
                 repo,
-                base: project?.branch,
+                base: named ? forge.value?.branch : project?.branch,
                 after: current ?? undefined,
                 mode,
             });
@@ -337,10 +377,21 @@ export function Project({ slug }) {
     if (!signed) {
         return (_jsxs(YStack, { flex: 1, items: "center", justify: "center", gap: "$3", children: [_jsx(SizableText, { size: "$4", color: "$ink", children: "Sign in to open this project." }), _jsx(Button, { onPress: () => host.signIn?.(), children: "Sign in" })] }));
     }
-    if (!all.loading && !project && !all.error) {
-        return (_jsxs(YStack, { flex: 1, items: "center", justify: "center", gap: "$3", px: "$4", children: [_jsx(SizableText, { size: "$4", color: "$ink", children: host.org ? `${host.org} has no project named ${slug}.` : `There is no project named ${slug}.` }), _jsx(Button, { variant: "outline", onPress: () => host.go('-/artifacts'), children: "See what this organization has built" })] }));
+    // A repository of another organization is opened in that one.
+    if (named && host.org && named.org.toLowerCase() !== host.org.toLowerCase()) {
+        const member = host.memberships?.some((m) => m.toLowerCase() === named.org.toLowerCase()) && host.chooseOrg;
+        return (_jsxs(YStack, { flex: 1, items: "center", justify: "center", gap: "$3", px: "$4", children: [_jsx(SizableText, { size: "$4", color: "$ink", text: "center", children: `${named.org}/${named.name} is in ${named.org}, and you are working in ${host.org}.` }), member ? (_jsx(Button, { variant: "outline", onPress: () => host.chooseOrg?.(named.org), children: `Switch to ${named.org}` })) : (_jsx(Button, { variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: 'projects' })), children: "See this organization\u2019s projects" }))] }));
+    }
+    if (named ? !forge.loading && !forge.value : !all.loading && !project && !all.error) {
+        return (_jsxs(YStack, { flex: 1, items: "center", justify: "center", gap: "$3", px: "$4", children: [_jsx(SizableText, { size: "$4", color: "$ink", text: "center", children: named
+                        ? forge.error && !/not found|404/i.test(forge.error.message)
+                            ? forge.error.message
+                            : `${named.org} has no repository named ${named.name}.`
+                        : host.org
+                            ? `${host.org} has no project named ${slug}.`
+                            : `There is no project named ${slug}.` }), _jsx(Button, { variant: "outline", onPress: () => host.go(path({ kind: 'screen', screen: named ? 'projects' : 'artifacts' })), children: named ? 'See this organization’s projects' : 'See what this organization has built' })] }));
     }
-    const chat = (_jsxs(YStack, { flex: 1, minH: 0, position: "relative", children: [_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$3", py: "$4", gap: "$4", children: ordered.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$ink", px: "$2", children: runs.loading
+    const chat = (_jsxs(YStack, { "data-slot": "project-chat", flex: 1, minH: 0, position: "relative", children: [_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$3", pt: "$2", pb: "$4", gap: "$4", $md: { pr: 0 }, children: ordered.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$ink", children: runs.loading
                         ? 'Reading this project’s runs…'
                         : project?.live
                             ? `${project.name} is loaded — it is in the preview, and every run on it is under the clock above. Say what to change and it gets built.`
@@ -354,12 +405,14 @@ export function Project({ slug }) {
                                             ? `${project?.name} is loaded — the preview shows the ${starter.title} starter until your copy is published. Say what to change and it gets built.`
                                             : project
                                                 ? `${project.name} is loaded and nothing is published yet. Say what to change and it gets built.`
-                                                : `${slug} is loaded. Say what to change and it gets built.` })) : (ordered.map((r) => (_jsxs(YStack, { gap: "$2", children: [_jsx(Turn, { run: r, open: r.id === current, onOpen: () => setChosen(r.id), project: slug }), r.id === current ? (_jsxs(YStack, { gap: "$1", pl: "$2", borderLeftWidth: 1, borderColor: "$borderColor", children: [fold(run.events.map((e) => ({ kind: e.kind, actor: who(e.actor), seq: e.seq, id: e.id, text: said(e, run.record?.mode) })).filter((b) => b.text)).map((b) => (_jsx(SizableText, { size: "$1", color: "$soft", children: b.text }, b.key))), pr.href ? (_jsxs(XStack, { items: "center", gap: "$2", flexWrap: "wrap", children: [_jsxs(Out, { href: pr.href, label: `Open pull request ${pr.label}`, children: [_jsxs(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: ["Pull request ", pr.label] }), _jsx(ExternalLink, { size: 11 })] }), _jsx(Merge, { session: r.id, open: proposing, onMerged: merged })] })) : null] })) : null] }, r.id)))) }), _jsxs(YStack, { px: "$3", pb: "$3", gap: "$2", children: [!dismissed && !running ? _jsx(Suggestions, { items: SUGGESTIONS, onPick: (s) => void send(s), onDismiss: () => setDismissed(true) }) : null, note ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note })) : null, picked.length ? _jsx(Attachments, { items: picked, onRemove: () => setPicked([]) }) : null, attached.length ? (_jsx(XStack, { gap: 6, flexWrap: "wrap", children: _jsx(Files, { files: attached, onFiles: setAttached }) })) : null, _jsxs(Composer, { ...cut, value: draft, onChange: setDraft, onSend: () => void (current && running ? steer(current) : send()), onStop: current
+                                                : named
+                                                    ? `${named.org}/${named.name} is open on ${home}. Say what to change and it gets built there.`
+                                                    : `${slug} is loaded. Say what to change and it gets built.` })) : (ordered.map((r) => (_jsxs(YStack, { gap: "$2", children: [_jsx(Turn, { run: r, open: r.id === current, onOpen: () => setChosen(r.id), project: slug }), r.id === current ? (_jsxs(YStack, { gap: "$1", pl: "$2", borderLeftWidth: 1, borderColor: "$borderColor", children: [fold(run.events.map((e) => ({ kind: e.kind, actor: who(e.actor), seq: e.seq, id: e.id, text: said(e, run.record?.mode) })).filter((b) => b.text)).map((b) => (_jsx(SizableText, { size: "$1", color: "$soft", children: b.text }, b.key))), pr.href ? (_jsxs(XStack, { items: "center", gap: "$2", flexWrap: "wrap", children: [_jsxs(Out, { href: pr.href, label: `Open pull request ${pr.label}`, children: [_jsxs(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: ["Pull request ", pr.label] }), _jsx(ExternalLink, { size: 11 })] }), _jsx(Merge, { session: r.id, open: proposing, onMerged: merged })] })) : null] })) : null] }, r.id)))) }), _jsxs(YStack, { "data-slot": "project-ask", px: "$3", pb: "$3", gap: "$2", minW: 0, $md: { pr: 0 }, children: [!dismissed && !running ? _jsx(Suggestions, { items: SUGGESTIONS, onPick: (s) => void send(s), onDismiss: () => setDismissed(true) }) : null, note ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: note })) : null, picked.length ? _jsx(Attachments, { items: picked, onRemove: () => setPicked([]) }) : null, attached.length ? (_jsx(XStack, { gap: 6, flexWrap: "wrap", children: _jsx(Files, { files: attached, onFiles: setAttached }) })) : null, _jsxs(Composer, { value: draft, onChange: setDraft, onSend: () => void (current && running ? steer(current) : send()), onStop: current
                             ? () => void stop(t, current).then(() => setNote('Stop requested — the run keeps its work on its branch'), (e) => setNote(e.message))
-                            : undefined, busy: busy || (running && !draft.trim()), rows: 3, placeholder: running ? 'Steer this run' : 'Ask Hanzo for edits', label: "Ask Hanzo for edits", children: [_jsx(Attach, { files: attached, onFiles: setAttached, onNote: setNote }), _jsx(XStack, { flex: 1 }), _jsx(ModeSelect, { modes: MODES, value: mode, onChange: (m) => setMode(m), self: "center" }), _jsx(Dictate, { onText: (said) => setDraft((d) => (d ? `${d} ${said}` : said)), onNote: setNote })] })] }), wide && !collapsed ? (_jsx(Grip, { side: "left", span: across, floor: CHAT_FLOOR, ceil: most, reset: CHAT_WIDTH, onSpan: setSplit, label: "Resize the chat", r: -GUTTER, width: GUTTER })) : null] }));
+                            : undefined, busy: busy || (running && !draft.trim()), rows: 3, placeholder: running ? 'Steer this run' : 'Ask Hanzo for edits', label: "Ask Hanzo for edits", children: [_jsx(Attach, { files: attached, onFiles: setAttached, onNote: setNote }), _jsx(XStack, { flex: 1 }), _jsx(ModeSelect, { modes: MODES, value: mode, onChange: (m) => setMode(m), self: "center" }), _jsx(Dictate, { onText: (said) => setDraft((d) => (d ? `${d} ${said}` : said)), onNote: setNote })] })] }), wide && !shut ? (_jsx(Grip, { side: "left", span: across, floor: CHAT_FLOOR, ceil: most, reset: CHAT_WIDTH, onSpan: setSplit, label: "Resize the chat", r: -GUTTER, width: GUTTER })) : null] }));
     // The preview stays loaded while another view is open, so coming back to it
     // is the page as it was left.
-    const preview = (_jsxs(YStack, { "data-slot": "preview", flex: 1, minH: 0, minW: 0, gap: "$2", display: view === 'preview' ? 'flex' : 'none', children: [_jsxs(XStack, { "data-slot": "preview-bar", items: "center", gap: "$1.5", minW: 0, shrink: 0, "$max-md": { px: '$2' }, children: [_jsx(XStack, { render: "button", "aria-label": "Reload the preview", onPress: () => frame.current?.reload(), p: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: _jsx(RefreshCcw, { size: 16 }) }), _jsx(PageSelect, { pages: pages, value: page, onChange: setPage, shrink: 1 }), _jsx(XStack, { flex: 1 }), _jsx(Views, { views: DEVICES, value: device, onChange: (d) => setDevice(d), label: "Device", labels: "none" }), src ? (_jsx(Out, { href: src, label: "Open in a new tab", children: _jsx(XStack, { p: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: _jsx(ExternalLink, { size: 16 }) }) })) : null] }), _jsx(PreviewFrame, { ref: frame, src: src, title: `${project?.name ?? slug} preview`, device: device, onBridge: onBridge, empty: _jsxs(YStack, { items: "center", gap: "$2", p: "$6", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: stalled
+    const preview = (_jsxs(YStack, { "data-slot": "preview", flex: 1, minH: 0, minW: 0, gap: "$2", display: view === 'preview' ? 'flex' : 'none', children: [_jsxs(XStack, { "data-slot": "preview-bar", items: "center", gap: "$1.5", minW: 0, shrink: 0, "$max-md": { px: '$2' }, children: [_jsx(XStack, { render: "button", "aria-label": "Reload the preview", onPress: () => frame.current?.reload(), p: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: _jsx(RefreshCcw, { size: 16 }) }), _jsx(PageSelect, { pages: pages, value: page, onChange: setPage, shrink: 1 }), _jsx(XStack, { flex: 1 }), _jsx(Views, { views: DEVICES, value: device, onChange: (d) => setDevice(d), label: "Device", labels: "none" }), src ? (_jsx(Out, { href: src, label: "Open in a new tab", children: _jsx(XStack, { p: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: _jsx(ExternalLink, { size: 16 }) }) })) : null] }), _jsx(PreviewFrame, { ref: frame, src: src, title: `${title} preview`, device: device, onBridge: onBridge, empty: _jsxs(YStack, { items: "center", gap: "$2", p: "$6", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: stalled
                                 ? 'Publishing is taking too long'
                                 : building
                                     ? project?.forked
@@ -373,29 +426,34 @@ export function Project({ slug }) {
                                     ? 'Its page appears here when the build finishes.'
                                     : failed
                                         ? why
-                                        : 'Publish this project and its page appears here.' }), (stalled || failed) && project?.repo ? (_jsx(Button, { variant: "outline", disabled: redo.busy, onPress: () => void retry(), children: "Publish again" })) : null, redo.error ? (_jsx(SizableText, { size: "$2", color: "$soft", text: "center", role: "alert", children: redo.error })) : null] }), toolbar: bridge ? (_jsx(XStack, { render: "button", "aria-pressed": editing, "aria-label": editing ? 'Stop picking elements' : 'Pick an element to edit', onPress: () => {
+                                        : 'Publish this project and its page appears here.' }), (stalled || failed) && clone ? (_jsx(Button, { variant: "outline", disabled: redo.busy, onPress: () => void retry(), children: "Publish again" })) : null, redo.error ? (_jsx(SizableText, { size: "$2", color: "$soft", text: "center", role: "alert", children: redo.error })) : null] }), toolbar: bridge ? (_jsx(XStack, { render: "button", "aria-pressed": editing, "aria-label": editing ? 'Stop picking elements' : 'Pick an element to edit', onPress: () => {
                         const next = !editing;
                         setEditing(next);
                         frame.current?.post({ type: 'preview:editable', active: next });
                     }, p: "$2", rounded: "$10", children: _jsx(MousePointerClick, { size: 16 }) })) : undefined })] }));
-    const body = view === 'preview' ? null : view === 'files' ? (repo ? (_jsx(FileTree, { load: async (dir) => (await tree(t, repo, ref, dir)).map((e) => ({ path: e.path, kind: e.dir ? 'dir' : 'file' })), value: file, onSelect: (p) => void openFile(p), label: `${repo} at ${ref}` }, round)) : (_jsx(SizableText, { size: "$2", color: "$soft", p: "$4", children: "This project has no repository yet. Its first run creates one." }))) : view === 'code' ? (_jsx(FileTabs, { files: files, value: file, onSelect: setFile, onClose: (p) => {
+    const body = view === 'preview' ? null : view === 'files' ? (repo && root.error ? (_jsx(SizableText, { size: "$2", color: "$soft", p: "$4", role: "status", children: `Nothing to show for ${repo} at ${ref}: the forge answered “${root.error.message}”.` })) : repo ? (_jsx(FileTree, { load: async (dir) => (await tree(t, repo, ref, dir)).map((e) => ({ path: e.path, kind: e.dir ? 'dir' : 'file' })), value: file, onSelect: (p) => void openFile(p), label: `${repo} at ${ref}` }, round)) : (_jsx(SizableText, { size: "$2", color: "$soft", p: "$4", children: "This project has no repository yet. Its first run creates one." }))) : view === 'code' ? (_jsx(FileTabs, { files: files, value: file, onSelect: setFile, onClose: (p) => {
             setFiles((was) => was.filter((f) => f.path !== p));
             if (file === p)
                 setFile(null);
         }, empty: _jsxs(SizableText, { size: "$2", color: "$soft", p: "$4", children: ["Open a file from Files. Code here is read at ", ref, "; ask in the chat to change it."] }) })) : (_jsx(YStack, { p: "$4", gap: "$2", children: picked.length ? (picked.map((p) => (_jsxs(SizableText, { size: "$2", color: "$ink", children: [p.label, " \u2014 ", p.id] }, p.id)))) : (_jsx(SizableText, { size: "$2", color: "$soft", children: bridge
                 ? 'Pick an element in the preview to see it here and attach it to your next ask.'
                 : 'Layers are read through the preview bridge, and this page does not run it. Its elements cannot be listed from here.' })) }));
-    return (_jsxs(_Fragment, { children: [_jsxs(Workspace, { start: _jsxs(XStack, { items: "center", gap: "$2", minW: 0, shrink: 1, children: [_jsx(XStack, { render: "button", "aria-label": "All runs", onPress: () => host.go(''), p: "$1", shrink: 0, children: _jsx(HanzoMark, { size: 20 }) }), _jsx(ProjectChip, { name: project?.name ?? slug, onPress: () => setSwitcher(true) }), _jsx(XStack, { render: "button", "aria-label": "History", onPress: () => setHistory(true), p: "$1.5", rounded: "$3", shrink: 0, hoverStyle: { bg: '$hover' }, children: _jsx(Clock, { size: 16 }) }), _jsx(XStack, { render: "button", "aria-label": collapsed ? 'Show the chat' : 'Hide the chat', "aria-pressed": !collapsed, onPress: () => setCollapsed(!collapsed), p: "$1.5", rounded: "$3", shrink: 0, hoverStyle: { bg: '$hover' }, "$max-md": { display: 'none' }, children: _jsx(PanelLeft, { size: 16 }) })] }), middle: _jsx(Views, { views: [...VIEWS, CHAT], value: pane === 'chat' && !wide ? 'chat' : view, onChange: (v) => {
+    return (_jsxs(_Fragment, { children: [_jsxs(Workspace, { start: _jsxs(XStack, { items: "center", gap: "$2", minW: 0, shrink: 1, children: [_jsx(XStack, { render: "button", "aria-label": "All runs", onPress: () => host.go(''), p: "$1", shrink: 0, children: _jsx(HanzoMark, { size: 20 }) }), _jsx(ProjectChip, { name: title, onPress: () => setSwitcher(true) }), _jsx(XStack, { render: "button", "aria-label": "History", onPress: () => setHistory(true), p: "$1.5", rounded: "$3", shrink: 0, hoverStyle: { bg: '$hover' }, children: _jsx(Clock, { size: 16 }) }), _jsx(XStack, { render: "button", "aria-label": shut ? 'Show the chat' : 'Hide the chat', "aria-pressed": !shut, onPress: () => (cramped ? setAsked(!asked) : setCollapsed(!collapsed)), p: "$1.5", rounded: "$3", shrink: 0, hoverStyle: { bg: '$hover' }, "$max-md": { display: 'none' }, children: _jsx(PanelLeft, { size: 16 }) })] }), middle: _jsx(Views, { views: [CHAT, ...VIEWS], value: pane === 'chat' && !wide ? 'chat' : view, onChange: (v) => {
                         if (v === 'chat')
                             return setPane('chat');
                         setView(v);
                         setPane('view');
-                    }, label: "View" }), end: _jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(XStack, { display: "none", $md: { display: 'flex' }, children: _jsxs(Button, { variant: "outline", size: "sm", onPress: () => void share(), children: [_jsx(Share2, { size: 14 }), " Share"] }) }), _jsxs(Button, { size: "sm", disabled: !project?.repo, onPress: () => project &&
-                                setPublish({ repo: project.repo, title: project.name, ref, name: project.slug, project: project.slug }), children: [_jsx(Upload, { size: 14 }), " Publish"] })] }), chat: chat, dock: _jsx(Console, { lines: lines, height: dock, onHeight: setDock, onClear: () => setPageLines([]), status: run.status || end.status || undefined, label: "Console" }), collapsed: collapsed, pane: pane, width: across, onLayout: (e) => setRoom(e.nativeEvent.layout.width), children: [preview, body] }), _jsx(Dialog, { open: history, onOpenChange: setHistory, children: _jsxs(DialogContent, { maxW: 480, children: [_jsxs(DialogTitle, { children: ["Runs on ", project?.name ?? slug] }), _jsx(YStack, { gap: "$1", children: runs.value.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$soft", children: "No runs yet." })) : (runs.value.map((r) => (_jsxs(XStack, { render: "button", onPress: () => {
+                    }, label: "View" }), end: _jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(XStack, { display: "none", $md: { display: 'flex' }, children: _jsxs(Button, { variant: "outline", size: "sm", onPress: () => void share(), children: [_jsx(Share2, { size: 14 }), " Share"] }) }), _jsxs(Button, { size: "sm", "aria-label": "Publish", disabled: !clone || !slug, onPress: () => setPublish({ repo: clone, title, ref, name: slug, project: slug }), children: [_jsx(Upload, { size: 14 }), _jsx(SizableText, { size: "$2", color: "inherit", "$max-md": { display: 'none' }, children: "Publish" })] })] }), chat: chat, dock: _jsx(Console, { lines: lines, height: dock, onHeight: setDock, onClear: () => setPageLines([]), status: run.status || end.status || undefined, label: "Console" }), collapsed: shut, pane: pane, width: across, onLayout: (e) => setRoom(e.nativeEvent.layout.width), children: [preview, body] }), _jsx(Dialog, { open: history, onOpenChange: setHistory, children: _jsxs(DialogContent, { maxW: 480, children: [_jsxs(DialogTitle, { children: ["Runs on ", title] }), _jsx(YStack, { gap: "$1", children: runs.value.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$soft", children: "No runs yet." })) : (runs.value.map((r) => (_jsxs(XStack, { render: "button", onPress: () => {
                                     setChosen(r.id);
                                     setHistory(false);
-                                }, justify: "space-between", px: "$2", py: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: [_jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 1, flex: 1, children: r.title || 'Untitled run' }), _jsx(SizableText, { size: "$1", color: "$soft", children: r.status })] }, r.id)))) })] }) }), _jsx(Dialog, { open: switcher, onOpenChange: setSwitcher, children: _jsxs(DialogContent, { maxW: 420, children: [_jsx(DialogTitle, { children: "Projects" }), _jsx(YStack, { gap: "$1", maxH: 420, overflow: "scroll", children: all.value.map((p) => (_jsx(XStack, { render: "button", onPress: () => {
-                                    setSwitcher(false);
-                                    host.go(p.slug);
-                                }, px: "$2", py: "$1.5", rounded: "$3", bg: p.slug === slug ? '$hover' : undefined, hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 1, children: p.name }) }, p.slug))) })] }) }), _jsx(Publish, { source: publish, onClose: () => setPublish(null), onLive: fresh })] }));
+                                }, justify: "space-between", px: "$2", py: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, children: [_jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 1, flex: 1, children: r.title || 'Untitled run' }), _jsx(SizableText, { size: "$1", color: "$soft", children: r.status })] }, r.id)))) })] }) }), _jsx(Dialog, { open: switcher, onOpenChange: setSwitcher, children: _jsxs(DialogContent, { maxW: 420, children: [_jsx(DialogTitle, { children: "Projects" }), _jsx(YStack, { gap: "$1", maxH: 420, overflow: "scroll", children: repos.error ? (_jsx(SizableText, { size: "$2", color: "$soft", children: repos.error.message })) : repos.loading && repos.value.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$soft", children: "Reading the forge\u2026" })) : (repos.value.map((c) => {
+                                const here = Boolean(named) && c.name === named?.name;
+                                return (_jsx(XStack, { render: "button", "aria-label": `Open ${c.org}/${c.name}`, "aria-current": here ? 'page' : undefined, onPress: () => {
+                                        setSwitcher(false);
+                                        host.go(path({ kind: 'repo', org: c.org || host.org || '', name: c.name }));
+                                    }, px: "$2", py: "$1.5", rounded: "$3", bg: here ? '$hover' : undefined, hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 1, children: c.name }) }, `${c.org}/${c.name}`));
+                            })) }), _jsx(Button, { variant: "outline", size: "sm", onPress: () => {
+                                setSwitcher(false);
+                                host.go(path({ kind: 'screen', screen: 'projects' }));
+                            }, children: "All projects" })] }) }), _jsx(Publish, { source: publish, onClose: () => setPublish(null), onLive: fresh })] }));
 }

package/lib/route.d.ts

@@ -8,13 +8,15 @@
  *   -/settings[/<section>]  a section of Settings
  *   -/customize[/<tab>]     skills, connectors and plugins: what the agent brings to a run
  *   -/plans                 the plans an organization can be on
- *   <slug>          a project's workspace
+ *   <org>/<repo>    a repository's workspace: a project is a repository on the forge
+ *   <slug>          a deployed site's workspace (Artifacts)
  *
  * 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.
+ * so it can hold neither the `_` a session id carries nor start with `-`, and a
+ * repository is the one address with two segments, each starting with a letter
+ * or a digit. Anything else is not an address here and reads as the empty state.
  */
-export type Screen = 'artifacts' | 'templates' | 'codebases' | 'projects' | 'issues' | 'automations' | 'sync' | 'mcp' | 'plans';
+export type Screen = 'artifacts' | 'templates' | 'projects' | 'issues' | 'automations' | 'sync' | 'mcp' | 'plans';
 /** Settings, one section each. Every setting the builder has lives on this page, none elsewhere. */
 export declare const SECTIONS: readonly ['general', 'account', 'privacy', 'billing', 'usage', 'capabilities', 'memory', 'code', 'environments', 'machines', 'keys', 'members', 'integrations', 'notifications'];
 export type Section = (typeof SECTIONS)[number];
@@ -38,12 +40,18 @@ export type Route = {
 } | {
     kind: 'project';
     slug: string;
+} | {
+    kind: 'repo';
+    org: string;
+    name: string;
 } | {
     kind: 'automation';
     id: string;
 };
 export declare const SESSION: RegExp;
 export declare const SLUG: RegExp;
+/** An organization or a repository name on the forge (api/codebases.ts `NAME`). */
+export declare const NAME: RegExp;
 /** An automation's id, or `new` for one not yet written. */
 export declare const AUTOMATION: RegExp;
 export declare function route(path: string): Route;

package/lib/route.js

@@ -19,9 +19,11 @@ export const SECTIONS = [
 export const TABS = ['skills', 'connectors', 'plugins', 'agents'];
 export const SESSION = /^sess_[0-9a-f]{32}$/;
 export const SLUG = /^[a-z0-9]([a-z0-9-]{0,38}[a-z0-9])?$/;
+/** An organization or a repository name on the forge (api/codebases.ts `NAME`). */
+export const NAME = /^[A-Za-z0-9][A-Za-z0-9._-]{0,63}$/;
 /** An automation's id, or `new` for one not yet written. */
 export const AUTOMATION = /^(flow_[0-9a-f]{32}|new)$/;
-const SCREENS = ['artifacts', 'templates', 'codebases', 'projects', 'issues', 'automations', 'sync', 'mcp', 'plans'];
+const SCREENS = ['artifacts', 'templates', 'projects', 'issues', 'automations', 'sync', 'mcp', 'plans'];
 export function route(path) {
     const p = path.replace(/^\/+|\/+$/g, '');
     if (SESSION.test(p))
@@ -44,6 +46,9 @@ export function route(path) {
     }
     if (SLUG.test(p))
         return { kind: 'project', slug: p };
+    const [org, name, ...rest] = p.split('/');
+    if (!rest.length && org && name && NAME.test(org) && NAME.test(name))
+        return { kind: 'repo', org, name };
     return { kind: 'new' };
 }
 /** The path for a route — the inverse of `route`. */
@@ -61,6 +66,8 @@ export function path(r) {
             return r.tab === 'skills' ? '-/customize' : `-/customize/${r.tab}`;
         case 'project':
             return r.slug;
+        case 'repo':
+            return `${r.org}/${r.name}`;
         case 'automation':
             return `-/automations/${r.id}`;
     }

package/lib/section.d.ts

@@ -8,7 +8,7 @@ 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, Automations, the forge (Codebase, Projects, Issues), Artifacts, Templates, then the
+ * New, Automations, the forge (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.

package/lib/section.js

@@ -11,7 +11,7 @@ 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, CircleDot, FolderGit2, Kanban, LayoutTemplate, SlidersHorizontal, SquarePen, Workflow } from '@hanzogui/lucide-icons-2';
+import { Blocks, CircleDot, FolderGit2, LayoutTemplate, SlidersHorizontal, SquarePen, Workflow } from '@hanzogui/lucide-icons-2';
 import { SidebarItem, SidebarSection, StatusDot } from '@hanzo/ui/chat';
 import { useMemo } from 'react';
 import { pinBoard } from './choice.js';
@@ -32,7 +32,7 @@ export function useSessions(host) {
 }
 const Note = ({ children }) => (_jsx(SizableText, { size: "$1", color: "$soft", px: "$2", py: "$1", children: children }));
 /**
- * New, Automations, the forge (Codebase, Projects, Issues), Artifacts, Templates, then the
+ * New, Automations, the forge (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.
@@ -45,7 +45,7 @@ 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(Workflow, { size: 16, "aria-hidden": true }), active: screen === 'automations' || r.kind === 'automation', 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: () => {
+    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' || r.kind === 'automation', onPress: () => go(path({ kind: 'screen', screen: 'automations' })), children: "Automations" }), _jsx(SidebarItem, { icon: _jsx(FolderGit2, { size: 16, "aria-hidden": true }), active: screen === 'projects' || screen === 'sync' || r.kind === 'repo', 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(SlidersHorizontal, { size: 16, "aria-hidden": true }), active: r.kind === 'customize', onPress: () => go(path({ kind: 'customize', tab: 'connectors' })), children: "Customize" }), _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.js

@@ -77,7 +77,7 @@ export function Sync() {
         }
     };
     const back = () => {
-        host.go(path({ kind: 'screen', screen: 'codebases' }));
+        host.go(path({ kind: 'screen', screen: 'projects' }));
     };
     useEffect(() => {
         if (!syncing)
@@ -102,7 +102,7 @@ export function Sync() {
             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: () => {
+    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 projects", onPress: back, children: _jsx(SizableText, { size: "$2", color: "$soft", children: "Projects" }) }), _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] })] })] }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/build",
-  "version": "0.2.51",
+  "version": "0.2.52",
   "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 component, mounted by the Hanzo app at hanzo.ai.",