@ruimte/agents-react 0.0.0 → 0.7.0

package/dist/providers/provider-abilities.js

@@ -0,0 +1,7 @@
+import i18next from 'i18next';
+/* What a provider offers, in one sentence, where it can be opened and whether its hooks report status. */
+export const providerAbilities = (provider) => {
+    const where = provider.capabilities.chat ? i18next.t('agent-providers:abilities.chatAndTerminal') : i18next.t('agent-providers:abilities.terminalOnly');
+    const status = provider.capabilities.hooks ? i18next.t('agent-providers:abilities.reportsStatus') : i18next.t('agent-providers:abilities.noStatus');
+    return `${where} ${status}`;
+};

package/dist/providers/variables.d.ts

@@ -0,0 +1,13 @@
+import type { ProviderAccountVariable } from '@ruimte/agent-contracts';
+export interface VariableDraft {
+    key: string;
+    name: string;
+    value: string;
+    sensitive: boolean;
+    kept: string | null;
+}
+export declare const draftsOf: (env: readonly ProviderAccountVariable[] | undefined) => VariableDraft[];
+export declare const emptyDraft: (sensitive: boolean) => VariableDraft;
+export declare const variablesProblem: (drafts: readonly VariableDraft[]) => string | null;
+export declare const variablesOf: (drafts: readonly VariableDraft[]) => ProviderAccountVariable[];
+export declare const variablesChanged: (drafts: readonly VariableDraft[], env: readonly ProviderAccountVariable[] | undefined) => boolean;

package/dist/providers/variables.js

@@ -0,0 +1,53 @@
+import i18next from 'i18next';
+const NAME = /^[A-Za-z_][A-Za-z0-9_]{0,127}$/;
+let drafted = 0;
+const nextKey = () => {
+    drafted += 1;
+    return `variable-${drafted}`;
+};
+export const draftsOf = (env) => (env ?? []).map((variable) => ({
+    key: nextKey(),
+    name: variable.name,
+    value: variable.value,
+    sensitive: variable.sensitive,
+    kept: variable.sensitive && variable.valueRedacted === true ? variable.name : null
+}));
+export const emptyDraft = (sensitive) => ({ key: nextKey(), name: '', value: '', sensitive, kept: null });
+/*
+ * A value the keychain holds only counts under the name it was kept under, and only while it stays
+ * sensitive: the machine finds it by that name, and never hands it out to be stored in plain text.
+ */
+const keepsValue = (draft) => draft.value === '' && draft.sensitive && draft.kept === draft.name;
+/* The first thing that keeps these from being saved, in a sentence; null when they can be. */
+export const variablesProblem = (drafts) => {
+    const words = (key, name) => i18next.t(`agent-providers:account.variables.problem.${key}`, { name });
+    const seen = new Set();
+    for (const draft of drafts) {
+        const name = draft.name.trim();
+        if (name === '') {
+            return words('noName', '');
+        }
+        if (!NAME.test(name)) {
+            return words('invalidName', name);
+        }
+        if (seen.has(name)) {
+            return words('duplicate', name);
+        }
+        seen.add(name);
+        if (draft.value === '' && !keepsValue({ ...draft, name })) {
+            return words('noValue', name);
+        }
+    }
+    return null;
+};
+/* The variables as `accounts.save` takes them; a kept value goes back empty and redacted, so the machine keeps what it has. */
+export const variablesOf = (drafts) => drafts.map((draft) => {
+    const name = draft.name.trim();
+    if (keepsValue({ ...draft, name })) {
+        return { name, value: '', sensitive: true, valueRedacted: true };
+    }
+    return { name, value: draft.value, sensitive: draft.sensitive };
+});
+/* Whether the drafts say something other than what the machine holds. */
+export const variablesChanged = (drafts, env) => JSON.stringify(variablesOf(drafts)) !==
+    JSON.stringify((env ?? []).map(({ name, value, sensitive, valueRedacted }) => ({ name, value, sensitive, ...(valueRedacted ? { valueRedacted } : {}) })));

package/dist/scope.d.ts

@@ -0,0 +1,11 @@
+import type { ChatClient } from './chat/chat-client';
+import type { ChatTransport } from './transport';
+export interface ChatScope {
+    readonly id: string;
+    keyOf(chatId: string): string;
+    owns(key: string): boolean;
+    readonly transport: ChatTransport;
+    readonly chats: ChatClient;
+}
+export declare const ChatScopeContext: import("react").Context<ChatScope | null>;
+export declare const useChatScope: () => ChatScope;

