@hanzo/build 0.2.80 → 0.2.81

package/lib/automations.js

@@ -10,9 +10,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * own: a task is its person's, in the org the builder is in. A save sends only
  * what changed; the switch sends `enabled` alone, so turning one on or off never
  * changes who it runs as.
+ *
+ * Its words are the reader's language (@hanzo/i18n `t`); a task's name, its
+ * instructions, a run's summary and post and the platform's refusals are drawn
+ * as given.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
 import { ChevronLeft } from '@hanzogui/lucide-icons-2';
+import { phrase } from '@hanzo/i18n';
+import { useI18n } from '@hanzo/i18n/react';
 import { Button, Input, Switch, Textarea } from '@hanzo/ui';
 import { StatusDot } from '@hanzo/ui/chat';
 import { ModelPicker } from '@hanzo/ui/models';
@@ -24,7 +30,7 @@ import { current, subscriptions } from './api/billing.js';
 import { SOCIAL } from './api/provider.js';
 import { Out } from './out.js';
 import { useSocial } from './settings/integrations.js';
-import { Refusal } from './api/call.js';
+import { Refusal, told } from './api/call.js';
 import { ENSO, limits as readLimits, models } from './api/models.js';
 import { Choice, Confirm, Field, Line, Sheet } from './customize/ui.js';
 import { useRead } from './data.js';
@@ -40,38 +46,39 @@ export const zone = () => {
         return 'UTC';
     }
 };
+/** The lists' words are English, marked (`phrase`), and drawn through `t`. */
 export const KINDS = [
-    { id: 'manual', label: 'When I run it' },
-    { id: 'once', label: 'Once' },
-    { id: 'hourly', label: 'Every hour' },
-    { id: 'daily', label: 'Every day' },
-    { id: 'weekdays', label: 'Weekdays' },
-    { id: 'weekly', label: 'Every week' },
-    { id: 'cron', label: 'Cron' },
+    { id: 'manual', label: phrase('When I run it') },
+    { id: 'once', label: phrase('Once') },
+    { id: 'hourly', label: phrase('Every hour') },
+    { id: 'daily', label: phrase('Every day') },
+    { id: 'weekdays', label: phrase('Weekdays') },
+    { id: 'weekly', label: phrase('Every week') },
+    { id: 'cron', label: phrase('Cron') },
 ];
 const DAYS = [
-    { id: 'mon', label: 'Monday' },
-    { id: 'tue', label: 'Tuesday' },
-    { id: 'wed', label: 'Wednesday' },
-    { id: 'thu', label: 'Thursday' },
-    { id: 'fri', label: 'Friday' },
-    { id: 'sat', label: 'Saturday' },
-    { id: 'sun', label: 'Sunday' },
+    { id: 'mon', label: phrase('Monday') },
+    { id: 'tue', label: phrase('Tuesday') },
+    { id: 'wed', label: phrase('Wednesday') },
+    { id: 'thu', label: phrase('Thursday') },
+    { id: 'fri', label: phrase('Friday') },
+    { id: 'sat', label: phrase('Saturday') },
+    { id: 'sun', label: phrase('Sunday') },
 ];
 const PERMISSIONS = [
-    { id: 'ask', label: 'Ask first' },
-    { id: 'auto', label: 'Act on its own' },
+    { id: 'ask', label: phrase('Ask first') },
+    { id: 'auto', label: phrase('Act on its own') },
 ];
-/** A run's status as the rail's dot draws it. */
+/** A run's status as the rail's dot draws it, and in words (marked, drawn through `t`). */
 export const DOT = { succeeded: 'done', failed: 'error', running: 'running', queued: 'running', review: 'paused', skipped: 'stopped', refused: 'stopped' };
 export const WORD = {
-    succeeded: 'Succeeded',
-    failed: 'Failed',
-    running: 'Running',
-    queued: 'Queued',
-    review: 'Waiting for your review',
-    skipped: 'Skipped',
-    refused: 'Refused',
+    succeeded: phrase('Succeeded'),
+    failed: phrase('Failed'),
+    running: phrase('Running'),
+    queued: phrase('Queued'),
+    review: phrase('Waiting for your review'),
+    skipped: phrase('Skipped'),
+    refused: phrase('Refused'),
 };
 const NAME = Object.fromEntries(SOCIAL.map((p) => [p.id, p.name]));
 export const live = (s) => s === 'running' || s === 'queued';
@@ -101,14 +108,14 @@ export function shaped(kind, was) {
             return { kind, cron: was.cron || '0 9 * * 1-5', tz };
     }
 }
-/** What is wrong with a schedule before it is sent, or ''. */
+/** What is wrong with a schedule before it is sent, or '': English, marked (`phrase`), so a screen says it through `t`. */
 export function unready(s) {
     if ((s.kind === 'daily' || s.kind === 'weekdays' || s.kind === 'weekly') && !/^([01]?\d|2[0-3]):[0-5]\d$/.test(s.at ?? ''))
-        return 'Time of day is HH:MM on a 24-hour clock.';
+        return phrase('Time of day is HH:MM on a 24-hour clock.');
     if (s.kind === 'once' && s.at && !/^\d{4}-\d{2}-\d{2}T([01]\d|2[0-3]):[0-5]\d$/.test(s.at))
-        return 'Once is a date and a time: YYYY-MM-DDTHH:MM.';
+        return phrase('Once is a date and a time: YYYY-MM-DDTHH:MM.');
     if (s.kind === 'cron' && (s.cron ?? '').trim().split(/\s+/).length !== 5)
-        return 'Cron is five fields: minute, hour, day of month, month, day of week.';
+        return phrase('Cron is five fields: minute, hour, day of month, month, day of week.');
     return '';
 }
 /** A schedule as the platform reads it: an hourly minute in two digits. */
@@ -145,13 +152,16 @@ function rebase(cur, was, next) {
     }
     return out;
 }
-/** A run the platform refused for want of a plan: a free org with no credit for the run fee. */
+/** A run the platform refused for want of a plan: a free org with no credit for the run fee. `PLAN` says so, marked, drawn through `t`. */
 export const unplanned = (e) => e instanceof Refusal && e.status === 402;
