@adecore/agents-react 0.0.1 → 0.17.0-beta.1

package/src/agents/AccountDot.tsx

@@ -0,0 +1,14 @@
+import clsx from 'clsx';
+import { accountColor } from './accounts';
+
+/* The color an account wears, or the app's accent while it wears none of the accents. */
+export function AccountDot({ color, className }: { color: string | undefined; className?: string }) {
+    const paint = accountColor(color);
+    return (
+        <span
+            aria-hidden
+            className={clsx('shrink-0 rounded-full', paint === undefined && 'bg-accent', className ?? 'size-2')}
+            style={paint === undefined ? undefined : { background: paint }}
+        />
+    );
+}

package/src/agents/AgentIcon.tsx

@@ -0,0 +1,26 @@
+import type { AgentKind } from '@adecore/agent-contracts';
+import clsx from 'clsx';
+import { Bot } from 'lucide-react';
+import { siClaude, siGithubcopilot, siGooglegemini } from 'simple-icons';
+import { Icon } from '@adecore/ui';
+import { PROVIDER_PATHS } from './provider-paths';
+
+// simple-icons removed OpenAI's mark at its request, so Codex reuses the usage page's path.
+const MARKS: Partial<Record<AgentKind, { title: string; path: string }>> = {
+    claude: siClaude,
+    codex: { title: 'Codex', path: PROVIDER_PATHS.codex },
+    gemini: siGooglegemini,
+    copilot: siGithubcopilot
+};
+
+export function AgentIcon({ kind, size = 14, className }: { kind: AgentKind; size?: number; className?: string }) {
+    const mark = MARKS[kind];
+    if (!mark) {
+        return <Icon icon={Bot} size={size} className={className} />;
+    }
+    return (
+        <svg role="img" aria-label={mark.title} viewBox="0 0 24 24" width={size} height={size} fill="currentColor" className={clsx('align-middle', className)}>
+            <path d={mark.path} />
+        </svg>
+    );
+}

package/src/agents/ModelOptionControl.tsx

@@ -0,0 +1,68 @@
+import type { ModelOptionDescriptor, ModelSelection } from '@adecore/agent-contracts';
+import { Segmented, Switch, Select } from '@adecore/ui';
+import { optionValue } from './model-options';
+
+// Up to this many choices read at a glance side by side; more go into a menu.
+const MAX_SEGMENTS = 3;
+
+// The item `defaultLabel` adds; a choice id is never empty.
+const MODEL_DEFAULT = '';
+
+type ModelOptionControlProps = {
+    option: ModelOptionDescriptor;
+    /* The selection's options, of which this control reads and writes one. */
+    options: ModelSelection['options'];
+    /* `compact` beside a model picker in a form, `row` as the control of a settings row. */
+    layout?: 'compact' | 'row';
+    disabled?: boolean;
+} & (
+    | { defaultLabel?: undefined; onChange(value: string | boolean): void }
+    /* Adds an item that leaves the choice to the model, answered as `undefined`. A boolean has no room for it and ignores it. */
+    | { defaultLabel: string; onChange(value: string | boolean | undefined): void }
+);
+
+/*
+ * One of a model's own knobs outside a chat, such as effort in a form. The composer draws the same
+ * descriptors as menu items (`RunSettings`), since there they sit in a menu.
+ */
+export function ModelOptionControl(props: ModelOptionControlProps) {
+    const { option, options, layout = 'compact', disabled } = props;
+    if (option.type === 'boolean') {
+        return <Switch checked={optionValue(option, options) === true} label={option.label} disabled={disabled} onCheckedChange={props.onChange} />;
+    }
+    const picked = props.defaultLabel !== undefined && options[option.id] === undefined ? MODEL_DEFAULT : String(optionValue(option, options));
+    const choices = [
+        ...(props.defaultLabel !== undefined ? [{ id: MODEL_DEFAULT, label: props.defaultLabel, description: undefined }] : []),
+        ...option.choices
+    ];
+    const choose = (id: string): void => {
+        if (props.defaultLabel !== undefined) {
+            props.onChange(id === MODEL_DEFAULT ? undefined : id);
+            return;
+        }
+        props.onChange(id);
+    };
+    if (layout === 'row' && choices.length <= MAX_SEGMENTS) {
+        return (
+            <Segmented
+                value={picked}
+                label={option.label}
+                disabled={disabled}
+                options={choices.map((choice) => ({ id: choice.id, label: choice.label }))}
+                onValueChange={choose}
+            />
+        );
+    }
+    return (
+        <Select
+            value={picked}
+            label={option.label}
+            size={layout === 'compact' ? 'sm' : 'md'}
+            variant={layout === 'compact' ? 'ghost' : 'outlined'}
+            align={layout === 'row' ? 'end' : 'start'}
+            disabled={disabled}
+            items={choices.map((choice) => ({ value: choice.id, label: choice.label, description: choice.description }))}
+            onValueChange={choose}
+        />
+    );
+}

