@hanzo/build 0.2.34 → 0.2.36

package/lib/api/github.d.ts

@@ -4,7 +4,8 @@
  *   GET  /v1/provider/github/repos?q=&owner=&limit=&after=           most recently pushed first
  *   GET  /v1/provider/github/repos/{owner}/{repo}/branches?q=&limit=&after=   default first
  *   GET  /v1/provider/github/user              the person's own connection
- *   POST /v1/provider/github/user/connect      → {authorizeUrl}
+ *   POST /v1/provider/github/user/connect      {return} → {authorizeUrl}
+ *   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
  *
@@ -14,8 +15,9 @@
  *
  * `connected` false with repositories is an org admin seeing the org's
  * installations; false with none is the cue to connect. GitHub returns a
- * connecting person to the console's /connectors?complete=github&grant=<id>,
- * which completes it.
+ * connecting person to the page the connect named as its return (a Hanzo app
+ * page; the console's /connectors otherwise) with `?complete=github&grant=<id>`,
+ * and that page completes it (`complete`, and `landed` in ../back.ts).
  */
 import { type Target } from './call.ts';
 export interface Repo {
@@ -74,8 +76,14 @@ export interface BranchQuery {
 }
 export declare function branches(t: Target, owner: string, name: string, p?: BranchQuery, signal?: AbortSignal): Promise<Branches>;
 export declare function connection(t: Target): Promise<Connection>;
-/** Where to send the person to authorize the platform's GitHub App — github.com only. */
-export declare function connect(t: Target): Promise<string>;
+/**
+ * Where to send the person to authorize the platform's GitHub App — github.com
+ * only. `back` is the page GitHub's return lands on; the platform keeps it only
+ * when it is a Hanzo app page.
+ */
+export declare function connect(t: Target, back?: string): Promise<string>;
+/** Finish the connect GitHub's return handed this page as `grant`. */
+export declare function complete(t: Target, grant: string): Promise<Connection>;
 export declare function disconnect(t: Target): Promise<void>;
 /** A GitHub account the platform's App is installed on, as this org sees it. */
 export interface Installation {

package/lib/api/github.js

@@ -4,7 +4,8 @@
  *   GET  /v1/provider/github/repos?q=&owner=&limit=&after=           most recently pushed first
  *   GET  /v1/provider/github/repos/{owner}/{repo}/branches?q=&limit=&after=   default first
  *   GET  /v1/provider/github/user              the person's own connection
- *   POST /v1/provider/github/user/connect      → {authorizeUrl}
+ *   POST /v1/provider/github/user/connect      {return} → {authorizeUrl}
+ *   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
  *
@@ -14,8 +15,9 @@
  *
  * `connected` false with repositories is an org admin seeing the org's
  * installations; false with none is the cue to connect. GitHub returns a
- * connecting person to the console's /connectors?complete=github&grant=<id>,
- * which completes it.
+ * connecting person to the page the connect named as its return (a Hanzo app
+ * page; the console's /connectors otherwise) with `?complete=github&grant=<id>`,
+ * and that page completes it (`complete`, and `landed` in ../back.ts).
  */
 import { call, query, seg } from './call.js';
 const str = (v) => (typeof v === 'string' ? v : '');
@@ -57,18 +59,29 @@ export async function branches(t, owner, name, p = {}, signal) {
         total: num(raw.total),
     };
 }
+function own(raw) {
+    const c = obj(raw);
+    return { configured: c.configured === true, connected: c.connected === true, login: str(c.login) };
+}
 export async function connection(t) {
-    const raw = obj(await call(t, 'GET', '/v1/provider/github/user'));
-    return { configured: raw.configured === true, connected: raw.connected === true, login: str(raw.login) };
+    return own(await call(t, 'GET', '/v1/provider/github/user'));
 }
-/** Where to send the person to authorize the platform's GitHub App — github.com only. */
-export async function connect(t) {
-    const raw = obj(await call(t, 'POST', '/v1/provider/github/user/connect'));
+/**
+ * Where to send the person to authorize the platform's GitHub App — github.com
+ * only. `back` is the page GitHub's return lands on; the platform keeps it only
+ * when it is a Hanzo app page.
+ */
+export async function connect(t, back) {
+    const raw = obj(await call(t, 'POST', '/v1/provider/github/user/connect', back ? { return: back } : undefined));
     const url = str(raw.authorizeUrl);
     if (!/^https:\/\/github\.com\//.test(url))
         throw new Error('The platform did not name a GitHub address to connect at');
     return url;
 }
+/** Finish the connect GitHub's return handed this page as `grant`. */
+export async function complete(t, grant) {
+    return own(await call(t, 'POST', '/v1/provider/github/user/complete', { grant }));
+}
 export async function disconnect(t) {
     await call(t, 'POST', '/v1/provider/github/user/disconnect');
 }

package/lib/api/provider.d.ts

@@ -3,7 +3,7 @@
  * platform's GitHub App is installed on.
  *
  *   GET  /v1/provider/{id}              one connector and this org's connection to it
- *   POST /v1/provider/{id}/connect      {} → {authorizeUrl}: the provider's own consent page (org admin)
+ *   POST /v1/provider/{id}/connect      {return} → {authorizeUrl}: the provider's own consent page (org admin)
  *   POST /v1/provider/{id}/disconnect   forget the org's connection (org admin)
  *   GET  /v1/provider/slack/channels    the connected workspace's channels, a page at a time
  *
@@ -25,8 +25,8 @@ export interface Connector {
 }
 export declare function connector(raw: unknown, id?: string): Connector;
 export declare function read(t: Target, id: string): Promise<Connector>;
-/** The provider's consent page for this org. */
-export declare function authorize(t: Target, id: string): Promise<string>;
+/** The provider's consent page for this org; its return lands on `back` when that is a Hanzo app page. */
+export declare function authorize(t: Target, id: string, back?: string): Promise<string>;
 export declare function disconnect(t: Target, id: string): Promise<void>;
 export interface Channel {
     id: string;

package/lib/api/provider.js

@@ -3,7 +3,7 @@
  * platform's GitHub App is installed on.
  *
  *   GET  /v1/provider/{id}              one connector and this org's connection to it
- *   POST /v1/provider/{id}/connect      {} → {authorizeUrl}: the provider's own consent page (org admin)
+ *   POST /v1/provider/{id}/connect      {return} → {authorizeUrl}: the provider's own consent page (org admin)
  *   POST /v1/provider/{id}/disconnect   forget the org's connection (org admin)
  *   GET  /v1/provider/slack/channels    the connected workspace's channels, a page at a time
  *
@@ -35,9 +35,9 @@ const CONSENT = {
     slack: /^https:\/\/slack\.com\//,
     github: /^https:\/\/github\.com\//,
 };
-/** The provider's consent page for this org. */
-export async function authorize(t, id) {
-    const url = str(obj(await call(t, 'POST', `/v1/provider/${seg(id)}/connect`, {})).authorizeUrl);
+/** The provider's consent page for this org; its return lands on `back` when that is a Hanzo app page. */
+export async function authorize(t, id, back) {
+    const url = str(obj(await call(t, 'POST', `/v1/provider/${seg(id)}/connect`, back ? { return: back } : {})).authorizeUrl);
     const host = CONSENT[id];
     if (!host || !host.test(url))
         throw new Error(`The platform did not name a ${id} address to connect at`);

package/lib/back.d.ts

@@ -0,0 +1,29 @@
+import type { Target } from './api/call.ts';
+/** The query keys a return carries its answer in. */
+export declare const ANSWER: readonly ['complete', 'grant', 'connected', 'account', 'error', 'reason'];
+export type Landing = {
+    kind: 'grant';
+    provider: string;
+    grant: string;
+} | {
+    kind: 'connected';
+    provider: string;
+    account: string;
+} | {
+    kind: 'error';
+    provider: string;
+    reason: string;
+};
+/** The answer a return carried in `search`, or null when it carried none. */
+export declare function landed(search: string): Landing | null;
+/** `href` without the answer keys; `href` itself when it carries none. */
+export declare function clean(href: string): string;
+/** This page's address, as a connect's return. */
+export declare function here(): string;
+/** A provider id as people write it. */
+export declare const named: (id: string) => string;
+/**
+ * Finish what a return carried, once a person is signed in: `say` gets the
+ * sentence, and `after` runs once something was connected.
+ */
+export declare function useBack(t: Target, signed: boolean, say: (note: string) => void, after: () => void): void;

package/lib/back.js

@@ -0,0 +1,82 @@
+/**
+ * Coming back from a provider's consent page.
+ *
+ * A connect names the page it starts on as its return (`here`). The platform
+ * keeps that address when it is a Hanzo app page, and its callback lands the
+ * person back on it with the answer in the query:
+ *
+ *   ?complete=github&grant=<id>         a GitHub connect to finish (POST /v1/provider/github/user/complete)
+ *   ?connected=<provider>&account=<n>   an organization's connector, connected
+ *   ?error=<provider>&reason=<why>      either, refused
+ *
+ * `useBack` reads that answer once, takes it off the address so a reload does
+ * not replay it, finishes a GitHub grant, and says what happened.
+ */
+import { useEffect } from 'react';
+import { complete } from './api/github.js';
+/** The query keys a return carries its answer in. */
+export const ANSWER = ['complete', 'grant', 'connected', 'account', 'error', 'reason'];
+/** The answer a return carried in `search`, or null when it carried none. */
+export function landed(search) {
+    const q = new URLSearchParams(search);
+    const error = q.get('error');
+    if (error)
+        return { kind: 'error', provider: error, reason: q.get('reason') ?? '' };
+    const grant = q.get('grant');
+    const done = q.get('complete');
+    if (done && grant)
+        return { kind: 'grant', provider: done, grant };
+    const connected = q.get('connected');
+    if (connected)
+        return { kind: 'connected', provider: connected, account: q.get('account') ?? '' };
+    return null;
+}
+/** `href` without the answer keys; `href` itself when it carries none. */
+export function clean(href) {
+    const url = new URL(href);
+    if (!ANSWER.some((k) => url.searchParams.has(k)))
+        return href;
+    for (const k of ANSWER)
+        url.searchParams.delete(k);
+    return url.href;
+}
+/** This page's address, as a connect's return. */
+export function here() {
+    return clean(window.location.href);
+}
+const NAMES = { github: 'GitHub', slack: 'Slack' };
+/** A provider id as people write it. */
+export const named = (id) => NAMES[id] ?? (id ? id[0].toUpperCase() + id.slice(1) : 'The connection');
+/**
+ * Finish what a return carried, once a person is signed in: `say` gets the
+ * sentence, and `after` runs once something was connected.
+ */
+export function useBack(t, signed, say, after) {
+    useEffect(() => {
+        if (!signed)
+            return;
+        const l = landed(window.location.search);
+        if (!l)
+            return;
+        // Off the address first: a grant completes once, and a reload must not try again.
+        const next = clean(window.location.href);
+        window.history.replaceState(window.history.state, '', next);
+        if (l.kind === 'error') {
+            say(`${named(l.provider)}: ${l.reason || 'not connected'}`);
+            return;
+        }
+        if (l.kind === 'connected') {
+            say(`${named(l.provider)} is connected${l.account ? ` as ${l.account}` : ''}`);
+            after();
+            return;
+        }
+        if (l.provider !== 'github')
+            return;
+        complete(t, l.grant).then((c) => {
+            say(c.connected ? `Connected as @${c.login}` : 'GitHub did not connect; connect again');
+            after();
+        }, (e) => say(e.message));
+        // Once per landing: the address is clean after the first run.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [signed]);
+}

package/lib/project.js

@@ -26,7 +26,9 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
  * template taken there reads `building` until its copy is `live` or failed, and
  * is read again until then; a run that publishes what it pushed says so on its
  * final status, which reads the project again and loads the preview again. Its
- * pull request is merged from beside its link.
+ * pull request is merged from beside its link. A build that failed, or that has
+ * run past STALL, says so in the preview with the platform's reason and offers
+ * Publish again, which builds the project's repository at its branch.
  *
  * Derived from the Hanzo App v2 editor (github.com/hanzoai/build-v2), itself
  * derived from OSW Studio and DeepSite (MIT). See NOTICE.
@@ -41,6 +43,7 @@ import { useEffect, useMemo, useRef, useState } from 'react';
 import { read as pushed } from './api/changes.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 { list, message, stop } from './api/sessions.js';
 import { decode, outcome, pull, said, who } from './api/turn.js';
@@ -57,6 +60,8 @@ import { Attach, compose, Dictate, Files } from './tools.js';
 const LIVE = new Set(['running', 'paused']);
 /** How often a project being published is read again, ms. */
 const AGAIN = 5000;
+/** How long a build may run before the builder offers to publish again, s. A template's build takes a few minutes. */
+const STALL = 10 * 60;
 /** The chat's width beside the work, px: its default, and the two it is kept between. */
 const CHAT_WIDTH = 360;
 const CHAT_FLOOR = 300;
@@ -89,14 +94,39 @@ export function Project({ slug }) {
     const building = project?.status === 'building';
     const failed = project?.status === 'error';
     const { reload: again } = all;
+    // The clock a build is measured against, moved each time the project is read again.
+    const [now, setNow] = useState(() => Date.now());
     useEffect(() => {
         if (!building)
             return;
-        const every = setInterval(again, AGAIN);
+        const every = setInterval(() => {
+            again();
+            setNow(Date.now());
+        }, AGAIN);
         return () => clearInterval(every);
     }, [building, again]);
-    // Why the build failed is its latest deployment's to say.
-    const failure = useRead(failed ? () => deployments(t, slug) : null, [], [t, slug, failed, project?.updated]);
+    // When the build began, and why it failed, are its latest deployment's to say.
+    const failure = useRead(building || failed ? () => deployments(t, slug) : null, [], [t, slug, building, failed, project?.updated]);
+    const latest = failure.value[0];
+    const began = latest?.status === 'building' ? latest.created : 0;
+    const ran = began ? Math.max(0, Math.floor(now / 1000) - began) : 0;
+    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: '' });
+    const retry = async () => {
+        if (!project?.repo || redo.busy)
+            return;
+        setRedo({ busy: true, error: '' });
+        try {
+            await declare(t, { repo: project.repo, ref: project.branch || 'main', name: slug, project: slug, mode: 'branch' });
+            setNow(Date.now());
+            again();
+            setRedo({ busy: false, error: '' });
+        }
+        catch (e) {
+            setRedo({ busy: false, error: e.message });
+        }
+    };
     const listed = useRead(signed ? () => list(t, { kind: 'coding', project: slug, limit: 50 }) : null, [], [t, signed, slug]);
     // 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.
@@ -314,18 +344,36 @@ export function Project({ slug }) {
                         ? '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.`
-                            : building
-                                ? `${project?.name} is being published — it appears in the preview when its build finishes. Say what to change and it gets built.`
-                                : starter
-                                    ? `${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
+                            : stalled
+                                ? `${project?.name} has been publishing for ${Math.floor(ran / 60)} minutes without finishing. Publish it again from the preview, or say what to change and it gets built.`
+                                : failed
+                                    ? `${project?.name} could not be published. Publish it again from the preview, or say what to change and it gets built.`
+                                    : building
+                                        ? `${project?.name} is being published — it appears in the preview when its build finishes. Say what to change and it gets built.`
+                                        : starter
+                                            ? `${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
                             ? () => 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] }));
     // 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: building ? (project?.forked ? 'Publishing your copy…' : 'Publishing…') : failed ? 'Publishing failed' : 'Nothing deployed yet' }), _jsx(SizableText, { size: "$2", color: "$soft", text: "center", children: building ? 'Its page appears here when the build finishes.' : failed ? why : 'Publish this project and its page appears here.' })] }), toolbar: bridge ? (_jsx(XStack, { render: "button", "aria-pressed": editing, "aria-label": editing ? 'Stop picking elements' : 'Pick an element to edit', onPress: () => {
+    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
+                                ? 'Publishing is taking too long'
+                                : building
+                                    ? project?.forked
+                                        ? 'Publishing your copy…'
+                                        : 'Publishing…'
+                                    : failed
+                                        ? 'Publishing failed'
+                                        : 'Nothing deployed yet' }), _jsx(SizableText, { size: "$2", color: "$soft", text: "center", children: stalled
+                                ? `Its build started ${Math.floor(ran / 60)} minutes ago and has not finished.`
+                                : building
+                                    ? '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: () => {
                         const next = !editing;
                         setEditing(next);
                         frame.current?.post({ type: 'preview:editable', active: next });

package/lib/settings/integrations.js

@@ -3,9 +3,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Integrations: your own GitHub connection, the GitHub accounts the
  * organization has installed the platform's App on, and its Slack workspace.
  *
- * Connecting leaves this page once, for GitHub's or Slack's own consent screen.
- * Anyone connects their own GitHub; installing the App and connecting Slack are
- * an org admin's, which is the platform's rule.
+ * Connecting leaves this page once, for GitHub's or Slack's own consent screen,
+ * and the platform's callback brings the person back here with the answer
+ * (../back.ts), which this page finishes and reports. Anyone connects their own
+ * GitHub; installing the App and connecting Slack are an org admin's, which is
+ * the platform's rule.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { Github, Hash, Lock, Slack } from '@hanzogui/lucide-icons-2';
@@ -13,6 +15,7 @@ import { Button } from '@hanzo/ui';
 import { useState } from 'react';
 import { connect, connection, disconnect as unlinkGithub, installations } from '../api/github.js';
 import { authorize, channels, disconnect, read } from '../api/provider.js';
+import { here, useBack } from '../back.js';
 import { useRead } from '../data.js';
 import { useHost, useTarget } from '../host.js';
 import { Card, day, Group, Heading, Note, Row, Soft } from './ui.js';
@@ -27,6 +30,11 @@ export function Integrations() {
     const rooms = useRead(signed && joined ? () => channels(t) : null, { channels: [], next: '' }, [t, signed, joined]);
     const [working, setWorking] = useState(false);
     const [note, setNote] = useState('');
+    useBack(t, signed, setNote, () => {
+        mine.reload();
+        installed.reload();
+        slack.reload();
+    });
     if (!signed) {
         return (_jsxs(YStack, { gap: "$5", children: [_jsx(Heading, { title: "Integrations" }), _jsx(Soft, { children: "Sign in to see this organization\u2019s integrations." })] }));
     }
@@ -67,7 +75,7 @@ export function Integrations() {
                                             ? 'This deployment cannot connect GitHub yet.'
                                             : me.connected
                                                 ? `Connected as @${me.login}`
-                                                : 'Not connected', trailing: me?.configured ? (me.connected ? (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void act(() => unlinkGithub(t), 'Your GitHub is disconnected', mine.reload), children: "Disconnect" })) : (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => connect(t)), children: "Connect" }))) : null }), installed.error ? (_jsx(Row, { title: "App installations", detail: installed.error.message })) : (installed.value.map((i) => (_jsx(Row, { leading: _jsx(Github, { size: 16 }), title: i.login, detail: [i.type, i.grant === 'all' ? 'every repository' : i.grant === 'selected' ? 'selected repositories' : ''].filter(Boolean).join(' · '), trailing: _jsx(SizableText, { size: "$1", color: i.connected ? '$ink' : '$soft', children: i.connected ? 'Installed' : 'Removed on GitHub' }) }, i.login)))), !installed.error && !installed.loading && installed.value.length === 0 ? (_jsx(Row, { title: "No GitHub accounts installed", detail: "Install the App on a GitHub account to bring its repositories here." })) : null] }), host.admin ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => authorize(t, 'github')), children: "Install on a GitHub account" }) })) : (_jsx(SizableText, { size: "$1", color: "$soft", children: "An org admin installs the App on a GitHub account." }))] }), _jsxs(Group, { title: "Slack", detail: "Talk to Hanzo from your workspace\u2019s channels.", children: [_jsxs(Card, { children: [_jsx(Row, { first: true, leading: _jsx(Slack, { size: 16 }), title: s?.connected && s.account ? s.account : 'Slack', detail: slack.error
+                                                : 'Not connected', trailing: me?.configured ? (me.connected ? (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void act(() => unlinkGithub(t), 'Your GitHub is disconnected', mine.reload), children: "Disconnect" })) : (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => connect(t, here())), children: "Connect" }))) : null }), installed.error ? (_jsx(Row, { title: "App installations", detail: installed.error.message })) : (installed.value.map((i) => (_jsx(Row, { leading: _jsx(Github, { size: 16 }), title: i.login, detail: [i.type, i.grant === 'all' ? 'every repository' : i.grant === 'selected' ? 'selected repositories' : ''].filter(Boolean).join(' · '), trailing: _jsx(SizableText, { size: "$1", color: i.connected ? '$ink' : '$soft', children: i.connected ? 'Installed' : 'Removed on GitHub' }) }, i.login)))), !installed.error && !installed.loading && installed.value.length === 0 ? (_jsx(Row, { title: "No GitHub accounts installed", detail: "Install the App on a GitHub account to bring its repositories here." })) : null] }), host.admin ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => authorize(t, 'github', here())), children: "Install on a GitHub account" }) })) : (_jsx(SizableText, { size: "$1", color: "$soft", children: "An org admin installs the App on a GitHub account." }))] }), _jsxs(Group, { title: "Slack", detail: "Talk to Hanzo from your workspace\u2019s channels.", children: [_jsxs(Card, { children: [_jsx(Row, { first: true, leading: _jsx(Slack, { size: 16 }), title: s?.connected && s.account ? s.account : 'Slack', detail: slack.error
                                     ? slack.error.message
                                     : !s
                                         ? 'Reading…'
@@ -75,7 +83,7 @@ export function Integrations() {
                                             ? `Connected${s.since ? ` since ${day(s.since)}` : ''}`
                                             : s.available
                                                 ? 'Not connected'
-                                                : s.note || 'This deployment cannot connect Slack yet.', trailing: host.admin && s && (s.connected || s.available) ? (s.connected ? (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void act(() => disconnect(t, 'slack'), 'Slack is disconnected', slack.reload), children: "Disconnect" })) : (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => authorize(t, 'slack')), children: "Connect" }))) : null }), joined && rooms.error ? _jsx(Row, { title: "Channels", detail: rooms.error.message }) : null, joined
+                                                : s.note || 'This deployment cannot connect Slack yet.', trailing: host.admin && s && (s.connected || s.available) ? (s.connected ? (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void act(() => disconnect(t, 'slack'), 'Slack is disconnected', slack.reload), children: "Disconnect" })) : (_jsx(Button, { size: "sm", variant: "outline", disabled: working, onPress: () => void away(() => authorize(t, 'slack', here())), children: "Connect" }))) : null }), joined && rooms.error ? _jsx(Row, { title: "Channels", detail: rooms.error.message }) : null, joined
                                 ? rooms.value.channels.map((c) => (_jsx(Row, { leading: c.private ? _jsx(Lock, { size: 14 }) : _jsx(Hash, { size: 14 }), title: c.name || c.id, trailing: _jsx(SizableText, { size: "$1", color: c.member ? '$ink' : '$soft', children: c.member ? 'Joined' : 'Not joined' }) }, c.id)))
                                 : null] }), !host.admin ? (_jsx(SizableText, { size: "$1", color: "$soft", children: "An org admin connects the Slack workspace." })) : null] }), _jsx(Note, { children: note })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/build",
-  "version": "0.2.34",
+  "version": "0.2.36",
   "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.",