-export const PLAN = 'Automations run on a paid plan; on Free each run needs $1 of credit, and this organization has none. Upgrade to run it.';
+export const PLAN = phrase('Automations run on a paid plan; on Free each run needs $1 of credit, and this organization has none. Upgrade to run it.');
 const BLANK = () => ({ name: '', instructions: '', model: null, schedule: { kind: 'manual' }, permissions: 'ask', notify: false, postTo: [], enabled: true, source: 'dev' });
 /** When a task runs, chosen: how often, the day and time, and the zone it is read in. */
 export function When({ s, onChange, disabled }) {
+    const { t } = useI18n();
     const setWhen = (p) => onChange({ ...s, ...p });
+    const kinds = useMemo(() => KINDS.map((k) => ({ ...k, label: t(k.label) })), [t]);
+    const days = useMemo(() => DAYS.map((x) => ({ ...x, label: t(x.label) })), [t]);
     const zones = useMemo(() => {
         try {
             return ['UTC', ...Intl.supportedValuesOf('timeZone').filter((z) => z !== 'UTC')].map((z) => ({ id: z, label: z }));
@@ -160,22 +170,23 @@ export function When({ s, onChange, disabled }) {
             return [{ id: 'UTC', label: 'UTC' }];
         }
     }, []);
-    const kind = KINDS.find((k) => k.id === s.kind) ?? KINDS[0];
-    return (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", rowGap: "$2", items: "center", opacity: disabled ? 0.6 : 1, pointerEvents: disabled ? 'none' : 'auto', children: [_jsx(ChipSelect, { name: "When it runs", label: kind.label, chosen: kind, items: KINDS, onChange: (k) => onChange(shaped(k.id, s)), placement: "bottom-start", width: 200 }), s.kind === 'weekly' ? _jsx(ChipSelect, { name: "Day", label: DAYS.find((x) => x.id === s.day)?.label ?? 'Monday', chosen: DAYS.find((x) => x.id === s.day), items: DAYS, onChange: (x) => setWhen({ day: x.id }), placement: "bottom-start", width: 180 }) : null, s.kind === 'daily' || s.kind === 'weekdays' || s.kind === 'weekly' ? (_jsx(YStack, { width: 110, children: _jsx(Input, { value: s.at ?? '', onChangeText: (v) => setWhen({ at: v.trim() }), placeholder: "09:00", "aria-label": "Time of day", inputMode: "text" }) })) : null, s.kind === 'once' ? (_jsx(YStack, { width: 190, children: _jsx(Input, { value: s.at ?? '', onChangeText: (v) => setWhen({ at: v.trim() }), placeholder: "2026-10-20T09:00", "aria-label": "Date and time", autoCapitalize: "none" }) })) : null, s.kind === 'hourly' ? (_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: "at minute" }), _jsx(YStack, { width: 70, children: _jsx(Input, { value: (s.at ?? '00:00').slice(3), onChangeText: (v) => setWhen({ at: `00:${v.replace(/\D/g, '').slice(0, 2)}` }), placeholder: "00", "aria-label": "Minute", inputMode: "numeric" }) })] })) : null, s.kind === 'cron' ? (_jsx(YStack, { width: 200, children: _jsx(Input, { value: s.cron ?? '', onChangeText: (v) => setWhen({ cron: v }), placeholder: "0 9 * * 1-5", "aria-label": "Cron", autoCapitalize: "none" }) })) : null, s.kind !== 'manual' ? _jsx(ChipSelect, { name: "Time zone", label: s.tz || 'UTC', chosen: { id: s.tz || 'UTC', label: s.tz || 'UTC' }, items: zones, onChange: (z) => setWhen({ tz: z.id }), placeholder: "Search zones\u2026", placement: "bottom-start", width: 260 }) : null] }));
+    const kind = kinds.find((k) => k.id === s.kind) ?? kinds[0];
+    return (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", rowGap: "$2", items: "center", opacity: disabled ? 0.6 : 1, pointerEvents: disabled ? 'none' : 'auto', children: [_jsx(ChipSelect, { name: t('When it runs'), label: kind.label, chosen: kind, items: kinds, onChange: (k) => onChange(shaped(k.id, s)), placement: "bottom-start", width: 200 }), s.kind === 'weekly' ? _jsx(ChipSelect, { name: t('Day'), label: days.find((x) => x.id === s.day)?.label ?? t('Monday'), chosen: days.find((x) => x.id === s.day), items: days, onChange: (x) => setWhen({ day: x.id }), placement: "bottom-start", width: 180 }) : null, s.kind === 'daily' || s.kind === 'weekdays' || s.kind === 'weekly' ? (_jsx(YStack, { width: 110, children: _jsx(Input, { value: s.at ?? '', onChangeText: (v) => setWhen({ at: v.trim() }), placeholder: "09:00", "aria-label": t('Time of day'), inputMode: "text" }) })) : null, s.kind === 'once' ? (_jsx(YStack, { width: 190, children: _jsx(Input, { value: s.at ?? '', onChangeText: (v) => setWhen({ at: v.trim() }), placeholder: "2026-10-20T09:00", "aria-label": t('Date and time'), autoCapitalize: "none" }) })) : null, s.kind === 'hourly' ? (_jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: t('at minute') }), _jsx(YStack, { width: 70, children: _jsx(Input, { value: (s.at ?? '00:00').slice(3), onChangeText: (v) => setWhen({ at: `00:${v.replace(/\D/g, '').slice(0, 2)}` }), placeholder: "00", "aria-label": t('Minute'), inputMode: "numeric" }) })] })) : null, s.kind === 'cron' ? (_jsx(YStack, { width: 200, children: _jsx(Input, { value: s.cron ?? '', onChangeText: (v) => setWhen({ cron: v }), placeholder: "0 9 * * 1-5", "aria-label": t('Cron'), autoCapitalize: "none" }) })) : null, s.kind !== 'manual' ? _jsx(ChipSelect, { name: t('Time zone'), label: s.tz || 'UTC', chosen: { id: s.tz || 'UTC', label: s.tz || 'UTC' }, items: zones, onChange: (z) => setWhen({ tz: z.id }), placeholder: t('Search zones…'), placement: "bottom-start", width: 260 }) : null] }));
 }
 /** One automation: what it does and when, its switch, Run now, and its runs. `new` writes one. */
 export function Editor({ id }) {
     const host = useHost();
-    const t = useTarget();
+    const { t } = useI18n();
+    const target = useTarget();
     const signed = Boolean(host.person);
     const fresh = id === 'new';
     // `tick` reads the automation again; `beat` reads its runs again.
     const [tick, setTick] = useState(0);
     const [beat, setBeat] = useState(0);
-    const saved = useRead(signed && !fresh ? () => automation(t, id) : null, null, [t, signed, id, tick]);
-    const history = useRead(signed && !fresh ? () => runs(t, id) : null, [], [t, signed, id, beat]);
-    const catalog = useRead(signed ? () => models(t) : null, [], [t, signed]);
-    const { limits } = useLimits(signed ? (signal) => readLimits(t, signal) : null, t);
+    const saved = useRead(signed && !fresh ? () => automation(target, id) : null, null, [target, signed, id, tick]);
+    const history = useRead(signed && !fresh ? () => runs(target, id) : null, [], [target, signed, id, beat]);
+    const catalog = useRead(signed ? () => models(target) : null, [], [target, signed]);
+    const { limits } = useLimits(signed ? (signal) => readLimits(target, signal) : null, target);
     // `base` is what the form started from; a save sends what changed since, and only that.
     const [base, setBase] = useState(BLANK);
     const [d, setD] = useState(BLANK);
@@ -187,12 +198,12 @@ export function Editor({ id }) {
     const [leaving, setLeaving] = useState('');
     const [upgrade, setUpgrade] = useState(false);
     const social = useSocial(signed, SOCIAL.filter((p) => p.posts).map((p) => p.id));
-    const subs = useRead(signed ? () => subscriptions(t) : null, [], [t, signed]);
+    const subs = useRead(signed ? () => subscriptions(target) : null, [], [target, signed]);
     // Free is what the platform says when it names no live subscription; a read that failed says nothing.
     const free = !subs.loading && !subs.error && !current(subs.value);
     const nameRef = useRef(null);
     const asksRef = useRef(null);
-    const offered = useRead(signed && fresh ? () => starters(t) : null, [], [t, signed, fresh]);
+    const offered = useRead(signed && fresh ? () => starters(target) : null, [], [target, signed, fresh]);
     const here = useRef(true);
     useEffect(() => {
         here.current = true;
@@ -235,7 +246,7 @@ export function Editor({ id }) {
         setUpgrade(false);
         setD((x) => ({ ...x, ...p }));
     };
-    const wrong = unready(d.schedule);
+    const wrong = t(unready(d.schedule));
     // A draft waits on its instructions: they have the focus when it opens.
     const drafty = Boolean(a?.draft);
     useEffect(() => {
@@ -252,7 +263,7 @@ export function Editor({ id }) {
         catch (e) {
             // Wanting a plan is said in these words only where a run was asked for.
             const run = what === 'run' && unplanned(e);
-            setNote(run ? PLAN : e.message);
+            setNote(run ? t(PLAN) : told(e, t));
             setUpgrade(run);
         }
         finally {
@@ -261,7 +272,7 @@ export function Editor({ id }) {
     };
     /** What a save still needs, said, with the focus on where to give it; true when nothing. */
     const complete = () => {
-        const ask = !d.name.trim() ? ['Name it first.', nameRef] : !d.instructions.trim() ? ['Add instructions first.', asksRef] : null;
+        const ask = !d.name.trim() ? [t('Name it first.'), nameRef] : !d.instructions.trim() ? [t('Add instructions first.'), asksRef] : null;
         if (ask) {
             setNote(ask[0]);
             ask[1].current?.focus();
@@ -275,7 +286,7 @@ export function Editor({ id }) {
     };
     const keep = () => act('save', async () => {
         if (fresh) {
-            const made = await create(t, tidy(d));
+            const made = await create(target, tidy(d));
             // Only while still here: a person who left during the create stays where they went.
             if (here.current)
                 host.go(path({ kind: 'automation', id: made.id }), { replace: true });
@@ -285,32 +296,32 @@ export function Editor({ id }) {
         const send = changes(base, tidy(snap));
         if (switchesAlone)
             delete send.enabled;
-        const now = Object.keys(send).length ? await save(t, id, send) : a;
+        const now = Object.keys(send).length ? await save(target, id, send) : a;
         // What was typed while the save was in flight stands.
         setBase(drafted(now));
         setD((cur) => rebase(cur, snap, drafted(now)));
         setTick((n) => n + 1);
-        setNote('Saved.');
+        setNote(t('Saved.'));
     });
     const flip = (on) => {
         if (!switchesAlone)
             return set({ enabled: on });
         void act('switch', async () => {
-            await save(t, id, { enabled: on });
+            await save(target, id, { enabled: on });
             setTick((n) => n + 1);
         });
     };
     const go = () => act('run', async () => {
-        const run = await start(t, id);
+        const run = await start(target, id);
         setBeat((n) => n + 1);
         if (run.status === 'skipped')
-            setNote('Not started: the previous run is still going.');
+            setNote(t('Not started: the previous run is still going.'));
     });
     const leave = (how) => host.go(path({ kind: 'screen', screen: 'automations' }), how);
     // A held post is answered once; its buttons go when it is.
     const [answered, setAnswered] = useState(() => new Set());
     const answer = (r, post) => act('review', async () => {
-        await review(t, id, r.id, post);
+        await review(target, id, r.id, post);
         setAnswered((x) => new Set(x).add(r.id));
         setBeat((n) => n + 1);
         setTick((n) => n + 1);
@@ -324,51 +335,61 @@ export function Editor({ id }) {
         asksRef.current?.focus();
     };
     if (!signed)
-        return _jsx(Page, { title: "Automation", onBack: () => leave(), says: "Sign in to see this organization's automations." });
+        return _jsx(Page, { title: t('Automation'), onBack: () => leave(), says: t("Sign in to see this organization's automations.") });
     if (!fresh && saved.error && !a)
-        return _jsx(Page, { title: "Automation", onBack: () => leave(), says: saved.error.message });
+        return _jsx(Page, { title: t('Automation'), onBack: () => leave(), says: told(saved.error, t) });
     if (!ready)
-        return _jsx(Page, { title: "Automation", onBack: () => leave(), says: "Reading the automation\u2026" });
+        return _jsx(Page, { title: t('Automation'), onBack: () => leave(), says: t('Reading the automation…') });
     const s = d.schedule;
     // An automation that posts speaks for the organization: only an admin changes it.
     const locked = !host.admin && Boolean(a?.postTo.length);
     // A new automation or a draft has nothing to switch on until it says what to do.
     const can = switchesAlone || Boolean(d.instructions.trim());
     const on = switchesAlone ? Boolean(a?.enabled) : can && d.enabled;
-    const says = switchesAlone ? (on ? 'On' : 'Off') : !can ? 'Add instructions first' : on ? 'On when saved' : 'Off when saved';
-    const state = fresh ? 'Not created yet' : dirty ? 'Unsaved changes' : '';
+    const says = switchesAlone ? (on ? t('On') : t('Off')) : !can ? t('Add instructions first') : on ? t('On when saved') : t('Off when saved');
+    const state = fresh ? t('Not created yet') : dirty ? t('Unsaved changes') : '';
     const sayId = `${id}-switch`;
-    return (_jsxs(YStack, { flex: 1, minH: 0, children: [_jsxs(YStack, { shrink: 0, px: "$6", pt: "$4", pb: "$3", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsxs(XStack, { width: "100%", maxW: 760, mx: "auto", items: "center", gap: "$3", flexWrap: "wrap", rowGap: "$2", children: [_jsxs(Button, { size: "sm", variant: "ghost", onPress: back, "aria-label": "All scheduled tasks", children: [_jsx(ChevronLeft, { size: 14 }), "Scheduled tasks"] }), _jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: state }), _jsx(XStack, { flex: 1 }), _jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { id: sayId, size: "$2", color: "$soft", children: says }), _jsx(Switch, { checked: on, disabled: busy === 'switch' || !can, onCheckedChange: flip, "aria-label": switchesAlone ? `${a.name} on` : 'On when saved', "aria-describedby": sayId })] }), a && !a.draft ? (_jsx(Button, { size: "sm", variant: "outline", disabled: Boolean(busy) || dirty, onPress: () => void go(), children: busy === 'run' ? 'Starting…' : 'Run now' })) : null, a && dirty ? (_jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => {
+    return (_jsxs(YStack, { flex: 1, minH: 0, children: [_jsxs(YStack, { shrink: 0, px: "$6", pt: "$4", pb: "$3", borderBottomWidth: 1, borderColor: "$borderColor", children: [_jsxs(XStack, { width: "100%", maxW: 760, mx: "auto", items: "center", gap: "$3", flexWrap: "wrap", rowGap: "$2", children: [_jsxs(Button, { size: "sm", variant: "ghost", onPress: back, "aria-label": t('All scheduled tasks'), children: [_jsx(ChevronLeft, { size: 14, 'data-i18n-mirror': '' }), t('Scheduled tasks')] }), _jsx(SizableText, { size: "$1", color: "$soft", role: "status", children: state }), _jsx(XStack, { flex: 1 }), _jsxs(XStack, { items: "center", gap: "$2", children: [_jsx(SizableText, { id: sayId, size: "$2", color: "$soft", children: says }), _jsx(Switch, { checked: on, disabled: busy === 'switch' || !can, onCheckedChange: flip, "aria-label": switchesAlone ? t('{name} on', { name: a.name }) : t('On when saved'), "aria-describedby": sayId })] }), a && !a.draft ? (_jsx(Button, { size: "sm", variant: "outline", disabled: Boolean(busy) || dirty, onPress: () => void go(), children: busy === 'run' ? t('Starting…') : t('Run now') })) : null, a && dirty ? (_jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => {
                                     setBase(drafted(a));
                                     setD(drafted(a));
                                     setNote('');
-                                }, children: "Discard changes" })) : null, _jsx(Button, { size: "sm", disabled: Boolean(busy) || locked || !(fresh || drafty || dirty), onPress: () => complete() && void keep(), children: busy === 'save' ? 'Saving…' : fresh ? 'Create' : 'Save' })] }), note ? (_jsxs(XStack, { width: "100%", maxW: 760, mx: "auto", items: "center", gap: "$3", pt: "$2", children: [_jsx(Line, { children: note }), upgrade ? (_jsx(Button, { size: "sm", variant: "outline", onPress: () => away(path({ kind: 'screen', screen: 'plans' })), children: "See plans" })) : null] })) : null] }), _jsxs(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$5", children: [_jsxs(YStack, { width: "100%", maxW: 760, mx: "auto", gap: "$5", children: [locked ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "note", children: "This automation posts to the organization\u2019s accounts, so only an org admin changes it." })) : null, free ? (_jsxs(XStack, { items: "center", gap: "$3", px: "$3", py: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", flexWrap: "wrap", rowGap: "$2", children: [_jsx(SizableText, { flex: 1, minW: 200, size: "$1", color: "$soft", children: "Paid plans include automation runs. On the Free plan each run needs $1 of credit." }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => away(path({ kind: 'screen', screen: 'plans' })), children: "See plans" })] })) : null, _jsxs(YStack, { gap: "$1", children: [_jsx(SizableText, { render: "h1", size: "$6", color: "$ink", numberOfLines: 1, children: fresh ? 'New automation' : a?.name }), _jsx(SizableText, { size: "$2", color: "$soft", children: fresh
-                                            ? 'Name it, say what it should do, and when. It runs as you, in this organization.'
+                                }, children: t('Discard changes') })) : null, _jsx(Button, { size: "sm", disabled: Boolean(busy) || locked || !(fresh || drafty || dirty), onPress: () => complete() && void keep(), children: busy === 'save' ? t('Saving…') : fresh ? t('Create') : t('Save') })] }), note ? (_jsxs(XStack, { width: "100%", maxW: 760, mx: "auto", items: "center", gap: "$3", pt: "$2", children: [_jsx(Line, { children: note }), upgrade ? (_jsx(Button, { size: "sm", variant: "outline", onPress: () => away(path({ kind: 'screen', screen: 'plans' })), children: t('See plans') })) : null] })) : null] }), _jsxs(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$5", children: [_jsxs(YStack, { width: "100%", maxW: 760, mx: "auto", gap: "$5", children: [locked ? (_jsx(SizableText, { size: "$1", color: "$soft", role: "note", children: t('This automation posts to the organization’s accounts, so only an org admin changes it.') })) : null, free ? (_jsxs(XStack, { items: "center", gap: "$3", px: "$3", py: "$2", rounded: "$3", borderWidth: 1, borderColor: "$borderColor", flexWrap: "wrap", rowGap: "$2", children: [_jsx(SizableText, { flex: 1, minW: 200, size: "$1", color: "$soft", children: t('Paid plans include automation runs. On the Free plan each run needs $1 of credit.') }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => away(path({ kind: 'screen', screen: 'plans' })), children: t('See plans') })] })) : null, _jsxs(YStack, { gap: "$1", children: [_jsx(SizableText, { render: "h1", size: "$6", color: "$ink", numberOfLines: 1, children: fresh ? t('New automation') : a?.name }), _jsx(SizableText, { size: "$2", color: "$soft", children: fresh
+                                            ? t('Name it, say what it should do, and when. It runs as you, in this organization.')
                                             : a?.draft
-                                                ? 'A draft: say what it should do and save it, and it runs.'
-                                                : [`From ${SOURCE[a.source]}`, words(a.schedule), a.next && a.enabled ? `next ${local(a.next)}` : a.schedule.kind === 'manual' ? '' : 'off'].filter(Boolean).join(' · ') })] }), fresh && offered.value.length && !d.instructions.trim() ? (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", rowGap: "$2", items: "center", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: "Start from" }), offered.value.map((x) => (_jsx(Button, { size: "sm", variant: "outline", onPress: () => begin(x), "aria-label": `Start from ${x.name}`, children: x.name }, x.key)))] })) : null, _jsx(Field, { label: "Name", children: _jsx(Input, { ref: nameRef, value: d.name, onChangeText: (v) => set({ name: v }), onSubmitEditing: () => asksRef.current?.focus(), placeholder: "Morning briefing", "aria-label": "Automation name", autoFocus: fresh, disabled: locked }) }), _jsx(Field, { label: "Instructions (required)", hint: "What the agent does each run. It works in a Dev sandbox with this organization's connectors, MCP servers and skills.", children: _jsx(Textarea, { ref: asksRef, disabled: locked, value: d.instructions, onChangeText: (v) => set({ instructions: v }), placeholder: "What should it do each run? For example: summarize what needs my attention today across calendar, email and messages.", "aria-label": "Instructions", rows: 7 }) }), _jsx(Field, { label: "When it runs", hint: s.kind === 'cron' ? 'Five fields: minute, hour, day of month, month, day of week.' : s.kind === 'once' ? 'It runs at that time and then switches itself off.' : undefined, children: _jsx(When, { s: s, onChange: (next) => set({ schedule: next }), disabled: locked }) }), _jsx(Field, { label: "Model", children: _jsx(XStack, { children: _jsx(ModelPicker, { size: "sm", name: "Model", models: catalog.value, scope: "chat", limits: limits, value: d.model ?? ENSO, onChange: (id) => set({ model: id === ENSO ? null : id }), loading: catalog.loading, error: catalog.error?.message ?? null }) }) }), _jsx(Field, { label: "Permissions", hint: d.permissions === 'auto' ? 'Works and uses connectors without stopping.' : 'Reads and researches, changes nothing, and ends with the actions it would take for you to approve.', children: _jsx(Choice, { label: "Permissions", value: d.permissions, options: PERMISSIONS, onChange: (p) => set({ permissions: p }) }) }), _jsxs(Field, { label: "Post to", hint: !host.admin
-                                    ? 'An org admin chooses where automations post: the accounts are the organization’s.'
+                                                ? t('A draft: say what it should do and save it, and it runs.')
+                                                : [
+                                                    t('From {product}', { product: t(SOURCE[a.source]) }),
+                                                    words(a.schedule, t),
+                                                    a.next && a.enabled ? t('next {when}', { when: local(a.next) }) : a.schedule.kind === 'manual' ? '' : t('off'),
+                                                ]
+                                                    .filter(Boolean)
+                                                    .join(' · ') })] }), fresh && offered.value.length && !d.instructions.trim() ? (_jsxs(XStack, { gap: "$2", flexWrap: "wrap", rowGap: "$2", items: "center", children: [_jsx(SizableText, { size: "$2", color: "$soft", children: t('Start from') }), offered.value.map((x) => (_jsx(Button, { size: "sm", variant: "outline", onPress: () => begin(x), "aria-label": t('Start from {name}', { name: x.name }), children: x.name }, x.key)))] })) : null, _jsx(Field, { label: t('Name'), children: _jsx(Input, { ref: nameRef, value: d.name, onChangeText: (v) => set({ name: v }), onSubmitEditing: () => asksRef.current?.focus(), placeholder: t('Morning briefing'), "aria-label": t('Automation name'), autoFocus: fresh, disabled: locked }) }), _jsx(Field, { label: t('Instructions (required)'), hint: t("What the agent does each run. It works in a Dev sandbox with this organization's connectors, MCP servers and skills."), children: _jsx(Textarea, { ref: asksRef, disabled: locked, value: d.instructions, onChangeText: (v) => set({ instructions: v }), placeholder: t('What should it do each run? For example: summarize what needs my attention today across calendar, email and messages.'), "aria-label": t('Instructions'), rows: 7 }) }), _jsx(Field, { label: t('When it runs'), hint: s.kind === 'cron' ? t('Five fields: minute, hour, day of month, month, day of week.') : s.kind === 'once' ? t('It runs at that time and then switches itself off.') : undefined, children: _jsx(When, { s: s, onChange: (next) => set({ schedule: next }), disabled: locked }) }), _jsx(Field, { label: t('Model'), children: _jsx(XStack, { children: _jsx(ModelPicker, { size: "sm", name: t('Model'), models: catalog.value, scope: "chat", limits: limits, value: d.model ?? ENSO, onChange: (id) => set({ model: id === ENSO ? null : id }), loading: catalog.loading, error: catalog.error ? told(catalog.error, t) : null }) }) }), _jsx(Field, { label: t('Permissions'), hint: d.permissions === 'auto' ? t('Works and uses connectors without stopping.') : t('Reads and researches, changes nothing, and ends with the actions it would take for you to approve.'), children: _jsx(Choice, { label: t('Permissions'), value: d.permissions, options: PERMISSIONS.map((p) => ({ ...p, label: t(p.label) })), onChange: (p) => set({ permissions: p }) }) }), _jsxs(Field, { label: t('Post to'), hint: !host.admin
+                                    ? t('An org admin chooses where automations post: the accounts are the organization’s.')
                                     : !d.postTo.length
-                                        ? 'Turn an account on and each run’s answer is a post for it.'
+                                        ? t('Turn an account on and each run’s answer is a post for it.')
                                         : d.permissions === 'auto'
-                                            ? 'Each run posts what the agent writes, as written.'
-                                            : 'Each run holds what the agent writes for you to post or discard.', children: [_jsx(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: SOCIAL.filter((p) => p.posts).map((p, i) => {
+                                            ? t('Each run posts what the agent writes, as written.')
+                                            : t('Each run holds what the agent writes for you to post or discard.'), children: [_jsx(YStack, { borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", children: SOCIAL.filter((p) => p.posts).map((p, i) => {
                                             const c = social.value[p.id];
                                             const on = d.postTo.includes(p.id);
                                             return (_jsxs(XStack, { items: "center", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: i ? 1 : 0, borderColor: "$borderColor", children: [_jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: p.name }), _jsx(SizableText, { size: "$1", color: "$soft", children: social.error
-                                                                    ? social.error.message
+                                                                    ? told(social.error, t)
                                                                     : !c
-                                                                        ? 'Reading…'
+                                                                        ? t('Reading…')
                                                                         : c.connected
-                                                                            ? `Connected${c.account ? ` as ${c.account}` : ''}`
-                                                                            : `${c.available ? 'Not connected: an org admin connects it in Settings → Integrations.' : p.needs} ${on || d.permissions === 'ask'
-                                                                                ? 'Runs hold the post for you to read; posting it fails until it is connected.'
-                                                                                : 'Acting on its own, it posts only to a connected account.'}` })] }), _jsx(Switch, { checked: on, disabled: !host.admin || (!on && !c?.connected && d.permissions === 'auto'), onCheckedChange: (v) => set({ postTo: v ? [...d.postTo, p.id].sort() : d.postTo.filter((x) => x !== p.id) }), "aria-label": `Post to ${p.name}` })] }, p.id));
-                                        }) }), _jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "ghost", onPress: () => away(path({ kind: 'settings', section: 'integrations' })), children: "Connect accounts" }) })] }), _jsxs(XStack, { items: "center", gap: "$3", children: [_jsxs(YStack, { flex: 1, minW: 0, children: [_jsx(SizableText, { size: "$2", color: "$ink", children: "Email me when a run ends" }), _jsx(SizableText, { size: "$1", color: "$soft", children: "One line on how it went, with a link to the run." })] }), _jsx(Switch, { checked: d.notify, onCheckedChange: (v) => set({ notify: v }), "aria-label": "Email me when a run ends" })] }), dirty && wrong && note !== wrong ? _jsx(Line, { children: wrong }) : null, a ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => setAsking(true), children: "Delete" }) })) : null, a ? (_jsxs(YStack, { gap: "$2", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: "Runs" }), history.error && !history.value.length ? (_jsx(Line, { children: history.error.message })) : !history.value.length ? (_jsx(SizableText, { size: "$2", color: "$soft", children: history.loading ? 'Reading its runs…' : a.draft ? 'It runs once its instructions are saved.' : 'No runs yet. Run now starts one.' })) : (_jsx(YStack, { role: "list", borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", "aria-label": "Run history", children: history.value.map((r, i) => (_jsxs(XStack, { role: "listitem", items: "flex-start", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: i ? 1 : 0, borderColor: "$borderColor", children: [_jsx(YStack, { pt: "$1", children: _jsx(StatusDot, { status: DOT[r.status] ?? 'idle' }) }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: `${WORD[r.status] ?? r.status} · ${local(r.at)}` }), _jsx(SizableText, { size: "$1", color: "$soft", style: { whiteSpace: 'pre-wrap' }, children: r.summary || (live(r.status) ? 'Working…' : '') }), r.draft ? (_jsx(YStack, { mt: "$1.5", px: "$3", py: "$2", rounded: "$2", bg: "$raised", role: "group", "aria-label": "The post", children: _jsx(SizableText, { size: "$2", color: "$ink", style: { whiteSpace: 'pre-wrap' }, children: r.draft }) })) : null, r.outputs.length ? _jsx(Outputs, { ids: r.outputs }) : null, r.posts.map((x) => (_jsxs(XStack, { items: "center", gap: "$2", pt: "$1", children: [_jsx(SizableText, { size: "$1", color: "$ink", children: NAME[x.to] ?? x.to }), x.url ? (_jsx(Out, { href: x.url, label: `Open the ${NAME[x.to] ?? x.to} post`, children: _jsx(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: "Posted \u00B7 open" }) })) : (_jsx(SizableText, { size: "$1", color: "$soft", children: x.error }))] }, x.to))), r.status === 'review' && host.admin && !answered.has(r.id) ? (_jsxs(XStack, { gap: "$2", pt: "$2", children: [_jsx(Button, { size: "sm", disabled: Boolean(busy), onPress: () => void answer(r, true), "aria-label": `Post the post of ${local(r.at)}`, children: "Post it" }), _jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => void answer(r, false), "aria-label": `Discard the post of ${local(r.at)}`, children: "Discard" })] })) : r.status === 'review' && !host.admin ? (_jsx(SizableText, { size: "$1", color: "$soft", pt: "$1", children: "An org admin posts or discards it." })) : null] }), r.session ? (_jsx(Button, { size: "sm", variant: "ghost", onPress: () => host.go(r.session), "aria-label": `Open the Dev run of ${local(r.at)}`, children: "Open run" })) : null] }, r.id))) }))] })) : null] }), a ? (_jsx(Confirm, { what: a.name, says: "It stops running, and its schedule and its runs go with it. A run going now is stopped.", open: asking, onOpenChange: setAsking, onYes: async () => {
-                            await remove(t, a.id);
+                                                                            ? c.account
+                                                                                ? t('Connected as {account}', { account: c.account })
+                                                                                : t('Connected')
+                                                                            : `${c.available ? t('Not connected: an org admin connects it in Settings → Integrations.') : t(p.needs)} ${on || d.permissions === 'ask'
+                                                                                ? t('Runs hold the post for you to read; posting it fails until it is connected.')
+                                                                                : t('Acting on its own, it posts only to a connected account.')}` })] }), _jsx(Switch, { checked: on, disabled: !host.admin || (!on && !c?.connected && d.permissions === 'auto'), onCheckedChange: (v) => set({ postTo: v ? [...d.postTo, p.id].sort() : d.postTo.filter((x) => x !== p.id) }), "aria-label": t('Post to {name}', { name: p.name }) })] }, p.id));
+                                        }) }), _jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "ghost", onPress: () => away(path({ kind: 'settings', section: 'integrations' })), children: t('Connect accounts') }) })] }), _jsxs(XStack, { items: "center", gap: "$3", children: [_jsxs(YStack, { flex: 1, minW: 0, children: [_jsx(SizableText, { size: "$2", color: "$ink", children: t('Email me when a run ends') }), _jsx(SizableText, { size: "$1", color: "$soft", children: t('One line on how it went, with a link to the run.') })] }), _jsx(Switch, { checked: d.notify, onCheckedChange: (v) => set({ notify: v }), "aria-label": t('Email me when a run ends') })] }), dirty && wrong && note !== wrong ? _jsx(Line, { children: wrong }) : null, a ? (_jsx(XStack, { children: _jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => setAsking(true), children: t('Delete') }) })) : null, a ? (_jsxs(YStack, { gap: "$2", children: [_jsx(SizableText, { size: "$3", color: "$ink", children: t('Runs') }), history.error && !history.value.length ? (_jsx(Line, { children: told(history.error, t) })) : !history.value.length ? (_jsx(SizableText, { size: "$2", color: "$soft", children: history.loading ? t('Reading its runs…') : a.draft ? t('It runs once its instructions are saved.') : t('No runs yet. Run now starts one.') })) : (_jsx(YStack, { role: "list", borderWidth: 1, borderColor: "$borderColor", rounded: "$3", overflow: "hidden", "aria-label": t('Run history'), children: history.value.map((r, i) => (_jsxs(XStack, { role: "listitem", items: "flex-start", gap: "$3", px: "$3", py: "$2.5", borderTopWidth: i ? 1 : 0, borderColor: "$borderColor", children: [_jsx(YStack, { pt: "$1", children: _jsx(StatusDot, { status: DOT[r.status] ?? 'idle' }) }), _jsxs(YStack, { flex: 1, minW: 0, gap: "$0.5", children: [_jsx(SizableText, { size: "$2", color: "$ink", children: `${WORD[r.status] ? t(WORD[r.status]) : r.status} · ${local(r.at)}` }), _jsx(SizableText, { size: "$1", color: "$soft", style: { whiteSpace: 'pre-wrap' }, children: r.summary || (live(r.status) ? t('Working…') : '') }), r.draft ? (_jsx(YStack, { mt: "$1.5", px: "$3", py: "$2", rounded: "$2", bg: "$raised", role: "group", "aria-label": t('The post'), children: _jsx(SizableText, { size: "$2", color: "$ink", style: { whiteSpace: 'pre-wrap' }, children: r.draft }) })) : null, r.outputs.length ? _jsx(Outputs, { ids: r.outputs }) : null, r.posts.map((x) => (_jsxs(XStack, { items: "center", gap: "$2", pt: "$1", children: [_jsx(SizableText, { size: "$1", color: "$ink", children: NAME[x.to] ?? x.to }), x.url ? (_jsx(Out, { href: x.url, label: t('Open the {name} post', { name: NAME[x.to] ?? x.to }), children: _jsx(SizableText, { size: "$1", color: "$ink", textDecorationLine: "underline", children: t('Posted · open') }) })) : (_jsx(SizableText, { size: "$1", color: "$soft", children: x.error }))] }, x.to))), r.status === 'review' && host.admin && !answered.has(r.id) ? (_jsxs(XStack, { gap: "$2", pt: "$2", children: [_jsx(Button, { size: "sm", disabled: Boolean(busy), onPress: () => void answer(r, true), "aria-label": t('Post the post of {when}', { when: local(r.at) }), children: t('Post it') }), _jsx(Button, { size: "sm", variant: "ghost", disabled: Boolean(busy), onPress: () => void answer(r, false), "aria-label": t('Discard the post of {when}', { when: local(r.at) }), children: t('Discard') })] })) : r.status === 'review' && !host.admin ? (_jsx(SizableText, { size: "$1", color: "$soft", pt: "$1", children: t('An org admin posts or discards it.') })) : null] }), r.session ? (_jsx(Button, { size: "sm", variant: "ghost", onPress: () => host.go(r.session), "aria-label": t('Open the Dev run of {when}', { when: local(r.at) }), children: t('Open run') })) : null] }, r.id))) }))] })) : null] }), a ? (_jsx(Confirm, { what: a.name, says: t('It stops running, and its schedule and its runs go with it. A run going now is stopped.'), open: asking, onOpenChange: setAsking, onYes: async () => {
+                            await remove(target, a.id);
                             leave({ replace: true });
-                        } })) : null, _jsxs(Sheet, { title: "Leave without saving?", open: Boolean(leaving), onOpenChange: (o) => !o && setLeaving(''), width: 420, children: [_jsx(SizableText, { size: "$2", color: "$soft", children: fresh ? 'This automation is not created yet.' : 'Your changes to this automation are not saved.' }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setLeaving(''), children: "Keep editing" }), _jsx(Button, { size: "sm", variant: "destructive", onPress: () => host.go(leaving), children: "Leave" })] })] })] })] }));
+                        } })) : null, _jsxs(Sheet, { title: t('Leave without saving?'), open: Boolean(leaving), onOpenChange: (o) => !o && setLeaving(''), width: 420, children: [_jsx(SizableText, { size: "$2", color: "$soft", children: fresh ? t('This automation is not created yet.') : t('Your changes to this automation are not saved.') }), _jsxs(XStack, { gap: "$2", justify: "flex-end", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => setLeaving(''), children: t('Keep editing') }), _jsx(Button, { size: "sm", variant: "destructive", onPress: () => host.go(leaving), children: t('Leave') })] })] })] })] }));
 }