package/dist/scope.js

@@ -0,0 +1,10 @@
+import { createContext, useContext } from 'react';
+export const ChatScopeContext = createContext(null);
+/* Throws outside a scope on purpose: a component that reads a chat has to know which host it runs on. */
+export const useChatScope = () => {
+    const scope = useContext(ChatScopeContext);
+    if (scope === null) {
+        throw new Error('This component reads a chat, so it has to be rendered inside a ChatScopeContext');
+    }
+    return scope;
+};

package/dist/settings/sections.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentType } from 'react';
+import { type LucideIcon } from 'lucide-react';
+import type { SettingsSectionEntry } from '@ruimte/ui/settings/SettingsDialog';
+export interface AgentsSettingsSection {
+    id: string;
+    icon: LucideIcon;
+    split?: boolean;
+    label(): string;
+    description(): string;
+}
+export declare const PROVIDERS_SECTION: AgentsSettingsSection;
+export declare const USAGE_SECTION: AgentsSettingsSection;
+export declare const settingsSection: (section: AgentsSettingsSection, pane: ComponentType) => SettingsSectionEntry;

package/dist/settings/sections.js

@@ -0,0 +1,30 @@
+import i18next from 'i18next';
+import { Brain, ChartNoAxesColumn } from 'lucide-react';
+/* The agent CLIs of the host and the accounts they sign in with: `ProvidersPane`. */
+export const PROVIDERS_SECTION = {
+    id: 'providers',
+    icon: Brain,
+    split: true,
+    label: () => i18next.t('agent-providers:section.label'),
+    description: () => i18next.t('agent-providers:section.description')
+};
+/* The currency of the usage page and the way to it: `UsagePane`. */
+export const USAGE_SECTION = {
+    id: 'usage',
+    icon: ChartNoAxesColumn,
+    label: () => i18next.t('agent-usage:section.label'),
+    description: () => i18next.t('agent-usage:section.description')
+};
+/*
+ * The entry the dialog takes for a section, with the pane the app hands it: the pane of this package
+ * itself, a lazy one, or a wrapper that gives the pane what only the app knows. Built when the dialog
+ * draws, since the words follow the language.
+ */
+export const settingsSection = (section, pane) => ({
+    id: section.id,
+    icon: section.icon,
+    label: section.label(),
+    description: section.description(),
+    pane,
+    split: section.split
+});

package/dist/state/chats.d.ts

@@ -0,0 +1,32 @@
+import type { ChatBookmark, ChatEvent, ChatInfo, ChatItem } from '@ruimte/agent-contracts';
+export interface ChatState {
+    info: ChatInfo;
+    items: Record<string, ChatItem>;
+    structure: Record<string, ChatItem>;
+    order: string[];
+    bookmarks?: ChatBookmark[];
+}
+export type ChatsById = Record<string, ChatState>;
+export type ChatStatuses = Record<string, Pick<ChatState, 'info'>>;
+export interface ChatSink {
+    reset(chatId: string, info: ChatInfo, items: ChatItem[]): void;
+    apply(chatId: string, event: ChatEvent): void;
+    status(chatId: string, info: ChatInfo): void;
+    bookmarks(chatId: string, bookmarks: ChatBookmark[]): void;
+    forget(chatId: string): void;
+}
+interface ChatsStore {
+    byKey: ChatsById;
+    statusByKey: ChatStatuses;
+    reset(key: string, info: ChatInfo, items: ChatItem[]): void;
+    apply(key: string, event: ChatEvent): void;
+    status(key: string, info: ChatInfo): void;
+    bookmarks(key: string, bookmarks: ChatBookmark[]): void;
+    forget(key: string): void;
+    forgetWhere(matches: (key: string) => boolean): void;
+}
+export declare const applyEvent: (state: ChatState, event: ChatEvent) => ChatState;
+export declare const useChats: import("zustand").UseBoundStore<import("zustand").StoreApi<ChatsStore>>;
+export declare const chatSink: (keyOf: (chatId: string) => string) => ChatSink;
+export declare const useChatRow: <T>(chatId: string, select: (row: ChatState | undefined) => T) => T;
+export {};

package/dist/state/chats.js

