@hanzo/build 0.2.16 → 0.2.18

package/lib/customize/ui.js

@@ -9,6 +9,7 @@ import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { Check, Plus, X } from '@hanzogui/lucide-icons-2';
 import { Button, Dialog, DialogContent, DialogTitle } from '@hanzo/ui';
 import { useState } from 'react';
+import { useHost } from '../host.js';
 export const mono = { fontFamily: 'var(--f-mono, ui-monospace, monospace)' };
 /** A button that holds a card's text reads from the left, not from the middle a button centres it in. */
 export const left = { textAlign: 'left' };
@@ -40,7 +41,7 @@ export function Tile({ title, detail, meta, mark, action, onOpen, }) {
 }
 /** The one card the shelf puts first, drawn larger. */
 export function Featured({ title, detail, meta, mark, action, onOpen }) {
-    return (_jsxs(XStack, { items: "flex-start", gap: "$4", p: "$4", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", flexWrap: "wrap", rowGap: "$3", children: [_jsxs(XStack, { render: "button", "aria-label": title, onPress: onOpen, flex: 1, minW: 220, gap: "$4", items: "flex-start", cursor: "pointer", style: left, children: [mark, _jsxs(YStack, { flex: 1, minW: 0, gap: "$1.5", children: [_jsx(SizableText, { size: "$1", color: "$soft", textTransform: "uppercase", letterSpacing: 1, children: "Featured" }), _jsx(SizableText, { size: "$6", color: "$ink", numberOfLines: 1, children: title }), _jsx(SizableText, { size: "$2", color: "$soft", numberOfLines: 3, children: detail }), meta ? (_jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: meta })) : null] })] }), action] }));
+    return (_jsxs(XStack, { items: "flex-start", gap: "$4", p: "$4", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", flexWrap: "wrap", rowGap: "$3", children: [_jsxs(XStack, { render: "button", "aria-label": title, onPress: onOpen, flex: 1, minW: 220, gap: "$4", items: "flex-start", cursor: "pointer", style: left, children: [mark, _jsxs(YStack, { flex: 1, minW: 0, gap: "$1.5", children: [_jsx(SizableText, { size: "$1", color: "$soft", textTransform: "uppercase", letterSpacing: 1, children: "Featured" }), _jsx(SizableText, { size: "$6", color: "$ink", numberOfLines: 1, children: title }), _jsx(SizableText, { size: "$2", color: "$soft", numberOfLines: 3, children: detail }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: meta })] })] }), action] }));
 }
 /** A card's add control: a plus while it is not yours, a check once it is. */
 export function Add({ name, added, busy, onPress }) {
@@ -65,7 +66,7 @@ export function Confirm({ what, says, open, onOpenChange, onYes }) {
             onOpenChange(false);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setBusy(false);
@@ -77,6 +78,11 @@ export function Confirm({ what, says, open, onOpenChange, onYes }) {
 export function Soft({ children, action }) {
     return (_jsxs(YStack, { py: "$6", items: "center", gap: "$3", children: [_jsx(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center' }, children: children }), action] }));
 }
+/** What a signed-out visitor is told, with the one control that signs them in. */
+export function Visitor({ children }) {
+    const host = useHost();
+    return (_jsx(Soft, { action: _jsx(Button, { size: "sm", onPress: () => host.signIn?.(), children: "Sign in" }), children: children }));
+}
 /** What the last action did, said once, where it was done. */
 export function Line({ children }) {
     if (!children)
@@ -85,7 +91,7 @@ export function Line({ children }) {
 }
 /** A small heading over a run of cards. */
 export function Part({ title, detail, children }) {
-    return (_jsxs(YStack, { gap: "$2.5", children: [_jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: title }), detail ? (_jsx(SizableText, { size: "$1", color: "$soft", children: detail })) : null] }), children] }));
+    return (_jsxs(YStack, { gap: "$2.5", children: [_jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: title }), _jsx(SizableText, { size: "$1", color: "$soft", children: detail })] }), children] }));
 }
 /** A labelled control, with a line under it when there is more to say. */
 export function Field({ label, hint, children }) {

package/lib/data.js

@@ -32,7 +32,8 @@ export function useRead(load, initial, key) {
             setValue(v);
             setError(null);
         })
-            .catch((e) => live && setError(e instanceof Error ? e : new Error(String(e))))
+            // Every read goes through the platform's client, which refuses with an Error.
+            .catch((e) => live && setError(e))
             .finally(() => live && setLoading(false));
         return () => {
             live = false;
@@ -50,27 +51,28 @@ export function useRecents(t, signed) {
     const read = useRead(signed ? () => list(t, { kind: 'coding', limit: 50 }) : null, [], [t, signed]);
     const [rows, setRows] = useState([]);
     useEffect(() => setRows(read.value), [read.value]);
-    // A feed of the whole org carries every agent's heartbeat, so an unseen id
-    // re-reads the list at most every five seconds.
     const last = useRef(0);
-    const reload = useRef(() => { });
-    reload.current = () => {
-        const now = Date.now();
-        if (now - last.current < 5000)
-            return;
-        last.current = now;
-        read.reload();
-    };
+    // useRead's reload is the same function every render, so it never reopens the feed.
+    const again = read.reload;
     useEffect(() => {
         if (!signed)
             return;
+        // A feed of the whole org carries every agent's heartbeat, so an unseen id
+        // re-reads the list at most every five seconds.
+        const reload = () => {
+            const now = Date.now();
+            if (now - last.current < 5000)
+                return;
+            last.current = now;
+            again();
+        };
         const ctl = new AbortController();
         void watch(t, '', {
             session: (s) => setRows((prev) => {
                 const i = prev.findIndex((r) => r.id === s.id);
                 if (i === -1) {
                     // A run this list has not seen: re-read rather than guess its kind.
-                    reload.current();
+                    reload();
                     return prev;
                 }
                 const next = prev.slice();
@@ -79,13 +81,13 @@ export function useRecents(t, signed) {
             }),
             open: (n) => {
                 if (n > 0)
-                    reload.current();
+                    reload();
             },
         }, ctl.signal).catch(() => {
             /* a refused feed leaves the list as read */
         });
         return () => ctl.abort();
-    }, [t, signed]);
+    }, [t, signed, again]);
     return { ...read, value: rows };
 }
 export function usePlaces(t, signed) {
@@ -149,7 +151,7 @@ export function useRun(t, id) {
                 if (n > 0)
                     reload.current();
             },
-        }, ctl.signal).catch((e) => setRefused(e instanceof Error ? e.message : 'The feed was refused'));
+        }, ctl.signal).catch((e) => setRefused(e.message));
         return () => ctl.abort();
     }, [t, id]);
     // The read and the frames describe THIS run or nothing: a read kept from the