+/** A page with nothing to edit yet: its title and what it says come already said. */
 function Page({ title, says, onBack }) {
-    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", children: _jsxs(YStack, { width: "100%", maxW: 760, mx: "auto", gap: "$4", children: [_jsx(XStack, { children: _jsxs(Button, { size: "sm", variant: "ghost", onPress: onBack, "aria-label": "All scheduled tasks", children: [_jsx(ChevronLeft, { size: 14 }), "Scheduled tasks"] }) }), _jsx(SizableText, { render: "h1", size: "$6", color: "$ink", children: title }), _jsx(SizableText, { size: "$2", color: "$soft", children: says })] }) }));
+    const { t } = useI18n();
+    return (_jsx(YStack, { flex: 1, minH: 0, overflow: "scroll", px: "$6", py: "$6", children: _jsxs(YStack, { width: "100%", maxW: 760, mx: "auto", gap: "$4", children: [_jsx(XStack, { children: _jsxs(Button, { size: "sm", variant: "ghost", onPress: onBack, "aria-label": t('All scheduled tasks'), children: [_jsx(ChevronLeft, { size: 14, 'data-i18n-mirror': '' }), t('Scheduled tasks')] }) }), _jsx(SizableText, { render: "h1", size: "$6", color: "$ink", children: title }), _jsx(SizableText, { size: "$2", color: "$soft", children: says })] }) }));
 }