@@ -0,0 +1,124 @@
+import { create } from 'zustand';
+import { useChatScope } from '../scope';
+const stateOf = (info, items) => {
+    const byId = Object.fromEntries(items.map((item) => [item.id, item]));
+    return { info, items: byId, structure: byId, order: items.map((item) => item.id) };
+};
+/* The state with one item replaced, in the thread and in the structure the rows come from. */
+const withItem = (state, item) => {
+    const items = { ...state.items, [item.id]: item };
+    return { ...state, items, structure: items };
+};
+/* Cheap enough, since a status only arrives when the host saw one change, never on a streamed word. */
+const sameInfo = (left, right) => JSON.stringify(left) === JSON.stringify(right);
+/* The statuses with this chat's info in them, the same object when that info is already there. */
+const withStatus = (statuses, key, info) => statuses[key]?.info === info ? statuses : { ...statuses, [key]: { info } };
+const without = (rows, matches) => Object.fromEntries(Object.entries(rows).filter(([key]) => !matches(key)));
+export const applyEvent = (state, event) => {
+    switch (event.type) {
+        case 'item': {
+            const known = event.item.id in state.items;
+            return { ...withItem(state, event.item), order: known ? state.order : [...state.order, event.item.id] };
+        }
+        case 'delta': {
+            const item = state.items[event.itemId];
+            if (item?.kind === 'assistant' || item?.kind === 'thinking') {
+                const grown = { ...item, text: item.text + event.text };
+                // The first text is structure after all, since an empty reply that is not streaming has no row.
+                // A sub-agent's text is drawn from inside its parent's row, which only the rows carry.
+                if (item.text === '' || (item.kind === 'assistant' && item.parentToolUseId)) {
+                    return withItem(state, grown);
+                }
+                return { ...state, items: { ...state.items, [event.itemId]: grown } };
+            }
+            if (item?.kind === 'tool' && item.state === 'running') {
+                const progress = item.progress ?? { startedAt: null, description: null, output: null };
+                return withItem(state, { ...item, progress: { ...progress, output: (progress.output ?? '') + event.text } });
+            }
+            return state;
+        }
+        case 'info':
+            return { ...state, info: event.info };
+        case 'reset':
+            return stateOf(event.info, event.items);
+    }
+};
+export const useChats = create((set) => ({
+    byKey: {},
+    statusByKey: {},
+    reset(key, info, items) {
+        set((s) => {
+            // The bookmarks are not part of the thread; they come in on their own and outlive a reset of it.
+            const bookmarks = s.byKey[key]?.bookmarks;
+            return {
+                byKey: {
+                    ...s.byKey,
+                    [key]: bookmarks === undefined ? stateOf(info, items) : { ...stateOf(info, items), bookmarks }
+                },
+                statusByKey: withStatus(s.statusByKey, key, info)
+            };
+        });
+    },
+    apply(key, event) {
+        set((s) => {
+            const current = s.byKey[key];
+            if (!current) {
+                return {};
+            }
+            const next = applyEvent(current, event);
+            return { byKey: { ...s.byKey, [key]: next }, statusByKey: withStatus(s.statusByKey, key, next.info) };
+        });
+    },
+    /*
+     * The status of a chat this window is not reading, which the host sends for every chat it has
+     * loaded. The thread stays empty until somebody attaches, since this is what a header, a list and
+     * the counters need, and they ask the info and never the items.
+     */
+    status(key, info) {
+        set((s) => {
+            const current = s.byKey[key];
+            if (!current) {
+                return { byKey: { ...s.byKey, [key]: stateOf(info, []) }, statusByKey: withStatus(s.statusByKey, key, info) };
+            }
+            // An attached client already had this on `chat.event`; writing it again would redraw the thread.
+            if (sameInfo(current.info, info)) {
+                return {};
+            }
+            return { byKey: { ...s.byKey, [key]: { ...current, info } }, statusByKey: withStatus(s.statusByKey, key, info) };
+        });
+    },
+    bookmarks(key, bookmarks) {
+        set((s) => {
+            const current = s.byKey[key];
+            if (!current) {
+                return {};
+            }
+            return { byKey: { ...s.byKey, [key]: { ...current, bookmarks } } };
+        });
+    },
+    forget(key) {
+        set((s) => {
+            const next = { ...s.byKey };
+            delete next[key];
+            const statuses = { ...s.statusByKey };
+            delete statuses[key];
+            return { byKey: next, statusByKey: statuses };
+        });
+    },
+    forgetWhere(matches) {
+        set((s) => ({ byKey: without(s.byKey, matches), statusByKey: without(s.statusByKey, matches) }));
+    }
+}));
+/* The sink of one host's chat client: it hands over chat ids, this puts them under the keys of its scope. */
+export const chatSink = (keyOf) => ({
+    reset: (chatId, info, items) => useChats.getState().reset(keyOf(chatId), info, items),
+    apply: (chatId, event) => useChats.getState().apply(keyOf(chatId), event),
+    status: (chatId, info) => useChats.getState().status(keyOf(chatId), info),
+    bookmarks: (chatId, bookmarks) => useChats.getState().bookmarks(keyOf(chatId), bookmarks),
+    forget: (chatId) => useChats.getState().forget(keyOf(chatId))
+});
+/* One chat's thread in the scope this is rendered in. The selector keeps a render tied to the field it reads. */
+export const useChatRow = (chatId, select) => {
+    const { keyOf } = useChatScope();
+    return useChats((s) => select(s.byKey[keyOf(chatId)]));
+};