package/src/agents/ProviderLogo.tsx

@@ -0,0 +1,20 @@
+import clsx from 'clsx';
+import type { UsageProvider } from '@adecore/agent-contracts';
+import { PROVIDER_PATHS } from './provider-paths';
+
+interface ProviderLogoProps {
+    provider: UsageProvider;
+    size?: number;
+    className?: string;
+}
+
+/* The 24 by 24 box both marks are drawn in, so one size renders them at the same weight. */
+const VIEW_BOX = '0 0 24 24';
+
+export function ProviderLogo({ provider, size = 14, className }: ProviderLogoProps) {
+    return (
+        <svg aria-hidden viewBox={VIEW_BOX} width={size} height={size} fill="currentColor" className={clsx('shrink-0', className)}>
+            <path d={PROVIDER_PATHS[provider]} />
+        </svg>
+    );
+}

package/src/agents/account-limits.ts

@@ -0,0 +1,61 @@
+import type { AgentKind, ProviderAccounts, UsageLimitsProvider, UsageLimitsSnapshot, UsageWindow } from '@adecore/agent-contracts';
+import { accountsOfKind, type AccountEntry } from './accounts';
+
+/* The account a plan entry is of; an entry from a machine before accounts is its CLI's default account. */
+export function limitsAccountId(entry: UsageLimitsProvider): string {
+    return entry.account?.id ?? entry.kind;
+}
+
+export function limitsOfAccount(snapshot: UsageLimitsSnapshot | null, id: string): UsageLimitsProvider | null {
+    return snapshot?.providers.find((entry) => limitsAccountId(entry) === id) ?? null;
+}
+
+export function sessionWindow(entry: UsageLimitsProvider | null): UsageWindow | null {
+    return entry?.windows.find((window) => window.kind === 'session') ?? null;
+}
+
+/* The numbers were read, and no window of the plan is spent. An account never read has no known room. */
+function hasRoom(entry: UsageLimitsProvider | null): entry is UsageLimitsProvider {
+    return entry !== null && entry.checkedAt > 0 && entry.unavailable === null && entry.windows.length > 0 && entry.windows.every((window) => window.used < 1);
+}
+
+/* What a turn of this account would run into first: its session window, else its fullest one. */
+function pressure(entry: UsageLimitsProvider): number {
+    return sessionWindow(entry)?.used ?? Math.max(...entry.windows.map((window) => window.used));
+}
+
+/* The other accounts of the CLI a chat could go on under right now: on, and signed in. */
+function others(accounts: ProviderAccounts | null, kind: AgentKind, current: string | undefined): AccountEntry[] {
+    return accountsOfKind(accounts, kind).filter(
+        (entry) => entry.id !== (current ?? kind) && entry.account.enabled !== false && entry.status?.state === 'ready'
+    );
+}
+
+/*
+ * The account a chat that stopped on a limit could go on under: another one of its CLI that is on,
+ * signed in and has room, the one with the least of its session spent. Null when none has room, or
+ * none was read yet; the choice is only ever offered, never made.
+ */
+export function continueTarget(
+    accounts: ProviderAccounts | null,
+    snapshot: UsageLimitsSnapshot | null,
+    kind: AgentKind,
+    current: string | undefined
+): AccountEntry | null {
+    const roomy = others(accounts, kind, current).flatMap((entry) => {
+        const limits = limitsOfAccount(snapshot, entry.id);
+        return hasRoom(limits) ? [{ entry, pressure: pressure(limits) }] : [];
+    });
+    roomy.sort((a, b) => a.pressure - b.pressure);
+    return roomy[0]?.entry ?? null;
+}
+
+/* Whether another account a chat could go on under has no numbers yet, since the machine only reads one in use by itself. */
+export function hasUnreadAccount(
+    accounts: ProviderAccounts | null,
+    snapshot: UsageLimitsSnapshot | null,
+    kind: AgentKind,
+    current: string | undefined
+): boolean {
+    return others(accounts, kind, current).some((entry) => (limitsOfAccount(snapshot, entry.id)?.checkedAt ?? 0) === 0);
+}