package/lib/desk.d.ts

@@ -17,11 +17,11 @@ export declare function Desk({ id, repo, branch, base, environment, mode, pr, ti
     sandbox: string;
     events: Event[];
     live: boolean;
-    /** What can be done to the run — rename, share, copy its id — as its header's menu offers it. */
-    menu?: NonNullable<DropdownMenuProps['items']>;
+    /** What can be done to the run — rename, share, copy its id — as its header offers it. */
+    menu: NonNullable<DropdownMenuProps['items']>;
     refused: string;
     /** The refusal's one action: Retry, or Sign in when nobody is. */
-    retry?: string;
+    retry: string;
     onRetry: () => void;
-    onHide?: () => void;
+    onHide: () => void;
 }): import("react").JSX.Element;

package/lib/desk.js

@@ -14,13 +14,15 @@ import { Files } from './files.js';
 import { Git } from './git.js';
 /** The tabs that are a surface of their own, drawn edge to edge. */
 const BLEED = ['desktop', 'terminal'];
-export function Desk({ id, repo, branch, base, environment, mode, pr, title, project, sandbox, events, live, menu = [], refused, retry = 'Retry', onRetry, onHide, }) {
-    // A setup run's work IS the environment, so it opens there.
-    const [tab, setTab] = useState(mode === 'setup' ? 'environment' : 'terminal');
+export function Desk({ id, repo, branch, base, environment, mode, pr, title, project, sandbox, events, live, menu, refused, retry, onRetry, onHide, }) {
+    // Until a tab is picked it follows the run's mode, which is known once the run
+    // is read: a setup run's work IS the environment, so it opens there.
+    const [picked, setTab] = useState(null);
+    const tab = picked ?? (mode === 'setup' ? 'environment' : 'terminal');
     const name = repo.split('/').filter(Boolean).pop() || repo;
     const lines = shell(events);
     const bleed = BLEED.includes(tab);
-    return (_jsxs(YStack, { role: "complementary", "aria-label": "Run details", flex: 1, minW: 0, minH: 0, borderLeftWidth: 1, borderColor: "$borderColor", display: "none", $md: { display: 'flex' }, children: [_jsxs(XStack, { px: "$2", pt: "$2", gap: "$1", borderBottomWidth: 1, borderColor: "$borderColor", items: "center", children: [_jsxs(XStack, { flex: 1, minW: 0, gap: "$1", overflow: "scroll", children: [_jsx(TabButton, { id: "environment", tab: tab, onPick: setTab, children: "Environment" }), _jsx(TabButton, { id: "git", tab: tab, onPick: setTab, children: "Git" }), _jsx(TabButton, { id: "desktop", tab: tab, onPick: setTab, children: "Desktop" }), _jsx(TabButton, { id: "terminal", tab: tab, onPick: setTab, children: "Terminal" }), _jsx(TabButton, { id: "files", tab: tab, onPick: setTab, children: "Files" }), _jsx(TabButton, { id: "subscriptions", tab: tab, onPick: setTab, children: "Subscriptions" })] }), onHide ? (_jsx(XStack, { render: "button", "aria-label": "Hide the side pane", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, onPress: onHide, children: _jsx(PanelRightClose, { size: 16 }) })) : null, _jsx(DropdownMenu, { trigger: _jsx(XStack, { render: "button", "aria-label": "Run actions", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, children: _jsx(MoreHorizontal, { size: 16 }) }), items: [...menu, { key: 'details', label: 'Details', icon: _jsx(Info, { size: 16 }), onSelect: () => setTab('environment') }] })] }), _jsxs(YStack, { flex: 1, minH: 0, overflow: bleed ? 'hidden' : 'scroll', px: bleed ? 0 : '$3', py: bleed ? 0 : '$3', children: [tab === 'environment' ? (_jsxs(YStack, { gap: "$2", children: [_jsx(Environment, { repo: name, busy: live && mode === 'setup' }), _jsx(SizableText, { size: "$2", color: "$ink", pt: "$4", children: "This run" }), _jsx(Fact, { label: "Run", value: id }), _jsx(Fact, { label: "Repository", value: name || '—' }), _jsx(Fact, { label: "Branch", value: branch || '—' }), _jsx(Fact, { label: "Base", value: base || '—' }), _jsx(Fact, { label: "Runs on", value: environment || 'sandbox' }), _jsx(Fact, { label: "Mode", value: mode || 'build' })] })) : null, tab === 'git' ? _jsx(Git, { session: id, title: title, live: live }) : null, tab === 'desktop' ? _jsx(Door, { which: "screen", sandbox: sandbox, live: live, session: id }) : null, tab === 'terminal' ? (_jsx(Terminal, { id: id, sandbox: sandbox, lines: lines, live: live, refused: refused, retry: retry, onRetry: onRetry })) : null, tab === 'files' ? (_jsx(Files, { session: id, repo: repo, branch: branch, sandbox: sandbox, live: live, mode: mode, project: project, pr: pr, onEnvironment: () => setTab('environment') })) : null, tab === 'subscriptions' ? (_jsx(YStack, { flex: 1, items: "center", justify: "center", px: "$6", children: _jsx(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center', maxWidth: 320 }, children: "Ask an agent to subscribe to a Slack channel or thread, a pull request, or a timer." }) })) : null] })] }));
+    return (_jsxs(YStack, { role: "complementary", "aria-label": "Run details", flex: 1, minW: 0, minH: 0, borderLeftWidth: 1, borderColor: "$borderColor", display: "none", $md: { display: 'flex' }, children: [_jsxs(XStack, { px: "$2", pt: "$2", gap: "$1", borderBottomWidth: 1, borderColor: "$borderColor", items: "center", children: [_jsxs(XStack, { flex: 1, minW: 0, gap: "$1", overflow: "scroll", children: [_jsx(TabButton, { id: "environment", tab: tab, onPick: setTab, children: "Environment" }), _jsx(TabButton, { id: "git", tab: tab, onPick: setTab, children: "Git" }), _jsx(TabButton, { id: "desktop", tab: tab, onPick: setTab, children: "Desktop" }), _jsx(TabButton, { id: "terminal", tab: tab, onPick: setTab, children: "Terminal" }), _jsx(TabButton, { id: "files", tab: tab, onPick: setTab, children: "Files" }), _jsx(TabButton, { id: "subscriptions", tab: tab, onPick: setTab, children: "Subscriptions" })] }), _jsx(XStack, { render: "button", "aria-label": "Hide the side pane", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, onPress: onHide, children: _jsx(PanelRightClose, { size: 16 }) }), _jsx(DropdownMenu, { trigger: _jsx(XStack, { render: "button", "aria-label": "Run actions", px: "$2", py: "$1", rounded: "$2", hoverStyle: { bg: '$hover' }, children: _jsx(MoreHorizontal, { size: 16 }) }), items: [...menu, { key: 'details', label: 'Details', icon: _jsx(Info, { size: 16 }), onSelect: () => setTab('environment') }] })] }), _jsxs(YStack, { flex: 1, minH: 0, overflow: bleed ? 'hidden' : 'scroll', px: bleed ? 0 : '$3', py: bleed ? 0 : '$3', children: [tab === 'environment' ? (_jsxs(YStack, { gap: "$2", children: [_jsx(Environment, { repo: name, busy: live && mode === 'setup' }), _jsx(SizableText, { size: "$2", color: "$ink", pt: "$4", children: "This run" }), _jsx(Fact, { label: "Run", value: id }), _jsx(Fact, { label: "Repository", value: name || '—' }), _jsx(Fact, { label: "Branch", value: branch || '—' }), _jsx(Fact, { label: "Base", value: base || '—' }), _jsx(Fact, { label: "Runs on", value: environment || 'sandbox' }), _jsx(Fact, { label: "Mode", value: mode || 'build' })] })) : null, tab === 'git' ? _jsx(Git, { session: id, title: title, live: live }) : null, tab === 'desktop' ? _jsx(Door, { which: "screen", sandbox: sandbox, live: live, session: id }) : null, tab === 'terminal' ? (_jsx(Terminal, { id: id, sandbox: sandbox, lines: lines, live: live, refused: refused, retry: retry, onRetry: onRetry })) : null, tab === 'files' ? (_jsx(Files, { session: id, repo: repo, branch: branch, sandbox: sandbox, live: live, mode: mode, project: project, pr: pr, onEnvironment: () => setTab('environment') })) : null, tab === 'subscriptions' ? (_jsx(YStack, { flex: 1, items: "center", justify: "center", px: "$6", children: _jsx(SizableText, { size: "$2", color: "$soft", style: { textAlign: 'center', maxWidth: 320 }, children: "Ask an agent to subscribe to a Slack channel or thread, a pull request, or a timer." }) })) : null] })] }));
 }
 function TabButton({ id, tab, onPick, children }) {
     const on = tab === id;

package/lib/door.js

@@ -39,7 +39,7 @@ export function Door({ which, sandbox, live, session }) {
             if (gone)
                 return;
             setState('failed');
-            setWhy(e instanceof Error ? e.message : '');
+            setWhy(e.message);
         });
         return () => {
             gone = true;

package/lib/environment.js

@@ -63,7 +63,7 @@ export function Environment({ repo, busy }) {
             return true;
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
             return false;
         }
         finally {
@@ -78,7 +78,7 @@ export function Environment({ repo, busy }) {
             host.go(run.session);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'The setup run did not start');
+            setNote(e.message);
             setWorking(false);
         }
     };
@@ -116,7 +116,7 @@ export function SetupDialog({ repo, open, onOpenChange, onStart, onSaved, }) {
             done();
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);

package/lib/find.js

@@ -44,7 +44,7 @@ export function Find({ open, onOpenChange, recents, onOpen, }) {
         })
             .catch((e) => {
             if (mine === asked.current)
-                setError(e instanceof Error ? e.message : 'The runs could not be read');
+                setError(e.message);
         })
             .finally(() => {
             if (mine === asked.current)
@@ -71,7 +71,7 @@ export function Find({ open, onOpenChange, recents, onOpen, }) {
         return n ? all.filter((h) => `${h.title} ${h.line}`.toLowerCase().includes(n)) : all;
     }, [q, rows, recents, status]);
     return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { maxW: 520, children: [_jsx(DialogTitle, { children: "Find a run" }), _jsx(Input, { autoFocus: true, value: q, onChangeText: setQ, placeholder: "Search runs\u2026", "aria-label": "Search runs", onKeyDown: (e) => {
-                        if ((e.key ?? e.nativeEvent?.key) === 'Enter' && hits[0])
+                        if (e.key === 'Enter' && hits[0])
                             onOpen(hits[0].id);
                     } }), _jsx(XStack, { gap: "$1", flexWrap: "wrap", role: "group", "aria-label": "Status", children: FILTERS.map((f) => (_jsx(XStack, { render: "button", "aria-label": f.label, "aria-pressed": status === f.id, onPress: () => setStatus(f.id), px: "$2.5", py: "$1", rounded: "$10", borderWidth: 1, borderColor: status === f.id ? '$ink' : '$borderColor', bg: status === f.id ? '$hover' : 'transparent', hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$1", color: status === f.id ? '$ink' : '$soft', children: f.label }) }, f.id || 'all'))) }), _jsx(ScrollView, { maxH: 360, children: _jsxs(YStack, { gap: "$1", role: "list", children: [hits.map((h) => (_jsxs(XStack, { role: "listitem", render: "button", "aria-label": h.title, onPress: () => onOpen(h.id), px: "$2", py: "$1.5", rounded: "$3", hoverStyle: { bg: '$hover' }, items: "center", gap: "$3", children: [_jsx(SizableText, { flex: 1, minW: 0, size: "$2", color: "$ink", numberOfLines: 1, style: { textAlign: 'left' }, children: h.title }), h.line ? (_jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, shrink: 0, maxW: "45%", children: h.line })) : null] }, h.id))), !loading && !error && hits.length === 0 ? (_jsx(SizableText, { size: "$2", color: "$soft", px: "$2", children: rows && next ? 'No run read so far matches.' : 'No run matches.' })) : null] }) }), error ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: error })) : null, loading ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: "Reading runs\u2026" })) : next ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "outline", onPress: () => void read(next), children: "Older runs" }) })) : null] }) }));
 }

package/lib/forge.js

@@ -69,7 +69,7 @@ function Automations() {
             setTick((n) => n + 1);
         }
         catch (e) {
-            setProblem(e instanceof Error ? e.message : 'Could not change that automation');
+            setProblem(e.message);
         }
     };
     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: "Automations" }), _jsx(SizableText, { size: "$2", color: "$soft", children: "Repeating work for this organization. A new one starts off, so you can name it before it runs." })] }), _jsxs(Button, { size: "sm", shrink: 0, disabled: !signed, onPress: () => setMaking(true), children: [_jsx(Plus, { size: 14 }), "New automation"] })] }), _jsx(XStack, { justify: "flex-end", children: _jsx(YStack, { width: 240, maxW: "100%", children: _jsx(Input, { value: q, onChangeText: setQ, placeholder: "Search\u2026", "aria-label": "Search automations", disabled: !signed }) }) }), problem ? _jsx(Note, { children: problem }) : null, list.error ? (_jsx(Note, { children: list.error.message })) : !signed ? (_jsx(Empty, { says: "Sign in to see this organization's automations." })) : list.loading && list.value.length === 0 ? (_jsx(Empty, { says: "Reading automations\u2026" })) : shown.length === 0 ? (_jsx(Empty, { says: list.value.length === 0 ? 'No automations yet.' : 'Nothing matches.', children: list.value.length === 0 ? (_jsx(Button, { size: "sm", onPress: () => setMaking(true), children: "New automation" })) : null })) : (_jsxs(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: [_jsxs(XStack, { px: "$3", py: "$2", gap: "$3", children: [_jsx(SizableText, { flex: 1, size: "$1", color: "$soft", children: "Name" }), _jsx(SizableText, { size: "$1", color: "$soft", width: 80, style: { textAlign: 'right' }, children: "Status" }), _jsx(SizableText, { size: "$1", color: "$soft", width: 120, style: { textAlign: 'right' }, children: "Updated" })] }), shown.map((a) => (_jsxs(XStack, { items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: 1, borderColor: "$borderColor", children: [_jsx(Workflow, { size: 14 }), _jsx(SizableText, { flex: 1, size: "$2", color: "$ink", numberOfLines: 1, children: a.name }), _jsx(XStack, { render: "button", "aria-label": a.status === 'ENABLED' ? `Turn off ${a.name}` : `Turn on ${a.name}`, onPress: () => void flip(a), width: 80, justify: "flex-end", children: _jsx(SizableText, { size: "$1", color: "$ink", children: a.status === 'ENABLED' ? 'On' : 'Off' }) }), _jsx(SizableText, { size: "$1", color: "$soft", width: 120, style: { textAlign: 'right' }, children: a.updated ? when(new Date(a.updated).toISOString()) : '—' })] }, a.id)))] }))] }), _jsx(NewAutomation, { open: making, onOpenChange: setMaking, onCreate: async (name) => {
@@ -93,7 +93,7 @@ function NewAutomation({ open, onOpenChange, onCreate, }) {
             setName('');
         }
         catch (e) {
-            setError(e instanceof Error ? e.message : 'Could not create that automation');
+            setError(e.message);
         }
         finally {
             setBusy(false);
@@ -198,7 +198,7 @@ function NewRepo({ open, onOpenChange, onCreate, }) {
             setDescription('');
         }
         catch (e) {
-            setError(e instanceof Error ? e.message : 'Could not create that repository');
+            setError(e.message);
         }
         finally {
             setBusy(false);
@@ -240,20 +240,12 @@ function Issues() {
     const signed = Boolean(host.person);
     const [board, setBoard] = useKept(boardKey(host.org), '');
     const list = useRead(signed ? () => issues(t, board) : null, [], [t, signed, board]);
+    // Another screen chose the board (the rail's Issues chooses every board) while this one is open.
     useEffect(() => {
-        const on = () => {
-            try {
-                const raw = window.localStorage.getItem(boardKey(host.org));
-                const next = raw === null ? '' : JSON.parse(raw);
-                setBoard(typeof next === 'string' ? next : '');
-            }
-            catch {
-                setBoard('');
-            }
-        };
+        const on = (e) => setBoard(e.detail);
         window.addEventListener('hanzo-board', on);
         return () => window.removeEventListener('hanzo-board', on);
-    }, [host.org, setBoard]);
+    }, [setBoard]);
     const open = (w) => {
         const name = w.repo || w.project;
         if (name) {

package/lib/git.js

@@ -39,7 +39,7 @@ export function Git({ session, title, live }) {
                                             : 'Open'
                                     : c.pull.state === 'merged'
                                         ? 'Merged'
-                                        : 'Closed' }), c.pull.url.startsWith('https://') ? (_jsx(Out, { href: c.pull.url, label: `Open pull request #${c.pull.number}`, children: _jsx(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: "Open on the forge" }) })) : null] }), c.pull.reviews.length ? (c.pull.reviews.map((r, i) => (_jsxs(YStack, { gap: "$1", pb: "$2", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: `${r.author || 'Someone'} · ${verdict(r.state)}${r.at ? ` · ${when(r.at)}` : ''}` }), r.body ? (_jsx(SizableText, { size: "$2", color: "$ink", children: r.body })) : null] }, i)))) : (_jsx(Soft, { children: "No reviews yet" }))] })) : (_jsx(Soft, { children: "No pull request yet. The run opens one when it pushes its changes." }))) : c.commits.length ? (_jsx(YStack, { children: c.commits.map((k) => (_jsxs(XStack, { gap: "$3", py: "$2", borderBottomWidth: 1, borderColor: "$borderColor", items: "baseline", children: [_jsx(SizableText, { size: "$1", color: "$soft", style: mono, children: k.sha.slice(0, 7) }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 2, children: k.message }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: [k.author, when(k.date)].filter(Boolean).join(' · ') })] })] }, k.sha))) })) : (_jsx(Soft, { children: "No pushed commits" }))] }));
+                                        : 'Closed' }), c.pull.url.startsWith('https://') ? (_jsx(Out, { href: c.pull.url, label: `Open pull request #${c.pull.number}`, children: _jsx(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: "Open on the forge" }) })) : null] }), c.pull.reviews.length ? (c.pull.reviews.map((r, i) => (_jsxs(YStack, { gap: "$1", pb: "$2", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsx(SizableText, { size: "$1", color: "$soft", children: [r.author || 'Someone', verdict(r.state), when(r.at)].filter(Boolean).join(' · ') }), r.body ? (_jsx(SizableText, { size: "$2", color: "$ink", children: r.body })) : null] }, i)))) : (_jsx(Soft, { children: "No reviews yet" }))] })) : (_jsx(Soft, { children: "No pull request yet. The run opens one when it pushes its changes." }))) : c.commits.length ? (_jsx(YStack, { children: c.commits.map((k) => (_jsxs(XStack, { gap: "$3", py: "$2", borderBottomWidth: 1, borderColor: "$borderColor", items: "baseline", children: [_jsx(SizableText, { size: "$1", color: "$soft", style: mono, children: k.sha.slice(0, 7) }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", numberOfLines: 2, children: k.message }), _jsx(SizableText, { size: "$1", color: "$soft", numberOfLines: 1, children: [k.author, when(k.date)].filter(Boolean).join(' · ') })] })] }, k.sha))) })) : (_jsx(Soft, { children: "No pushed commits" }))] }));
 }
 function File({ change: f, first }) {
     const [open, setOpen] = useState(false);

package/lib/host.d.ts

@@ -17,6 +17,8 @@ export interface Person {
     avatar: string;
 }
 export interface Host {
+    /** The product's name, drawn at the top left: `Hanzo Build` on hanzo.build, `Hanzo` on hanzo.ai. */
+    name: string;
     /** The platform origin, no trailing slash. */
     api: string;
     /** The signed-in person's bearer, or null. Read at call time, so a refresh is picked up. */

package/lib/landing.js

@@ -41,6 +41,13 @@ export const EFFORTS = [
 ];
 const FIRST = { repo: null, branch: '', place: '', mode: 'build', model: ENSO, effort: 'medium', ask: '' };
 const COLUMN = 768;
+/**
+ * What was typed here and not sent, for as long as this document lives. Signing
+ * in swaps a visitor's page for the rail, which draws New again in another
+ * place; the popup keeps the document so the sentence can come along, and this
+ * is where it waits.
+ */
+let unsent = { draft: '', files: [] };
 export function Landing({ onStarted }) {
     const host = useHost();
     const t = useTarget();
@@ -50,8 +57,11 @@ export function Landing({ onStarted }) {
     // Nothing chosen here yet: start from the person's coding defaults (Settings → Code).
     const kept = stored ?? { ...FIRST, ...prefs.code };
     const set = (patch) => keep({ ...kept, ...patch });
-    const [draft, setDraft] = useState(kept.ask || '');
-    const [files, setFiles] = useState([]);
+    const [draft, setDraft] = useState(kept.ask || unsent.draft);
+    const [files, setFiles] = useState(unsent.files);
+    useEffect(() => {
+        unsent = { draft, files };
+    }, [draft, files]);
     const [busy, setBusy] = useState(false);
     const [note, setNote] = useState('');
     const [adding, setAdding] = useState(null);
@@ -81,18 +91,16 @@ export function Landing({ onStarted }) {
             known.current.set(r.name, r);
         return { repos, next: null };
     }, [t]);
+    // Drawn only once a forge codebase is chosen; one the forge no longer lists offers its default branch.
+    const home = kept.repo?.default_branch || 'main';
     const loadBranches = useCallback(async (q) => {
-        if (!kept.repo)
-            return { branches: [], next: null };
-        const found = await one(t, kept.repo.name);
+        const found = await one(t, codebase);
         const needle = q.trim().toLowerCase();
-        const names = (found?.branches ?? [kept.repo.default_branch || 'main']).filter((b) => !needle || b.toLowerCase().includes(needle));
+        const names = (found?.branches ?? [home]).filter((b) => !needle || b.toLowerCase().includes(needle));
         return { branches: names.map((name) => ({ name })), next: null };
-    }, [t, kept.repo]);
+    }, [t, codebase, home]);
+    // The composer sends only a draft with words in it, and not while a send is out.
     const send = async () => {
-        const prompt = draft.trim();
-        if (!prompt || busy)
-            return;
         if (!signed) {
             host.signIn?.();
             return;
@@ -105,11 +113,12 @@ export function Landing({ onStarted }) {
         setNote('');
         try {
             const run = await start(t, {
-                prompt: compose(prompt, files),
+                prompt: compose(draft.trim(), files),
                 // The name alone. The org rides the request, and a slash is not a repo name.
-                repo: isForge(kept.repo) ? kept.repo.name : undefined,
-                base: isForge(kept.repo) ? kept.branch || kept.repo.default_branch || undefined : undefined,
-                targetId: place.id || undefined,
+                // An empty base or place is not sent: the default branch, and the sandbox.
+                repo: kept.repo.name,
+                base: kept.branch,
+                targetId: place.id,
                 mode: kept.mode,
                 model: kept.model === ENSO ? undefined : kept.model,
                 effort: kept.effort,
@@ -119,7 +128,7 @@ export function Landing({ onStarted }) {
             onStarted(run.session);
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'The run could not start');
+            setNote(e.message);
         }
         finally {
             setBusy(false);
@@ -146,7 +155,7 @@ export function Landing({ onStarted }) {
         place: p,
     })), [places.value, setUp]);
     const branch = kept.branch || kept.repo?.default_branch || 'main';
-    const head = (_jsxs(XStack, { gap: 6, items: "center", flexWrap: "wrap", children: [_jsx(ChipSelect, { name: "Where the run runs", icon: place.id ? _jsx(Monitor, { size: 13 }) : _jsx(Cloud, { size: 13 }), label: place.id ? place.label : 'Cloud', chosen: placeItems.find((i) => i.place.id === place.id) ?? null, items: placeItems, onChange: (i) => set({ place: i.place.id }), placeholder: "Search machines\u2026", loading: places.loading, error: places.error?.message ?? null, footer: _jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$1", color: "$ink", children: "Set up remote control" }), _jsxs(SizableText, { size: "$1", color: "$soft", children: ["Run", ' ', _jsx(SizableText, { size: "$1", color: "$ink", style: { fontFamily: 'var(--f-mono, ui-monospace, monospace)' }, children: "hanzo link" }), ' ', "on a machine: it joins this list, and a run there uses its checkout and credentials."] })] }) }), _jsx(RepoSelect, { open: picking, onOpenChange: setPicking, value: isForge(kept.repo) ? kept.repo : null, onChange: (r) => {
+    const head = (_jsxs(XStack, { gap: 6, items: "center", flexWrap: "wrap", children: [_jsx(ChipSelect, { name: "Where the run runs", icon: place.id ? _jsx(Monitor, { size: 13 }) : _jsx(Cloud, { size: 13 }), label: place.id ? place.label : 'Cloud', chosen: placeItems.find((i) => i.place.id === place.id), items: placeItems, onChange: (i) => set({ place: i.place.id }), placeholder: "Search machines\u2026", loading: places.loading, error: places.error?.message ?? null, footer: _jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$1", color: "$ink", children: "Set up remote control" }), _jsxs(SizableText, { size: "$1", color: "$soft", children: ["Run", ' ', _jsx(SizableText, { size: "$1", color: "$ink", style: { fontFamily: 'var(--f-mono, ui-monospace, monospace)' }, children: "hanzo link" }), ' ', "on a machine: it joins this list, and a run there uses its checkout and credentials."] })] }) }), _jsx(RepoSelect, { open: picking, onOpenChange: setPicking, value: isForge(kept.repo) ? kept.repo : null, onChange: (r) => {
                     const row = known.current.get(r.name) ?? chosen(r);
                     set({ repo: row, branch: row.default_branch });
                 }, load: loadRepos, troubleshoot: {

package/lib/markdown.js

@@ -5,7 +5,8 @@ const RULE = /^\s{0,3}([-*_])(\s*\1){2,}\s*$/;
 const QUOTE = /^\s{0,3}>\s?(.*)$/;
 const ROW = /^\s*\|(.*)\|\s*$/;
 const DIVIDER = /^\s*\|?\s*:?-{3,}:?\s*(\|\s*:?-{3,}:?\s*)*\|?\s*$/;
-const cells = (line) => (ROW.exec(line)?.[1] ?? line).split('|').map((c) => c.trim());
+/** A table row's cells. Only a line ROW matched is one. */
+const cells = (line) => ROW.exec(line)[1].split('|').map((c) => c.trim());
 /** The blocks of a markdown text, in order. */
 export function blocks(md) {
     const lines = md.replace(/\r\n?/g, '\n').split('\n');
@@ -25,7 +26,7 @@ export function blocks(md) {
             i++;
             while (i < lines.length && !lines[i].trim().startsWith(fence[1]))
                 body.push(lines[i++]);
-            out.push({ kind: 'code', lang: fence[2] ?? '', text: body.join('\n') });
+            out.push({ kind: 'code', lang: fence[2], text: body.join('\n') });
             continue;
         }
         if (!line.trim()) {
@@ -78,7 +79,7 @@ export function blocks(md) {
                     continue;
                 }
                 // A line indented under an item continues it.
-                if (lines[j].trim() && /^\s{2,}/.test(lines[j]) && items.length) {
+                if (lines[j].trim() && /^\s{2,}/.test(lines[j])) {
                     items[items.length - 1].text += ` ${lines[j].trim()}`;
                     j++;
                     continue;
@@ -113,7 +114,8 @@ export function spans(text) {
             out.push({ kind: 'strong', text: (m[5] ?? m[6]) });
         else if (m[7] !== undefined || m[8] !== undefined)
             out.push({ kind: 'em', text: (m[7] ?? m[8]) });
-        else if (m[9] !== undefined)
+        // What is left is the bare address, the only other thing INLINE matches.
+        else
             out.push({ kind: 'link', text: m[9], href: m[9] });
         at = m.index + m[0].length;
     }

package/lib/pitch.d.ts

@@ -0,0 +1,4 @@
+export declare const INSTALL = "curl -fsSL hanzo.sh | sh";
+export declare function Pitch({ onStart }: {
+    onStart: () => void;
+}): import("react").JSX.Element;

package/lib/pitch.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * What a visitor reads under New on hanzo.build: the same agent on their own
+ * computer, one line to install, and what it brings to a run. Each card names
+ * something this page or the CLI does today, and nothing it does not.
+ */
+import { SizableText, XStack, YStack } from '@hanzo/gui';
+import { Check, Copy, GitPullRequest, LayoutTemplate, ListChecks, MonitorPlay, Plug, Server, Sparkles, Workflow } from '@hanzogui/lucide-icons-2';
+import { Button } from '@hanzo/ui';
+import { useState } from 'react';
+import { DOCS } from './foot.js';
+export const INSTALL = 'curl -fsSL hanzo.sh | sh';
+const FEATURES = [
+    { icon: _jsx(Sparkles, { size: 18 }), title: 'Skills', body: 'Teach it a workflow once. A skill loads when a task matches, or when you call it by name.' },
+    { icon: _jsx(ListChecks, { size: 18 }), title: 'Plan first', body: 'Start a run in plan mode. Nothing is built until you approve the plan.' },
+    { icon: _jsx(Plug, { size: 18 }), title: 'Connectors and plugins', body: 'MCP servers, skills and agents behind one install. Your org’s credentials reach a run through a relay, never the sandbox.' },
+    { icon: _jsx(Server, { size: 18 }), title: 'Environments', body: 'Point it at a repository. An agent works out install and start, and every later run begins from that setup.' },
+    { icon: _jsx(MonitorPlay, { size: 18 }), title: 'Desktop and terminal', body: 'Watch each run’s browser and shell live, beside the conversation.' },
+    { icon: _jsx(GitPullRequest, { size: 18 }), title: 'Review', body: 'Every run ends as a diff on its own branch, with commits and a pull request to review.' },
+    { icon: _jsx(LayoutTemplate, { size: 18 }), title: 'Templates to live', body: 'Start from a working app and publish it to a live address.' },
+    { icon: _jsx(Workflow, { size: 18 }), title: 'Automations', body: 'Hand it repeating work, and it runs on your schedule.' },
+];
+/** One line to copy, with a button that copies it. */
+function Line({ text }) {
+    const [copied, setCopied] = useState(false);
+    const copy = () => {
+        void navigator.clipboard.writeText(text).then(() => {
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+        });
+    };
+    return (_jsxs(XStack, { items: "center", gap: "$3", px: "$4", height: 52, rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", width: "100%", maxW: 560, children: [_jsx(SizableText, { size: "$3", color: "$soft", fontFamily: "$mono", "aria-hidden": true, children: "$" }), _jsx(SizableText, { flex: 1, size: "$3", color: "$ink", fontFamily: "$mono", numberOfLines: 1, children: text }), _jsx(Button, { variant: "ghost", size: "icon-sm", "aria-label": copied ? 'Copied' : 'Copy the install command', onPress: copy, children: copied ? _jsx(Check, { size: 16 }) : _jsx(Copy, { size: 16 }) })] }));
+}
+function Card({ icon, title, body }) {
+    return (_jsxs(YStack, { gap: "$2", p: "$5", rounded: "$4", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", flex: 1, minW: 240, children: [_jsxs(XStack, { items: "center", gap: "$2.5", children: [icon, _jsx(SizableText, { size: "$4", fontWeight: "600", color: "$ink", children: title })] }), _jsx(SizableText, { size: "$3", color: "$soft", children: body })] }));
+}
+export function Pitch({ onStart }) {
+    return (_jsxs(YStack, { items: "center", px: "$4", pb: "$12", gap: "$12", children: [_jsxs(YStack, { id: "features", width: "100%", maxW: 1080, items: "center", gap: "$5", pt: "$6", children: [_jsx(SizableText, { size: "$2", color: "$soft", fontFamily: "$mono", children: "Powered by Zen 6 \u00B7 routed by Enso" }), _jsx(SizableText, { role: "heading", "aria-level": 2, size: "$9", color: "$ink", style: { textAlign: 'center' }, children: "Hanzo Dev" }), _jsx(SizableText, { size: "$4", color: "$soft", maxW: 620, style: { textAlign: 'center' }, children: "The agent. It runs in your terminal, on any codebase, in any language. This page is that same agent in the browser." }), _jsx(Line, { text: INSTALL }), _jsx(SizableText, { size: "$2", color: "$soft", fontFamily: "$mono", children: "dev opens it. dev \"fix the failing test\" hands it a task." }), _jsx("a", { href: DOCS, style: { color: 'inherit', textDecoration: 'none' }, children: _jsx(XStack, { items: "center", height: 34, px: "$3", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", hoverStyle: { bg: '$hover' }, children: _jsx(SizableText, { size: "$3", color: "$ink", children: "Read the docs" }) }) })] }), _jsxs(YStack, { width: "100%", maxW: 1080, gap: "$5", children: [_jsx(SizableText, { role: "heading", "aria-level": 2, size: "$7", color: "$ink", children: "Everything a run needs" }), _jsx(XStack, { flexWrap: "wrap", gap: "$3", children: FEATURES.map((f) => (_jsx(Card, { ...f }, f.title))) })] }), _jsxs(YStack, { width: "100%", maxW: 1080, items: "center", gap: "$4", py: "$8", rounded: "$6", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", children: [_jsx(SizableText, { role: "heading", "aria-level": 2, size: "$7", color: "$ink", style: { textAlign: 'center' }, children: "Say what you want built." }), _jsx(SizableText, { size: "$3", color: "$soft", style: { textAlign: 'center' }, px: "$4", children: "In the browser here, or in your terminal." }), _jsx(Button, { variant: "primary", size: "sm", onPress: onStart, children: "Start building" })] })] }));
+}

package/lib/plans.js

@@ -37,6 +37,7 @@ export function Plans() {
     const [working, setWorking] = useState(false);
     const [note, setNote] = useState('');
     const on = current(subs.value);
+    const who = host.org ?? 'This organization';
     const card = chosen(cards.value);
     const yearly = list.value.some((p) => p.yearly > 0);
     const free = (p) => p.monthly === 0 && !p.sales;
@@ -51,7 +52,7 @@ export function Plans() {
             subs.reload();
         }
         catch (e) {
-            setNote(e instanceof Error ? e.message : 'That did not work');
+            setNote(e.message);
         }
         finally {
             setWorking(false);
@@ -73,10 +74,10 @@ export function Plans() {
         if (!settled)
             return null;
         if (free(p)) {
-            if (!on)
-                return null;
-            if (on.ending)
-                return _jsx(Line, { children: `You move to ${p.name} when ${on.name} ends on ${day(on.ends)}.` });
+            // A free plan that is not the org's means a paid one is.
+            const paid = on;
+            if (paid.ending)
+                return _jsx(Line, { children: `You move to ${p.name} when ${paid.name} ends on ${day(paid.ends)}.` });
             return (_jsx(Button, { size: "sm", variant: "outline", onPress: () => setLeaving(true), children: `Switch to ${p.name}` }));
         }
         if (on && on.price > 0)
@@ -89,17 +90,17 @@ export function Plans() {
     return (_jsxs(YStack, { flex: 1, minH: 0, overflow: "scroll", children: [_jsxs(YStack, { width: "100%", maxW: 1100, mx: "auto", px: "$5", py: "$5", gap: "$5", children: [_jsxs(XStack, { render: "button", "aria-label": "Back to billing", items: "center", gap: "$1", self: "flex-start", onPress: () => host.go(path({ kind: 'settings', section: 'billing' })), children: [_jsx(ChevronLeft, { size: 16 }), _jsx(SizableText, { size: "$2", color: "$soft", children: "Billing" })] }), _jsxs(XStack, { items: "flex-end", gap: "$4", flexWrap: "wrap", children: [_jsxs(YStack, { flex: 1, minW: 240, gap: "$1", children: [_jsx(SizableText, { render: "h1", size: "$7", color: "$ink", children: "Plans that grow with you" }), _jsx(SizableText, { size: "$2", color: "$soft", children: !signed
                                             ? 'Sign in to see the plan you are on.'
                                             : on
-                                                ? `${host.org ?? 'This organization'} is on ${on.name}.`
-                                                : `${host.org ?? 'This organization'} is on the free plan.` })] }), yearly ? (_jsx(XStack, { role: "radiogroup", "aria-label": "Billing period", p: "$1", gap: "$1", rounded: "$10", borderWidth: 1, borderColor: "$borderColor", children: ['month', 'year'].map((k) => (_jsx(XStack, { render: "button", role: "radio", "aria-checked": term === k, "aria-label": k === 'month' ? 'Monthly' : 'Yearly', onPress: () => setTerm(k), px: "$3", py: "$1.5", rounded: "$10", bg: term === k ? '$hover' : 'transparent', children: _jsx(SizableText, { size: "$2", color: term === k ? '$ink' : '$soft', children: k === 'month' ? 'Monthly' : 'Yearly' }) }, k))) })) : null] }), list.error ? (_jsx(Line, { children: list.error.message })) : list.loading && !list.value.length ? (_jsx(Line, { children: "Reading plans\u2026" })) : list.value.length === 0 ? (_jsx(Line, { children: "This brand sells no plans." })) : (_jsx(XStack, { flexWrap: "wrap", gap: "$4", children: list.value.map((p) => {
+                                                ? `${who} is on ${on.name}.`
+                                                : `${who} is on the free plan.` })] }), yearly ? (_jsx(XStack, { role: "radiogroup", "aria-label": "Billing period", p: "$1", gap: "$1", rounded: "$10", borderWidth: 1, borderColor: "$borderColor", children: ['month', 'year'].map((k) => (_jsx(XStack, { render: "button", role: "radio", "aria-checked": term === k, "aria-label": k === 'month' ? 'Monthly' : 'Yearly', onPress: () => setTerm(k), px: "$3", py: "$1.5", rounded: "$10", bg: term === k ? '$hover' : 'transparent', children: _jsx(SizableText, { size: "$2", color: term === k ? '$ink' : '$soft', children: k === 'month' ? 'Monthly' : 'Yearly' }) }, k))) })) : null] }), list.error ? (_jsx(Line, { children: list.error.message })) : list.loading && !list.value.length ? (_jsx(Line, { children: "Reading plans\u2026" })) : list.value.length === 0 ? (_jsx(Line, { children: "This brand sells no plans." })) : (_jsx(XStack, { flexWrap: "wrap", gap: "$4", children: list.value.map((p) => {
                             const cost = price(p, term);
                             return (_jsxs(YStack, { "aria-label": `${p.name} plan`, flex: 1, minW: 240, maxW: 360, "$max-sm": { maxW: '100%' }, gap: "$3", p: "$4", rounded: "$4", borderWidth: 1, borderColor: mine(p) || p.popular ? '$ink' : '$borderColor', bg: "$panel", children: [_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { flex: 1, size: "$5", color: "$ink", children: p.name }), mine(p) ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "Current" })) : p.popular ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "Popular" })) : null] }), p.description ? (_jsx(SizableText, { size: "$2", color: "$soft", children: p.description })) : null, _jsxs(YStack, { gap: "$0.5", children: [_jsx(SizableText, { size: "$7", color: "$ink", children: p.sales ? 'Custom' : cost.month === 0 ? 'Free' : money(cost.month, p.currency) }), _jsx(SizableText, { size: "$1", color: "$soft", children: p.sales
                                                     ? 'Talk to us'
                                                     : cost.month === 0
                                                         ? 'Forever'
                                                         : `${p.perSeat ? 'per seat, ' : ''}a month${term === 'year' && p.yearly ? `, ${money(cost.now, p.currency)} billed yearly` : ''}` })] }), _jsx(XStack, { children: move(p) }), p.features.length ? (_jsx(YStack, { gap: "$2", borderTopWidth: 1, borderColor: "$borderColor", pt: "$3", children: p.features.map((f) => (_jsxs(XStack, { gap: "$2", items: "flex-start", children: [_jsx(YStack, { pt: 2, children: _jsx(Check, { size: 14 }) }), _jsx(SizableText, { flex: 1, size: "$2", color: "$soft", children: f })] }, f))) })) : null] }, p.id));
-                        }) })), note ? (_jsx(SizableText, { size: "$2", color: "$soft", role: "status", children: note })) : null] }), _jsx(Dialog, { open: Boolean(buying), onOpenChange: (o) => (o ? undefined : setBuying(null)), children: _jsxs(DialogContent, { maxW: 420, showCloseButton: false, children: [_jsx(DialogTitle, { children: buying ? `Upgrade to ${buying.name}` : 'Upgrade' }), buying && card ? (_jsxs(YStack, { gap: "$3", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: `${label(card)} is charged ${money(price(buying, term).now, buying.currency)} now, and again every ${term} until you cancel.` }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setBuying(null), children: "Not now" }), _jsx(Button, { size: "sm", disabled: working, onPress: () => void act(async () => {
+                        }) })), note ? (_jsx(SizableText, { size: "$2", color: "$soft", role: "status", children: note })) : null] }), _jsx(Dialog, { open: Boolean(buying), onOpenChange: (o) => !o && setBuying(null), children: _jsxs(DialogContent, { maxW: 420, showCloseButton: false, children: [_jsx(DialogTitle, { children: buying ? `Upgrade to ${buying.name}` : 'Upgrade' }), buying && card ? (_jsxs(YStack, { gap: "$3", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: `${label(card)} is charged ${money(price(buying, term).now, buying.currency)} now, and again every ${term} until you cancel.` }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setBuying(null), children: "Not now" }), _jsx(Button, { size: "sm", disabled: working, onPress: () => void act(async () => {
                                                 await subscribe(t, { plan: buying.id, interval: yearly && buying.yearly ? term : 'month', method: card.id });
-                                                return `${host.org ?? 'This organization'} is on ${buying.name}`;
+                                                return `${who} is on ${buying.name}`;
                                             }), children: "Upgrade" })] })] })) : null] }) }), _jsx(Dialog, { open: leaving, onOpenChange: setLeaving, children: _jsxs(DialogContent, { maxW: 420, showCloseButton: false, children: [_jsx(DialogTitle, { children: "Switch to the free plan?" }), on ? (_jsxs(YStack, { gap: "$3", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: `${on.name} stays on until ${day(on.ends) || 'the end of this period'}, and nothing is charged after that.` }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setLeaving(false), children: `Keep ${on.name}` }), _jsx(Button, { size: "sm", variant: "destructive", disabled: working, onPress: () => void act(async () => {
                                                 await cancel(t, on.id);
                                                 return `${on.name} ends on ${day(on.ends)}`;