package/dist/state/provider-accounts.d.ts

@@ -0,0 +1,17 @@
+import type { ProviderAccounts } from '@ruimte/agent-contracts';
+import type { ChatTransport } from '../transport';
+export interface ProviderAccountsRow {
+    accounts: ProviderAccounts | null;
+    loaded: boolean;
+}
+interface ProviderAccountsStore {
+    byScope: Record<string, ProviderAccountsRow>;
+    set(scopeId: string, accounts: ProviderAccounts | null): void;
+    forget(scopeId: string): void;
+}
+export declare const useProviderAccountsStore: import("zustand").UseBoundStore<import("zustand").StoreApi<ProviderAccountsStore>>;
+export declare const useProviderAccounts: <T>(select: (row: ProviderAccountsRow) => T) => T;
+export declare const providerAccountsOf: (scopeId: string) => ProviderAccountsRow;
+export declare const knownAccounts: (row: ProviderAccountsRow) => ProviderAccounts | null | undefined;
+export declare const watchProviderAccounts: (scopeId: string, transport: ChatTransport) => (() => void);
+export {};

package/dist/state/provider-accounts.js

@@ -0,0 +1,63 @@
+import { create } from 'zustand';
+import { useChatScope } from '../scope';
+/* One object for a host that has not answered yet, so a selector gets a stable snapshot. */
+const NONE = { accounts: null, loaded: false };
+/* The accounts of every agent CLI on each host, and what each CLI last said about who is signed in there. */
+export const useProviderAccountsStore = create((set, get) => ({
+    byScope: {},
+    set(scopeId, accounts) {
+        set({ byScope: { ...get().byScope, [scopeId]: { accounts, loaded: true } } });
+    },
+    forget(scopeId) {
+        const { [scopeId]: _gone, ...rest } = get().byScope;
+        set({ byScope: rest });
+    }
+}));
+/* The accounts of the host in scope, like `useProviders`. */
+export const useProviderAccounts = (select) => {
+    const { id } = useChatScope();
+    return useProviderAccountsStore((s) => select(s.byScope[id] ?? NONE));
+};
+export const providerAccountsOf = (scopeId) => useProviderAccountsStore.getState().byScope[scopeId] ?? NONE;
+/* The accounts as `accountFor` takes them: undefined until the host answered, null for one that keeps none. */
+export const knownAccounts = (row) => (row.loaded ? row.accounts : undefined);
+/*
+ * Keeps one host's accounts in the store: the whole list on every fresh link, then every change the
+ * host announces. Answers the function that stops it.
+ */
+export const watchProviderAccounts = (scopeId, transport) => {
+    const store = useProviderAccountsStore.getState();
+    // A list asked for before a change arrived is older than that change, so it is dropped.
+    let changes = 0;
+    const load = () => {
+        const asked = changes;
+        transport
+            .request('accounts.list', {})
+            .then((accounts) => {
+            if (changes === asked) {
+                store.set(scopeId, accounts);
+            }
+        })
+            .catch(() => {
+            // A host from before accounts never answers; it has only each CLI's own login.
+            if (changes === asked && !providerAccountsOf(scopeId).loaded) {
+                store.set(scopeId, null);
+            }
+        });
+    };
+    const off = [
+        transport.on('accounts.changed', (accounts) => {
+            changes += 1;
+            store.set(scopeId, accounts);
+        }),
+        transport.subscribeStatus((status) => {
+            if (status === 'open') {
+                load();
+            }
+        })
+    ];
+    if (transport.status === 'open') {
+        load();
+    }
+    return () => off.forEach((stop) => stop());
+};

package/dist/state/providers.d.ts