package/src/agents/accounts.ts

@@ -0,0 +1,137 @@
+import i18next from 'i18next';
+import type { AgentKind, ProviderAccount, ProviderAccounts, ProviderAccountStatus } from '@adecore/agent-contracts';
+import { chatHost } from '../host';
+
+/*
+ * An account wears one of the host's accents, so the app paints from one palette. A color that is none
+ * of them (an older name, or one written by hand) reads as undefined, and the dot takes the accent.
+ */
+export function accountColor(color: string | undefined): string | undefined {
+    return chatHost().accents.all.find((entry) => entry.id === color)?.color;
+}
+
+/*
+ * The variable each CLI reads its config folder from, as the host's providers name them. Only for
+ * the sentence under the folder; a CLI missing here still works, the sentence just does not name it.
+ */
+export const FOLDER_VARIABLES: Partial<Record<AgentKind, string>> = { claude: 'CLAUDE_CONFIG_DIR', codex: 'CODEX_HOME' };
+
+export interface AccountEntry {
+    id: string;
+    account: ProviderAccount;
+    status: ProviderAccountStatus | null;
+    /* The account under the CLI's own id, in the CLI's own folder. */
+    isDefault: boolean;
+}
+
+/* The accounts of one CLI, its default one first and the others in the order the machine keeps them. */
+export function accountsOfKind(accounts: ProviderAccounts | null, kind: AgentKind): AccountEntry[] {
+    if (accounts === null) {
+        return [];
+    }
+    const statuses = new Map(accounts.statuses.map((status) => [status.id, status]));
+    return Object.entries(accounts.accounts)
+        .filter(([, account]) => account.kind === kind)
+        .map(([id, account]) => ({ id, account, status: statuses.get(id) ?? null, isDefault: id === kind }))
+        .sort((a, b) => Number(b.isDefault) - Number(a.isDefault));
+}
+
+/* A default account nobody named goes by its CLI's name. */
+export function accountName(entry: Pick<AccountEntry, 'id' | 'account' | 'isDefault'>, providerName: string): string {
+    return entry.account.label ?? (entry.isDefault ? providerName : entry.id);
+}
+
+export type AccountTone = 'muted' | 'needs-you' | 'error';
+
+export const ACCOUNT_TONE_CLASSES: Record<AccountTone, string> = {
+    muted: 'text-text-muted',
+    'needs-you': 'text-status-needs-you',
+    error: 'text-status-error'
+};
+
+/*
+ * What an account's row says about it, in a few words. `canLogIn` is false for a CLI without a config
+ * folder: it has no login of its own to report, so being there is all a ready one says.
+ */
+export function accountStatusLine(status: ProviderAccountStatus | null, canLogIn: boolean): { text: string; tone: AccountTone } {
+    const words = (key: string, values?: Record<string, string>): string => i18next.t(`agent-providers:status.${key}`, values);
+    switch (status?.state ?? 'checking') {
+        case 'checking':
+            return { text: words('checking'), tone: 'muted' };
+        case 'disabled':
+            return { text: words('disabled'), tone: 'muted' };
+        case 'not-found':
+            return { text: words('notFound'), tone: 'muted' };
+        case 'signed-out':
+            return { text: words('signedOut'), tone: 'needs-you' };
+        case 'ready':
+            if (!canLogIn) {
+                return { text: words('available'), tone: 'muted' };
+            }
+            return { text: status?.plan ? words('readyPlan', { plan: status.plan }) : words('ready'), tone: 'muted' };
+        case 'folder-missing':
+            return { text: words('folderMissing'), tone: 'error' };
+        case 'unavailable':
+            return { text: words('unavailable'), tone: 'muted' };
+        case 'failed':
+            return { text: words('failed'), tone: 'error' };
+    }
+}
+
+/* The part of a name an id can hold, the way the machine makes one: `Work (EU)` becomes `work-eu`. */
+function slugOf(label: string): string {
+    return label
+        .normalize('NFKD')
+        .replace(/[̀-ͯ]/g, '')
+        .toLowerCase()
+        .replace(/[^a-z0-9]+/g, '-')
+        .replace(/^-+|-+$/g, '');
+}
+
+/* A free id for an account a person links to a folder of their own; one the machine makes gets its id from the machine. */
+export function mintAccountId(kind: AgentKind, label: string, taken: ReadonlySet<string>): string {
+    const base = `${kind}_${slugOf(label) || 'account'}`.slice(0, 60).replace(/-+$/, '');
+    let id = base;
+    for (let suffix = 2; taken.has(id); suffix += 1) {
+        id = `${base}-${suffix}`;
+    }
+    return id;
+}
+
+/*
+ * The first featured accent no account of the CLI wears yet, then any other, so a new one stands apart.
+ * An account without a color of its own wears `fallback`, the accent the app is painted in.
+ */
+export function freeAccountColor(entries: readonly AccountEntry[], fallback: string): string {
+    const { all, featured } = chatHost().accents;
+    const worn = new Set(entries.map((entry) => (accountColor(entry.account.color) === undefined ? fallback : entry.account.color)));
+    const choices = [...featured, ...all.map((entry) => entry.id).filter((id) => !featured.includes(id))];
+    return choices.find((id) => !worn.has(id)) ?? featured[entries.length % featured.length] ?? fallback;
+}
+
+/* The accounts of a CLI a picker offers: every one that is on, and the one in use even while it is off. */
+export function offeredAccounts(entries: readonly AccountEntry[], current: string | undefined): AccountEntry[] {
+    return entries.filter((entry) => entry.account.enabled !== false || entry.id === current);
+}
+
+/* Whether a person has a choice of account for this CLI at all, which is when a chat shows its account. */
+export function hasAccountChoice(entries: readonly AccountEntry[]): boolean {
+    return entries.filter((entry) => entry.account.enabled !== false).length >= 2;
+}
+
+/*
+ * Whether a chat of one account can go on under another, the way the machine decides it: the same
+ * account, or two of the chat's CLI that write their conversations to one folder. A machine that does
+ * not say where an account writes them answers no, so the person forks instead of being refused.
+ */
+export function canContinueOn(accounts: ProviderAccounts | null, kind: AgentKind, from: string | undefined, to: string | undefined): boolean {
+    const fromId = from ?? kind;
+    const toId = to ?? kind;
+    if (fromId === toId) {
+        return true;
+    }
+    const folderOf = (id: string): string | undefined =>
+        accounts?.accounts[id]?.kind === kind ? accounts.statuses.find((status) => status.id === id)?.transcripts : undefined;
+    const folder = folderOf(fromId);
+    return folder !== undefined && folder !== '' && folder === folderOf(toId);
+}

