@adecore/agents-react 0.31.11 → 0.31.12

package/dist/chat/ui/rows/WorkRows.js

@@ -11,7 +11,7 @@ import { useChatHost } from '../../../host.js';
 import { lazyNamed } from '../../../lazy.js';
 import { useChatActions } from '../../actions.js';
 import { ChatScopeContext, useChatScope } from '../../../scope.js';
-import { useCurrentItem } from '../../../state/chats.js';
+import { useAwaitsApproval, useCurrentItem } from '../../../state/chats.js';
 import { useTimelineFlash } from '../../timeline-flash.js';
 import { formatClockDuration, formatElapsedShort } from '@adecore/ui/format';
 import { Icon, LazyBoundary, MiddleTruncate, Spinner, useTickingText } from '@adecore/ui';
@@ -147,7 +147,9 @@ export function WorkLiveRow({ chatId, tool: derived }) {
     const shell = shellCommand(tool.name, tool.input);
     const { commandLooks } = useChatHost();
     const run = shell === null ? null : matchCommandLook(shell, commandLooks);
-    return (_jsxs("div", { children: [_jsx(ToggleLine, { icon: run === null ? toolIcon(tool.name) : _jsx(run.look.Mark, { size: 12 }), label: run === null ? tool.name : run.match.label, brand: run?.look.brand, look: run === null ? undefined : { run, chatId }, detail: summary || tool.progress?.description || '', command: summary !== '' && summary === shellCommand(tool.name, tool.input), path: summary !== '' && toolSummaryIsPath(tool.name, tool.input), open: open && opens, onToggle: opens ? () => setOpen((o) => !o) : undefined, trailing: _jsx(RunningFor, { startedAt: toolStartedAt(tool) }), live: true }), open && opens && _jsx(ToolBody, { tool: tool }), tail !== null && !open && (_jsx("pre", { className: "mt-1.5 mb-2 ml-6 max-h-48 overflow-auto rounded-md border border-border bg-surface-raised px-3 py-2 font-mono text-code whitespace-pre-wrap text-chat-output select-text", children: _jsx(AnsiOutput, { text: tail, tailLines: 12 }) }))] }));
+    const awaiting = useAwaitsApproval(chatId, tool.toolUseId);
+    const { t } = useTranslation('agent-chat');
+    return (_jsxs("div", { children: [_jsx(ToggleLine, { icon: run === null ? toolIcon(tool.name) : _jsx(run.look.Mark, { size: 12 }), label: run === null ? tool.name : run.match.label, brand: run?.look.brand, look: run === null ? undefined : { run, chatId }, detail: summary || tool.progress?.description || '', command: summary !== '' && summary === shellCommand(tool.name, tool.input), path: summary !== '' && toolSummaryIsPath(tool.name, tool.input), open: open && opens, onToggle: opens ? () => setOpen((o) => !o) : undefined, trailing: awaiting ? (_jsx("span", { className: "shrink-0 text-xs text-text-faint", children: t('work.awaitingApproval') })) : (_jsx(RunningFor, { startedAt: toolStartedAt(tool) })), live: true }), open && opens && _jsx(ToolBody, { tool: tool }), tail !== null && !open && (_jsx("pre", { className: "mt-1.5 mb-2 ml-6 max-h-48 overflow-auto rounded-md border border-border bg-surface-raised px-3 py-2 font-mono text-code whitespace-pre-wrap text-chat-output select-text", children: _jsx(AnsiOutput, { text: tail, tailLines: 12 }) }))] }));
 }
 /* A run of tool calls as one line ("Read 4 files"); opening it lists every call. A run of one look wears its mark and its brand. */
 export function WorkGroupRow({ tools, summary, look, expanded, onToggle }) {

package/dist/locales/en/agent-chat.d.ts

@@ -183,6 +183,7 @@ declare const _default: {
         loadingDiff: string;
         diffUnavailable: string;
         runningFor: string;
+        awaitingApproval: string;
         forksAfter_one: string;
         forksAfter_other: string;
         omitted: {

package/dist/locales/en/agent-chat.js

@@ -183,6 +183,7 @@ export default {
         loadingDiff: 'Loading diff',
         diffUnavailable: 'Could not load this diff',
         runningFor: 'running for {{elapsed}}',
+        awaitingApproval: 'waiting for you',
         forksAfter_one: 'A fork goes on after this turn',
         forksAfter_other: '{{count}} forks go on after this turn',
         omitted: {

package/dist/locales/nl/agent-chat.d.ts

@@ -183,6 +183,7 @@ declare const _default: {
         loadingDiff: string;
         diffUnavailable: string;
         runningFor: string;
+        awaitingApproval: string;
         forksAfter_one: string;
         forksAfter_other: string;
         omitted: {

package/dist/locales/nl/agent-chat.js

@@ -183,6 +183,7 @@ export default {
         loadingDiff: 'Diff laden',
         diffUnavailable: 'Deze diff kon niet worden geladen',
         runningFor: 'loopt al {{elapsed}}',
+        awaitingApproval: 'wacht op jou',
         forksAfter_one: 'Een fork gaat verder na deze turn',
         forksAfter_other: '{{count}} forks gaan verder na deze turn',
         omitted: {

package/dist/prompts/ui/ApprovalBody.js

@@ -22,7 +22,9 @@ function ApprovalDetails({ item }) {
     const editorPreview = host.code.editor !== undefined;
     const maxHeight = expanded ? 480 : 176;
     const input = typeof item.input === 'object' && item.input !== null ? item.input : {};
-    return (_jsxs(_Fragment, { children: [item.description && _jsx("p", { className: "text-sm text-text-muted", children: item.description }), patches.length + edits.length > 1 && (_jsx("p", { className: "text-xs text-text-muted", children: t('approval.allChanges', { count: patches.length + edits.length }) })), patches.length + edits.length > 0 ? (_jsxs("div", { className: "overflow-hidden rounded-xl bg-surface-sunken", children: [_jsx("div", { className: clsx(editorPreview ? 'overflow-hidden' : 'overflow-auto', !editorPreview && !expanded && 'max-h-44'), children: _jsx(ApprovalReview, { entries: entries, maxHeight: maxHeight }, item.requestId) }), _jsx("div", { className: "flex items-center border-t border-border p-1", children: _jsx(Button, { size: "sm", "aria-expanded": expanded, onClick: () => setExpanded(!expanded), children: expanded ? t('approval.collapseDiff') : t('approval.viewDiff') }) })] })) : typeof input.command === 'string' ? (_jsx(CommandBox, { command: input.command, cwd: typeof input.cwd === 'string' ? input.cwd : undefined })) : (_jsxs("details", { children: [_jsx("summary", { className: "flex h-7 cursor-pointer items-center text-xs text-text-muted", children: t('approval.details') }), _jsx(TextMenu, { children: _jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre-wrap break-words rounded-xl bg-surface-sunken p-3 font-mono text-code text-text select-text", children: JSON.stringify(item.input, null, 2) }) })] }))] }));
+    // Some agents describe a command by the command itself, which the box under it already shows.
+    const describes = item.description && item.description.trim() !== (typeof input.command === 'string' ? input.command.trim() : null);
+    return (_jsxs(_Fragment, { children: [describes && _jsx("p", { className: "text-sm text-text-muted", children: item.description }), patches.length + edits.length > 1 && (_jsx("p", { className: "text-xs text-text-muted", children: t('approval.allChanges', { count: patches.length + edits.length }) })), patches.length + edits.length > 0 ? (_jsxs("div", { className: "overflow-hidden rounded-xl bg-surface-sunken", children: [_jsx("div", { className: clsx(editorPreview ? 'overflow-hidden' : 'overflow-auto', !editorPreview && !expanded && 'max-h-44'), children: _jsx(ApprovalReview, { entries: entries, maxHeight: maxHeight }, item.requestId) }), _jsx("div", { className: "flex items-center border-t border-border p-1", children: _jsx(Button, { size: "sm", "aria-expanded": expanded, onClick: () => setExpanded(!expanded), children: expanded ? t('approval.collapseDiff') : t('approval.viewDiff') }) })] })) : typeof input.command === 'string' ? (_jsx(CommandBox, { command: input.command, cwd: typeof input.cwd === 'string' ? input.cwd : undefined })) : (_jsxs("details", { children: [_jsx("summary", { className: "flex h-7 cursor-pointer items-center text-xs text-text-muted", children: t('approval.details') }), _jsx(TextMenu, { children: _jsx("pre", { className: "max-h-64 overflow-auto whitespace-pre-wrap break-words rounded-xl bg-surface-sunken p-3 font-mono text-code text-text select-text", children: JSON.stringify(item.input, null, 2) }) })] }))] }));
 }
 /* A chat's permission request: the diff, the command or the raw input, and the reason a Deny may carry. */
 export function ApprovalBody({ item, draft, onDraft, denyReason, locked }) {

package/dist/state/chats.d.ts

@@ -46,5 +46,6 @@ export declare const useChats: import("zustand").UseBoundStore<import("zustand")
 export declare function chatSink(keyOf: (chatId: string) => string): ChatSink;
 export declare function useChatRow<T>(chatId: string, select: (row: ChatState | undefined) => T): T;
 export declare function useReportedModels(provider: AgentKind): ReadonlySet<string>;
+export declare function useAwaitsApproval(chatId: string, toolUseId: string): boolean;
 export declare function useCurrentItem<T extends ChatItem>(chatId: string, derived: T): T;
 export {};

package/dist/state/chats.js

@@ -243,6 +243,10 @@ export function useReportedModels(provider) {
     });
     return useMemo(() => new Set(joined === '' ? [] : joined.split('\n')), [joined]);
 }
+/* Whether a call still waits on the person's answer to an approval of it, when its clock is not running yet. */
+export function useAwaitsApproval(chatId, toolUseId) {
+    return useChatRow(chatId, (row) => waitingRequestsOf(row).some((request) => request.kind === 'approval' && request.toolUseId === toolUseId));
+}
 /* The item as the thread holds it now, for a row derived from the structure, which a delta leaves alone. */
 export function useCurrentItem(chatId, derived) {
     return useChatRow(chatId, (row) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/agents-react",
-  "version": "0.31.11",
+  "version": "0.31.12",
   "description": "React agent chat threads, composers, approvals, provider accounts and usage views.",
   "type": "module",
   "exports": {
@@ -67,11 +67,11 @@
     "test:visuals": "bun --config=integration.bunfig.toml --conditions=source test ./src/chat/visual-viewport.integration.test.ts"
   },
   "dependencies": {
-    "@adecore/agent-contracts": "0.31.11",
-    "@adecore/editor": "0.31.11",
-    "@adecore/editor-react": "0.31.11",
-    "@adecore/intelligent-ui": "0.31.11",
-    "@adecore/merge": "0.31.11",
+    "@adecore/agent-contracts": "0.31.12",
+    "@adecore/editor": "0.31.12",
+    "@adecore/editor-react": "0.31.12",
+    "@adecore/intelligent-ui": "0.31.12",
+    "@adecore/merge": "0.31.12",
     "@codemirror/commands": "^6.11.1",
     "@codemirror/language": "^6.12.4",
     "@codemirror/state": "^6.7.6",
@@ -94,14 +94,14 @@
     "zustand": "^5.0.15"
   },
   "peerDependencies": {
-    "@adecore/ui": "^0.31.11",
+    "@adecore/ui": "^0.31.12",
     "i18next": "^26.4.2",
     "react": "^19.3.0",
     "react-dom": "^19.3.0",
     "react-i18next": "^17.0.15"
   },
   "devDependencies": {
-    "@adecore/ui": "0.31.11",
+    "@adecore/ui": "0.31.12",
     "@types/bun": "^1.4.2",
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",

package/src/chat/ui/rows/WorkRows.tsx

@@ -26,7 +26,7 @@ import { useChatHost, type CommandLook } from '../../../host';
 import { lazyNamed } from '../../../lazy';
 import { useChatActions } from '../../actions';
 import { ChatScopeContext, useChatScope } from '../../../scope';
-import { useCurrentItem } from '../../../state/chats';
+import { useAwaitsApproval, useCurrentItem } from '../../../state/chats';
 import { useTimelineFlash } from '../../timeline-flash';
 import { formatClockDuration, formatElapsedShort } from '@adecore/ui/format';
 import { Icon, LazyBoundary, MiddleTruncate, Spinner, useTickingText } from '@adecore/ui';
@@ -378,6 +378,8 @@ export function WorkLiveRow({ chatId, tool: derived }: { chatId: string; tool: C
     const shell = shellCommand(tool.name, tool.input);
     const { commandLooks } = useChatHost();
     const run = shell === null ? null : matchCommandLook(shell, commandLooks);
+    const awaiting = useAwaitsApproval(chatId, tool.toolUseId);
+    const { t } = useTranslation('agent-chat');
     return (
         <div>
             <ToggleLine
@@ -390,7 +392,13 @@ export function WorkLiveRow({ chatId, tool: derived }: { chatId: string; tool: C
                 path={summary !== '' && toolSummaryIsPath(tool.name, tool.input)}
                 open={open && opens}
                 onToggle={opens ? () => setOpen((o) => !o) : undefined}
-                trailing={<RunningFor startedAt={toolStartedAt(tool)} />}
+                trailing={
+                    awaiting ? (
+                        <span className="shrink-0 text-xs text-text-faint">{t('work.awaitingApproval')}</span>
+                    ) : (
+                        <RunningFor startedAt={toolStartedAt(tool)} />
+                    )
+                }
                 live
             />
             {open && opens && <ToolBody tool={tool} />}

package/src/locales/en/agent-chat.ts

@@ -183,6 +183,7 @@ export default {
         loadingDiff: 'Loading diff',
         diffUnavailable: 'Could not load this diff',
         runningFor: 'running for {{elapsed}}',
+        awaitingApproval: 'waiting for you',
         forksAfter_one: 'A fork goes on after this turn',
         forksAfter_other: '{{count}} forks go on after this turn',
         omitted: {

package/src/locales/nl/agent-chat.ts

@@ -183,6 +183,7 @@ export default {
         loadingDiff: 'Diff laden',
         diffUnavailable: 'Deze diff kon niet worden geladen',
         runningFor: 'loopt al {{elapsed}}',
+        awaitingApproval: 'wacht op jou',
         forksAfter_one: 'Een fork gaat verder na deze turn',
         forksAfter_other: '{{count}} forks gaan verder na deze turn',
         omitted: {

package/src/prompts/ui/ApprovalBody.tsx

@@ -30,9 +30,11 @@ function ApprovalDetails({ item }: { item: ChatApprovalItem }) {
     const editorPreview = host.code.editor !== undefined;
     const maxHeight = expanded ? 480 : 176;
     const input = typeof item.input === 'object' && item.input !== null ? (item.input as Record<string, unknown>) : {};
+    // Some agents describe a command by the command itself, which the box under it already shows.
+    const describes = item.description && item.description.trim() !== (typeof input.command === 'string' ? input.command.trim() : null);
     return (
         <>
-            {item.description && <p className="text-sm text-text-muted">{item.description}</p>}
+            {describes && <p className="text-sm text-text-muted">{item.description}</p>}
             {patches.length + edits.length > 1 && (
                 <p className="text-xs text-text-muted">{t('approval.allChanges', { count: patches.length + edits.length })}</p>
             )}

package/src/state/chats.ts

@@ -347,6 +347,11 @@ export function useReportedModels(provider: AgentKind): ReadonlySet<string> {
     return useMemo(() => new Set(joined === '' ? [] : joined.split('\n')), [joined]);
 }
 
+/* Whether a call still waits on the person's answer to an approval of it, when its clock is not running yet. */
+export function useAwaitsApproval(chatId: string, toolUseId: string): boolean {
+    return useChatRow(chatId, (row) => waitingRequestsOf(row).some((request) => request.kind === 'approval' && request.toolUseId === toolUseId));
+}
+
 /* The item as the thread holds it now, for a row derived from the structure, which a delta leaves alone. */
 export function useCurrentItem<T extends ChatItem>(chatId: string, derived: T): T {
     return useChatRow(chatId, (row) => {