@@ -0,0 +1,17 @@
+import type { ProviderInfo } from '@ruimte/agent-contracts';
+export interface ProvidersRow {
+    providers: ProviderInfo[];
+    loaded: boolean;
+}
+interface ProvidersStore {
+    byScope: Record<string, ProvidersRow>;
+    setProviders(scopeId: string, providers: ProviderInfo[]): void;
+    forget(scopeId: string): void;
+}
+export declare const useProvidersStore: import("zustand").UseBoundStore<import("zustand").StoreApi<ProvidersStore>>;
+export declare const useProviders: <T>(select: (row: ProvidersRow) => T) => T;
+export declare const providersOf: (scopeId: string) => ProvidersRow;
+export declare const providerSinkFor: (scopeId: string) => {
+    setProviders(providers: ProviderInfo[]): void;
+};
+export {};

package/dist/state/providers.js

@@ -0,0 +1,29 @@
+import { create } from 'zustand';
+import { useChatScope } from '../scope';
+/* One object for a host that has not answered yet, so a selector gets a stable snapshot. */
+const NONE = { providers: [], loaded: false };
+/* Which agent CLIs each host reports, and their models; filled once per connection. */
+export const useProvidersStore = create((set, get) => ({
+    byScope: {},
+    setProviders(scopeId, providers) {
+        set({ byScope: { ...get().byScope, [scopeId]: { providers, loaded: true } } });
+    },
+    forget(scopeId) {
+        const { [scopeId]: _gone, ...rest } = get().byScope;
+        set({ byScope: rest });
+    }
+}));
+/*
+ * The CLIs of the host in scope. An agent menu has to offer what the host the chat will run on has
+ * installed, never what another host answered.
+ */
+export const useProviders = (select) => {
+    const { id } = useChatScope();
+    return useProvidersStore((s) => select(s.byScope[id] ?? NONE));
+};
+/* The same answer outside a render. */
+export const providersOf = (scopeId) => useProvidersStore.getState().byScope[scopeId] ?? NONE;
+/* What one host's chat client fills in; it knows its own host and nothing of the others. */
+export const providerSinkFor = (scopeId) => ({
+    setProviders: (providers) => useProvidersStore.getState().setProviders(scopeId, providers)
+});

package/dist/state/usage.d.ts

@@ -0,0 +1,41 @@
+import type { UsageLimitsSnapshot, UsageSummaryPayload, UsageSummaryResult } from '@ruimte/agent-contracts';
+import type { UsageCurrency } from '../usage/format';
+export type UsagePeriod = 'today' | '7d' | '30d' | '90d';
+export type UsageMetric = 'cost' | 'tokens';
+export declare const USAGE_PERIODS: readonly {
+    id: UsagePeriod;
+    days: number;
+}[];
+interface Preferences {
+    period: UsagePeriod;
+    metric: UsageMetric;
+    currency: UsageCurrency;
+}
+export declare const dayOf: (date: Date) => string;
+export declare const windowFor: (period: UsagePeriod, now?: Date) => UsageSummaryPayload;
+export declare const summaryPayload: (period: UsagePeriod, account: string | null, now?: Date) => UsageSummaryPayload;
+export declare const askedKey: (payload: UsageSummaryPayload) => string;
+interface UsageRow {
+    asked: string | null;
+    summary: UsageSummaryResult | null;
+    loading: boolean;
+    failed: boolean;
+    limits: UsageLimitsSnapshot | null;
+}
+interface UsageStore extends Preferences {
+    byScope: Record<string, UsageRow>;
+    chosen: string | null;
+    choose(scopeId: string | null): void;
+    setPeriod(period: UsagePeriod): void;
+    setMetric(metric: UsageMetric): void;
+    setCurrency(currency: UsageCurrency): void;
+    setLoading(scopeId: string, loading: boolean): void;
+    receive(scopeId: string, asked: string, summary: UsageSummaryResult): void;
+    fail(scopeId: string): void;
+    setLimits(scopeId: string, limits: UsageLimitsSnapshot): void;
+    forget(scopeId: string): void;
+}
+export declare const useUsageStore: import("zustand").UseBoundStore<import("zustand").StoreApi<UsageStore>>;
+export type UsageView = Preferences & UsageRow;
+export declare const useUsage: <T>(select: (view: UsageView) => T) => T;
+export {};

package/dist/state/usage.js