package/src/agents/model-name.ts

@@ -0,0 +1,70 @@
+import type { AgentKind, ModelInfo, ProviderInfo } from '@adecore/agent-contracts';
+import { useProviders } from '../state/providers';
+
+/*
+ * A model id as a person reads it, for a model no catalog names: without its vendor prefix and its
+ * date, and with the version number put back together (`claude-opus-4-5` is one 4.5, not a 4 and a
+ * 5).
+ */
+export function modelNameFromSlug(slug: string): string {
+    const bare = slug.slice(slug.lastIndexOf('/') + 1).replace(/-\d{6,8}$/, '');
+    const words: string[] = [];
+    for (const word of bare.split('-')) {
+        const previous = words.at(-1);
+        if (previous !== undefined && /^\d+$/.test(word) && /\d$/.test(previous)) {
+            words[words.length - 1] = `${previous}.${word}`;
+            continue;
+        }
+        words.push(word);
+    }
+    return words.map((word) => (word === 'gpt' ? 'GPT' : word.charAt(0).toUpperCase() + word.slice(1))).join(' ');
+}
+
+/* What the CLI calls the model, so every surface says the same thing; a slug it no longer offers is read as one. */
+export function modelName(slug: string, models: readonly ModelInfo[] | undefined): string {
+    return models?.find((entry) => entry.slug === slug)?.name ?? modelNameFromSlug(slug);
+}
+
+/* What an agent picker's chip says: the provider's name beside the model, and whether its mark is the logo of the usage page or the generic icon. */
+export interface AgentChip {
+    readonly mark: 'logo' | 'icon';
+    readonly name: string;
+    readonly model: string;
+}
+
+export function agentChipOf(providers: readonly ProviderInfo[], provider: AgentKind, model: string): AgentChip {
+    const owner = providers.find((entry) => entry.kind === provider);
+    return {
+        mark: provider === 'claude' || provider === 'codex' ? 'logo' : 'icon',
+        name: owner?.name ?? provider,
+        model: modelName(model, owner?.models)
+    };
+}
+
+/* The same answer for the machine in scope, whose catalog is the only one that can name the slug. */
+export function useModelName(provider: AgentKind | undefined, slug: string): string {
+    return useProviders((state) => modelName(slug, state.providers.find((entry) => entry.kind === provider)?.models));
+}
+
+/*
+ * The leading words every model of a catalog shares, so a tight spot can say `Opus 5.5` where the
+ * CLI says `Claude Opus 5.5`. Whole words only, so `GPT-6` never loses its `GPT-`, and never all of a name.
+ */
+export function sharedModelPrefix(models: readonly ModelInfo[]): string {
+    const names = models.map((entry) => entry.name.split(' '));
+    const first = names[0];
+    if (first === undefined || names.length < 2) {
+        return '';
+    }
+    let count = 0;
+    while (names.every((words) => words.length > count + 1 && words[count] === first[count])) {
+        count++;
+    }
+    return count === 0 ? '' : `${first.slice(0, count).join(' ')} `;
+}
+
+/* A model's name without the words its whole catalog shares. */
+export function shortModelName(name: string, models: readonly ModelInfo[] | undefined): string {
+    const prefix = sharedModelPrefix(models ?? []);
+    return prefix !== '' && name.startsWith(prefix) ? name.slice(prefix.length) : name;
+}