package/lib/back.js

@@ -12,6 +12,8 @@
  * `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 { phrase } from '@hanzo/i18n';
+import { useI18n } from '@hanzo/i18n/react';
 import { useEffect } from 'react';
 import { complete } from './api/github.js';
 /** The query keys a return carries its answer in. */
@@ -56,12 +58,13 @@ export function here() {
 }
 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');
+export const named = (id) => NAMES[id] ?? (id ? id[0].toUpperCase() + id.slice(1) : phrase('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) {
+    const { t: words } = useI18n();
     useEffect(() => {
         if (!signed)
             return;
@@ -72,18 +75,21 @@ export function useBack(t, signed, say, after) {
         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'}`);
+            // The provider's own reason is said as it came; with none, ours.
+            say(l.reason ? `${words(named(l.provider))}: ${l.reason}` : words('{provider}: not connected', { provider: words(named(l.provider)) }));
             return;
         }
         if (l.kind === 'connected') {
-            say(`${named(l.provider)} is connected${l.account ? ` as ${l.account}` : ''}`);
+            say(l.account
+                ? words('{provider} is connected as {account}', { provider: words(named(l.provider)), account: l.account })
+                : words('{provider} is connected', { provider: words(named(l.provider)) }));
             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');
+            say(c.connected ? words('Connected as @{login}', { login: c.login }) : words('GitHub did not connect; connect again'));
             after();
         }, (e) => say(e.message));
         // Once per landing: the address is clean after the first run.