@@ -0,0 +1,100 @@
+import { create } from 'zustand';
+import { localTimeZone } from '@ruimte/ui/format/time-zone';
+import { useChatScope } from '../scope';
+/* Only the id and the length. A store has no words, so the page names a period in its own language. */
+export const USAGE_PERIODS = [
+    { id: 'today', days: 1 },
+    { id: '7d', days: 7 },
+    { id: '30d', days: 30 },
+    { id: '90d', days: 90 }
+];
+const STORAGE_KEY = 'ruimte.usage';
+const DEFAULTS = { period: '7d', metric: 'cost', currency: 'USD' };
+const readPreferences = () => {
+    try {
+        const stored = JSON.parse(localStorage.getItem(STORAGE_KEY) ?? '{}');
+        return {
+            period: USAGE_PERIODS.some((period) => period.id === stored.period) ? stored.period : DEFAULTS.period,
+            metric: stored.metric === 'tokens' || stored.metric === 'cost' ? stored.metric : DEFAULTS.metric,
+            currency: stored.currency === 'EUR' ? 'EUR' : DEFAULTS.currency
+        };
+    }
+    catch {
+        return DEFAULTS;
+    }
+};
+const persist = (preferences) => {
+    try {
+        localStorage.setItem(STORAGE_KEY, JSON.stringify(preferences));
+    }
+    catch {
+        // Storage that refuses keeps the choice for this session only.
+    }
+};
+/* The three stored choices out of the store, so a setter writes the other two back unchanged. */
+const chosen = (state) => ({ period: state.period, metric: state.metric, currency: state.currency });
+const pad = (value) => String(value).padStart(2, '0');
+/* The viewer's own calendar day; the host may stand in another zone and buckets in this one. */
+export const dayOf = (date) => `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+/*
+ * What a period asks for. Today counts from local midnight in hours, the way the commit log already
+ * groups days, so every other period reads as one bar per calendar day.
+ */
+export const windowFor = (period, now = new Date()) => {
+    const days = USAGE_PERIODS.find((entry) => entry.id === period)?.days ?? 7;
+    const from = new Date(now.getFullYear(), now.getMonth(), now.getDate() - (days - 1));
+    return {
+        from: dayOf(from),
+        to: dayOf(now),
+        resolution: period === 'today' ? 'hour' : 'day',
+        timeZone: localTimeZone() ?? 'UTC'
+    };
+};
+/* A period, and only the usage of one account when one is picked; null is every account. */
+export const summaryPayload = (period, account, now = new Date()) => account === null ? windowFor(period, now) : { ...windowFor(period, now), accounts: [account] };
+/* What was asked, so an answer to the question before this one is never drawn over a newer one. */
+export const askedKey = (payload) => `${payload.from}\0${payload.to}\0${payload.resolution}\0${payload.timeZone}\0${payload.accounts?.join(',') ?? ''}`;
+/* One object for a host nothing was read from yet, so a selector gets a stable snapshot. */
+const EMPTY = { asked: null, summary: null, loading: false, failed: false, limits: null };
+export const useUsageStore = create((set, get) => ({
+    ...readPreferences(),
+    byScope: {},
+    chosen: null,
+    choose(scopeId) {
+        set({ chosen: scopeId });
+    },
+    setPeriod(period) {
+        persist({ ...chosen(get()), period });
+        set({ period });
+    },
+    setMetric(metric) {
+        persist({ ...chosen(get()), metric });
+        set({ metric });
+    },
+    setCurrency(currency) {
+        persist({ ...chosen(get()), currency });
+        set({ currency });
+    },
+    setLoading(scopeId, loading) {
+        set({ byScope: { ...get().byScope, [scopeId]: { ...(get().byScope[scopeId] ?? EMPTY), loading } } });
+    },
+    receive(scopeId, asked, summary) {
+        set({
+            byScope: { ...get().byScope, [scopeId]: { ...(get().byScope[scopeId] ?? EMPTY), asked, summary, loading: false, failed: false } }
+        });
+    },
+    fail(scopeId) {
+        set({ byScope: { ...get().byScope, [scopeId]: { ...(get().byScope[scopeId] ?? EMPTY), loading: false, failed: true } } });
+    },
+    setLimits(scopeId, limits) {
+        set({ byScope: { ...get().byScope, [scopeId]: { ...(get().byScope[scopeId] ?? EMPTY), limits } } });
+    },
+    forget(scopeId) {
+        const { [scopeId]: _gone, ...rest } = get().byScope;
+        set({ byScope: rest });
+    }
+}));
+export const useUsage = (select) => {
+    const { id } = useChatScope();
+    return useUsageStore((s) => select({ period: s.period, metric: s.metric, currency: s.currency, ...(s.byScope[id] ?? EMPTY) }));
+};