package/src/agents/model-options.ts

@@ -0,0 +1,21 @@
+import type { ModelInfo, ModelOptionDescriptor, ModelSelection } from '@adecore/agent-contracts';
+
+type OptionValues = ModelSelection['options'];
+
+function fits(option: ModelOptionDescriptor, value: string | boolean | undefined): value is string | boolean {
+    return option.type === 'boolean' ? typeof value === 'boolean' : typeof value === 'string' && option.choices.some((choice) => choice.id === value);
+}
+
+/* What an option runs at: the value picked, else the model's own default. A value the model does not offer counts as unpicked. */
+export function optionValue(option: ModelOptionDescriptor, options: OptionValues): string | boolean {
+    const picked = options[option.id];
+    if (fits(option, picked)) {
+        return picked;
+    }
+    return option.type === 'boolean' ? option.defaultValue : option.defaultChoice;
+}
+
+/* The picked options that `model` offers as well, so switching models keeps an effort the next one also has. */
+export function carryOptions(options: OptionValues, model: ModelInfo | undefined): OptionValues {
+    return Object.fromEntries((model?.options ?? []).filter((option) => fits(option, options[option.id])).map((option) => [option.id, options[option.id]!]));
+}

package/src/agents/provider-paths.ts

@@ -0,0 +1,10 @@
+import type { UsageProvider } from '@adecore/agent-contracts';
+
+/*
+ * The marks of Anthropic and OpenAI. Lucide has no brand marks, so these are the icon rule's
+ * exception for provider marks. One path each, in `currentColor`, so a row decides how loud the logo is.
+ */
+export const PROVIDER_PATHS: Record<UsageProvider, string> = {
+    claude: 'M4.709 15.955l4.72-2.647.079-.23-.08-.128H9.2l-.79-.048-2.698-.073-2.339-.097-2.266-.122-.571-.121L0 11.784l.055-.352.48-.321.686.06 1.52.103 2.278.158 1.652.097 2.449.255h.389l.055-.157-.134-.098-.103-.097-2.358-1.596-2.552-1.688-1.336-.972-.724-.491-.364-.462-.158-1.008.656-.722.881.06.225.061.893.686 1.908 1.476 2.491 1.833.365.304.145-.103.019-.073-.164-.274-1.355-2.446-1.446-2.49-.644-1.032-.17-.619a2.97 2.97 0 01-.104-.729L6.283.134 6.696 0l.996.134.42.364.62 1.414 1.002 2.229 1.555 3.03.456.898.243.832.091.255h.158V9.01l.128-1.706.237-2.095.23-2.695.08-.76.377-.91.747-.492.584.28.48.685-.067.444-.286 1.851-.559 2.903-.364 1.942h.212l.243-.242.985-1.306 1.652-2.064.73-.82.85-.904.547-.431h1.033l.76 1.129-.34 1.166-1.064 1.347-.881 1.142-1.264 1.7-.79 1.36.073.11.188-.02 2.856-.606 1.543-.28 1.841-.315.833.388.091.395-.328.807-1.969.486-2.309.462-3.439.813-.042.03.048.061 1.549.146.662.036h1.622l3.02.225.79.522.474.638-.079.485-1.215.62-1.64-.389-3.829-.91-1.312-.329h-.182v.11l1.093 1.068 2.006 1.81 2.509 2.33.127.578-.322.455-.34-.049-2.205-1.657-.851-.747-1.926-1.62h-.128v.17l.444.649 2.345 3.521.122 1.08-.17.353-.607.212-.668-.122-1.374-1.925-1.415-2.167-1.143-1.943-.14.08-.674 7.254-.316.37-.729.28-.607-.461-.322-.747.322-1.476.389-1.924.315-1.53.286-1.9.17-.632-.012-.042-.14.018-1.434 1.967-2.18 2.945-1.726 1.845-.414.164-.717-.37.067-.662.401-.589 2.388-3.036 1.44-1.882.93-1.086-.006-.158h-.055L4.132 18.56l-1.13.146-.487-.456.061-.746.231-.243 1.914-1.316-.012.01z',
+    codex: 'M21.55 10.004a5.416 5.416 0 00-.478-4.501c-1.217-2.09-3.662-3.166-6.05-2.66A5.59 5.59 0 0010.831 1C8.39.995 6.224 2.546 5.473 4.838A5.553 5.553 0 001.76 7.496a5.487 5.487 0 00.691 6.5 5.416 5.416 0 00.477 4.502c1.217 2.09 3.662 3.165 6.05 2.66A5.586 5.586 0 0013.168 23c2.443.006 4.61-1.546 5.361-3.84a5.554 5.554 0 003.715-2.66 5.488 5.488 0 00-.693-6.497v.001zm-8.381 11.558a4.199 4.199 0 01-2.675-.954c.034-.018.093-.05.132-.074l4.44-2.53a.71.71 0 00.364-.623v-6.176l1.877 1.069c.02.01.033.029.036.05v5.115c-.003 2.274-1.87 4.118-4.174 4.123zM4.192 17.78a4.059 4.059 0 01-.498-2.763c.032.019.09.055.131.078l4.44 2.53c.225.13.504.13.73 0l5.42-3.088v2.138a.068.068 0 01-.027.057L9.9 19.288c-1.999 1.136-4.552.46-5.707-1.51h-.001zM3.023 8.216A4.15 4.15 0 015.198 6.41l-.002.151v5.06a.711.711 0 00.364.624l5.42 3.087-1.876 1.07a.067.067 0 01-.063.005l-4.489-2.559c-1.995-1.14-2.679-3.658-1.53-5.63h.001zm15.417 3.54l-5.42-3.088L14.896 7.6a.067.067 0 01.063-.006l4.489 2.557c1.998 1.14 2.683 3.662 1.529 5.633a4.163 4.163 0 01-2.174 1.807V12.38a.71.71 0 00-.363-.623zm1.867-2.773a6.04 6.04 0 00-.132-.078l-4.44-2.53a.731.731 0 00-.729 0l-5.42 3.088V7.325a.068.068 0 01.027-.057L14.1 4.713c2-1.137 4.555-.46 5.707 1.513.487.833.664 1.809.499 2.757h.001zm-11.741 3.81l-1.877-1.068a.065.065 0 01-.036-.051V6.559c.001-2.277 1.873-4.122 4.181-4.12.976 0 1.92.338 2.671.954-.034.018-.092.05-.131.073l-4.44 2.53a.71.71 0 00-.365.623l-.003 6.173v.001zm1.02-2.168L12 9.25l2.414 1.375v2.75L12 14.75l-2.415-1.375v-2.75z'
+};