package/lib/builder.js

@@ -28,6 +28,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * `DevSection`, section.tsx): one left column, never two.
  */
 import { SizableText, XStack, YStack } from '@hanzo/gui';
+import { useI18n } from '@hanzo/i18n/react';
 import { Menu, Search } from '@hanzogui/lucide-icons-2';
 import { Button } from '@hanzo/ui';
 import { SessionRail } from '@hanzo/ui/chat';
@@ -54,6 +55,7 @@ import { Find } from './find.js';
 import { Slack, useWho, Who } from './foot.js';
 import { Settings } from './settings/index.js';
 function Shell() {
+    const { t: say } = useI18n();
     const host = useHost();
     const t = useTarget();
     const r = route(host.path);
@@ -69,21 +71,21 @@ function Shell() {
         host.go(p);
     };
     const rows = useMemo(() => {
-        const list = recents.value.map((s) => ({ id: s.id, title: s.title || 'Untitled run', status: DOTS[s.status] ?? 'idle' }));
+        const list = recents.value.map((s) => ({ id: s.id, title: s.title || say('Untitled run'), status: DOTS[s.status] ?? 'idle' }));
         if (order === 'running')
             list.sort((a, b) => Number(b.status === 'running') - Number(a.status === 'running'));
         return list;
-    }, [recents.value, order]);
+    }, [recents.value, order, say]);
     // The top left, as on claude.ai: the builder's name, which leads to New, and under
     // it the search that finds a run. The organization is the account's, so it is
     // switched from the account menu at the foot. Beside the rail from md up, beside
     // the drawer's button below it — one place at a time.
     const name = _jsx(Name, { onPress: () => go('') });
     // Every place in view, none behind a More; the rail's own New starts a run.
