@adecore/agents-react 0.24.1 → 0.25.0

package/src/chat/ui/composer/use-composer-submit.ts

@@ -1,17 +1,20 @@
 import { useEffect, useRef, type RefObject } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useChatHost } from '../../../host';
 import { useChatScope } from '../../../scope';
 import { checkAttachmentLimits, uploadBytes } from '../../attachments';
 import type { ChatSendExtras } from '../../chat-client';
 import { registerComposerSender, type ComposerSend } from '../../composer-send';
 import { isEmptyDraft } from '../../drafts';
+import { CONTINUE_PROMPT } from '../../logic/continue-after-stop';
 import type { PromptGuard } from '../../guards';
 import { presentMentions, presentSkills } from '../../mentions';
 import { withQuote } from '../../quote';
-import { stashDraft, useStash, type StashedPrompt } from '../../stash';
+import { restorableChats, stashDraft, useStash, type StashedPrompt } from '../../stash';
 import { scrollTimelineToEnd } from '../../timeline-scroll';
 import type { ComposerInputHandle } from '../ComposerInput';
 import type { ChatControls } from './use-chat-controls';
+import type { NoticeTone } from './use-notice';
 import type { ComposerDraft } from './use-composer-draft';
 import type { ComposerMenus } from './use-composer-menus';
 import type { PromptHistory } from './use-prompt-history';
@@ -31,7 +34,7 @@ interface SubmitInput {
     history: PromptHistory;
     hold: ComposerPromptHold;
     inputRef: RefObject<ComposerInputHandle | null>;
-    setNotice(notice: string): void;
+    setNotice(notice: string, tone?: NoticeTone): void;
     onSend(text: string, extras: ChatSendExtras): void | Promise<boolean>;
 }
 