package/src/agents/status-look.ts

@@ -0,0 +1,43 @@
+import { CircleCheck, CircleSlash, CircleX, Hourglass, LoaderCircle, type LucideIcon } from 'lucide-react';
+
+/* The states a piece of work settles into, wherever it is drawn. */
+export type StatusWord = 'running' | 'paused' | 'done' | 'failed' | 'cancelled';
+
+export interface StatusLook {
+    icon: LucideIcon;
+    tone: string;
+    spins: boolean;
+}
+
+/*
+ * One state, one mark: an entry in the sub-agent flyout, a task on its node (`TaskMark`), what finished
+ * in the toolbar (`StatusSummary`) and work in progress in a toast. A spinner stops under reduced
+ * motion with every other animation (`styles.css`).
+ */
+const LOOKS: Record<StatusWord, StatusLook> = {
+    running: { icon: LoaderCircle, tone: 'text-status-running', spins: true },
+    // The hourglass of a chat that stopped on a limit, since that is what holds the work up.
+    paused: { icon: Hourglass, tone: 'text-text-faint', spins: false },
+    done: { icon: CircleCheck, tone: 'text-status-idle', spins: false },
+    failed: { icon: CircleX, tone: 'text-status-error', spins: false },
+    cancelled: { icon: CircleSlash, tone: 'text-text-faint', spins: false }
+};
+
+export function statusLookOf(word: StatusWord): StatusLook {
+    return LOOKS[word];
+}
+
+/* A task as far as its look goes, for an app that hands work to agents as tasks. */
+export interface TaskState {
+    status: 'open' | 'done' | 'failed' | 'cancelled';
+    /* Set while the child waits out a limit. */
+    paused?: object;
+}
+
+/* A task calls its running state `open`, which is the host's word for it and not a person's; an open task whose child stopped on a limit is paused. */
+export function taskStatusWord(task: TaskState): StatusWord {
+    if (task.status !== 'open') {
+        return task.status;
+    }
+    return task.paused === undefined ? 'running' : 'paused';
+}