-    const links = nav(host, go)
+    const links = nav(host, go, say)
         .flatMap((g) => g.links)
         .filter((l) => l.id !== NEW);
-    return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, bg: "$background", children: [_jsxs(YStack, { position: "relative", shrink: 0, children: [_jsx(SessionRail, { onNew: () => go(''), fresh: r.kind === 'new', links: links, recents: rows, active: r.kind === 'run' ? r.id : null, onOpen: (id) => go(id), onSort: () => setOrder(order === 'newest' ? 'running' : 'newest'), sortLabel: order === 'newest' ? 'Show running first' : 'Show newest first', empty: _jsx(SizableText, { size: "$1", color: "$soft", px: "$2", children: !host.person ? 'Sign in to see your runs.' : recents.error ? recents.error.message : recents.loading ? 'Reading…' : 'No runs yet.' }), notice: host.person && !slack ? (_jsx(Slack, { onOpen: () => go(path({ kind: 'settings', section: 'integrations' })), onDismiss: () => setSlack(true) })) : undefined, account: host.person
+    return (_jsxs(XStack, { flex: 1, minH: 0, minW: 0, bg: "$background", children: [_jsxs(YStack, { position: "relative", shrink: 0, children: [_jsx(SessionRail, { onNew: () => go(''), fresh: r.kind === 'new', links: links, recents: rows, active: r.kind === 'run' ? r.id : null, onOpen: (id) => go(id), onSort: () => setOrder(order === 'newest' ? 'running' : 'newest'), sortLabel: order === 'newest' ? say('Show running first') : say('Show newest first'), empty: _jsx(SizableText, { size: "$1", color: "$soft", px: "$2", children: !host.person ? say('Sign in to see your runs.') : recents.error ? say(recents.error.message) : recents.loading ? say('Reading…') : say('No runs yet.') }), notice: host.person && !slack ? (_jsx(Slack, { onOpen: () => go(path({ kind: 'settings', section: 'integrations' })), onDismiss: () => setSlack(true) })) : undefined, account: host.person
                             ? {
                                 // Who, and in which organization, as claude.ai says who and on which plan.
                                 name: [host.person.name || host.person.email, host.org].filter(Boolean).join(' · '),
@@ -92,7 +94,7 @@ function Shell() {
                                     who.toggle();
                                 },
                             }
-                            : { name: 'Sign in', onPress: () => host.signIn?.() }, collapsed: collapsed, onCollapse: setCollapsed, mark: _jsx(Brand, { org: host.org, logo: host.logo }), pt: collapsed ? undefined : 92, open: drawer, onOpenChange: setDrawer, label: "Runs" }), collapsed ? null : (_jsxs(YStack, { position: "absolute", t: 10, l: 8, r: 8, z: 2, gap: "$2.5", "$max-md": { display: 'none' }, children: [_jsx(XStack, { px: "$2.5", children: name }), _jsxs(XStack, { render: "button", "aria-label": "Search runs", onPress: () => setFinding(true), items: "center", gap: "$2", px: "$2.5", height: 34, rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", hoverStyle: { bg: '$hover' }, children: [_jsx(Search, { size: 15, color: "$soft" }), _jsx(SizableText, { size: "$2", color: "$soft", children: "Search" })] })] })), host.person ? _jsx(Who, { open: who.open, onOpenChange: who.onOpenChange, narrow: collapsed }) : null] }), _jsxs(YStack, { flex: 1, minW: 0, minH: 0, position: "relative", children: [_jsxs(XStack, { height: 44, px: "$2", gap: "$2", items: "center", shrink: 0, $md: { display: 'none' }, children: [_jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setDrawer(true), "aria-label": "Open runs", children: _jsx(Menu, { size: 18 }) }), name, _jsx(XStack, { flex: 1 }), _jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setFinding(true), "aria-label": "Search runs", children: _jsx(Search, { size: 18 }) })] }), _jsx(Pane, { onStarted: () => recents.reload() })] }), _jsx(Find, { open: finding, onOpenChange: setFinding, recents: rows, onOpen: (id) => { setFinding(false); go(id); } })] }));
+                            : { name: say('Sign in'), onPress: () => host.signIn?.() }, collapsed: collapsed, onCollapse: setCollapsed, mark: _jsx(Brand, { org: host.org, logo: host.logo }), pt: collapsed ? undefined : 92, open: drawer, onOpenChange: setDrawer, label: say('Runs') }), collapsed ? null : (_jsxs(YStack, { position: "absolute", t: 10, l: 8, r: 8, z: 2, gap: "$2.5", "$max-md": { display: 'none' }, children: [_jsx(XStack, { px: "$2.5", children: name }), _jsxs(XStack, { render: "button", "aria-label": say('Search runs'), onPress: () => setFinding(true), items: "center", gap: "$2", px: "$2.5", height: 34, rounded: "$3", borderWidth: 1, borderColor: "$borderColor", bg: "$panel", hoverStyle: { bg: '$hover' }, children: [_jsx(Search, { size: 15, color: "$soft" }), _jsx(SizableText, { size: "$2", color: "$soft", children: say('Search') })] })] })), host.person ? _jsx(Who, { open: who.open, onOpenChange: who.onOpenChange, narrow: collapsed }) : null] }), _jsxs(YStack, { flex: 1, minW: 0, minH: 0, position: "relative", children: [_jsxs(XStack, { height: 44, px: "$2", gap: "$2", items: "center", shrink: 0, $md: { display: 'none' }, children: [_jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setDrawer(true), "aria-label": say('Open runs'), children: _jsx(Menu, { size: 18 }) }), name, _jsx(XStack, { flex: 1 }), _jsx(Button, { variant: "ghost", size: "icon-sm", onPress: () => setFinding(true), "aria-label": say('Search runs'), children: _jsx(Search, { size: 18 }) })] }), _jsx(Pane, { onStarted: () => recents.reload() })] }), _jsx(Find, { open: finding, onOpenChange: setFinding, recents: rows, onOpen: (id) => { setFinding(false); go(id); } })] }));
 }
 /** The wordmark: the product's name, as its host calls it, which leads to New. */
 function Name({ onPress }) {

package/lib/carry.js

@@ -17,6 +17,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * (Chat its agents, Dev its devices) beside these.
  */
 import { SizableText, XStack } from '@hanzo/gui';
+import { useI18n } from '@hanzo/i18n/react';
 import { BookOpen, ListChecks, Palette, ScrollText } from '@hanzogui/lucide-icons-2';
 import { Button, Dialog, DialogContent, DialogDescription, DialogTitle } from '@hanzo/ui';
 import { useEffect, useMemo, useRef, useState } from 'react';
@@ -65,7 +66,8 @@ async function said(t, skills, memory, mode, design) {
 }
 /** Manual's pause: what is about to run, what it does, and the three answers. Closing it is a no. */
 function Allow({ what, onAnswer }) {
-    return (_jsx(Dialog, { open: true, onOpenChange: (o) => !o && onAnswer('deny'), children: _jsxs(DialogContent, { maxW: 440, width: "100%", "data-slot": "allow", children: [_jsx(DialogTitle, { children: `Allow ${what.name}?` }), _jsx(DialogDescription, { children: what.note ? `${what.note}. Manual asks before each one runs.` : 'Manual asks before each one runs.' }), _jsxs(XStack, { justify: "flex-end", gap: "$2", pt: "$3", flexWrap: "wrap", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => onAnswer('deny'), children: "Deny" }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => onAnswer('always'), children: _jsx(SizableText, { fontSize: 14, children: "Always in this chat" }) }), _jsx(Button, { size: "sm", onPress: () => onAnswer('once'), children: "Allow once" })] })] }) }));
+    const { t } = useI18n();
+    return (_jsx(Dialog, { open: true, onOpenChange: (o) => !o && onAnswer('deny'), children: _jsxs(DialogContent, { maxW: 440, width: "100%", "data-slot": "allow", children: [_jsx(DialogTitle, { children: t('Allow {name}?', { name: t(what.name) }) }), _jsx(DialogDescription, { children: what.note ? `${t(what.note)}. ${t('Manual asks before each one runs.')}` : t('Manual asks before each one runs.') }), _jsxs(XStack, { justify: "flex-end", gap: "$2", pt: "$3", flexWrap: "wrap", children: [_jsx(Button, { size: "sm", variant: "ghost", onPress: () => onAnswer('deny'), children: t('Deny') }), _jsx(Button, { size: "sm", variant: "outline", onPress: () => onAnswer('always'), children: _jsx(SizableText, { fontSize: 14, children: t('Always in this chat') }) }), _jsx(Button, { size: "sm", onPress: () => onAnswer('once'), children: t('Allow once') })] })] }) }));
 }
 /**
  * The conversation `key` names (`''` for one not begun), for target `t`.
@@ -73,6 +75,7 @@ function Allow({ what, onAnswer }) {
  * surface offers (a choice it does not offer reads as Auto).
  */
 export function useCarry(t, key, customize, lent, modes = DEV_MODES) {
+    const { t: say } = useI18n();
     const gear = useGear(t, key);
     const [dialog, show] = useState(null);
     // The composer a plugin acts on, read when it acts: the draft moves under it.
@@ -98,13 +101,13 @@ export function useCarry(t, key, customize, lent, modes = DEV_MODES) {
         rows: names.map((n) => ({ id: n, label: n, icon: _jsx(ScrollText, { size: 16 }), on: skills.includes(n) })),
         pick: (id) => gear.toggle('skills', id),
         loading: list.loading,
-        error: list.error ? 'The skills could not be read.' : null,
-        search: names.length > 8 ? 'Search skills' : undefined,
-        empty: 'No skills are on for this organization',
-        manage: { label: 'Manage skills', onPress: () => customize('skills') },
-        browse: { label: 'Browse skills', onPress: () => customize('skills') },
+        error: list.error ? say('The skills could not be read.') : null,
+        search: names.length > 8 ? say('Search skills') : undefined,
+        empty: say('No skills are on for this organization'),
+        manage: { label: say('Manage skills'), onPress: () => customize('skills') },
+        browse: { label: say('Browse skills'), onPress: () => customize('skills') },
     };
-    const plugins = pluginShelf(found, gear, composer);
+    const plugins = pluginShelf(found, gear, composer, say);
     // The design systems: Studio's brands, the one store for them.
     const kits = useRead(signed ? () => brands(t) : null, [], [t, signed, design]);
     const named = kits.value.find((b) => b.id === design);
@@ -114,26 +117,27 @@ export function useCarry(t, key, customize, lent, modes = DEV_MODES) {
         }),
         pick: (id) => gear.set({ design: design === id ? '' : id }),
         loading: kits.loading,
-        error: kits.error ? 'The design systems could not be read.' : null,
-        empty: 'No design systems yet',
+        error: kits.error ? say('The design systems could not be read.') : null,
+        empty: say('No design systems yet'),
         create: {
-            label: 'Create design system',
+            label: say('Create design system'),
             onPress: () => {
                 if (!gear.gear.plugins.includes('design'))
                     gear.toggle('plugins', 'design');
-                lentNow.current.setDraft('Make me a design system for ');
+                // The person's own words to finish, so in their language.
+                lentNow.current.setDraft(say('Make me a design system for '));
             },
         },
     };
     const lit = lighted(found.plugins, gear.gear);
     const on = [
         ...skills.map((n) => ({ id: `skill:${n}`, label: n, icon: _jsx(ScrollText, { size: 14 }), onRemove: () => gear.toggle('skills', n) })),
-        ...(research ? [{ id: 'research', label: 'Research', icon: _jsx(BookOpen, { size: 14 }), onRemove: () => gear.set({ research: false }) }] : []),
-        ...(mode === 'plan' ? [{ id: 'plan', label: 'Plan', icon: _jsx(ListChecks, { size: 14 }), onRemove: () => gear.set({ mode: 'auto' }) }] : []),
-        ...(design ? [{ id: 'design', label: named?.name ?? 'Design system', icon: _jsx(Palette, { size: 14 }), onRemove: () => gear.set({ design: '' }) }] : []),
+        ...(research ? [{ id: 'research', label: say('Research'), icon: _jsx(BookOpen, { size: 14 }), onRemove: () => gear.set({ research: false }) }] : []),
+        ...(mode === 'plan' ? [{ id: 'plan', label: say('Plan'), icon: _jsx(ListChecks, { size: 14 }), onRemove: () => gear.set({ mode: 'auto' }) }] : []),
+        ...(design ? [{ id: 'design', label: named?.name ?? say('Design system'), icon: _jsx(Palette, { size: 14 }), onRemove: () => gear.set({ design: '' }) }] : []),
         ...lit
             .filter((p) => p.id !== 'research')
-            .map((p) => ({ id: `plugin:${p.id}`, label: p.name, icon: p.icon, onRemove: () => gear.toggle('plugins', p.id) })),
+            .map((p) => ({ id: `plugin:${p.id}`, label: say(p.name), icon: p.icon, onRemove: () => gear.toggle('plugins', p.id) })),
     ];
     const signedIn = Boolean(t.token());
     const [text, setText] = useState('');
@@ -183,7 +187,7 @@ export function useCarry(t, key, customize, lent, modes = DEV_MODES) {
             for (const x of lit)
                 if (!signal.aborted && !(await allow({ id: x.id, name: x.name, note: x.note })))
                     denied.push(x.id);
-            const p = await prep(found.plugins, gear.gear, { ...turn, design }, composer, signal, denied);
+            const p = await prep(found.plugins, gear.gear, { ...turn, design }, composer, signal, denied, say);
             if (p.design)
                 gear.set({ design: p.design, plugins: gear.gear.plugins.filter((x) => x !== 'design') });
             return p;