@@ -51,9 +54,11 @@ export function useComposerSubmit({
     setNotice,
     onSend
 }: SubmitInput) {
+    const { t } = useTranslation('agent-chat');
     const host = useChatHost();
     const scope = useChatScope();
     const { draft, setDraft } = box;
+    const referable = host.useReferableChats();
 
     /* Opens the host's new chat once the host took the message; a host that answers nothing took it. */
     const afterSend = (sent: void | Promise<boolean>, andNew: boolean): void => {
@@ -127,23 +132,38 @@ export function useComposerSubmit({
     useEffect(() => registerComposerSender(scope.keyOf(chatId), (how) => submitRef.current(how)), [scope, chatId]);
 
     /*
-     * A stashed prompt comes back as text, mentions and skills; its files were never kept. Its quote
-     * keeps leading to its reply in the chat it came from, and is plain text in any other.
+     * A stashed prompt comes back as text, mentions, skills and the chats this project still has; its
+     * files were never kept. Its quote keeps leading to its reply in the chat it came from, and is plain
+     * text in any other.
      */
     const restoreStashed = (prompt: StashedPrompt): void => {
         const stashedQuote = prompt.quote;
         const here = stashedQuote !== undefined && stashedQuote.chatId === chatId;
+        const { chats, dropped } = restorableChats(prompt.chats, new Set(referable.map((chat) => chat.id)), chatId);
         setDraft((current) => ({
             ...current,
             text: stashedQuote === undefined || here ? prompt.text : withQuote(stashedQuote.text, prompt.text),
             mentions: [...prompt.mentions],
             skills: [...prompt.skills],
+            chats,
             ...(here ? { quote: stashedQuote.text, quoteSource: stashedQuote.itemId } : {})
         }));
+        if (dropped > 0) {
+            setNotice(t('composer.notice.stashChatsDropped', { count: dropped }), 'info');
+        }
         history.forget();
         inputRef.current?.focus();
     };
 
+    /* Sends the prompt that goes on after a stop through the same door as a typed one, so the host sees a person's message. */
+    const continueTurn = (): void => {
+        if (!writable) {
+            return;
+        }
+        scrollTimelineToEnd(chatId, 'instant');
+        afterSend(onSend(CONTINUE_PROMPT, {}), false);
+    };
+
     /* Cmd+S puts the draft away and clears the box; on an empty box the same key takes the last one back. */
     const toggleStash = (): void => {
         if (isEmptyDraft(draft)) {
@@ -159,5 +179,5 @@ export function useComposerSubmit({
         }
     };
 
-    return { submit, restoreStashed, toggleStash };
+    return { submit, continueTurn, restoreStashed, toggleStash };
 }

package/src/chat/ui/composer/use-continuable-turn.ts

@@ -0,0 +1,14 @@
+import { useMemo } from 'react';
+import type { ChatInfo, ChatItem } from '@adecore/agent-contracts';
+import { useChatRow } from '../../../state/chats';
+import { continuableTurn } from '../../logic/continue-after-stop';
+
+/* The turn a person stopped that Continue would pick up, or null when there is none. */
+export function useContinuableTurn(chatId: string, info: ChatInfo): string | null {
+    const order = useChatRow(chatId, (row) => row?.order);
+    const structure = useChatRow(chatId, (row) => row?.structure);
+    return useMemo(() => {
+        const items = (order ?? []).map((id) => structure?.[id]).filter((item): item is ChatItem => item !== undefined);
+        return continuableTurn(info, items);
+    }, [info, order, structure]);
+}

package/src/chat/ui/composer/use-notice.ts

@@ -1,27 +1,34 @@
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 
 const NOTICE_MS = 4000;
 
+/* An error is what went wrong; info is something the composer did that the person should know. */
+export type NoticeTone = 'error' | 'info';
+
 export interface ComposerNotice {
     notice: string | null;
-    setNotice(notice: string | null): void;
+    tone: NoticeTone;
+    setNotice(notice: string | null, tone?: NoticeTone): void;
     showError(error: unknown): void;
 }
 
 /* A line under the box that says what went wrong, gone again after a few seconds. */
 export function useNotice(): ComposerNotice {
-    const [notice, setNotice] = useState<string | null>(null);
+    const [shown, setShown] = useState<{ text: string; tone: NoticeTone } | null>(null);
 
     useEffect(() => {
-        if (!notice) {
+        if (!shown) {
             return;
         }
-        const timer = setTimeout(() => setNotice(null), NOTICE_MS);
+        const timer = setTimeout(() => setShown(null), NOTICE_MS);
         return () => clearTimeout(timer);
-    }, [notice]);
+    }, [shown]);
+
+    const setNotice = useCallback((notice: string | null, tone: NoticeTone = 'error'): void => setShown(notice ? { text: notice, tone } : null), []);
 
     return {
-        notice,
+        notice: shown?.text ?? null,
+        tone: shown?.tone ?? 'error',
         setNotice,
         showError: (error) => setNotice(error instanceof Error ? error.message : String(error))
     };

package/src/chat/ui/diff/ReviewDiff.tsx

@@ -1,4 +1,4 @@
-import { Suspense } from 'react';
+import { LazyBoundary } from '@adecore/ui';
 import { useTranslation } from 'react-i18next';
 import { lazyNamed } from '../../../lazy';
 import type { ReviewEntry } from './review-plan';
@@ -10,13 +10,13 @@ export function ReviewDiff({ entry, maxHeight = 480 }: { entry: ReviewEntry; max
     const { t } = useTranslation('agent-chat');
     return (
         <div data-review-entry={entry.key}>
-            <Suspense fallback={<p className="px-3 py-2 text-xs text-text-faint">{t('work.loadingDiff')}</p>}>
+            <LazyBoundary fallback={<p className="px-3 py-2 text-xs text-text-faint">{t('work.loadingDiff')}</p>}>
                 {entry.change.kind === 'edit' ? (
                     <EditDiff change={entry.change.edit} maxHeight={maxHeight} />
                 ) : (
                     <UnifiedDiff change={entry.change.patch} contents={entry.change.contents} maxHeight={maxHeight} />
                 )}
-            </Suspense>
+            </LazyBoundary>
         </div>
     );
 }

package/src/chat/ui/index.ts

@@ -1,7 +1,6 @@
 // Public API: exports.test.ts snapshots this list, so a name added or dropped here is an API change.
 export { AccountPill } from './AccountPill';
 export { AnsiOutput } from './AnsiOutput';
-export { BookmarkMarker } from './BookmarkMarker';
 export { BookmarkSubmenu } from './BookmarkSubmenu';
 export { ChatActivity, StatusIcon } from './ChatActivity';
 export { ChatReferenceChip } from './ChatReferenceChip';
@@ -15,40 +14,17 @@ export { GoalDock, GoalPill } from './GoalDock';
 export { ImageThumb, type ImageThumbProps } from './ImageView';
 export { LimitDock, LimitPill } from './LimitState';
 export { ReplyMarkdown, MessageMarkdown, Markdown } from './Markdown';
-export { MermaidBlock } from './MermaidBlock';
-export { MessageActions } from './MessageActions';
-export { ModelPicker, StashPicker } from './Pickers';
-export { type PromptHold, PromptComposer } from './PromptComposer';
-export { QuoteButton } from './QuoteButton';
+export { ModelPicker } from './Pickers';
 export { ResumeCompactionDock } from './ResumeCompactionDock';
-export { RowTime } from './RowTime';
-export { RunSettings } from './RunSettings';
-export { Scrubber, type CardChat } from './Scrubber';
-export { SubagentTitleCrumb, SubagentBreadcrumb, SubagentActions } from './SubagentControls';
+export { SubagentTitleCrumb, SubagentBreadcrumb } from './SubagentControls';
 export { SubagentInfo } from './SubagentInfo';
-export { SubagentStopButton } from './SubagentStopButton';
 export { SubagentTimeline } from './SubagentTimeline';
 export { Timeline } from './Timeline';
-export { TimelineMenuPopup, BookmarkMenuItems } from './TimelineMenu';
+export { TimelineMenuPopup } from './TimelineMenu';
 export { default as UnifiedDiff } from './UnifiedDiff';
 export { UploadThumb } from './UploadThumb';
-export { VisualDialogs } from './VisualDialogs';
-export { type VisualFrameProps, VisualFrame } from './VisualFrame';
 export { WelcomeGreeting } from './Welcome';
-export { chipDecorations, type ChipChoices } from './composer/chips';
-export { externalChange, markdownLanguage, composerEditorExtensions } from './composer/editor';
-export { insertAtSelection } from './composer/insert';
-export {
-    listItemAt,
-    enterAction,
-    inOpenFence,
-    recallDirection,
-    type EnterAction,
-    type EnterKeys,
-    type ListItem,
-    type EnterContext,
-    type RecallContext
-} from './composer/keys';
+export { externalChange, composerEditorExtensions } from './composer/editor';
 export {
     createDiffSyntaxRuntime,
     diffSyntaxRuntime,
@@ -61,11 +37,10 @@ export {
 } from './diff-syntax';
 export { useDiffTheme } from './diff-theme';
 export type { UnifiedDiffProps } from './diff/diff-props';
-export { FileLinkContext, useFileLinkCwd, useFileLinkScopeId, useOpenFileLink } from './file-links';
-export { type ChatFindField, type FindReveal, useOpenForFind } from './find-reveal';
+export { FileLinkContext, useFileLinkCwd } from './file-links';
+export { type ChatFindField, type FindReveal } from './find-reveal';
 export type { DiffContents } from './full-diff';
 export { type UiBlockFrameProps, UiBlockFrame, type UiBlockFix, type UiBlockFooterProps } from './intelligent-ui/UiBlockFrame';
-export { UiFallbackPart, type UiFallbackProblem } from './intelligent-ui/UiFallbackPart';
 export { UiReply } from './intelligent-ui/UiReply';
 export { uiChartData, type UiChartSeries, type UiChartValues, type UiChartData } from './intelligent-ui/chart-data';
 export { uiNodeLabel } from './intelligent-ui/node-text';
@@ -75,6 +50,7 @@ export type {
     UiRendererProps,
     UiLinkTarget,
     UiLink,
+    UiPlacePoint,
     UiAnswer,
     UiLiveStatus,
     UiLiveValue,
@@ -86,24 +62,8 @@ export type { QuoteTaker } from './quote-selection';
 export { ReplyContext } from './reply-context';
 export { ForksRow } from './rows/ForksRow';
 export { GeneratedImageRow } from './rows/GeneratedImageRow';
-export {
-    UserRow,
-    ReportRow,
-    ReplyHeader,
-    AssistantRow,
-    ThinkingRow,
-    LiveThoughtRow,
-    NoteRow,
-    AgentTurnRow,
-    CompactionRow,
-    ApprovalHistoryRow,
-    QuestionHistoryRow
-} from './rows/MessageRows';
-export { type RowContainerProps, RowContainer } from './rows/RowContainer';
-export { Row, type RowProps } from './rows/Rows';
-export { SubagentRow, SubagentBranchRow } from './rows/SubagentRow';
+export { ReportRow, AssistantRow, NoteRow, AgentTurnRow, CompactionRow } from './rows/MessageRows';
 export { TaskRow } from './rows/TaskRow';
-export { VisualRow } from './rows/VisualRow';
-export { ToggleLine, WorkRow, RunningFor, WorkLiveRow, WorkGroupRow, TurnFoldRow, ChangedFilesRow, WorkingRow } from './rows/WorkRows';
+export { WorkRow, WorkGroupRow, WorkingRow } from './rows/WorkRows';
 export { WorkflowRow } from './rows/WorkflowRow';
 export { useDiffSourceTokens } from './use-diff-source-tokens';

package/src/chat/ui/intelligent-ui/UiReply.tsx

@@ -365,6 +365,23 @@ function UiNodeBody({
     );
 }
 
+/*
+ * The points the machine froze beside a block, as a renderer asks for them. Until the block is frozen
+ * nothing is looked up yet, unless the machine keeps no readings for this reply at all; once it is, a place
+ * with no reading for its current address is one the machine did not look up.
+ */
+function placeReader(frozen: ChatUiQueryState['blocks'][string] | undefined, revision: string | undefined, unrecorded: boolean): UiRenderContext['place'] {
+    if (frozen === undefined || frozen.revision !== revision) {
+        return () => (unrecorded ? null : undefined);
+    }
+    return (nodeId, address) => {
+        const reading = Object.hasOwn(frozen.places ?? {}, nodeId) ? frozen.places![nodeId] : undefined;
+        return reading?.address === address.trim() && reading.state === 'found' && reading.lat !== undefined && reading.lon !== undefined
+            ? { lat: reading.lat, lon: reading.lon, label: reading.label }
+            : null;
+    };
+}
+
 /* What names a block and whether it still streams; the rest of its render context the block works out itself. */
 type UiBlockIdentity = Pick<UiRenderContext, 'scopeId' | 'chatId' | 'itemId' | 'blockId' | 'phase'>;
 
@@ -372,12 +389,15 @@ function UiBlockBody({
     block,
     context,
     answered,
-    frozen
+    frozen,
+    unrecorded
 }: {
     block: UiBlock;
     context: UiBlockIdentity;
     answered?: ChatUiAnswer;
     frozen?: ChatUiQueryState['blocks'][string];
+    /* Set for a finished reply the machine keeps no readings for, which nothing will ever look up. */
+    unrecorded: boolean;
 }): ReactNode {
     const host = useChatHost();
     const { t } = useTranslation('agent-chat');
@@ -430,9 +450,11 @@ function UiBlockBody({
     );
     const liveValue = useUiLiveValues(block, evaluation.nodes, queries.currentReadings);
     const sendChoice = host.intelligentUi?.sendChoice;
+    const place = useMemo(() => placeReader(frozen, block.revision, unrecorded), [frozen, block.revision, unrecorded]);
     const rendering: UiRenderContext = {
         ...context,
         ...links,
+        place,
         answer,
         failedChoiceId,
         live: queries.live,
@@ -531,6 +553,7 @@ export function UiReply({
                         <UiBlockBody
                             block={part.block}
                             frozen={queries?.blocks[part.block.id]}
+                            unrecorded={context.phase === 'final' && queries === undefined}
                             answered={answers?.[part.block.id]}
                             context={{ scopeId: context.scopeId, chatId: context.chatId, itemId: context.itemId, phase: context.phase, blockId: part.block.id }}
                         />

package/src/chat/ui/intelligent-ui/node-text.ts

@@ -1,5 +1,6 @@
 import type { TFunction } from 'i18next';
-import type { UiComponentName, UiProps, UiViewNode } from '@adecore/intelligent-ui';
+import { parseUiEventTime, type UiComponentName, type UiProps, type UiViewNode } from '@adecore/intelligent-ui';
+import { formatClock, formatDay, formatDayClock, formatDayClockWithYear, formatDayWithYear } from '@adecore/ui/format';
 import type { UiLiveStatus } from './render-context';
 
 /* The text a node holds, every `$text` below it joined as written, such as the code of a CodeBlock. */
@@ -12,6 +13,16 @@ export function uiNodeLabel(node: UiViewNode): string {
     return uiNodeText(node).replace(/\s+/g, ' ').trim();
 }
 
+/* The text written directly in a node, beside its component children: the label of a Select, whose children are mostly its options. */
+export function uiOwnLabel(node: UiViewNode): string {
+    return node.children
+        .filter((child) => child.type === '$text')
+        .map((child) => String(child.props.text ?? ''))
+        .join('')
+        .replace(/\s+/g, ' ')
+        .trim();
+}
+
 /* The valid children of one kind, which a parent reads as metadata: the columns of a table, the tabs of a strip. */
 export function uiChildrenOf<Name extends UiComponentName>(node: UiViewNode, type: Name): UiViewNode<UiProps<Name>>[] {
     return node.children.filter((child) => child.type === type && child.error === undefined) as UiViewNode<UiProps<Name>>[];
@@ -117,3 +128,25 @@ export function uiUrlDomain(url: string): string {
         return url;
     }
 }
+
+/*
+ * An event's `at` the way the person's language and region write it. The year is written once it is not the
+ * one we are in; a text without an offset reads as written, whatever zone or clock change the reader is in.
+ * A text the catalog would not accept stays as written.
+ */
+export function uiEventTime(at: string, now: Date | number = Date.now()): string {
+    const moment = parseUiEventTime(at);
+    if (moment === null) {
+        return at;
+    }
+    const zone = moment.written ? 'UTC' : undefined;
+    const year = moment.written ? moment.date.getUTCFullYear() : moment.date.getFullYear();
+    const withYear = year !== new Date(now).getFullYear();
+    if (moment.kind === 'time') {
+        return formatClock(moment.date, zone);
+    }
+    if (moment.kind === 'date') {
+        return withYear ? formatDayWithYear(moment.date, zone) : formatDay(moment.date, zone);
+    }
+    return withYear ? formatDayClockWithYear(moment.date, zone) : formatDayClock(moment.date, zone);
+}

package/src/chat/ui/intelligent-ui/registry.ts

@@ -1,17 +1,37 @@
 import type { UiRenderers } from './render-context';
 import { ChartRenderer } from './renderers/chart';
 import { ChoiceRenderer, ChoicesRenderer } from './renderers/choices';
-import { CodeBlockRenderer, ImageRenderer, SourceRenderer, SourcesRenderer } from './renderers/content';
+import { CodeBlockRenderer, CompareRenderer, GalleryRenderer, ImageRenderer, SourceRenderer, SourcesRenderer } from './renderers/content';
 import { EntityListRenderer, EntryRenderer, StatRenderer, StatsRenderer, TableRenderer } from './renderers/data';
-import { ButtonRenderer, ChecklistRenderer, ItemRenderer, SegmentedRenderer, SliderRenderer, SwitchRenderer } from './renderers/inputs';
+import {
+    ButtonRenderer,
+    ChecklistRenderer,
+    ItemRenderer,
+    SegmentedRenderer,
+    SelectRenderer,
+    SliderRenderer,
+    SwitchRenderer,
+    TextFieldRenderer
+} from './renderers/inputs';
 import { CommitRenderer, DiffRenderer, FileRenderer, NodeRenderer } from './renderers/links';
+import { MapRenderer } from './renderers/map';
 import { SectionRenderer, SectionsRenderer, TabRenderer, TabsRenderer } from './renderers/structure';
-import { CalloutRenderer, ProgressRenderer, StepRenderer, StepsRenderer, SummaryRenderer, TagRenderer } from './renderers/text';
+import {
+    CalloutRenderer,
+    EventRenderer,
+    ProgressRenderer,
+    StepRenderer,
+    StepsRenderer,
+    SummaryRenderer,
+    TagRenderer,
+    TimelineRenderer
+} from './renderers/text';
 
 /*
  * A renderer for every component of the catalog; a name missing here fails the typecheck. Null draws
- * nothing for the node itself: the runtime resolves Show and Each before rendering, and Column and
- * Option are metadata their parent reads from its node (a table its columns, Segmented its segments).
+ * nothing for the node itself: the runtime resolves Show and Each before rendering, and Column,
+ * Option and Place are metadata their parent reads from its node (a table its columns, Segmented and
+ * Select their options, a map its places).
  */
 export const UI_RENDERERS: UiRenderers = {
     Summary: SummaryRenderer,
@@ -20,6 +40,8 @@ export const UI_RENDERERS: UiRenderers = {
     Progress: ProgressRenderer,
     Steps: StepsRenderer,
     Step: StepRenderer,
+    Timeline: TimelineRenderer,
+    Event: EventRenderer,
     Stats: StatsRenderer,
     Stat: StatRenderer,
     EntityList: EntityListRenderer,
@@ -33,6 +55,10 @@ export const UI_RENDERERS: UiRenderers = {
     Section: SectionRenderer,
     CodeBlock: CodeBlockRenderer,
     Image: ImageRenderer,
+    Gallery: GalleryRenderer,
+    Compare: CompareRenderer,
+    Map: MapRenderer,
+    Place: null,
     Sources: SourcesRenderer,
     Source: SourceRenderer,
     File: FileRenderer,
@@ -44,7 +70,9 @@ export const UI_RENDERERS: UiRenderers = {
     Switch: SwitchRenderer,
     Slider: SliderRenderer,
     Segmented: SegmentedRenderer,
+    Select: SelectRenderer,
     Option: null,
+    TextField: TextFieldRenderer,
     Button: ButtonRenderer,
     Show: null,
     Each: null,

package/src/chat/ui/intelligent-ui/render-context.ts

@@ -15,6 +15,14 @@ export interface UiLink {
     code?: string;
 }
 
+/* The point a Place stands at, in decimal degrees. */
+export interface UiPlacePoint {
+    lat: number;
+    lon: number;
+    /* What the host called the point it found, such as the street and town. */
+    label?: string;
+}
+
 /* The Choice that answered a block. `sending` already reads as sent, so a second click does nothing. */
 export interface UiAnswer {
     choiceId: string;
@@ -63,6 +71,12 @@ export interface UiRenderContext {
     onChoose?(nodeId: string): void;
     /* Why the choices are closed while `onChoose` is absent, such as live data still being read; without it they say they are not available. */
     choiceReason?: string | null;
+    /*
+     * The point the host found for the `address` of the Place `nodeId`: undefined while it is not looked up
+     * yet, null when none was found. A reading counts only for the address it was made for, so a place that
+     * moved to another node, or whose address changed, does not wear another place's point.
+     */
+    place?(nodeId: string, address: string): UiPlacePoint | null | undefined;
     /* Table cells use the evaluated rows index and column key. */
     liveValue?(nodeId: string, prop: string, path?: readonly [row: number, key: string]): UiLiveValue | undefined;
 }