package/src/chat/account-choice.ts

@@ -0,0 +1,44 @@
+import { useMemo } from 'react';
+import type { AgentKind, ProviderAccounts } from '@adecore/agent-contracts';
+import { accountName, accountsOfKind, hasAccountChoice, offeredAccounts, type AccountEntry } from '../agents/accounts';
+import { useProviderAccounts } from '../state/provider-accounts';
+import { useProviders } from '../state/providers';
+
+export interface AccountChoice {
+    accounts: ProviderAccounts;
+    /* The accounts a person may pick for this CLI: those that are on, and the one in use. */
+    offered: AccountEntry[];
+    /* The account the chat runs under, by id; the CLI's kind for its default account. */
+    currentId: string;
+    /* Null for an account the machine no longer has. */
+    current: AccountEntry | null;
+    providerName: string;
+    nameOf(entry: AccountEntry): string;
+}
+
+/*
+ * The accounts of a chat's CLI on the machine in scope and the one the chat runs under, or null while
+ * the CLI has fewer than two accounts that are on: with one there is nothing to choose or tell apart.
+ */
+export function useAccountChoice(kind: AgentKind | null, account: string | undefined): AccountChoice | null {
+    const accounts = useProviderAccounts((row) => row.accounts);
+    const providerName = useProviders((row) => row.providers.find((entry) => entry.kind === kind)?.name) ?? kind ?? '';
+    return useMemo(() => {
+        if (kind === null || accounts === null) {
+            return null;
+        }
+        const entries = accountsOfKind(accounts, kind);
+        if (!hasAccountChoice(entries)) {
+            return null;
+        }
+        const currentId = account ?? kind;
+        return {
+            accounts,
+            offered: offeredAccounts(entries, currentId),
+            currentId,
+            current: entries.find((entry) => entry.id === currentId) ?? null,
+            providerName,
+            nameOf: (entry: AccountEntry) => accountName(entry, providerName)
+        };
+    }, [accounts, kind, account, providerName]);
+}

package/src/chat/actions.ts

@@ -0,0 +1,72 @@
+import i18next from 'i18next';
+import { chatHost, type ChatActions } from '../host';
+import { useChatScope, type ChatScope } from '../scope';
+import { ChatTransportError, type ChatTransport } from '../transport';
+
+/* Every action as the request a chat host answers, for an app that runs them through nothing of its own. */
+export function transportActions(transport: ChatTransport): ChatActions {
+    return {
+        clear: async (chatId, force) => {
+            await transport.request('chat.clear', { chatId, ...(force ? { force: true } : {}) });
+        },
+        stopTurn: async (chatId, subagents) => {
+            await transport.request('chat.cancel', { chatId, ...(subagents ? { subagents: true } : {}) });
+        },
+        unqueue: async (chatId, messageId) => {
+            const { message } = await transport.request('chat.unqueue', { chatId, messageId });
+            // A host answers without the message once it went out, which is what the composer tells a person.
+            if (message === undefined) {
+                throw new ChatTransportError('request-not-found', i18next.t('agent-chat:composer.queue.alreadySent'));
+            }
+        },
+        sendNow: async (chatId, messageId) => {
+            await transport.request('chat.sendNow', { chatId, messageId });
+        },
+        compact: async (chatId) => {
+            await transport.request('chat.compact', { chatId });
+        },
+        configure: async (chatId, patch) => {
+            await transport.request('chat.configure', { chatId, ...patch });
+        },
+        continueOn: async (chatId, account) => {
+            await transport.request('chat.continueOn', { chatId, account });
+        },
+        turnDiff: async (chatId, turnId) => (await transport.request('chat.turnDiff', { chatId, turnId })).diff,
+        stopSubagent: async (chatId, toolUseId) => {
+            await transport.request('chat.stopSubagent', { chatId, toolUseId });
+        },
+        stopTask: async (chatId, taskId) => {
+            await transport.request('chat.stopTask', { chatId, taskId });
+        },
+        approve: async (chatId, requestId, decision, message) => {
+            await transport.request('chat.approve', { chatId, requestId, decision, ...(message === undefined ? {} : { message }) });
+        },
+        answer: async (chatId, requestId, answers) => {
+            await transport.request('chat.answer', { chatId, requestId, answers });
+        },
+        dismiss: async (chatId, itemId) => {
+            await transport.request('chat.dismiss', { chatId, itemId });
+        }
+    };
+}
+
+const byTransport = new WeakMap<ChatTransport, ChatActions>();
+
+/* The app's own actions when it has them, and the requests of this scope's host otherwise. */
+export function actionsOf(scope: ChatScope): ChatActions {
+    const own = chatHost().actions;
+    if (own !== null) {
+        return own;
+    }
+    const { transport } = scope;
+    let actions = byTransport.get(transport);
+    if (actions === undefined) {
+        actions = transportActions(transport);
+        byTransport.set(transport, actions);
+    }
+    return actions;
+}
+
+export function useChatActions(): ChatActions {
+    return actionsOf(useChatScope());
+}

package/src/chat/activity.ts

@@ -0,0 +1,8 @@
+import type { ChatBackgroundTask } from '@adecore/agent-contracts';
+
+export function backgroundCounts(tasks: readonly ChatBackgroundTask[]): { shells: number; monitors: number } {
+    return {
+        shells: tasks.filter((task) => task.kind === 'shell').length,
+        monitors: tasks.filter((task) => task.kind === 'monitor').length
+    };
+}