@datalayer/agent-runtimes 1.5.65 → 1.5.70

package/lib/apps/plugins/chat/SessionChooseDialog.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { FormControl, Select, Text } from '@primer/react';
+import { Dialog } from '@primer/react/experimental';
+import { Box } from '@datalayer/primer-addons';
+export const CHOOSE_WORDS = {
+    confirm: 'Switch',
+    cancel: 'Keep it',
+};
+export function SessionChooseDialog({ question, onPick, }) {
+    const [picked, setPicked] = useState(question.options[0]?.id ?? '');
+    const [says, setSays] = useState('');
+    useEffect(() => {
+        let current = true;
+        if (!question.says || !picked) {
+            setSays('');
+            return undefined;
+        }
+        question.says(picked).then(sentence => current && setSays(sentence), () => current && setSays(''));
+        return () => {
+            current = false;
+        };
+    }, [picked, question]);
+    const chosen = question.options.find(option => option.id === picked);
+    return (_jsx(Dialog, { title: question.title, onClose: () => onPick(undefined), width: "medium", footerButtons: [
+            {
+                buttonType: 'default',
+                content: CHOOSE_WORDS.cancel,
+                onClick: () => onPick(undefined),
+            },
+            {
+                buttonType: 'primary',
+                content: CHOOSE_WORDS.confirm,
+                disabled: !picked,
+                onClick: () => onPick(picked || undefined),
+            },
+        ], children: _jsxs(Box, { display: "grid", gap: 3, "data-session-choose": "", children: [_jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: question.title }), _jsx(Select, { value: picked, onChange: event => setPicked(event.target.value), block: true, children: question.options.map(option => (_jsx(Select.Option, { value: option.id, children: option.label }, option.id))) })] }), chosen?.description ? (_jsx(Text, { sx: { fontSize: 1, color: 'fg.muted' }, children: chosen.description })) : null, says ? (_jsx(Text, { as: "p", sx: { m: 0, fontSize: 1, fontStyle: 'italic' }, "data-session-choose-says": "", children: says })) : null] }) }));
+}
+export default SessionChooseDialog;

package/lib/apps/plugins/chat/index.js

@@ -9,8 +9,9 @@
  */
 import { CommentDiscussionIcon, FoldIcon, SparkleFillIcon, SyncIcon, } from '@primer/octicons-react';
 import { contribution, definePlugin } from '@datalayer/reactor';
-import { LoopAgentGate, LoopChatComposer, LoopChatExtras, LoopChatHeader, LoopChatSuggestion, LoopChatTurn, LoopCommand, LoopFrontendTool, LoopDocumentToolbarItem, LoopNotebookToolbarItem, LoopViewType, } from '../../core';
+import { LoopAgentGate, LoopChatComposer, LoopChatExtras, LoopChatHeader, LoopChatSuggestion, LoopChatTurn, LoopCommand, LoopFrontendTool, LoopDocumentToolbarItem, LoopNotebookToolbarItem, LoopSessionAction, LoopViewType, } from '../../core';
 import { createTurnFeed, feedWriters } from './turnState';
+import { CHAT_SESSION_ACTIONS } from './sessionActions';
 /**
  * An editor toolbar button that asks an agent to do something.
  *
@@ -93,6 +94,12 @@ export const ChatPlugin = definePlugin({
         return {};
     },
     contributes: [
+        // The thread's menu entries (MH-F08): each says with `when` whether it
+        // applies; the chat draws what the registry holds, a host adds its own.
+        ...CHAT_SESSION_ACTIONS.map(entry => contribution(LoopSessionAction, entry, {
+            id: entry.id,
+            order: entry.order,
+        })),
         contribution(LoopViewType, {
             viewType: 'chat',
             title: 'Chat',

package/lib/apps/plugins/chat/sessionActions.d.ts

@@ -0,0 +1,65 @@
+/**
+ * The chat's entries on a thread's menu (`loop.session.action`): *Switch
+ * agent…*, *Clone from here*, *Export*, *Import…*, *Resume* — each saying
+ * with `when` whether it applies to the session as it stands, each doing
+ * its work through the runtime's session API and the page's ways (a
+ * picker, a file, a download, opening a thread). *Clone from here* is also
+ * on each turn's row, where it names the turn. A host adds its own entries
+ * by contributing to the same point; nothing here is copied.
+ *
+ * Every refusal of the runtime is said as it is — a turn still running, a
+ * turn the session does not have, a file this runtime does not read, an
+ * agent it lacks — and nothing falls back to a default.
+ *
+ * @module apps/plugins/chat/sessionActions
+ */
+import type { SessionActionContext, SessionActionContribution, SessionFacts } from '../../core';
+/** The file a session is exported as. */
+export declare const sessionFileName: (session: Pick<SessionFacts, "uid">) => string;
+/** What the entries say, in a person's words. */
+export declare const SESSION_ACTION_WORDS: {
+    readonly switchAgent: "Switch agent…";
+    readonly switchTitle: (agent: string) => string;
+    readonly noPicker: "Switching the agent needs a picker this page has not: use `loop sessions swap`.";
+    readonly noAgents: "No other agent of the catalogue runs on a harness.";
+    readonly cloneFromHere: "Clone from here";
+    readonly cloned: (atTurn: number, uid: string) => string;
+    readonly export: "Export";
+    readonly exported: (turns: number, redactions: number, name: string) => string;
+    readonly import: "Import…";
+    readonly noFilePicker: "Importing a session needs a file picker this page has not: use `loop sessions import`.";
+    readonly imported: (uid: string, turns: number, redactions: number) => string;
+    readonly resume: "Resume";
+    readonly resumed: (uid: string) => string;
+};
+/** One agent a session may be switched to. */
+export type AgentChoice = {
+    id: string;
+    label: string;
+    description?: string;
+};
+/**
+ * The agents a session may be switched to: the catalogue's harness agents
+ * — each harness offered by the catalogue agent that runs on it, as the
+ * Studio's toolbox offers them — the session's own agent left out. A swap
+ * may cross kinds (a model agent to a harness and back): what the person
+ * chooses among is what the catalogue has.
+ */
+export declare function agentChoices(session: Pick<SessionFacts, 'agent'>): AgentChoice[];
+/**
+ * What the new agent is told, shown before the swap is sent: the sentence
+ * the runtime says on the swap, in its first two clauses; the runtime's own
+ * `said` — whose last clause follows what the old harness can load again —
+ * is shown once the swap is done.
+ */
+export declare function swapSentence(session: Pick<SessionFacts, 'agent' | 'harness' | 'turns'>, to: AgentChoice): string;
+/** The redactions a session file's first line counts. */
+export declare function redactionsOf(text: string): number;
+export declare const SWITCH_AGENT: SessionActionContribution;
+export declare const CLONE_FROM_HERE: SessionActionContribution;
+export declare const EXPORT: SessionActionContribution;
+export declare const IMPORT: SessionActionContribution;
+export declare const RESUME: SessionActionContribution;
+/** The chat's entries, in the order they are drawn. */
+export declare const CHAT_SESSION_ACTIONS: readonly SessionActionContribution[];
+export type { SessionActionContext };

package/lib/apps/plugins/chat/sessionActions.js

@@ -0,0 +1,184 @@
+/*
+ * Copyright (c) 2025-2026 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+import { listAgentspecs } from '../../../specs/agents';
+import { listHarnesses } from '../../../specs/harnesses';
+/** The file a session is exported as. */
+export const sessionFileName = (session) => `${session.uid}.session.jsonl`;
+/** What the entries say, in a person's words. */
+export const SESSION_ACTION_WORDS = {
+    switchAgent: 'Switch agent…',
+    switchTitle: (agent) => `Switch ${agent} to`,
+    noPicker: 'Switching the agent needs a picker this page has not: use `loop sessions swap`.',
+    noAgents: 'No other agent of the catalogue runs on a harness.',
+    cloneFromHere: 'Clone from here',
+    cloned: (atTurn, uid) => `Cloned from turn ${atTurn} as ${uid}: opened here, the source untouched.`,
+    export: 'Export',
+    exported: (turns, redactions, name) => `Exported ${turns} turn${turns === 1 ? '' : 's'}, ${redactions} redaction${redactions === 1 ? '' : 's'} → ${name}.`,
+    import: 'Import…',
+    noFilePicker: 'Importing a session needs a file picker this page has not: use `loop sessions import`.',
+    imported: (uid, turns, redactions) => `Imported as ${uid} (${turns} turn${turns === 1 ? '' : 's'}, ${redactions} redaction${redactions === 1 ? '' : 's'}): opened here.`,
+    resume: 'Resume',
+    resumed: (uid) => `Resumed ${uid}.`,
+};
+/**
+ * The agents a session may be switched to: the catalogue's harness agents
+ * — each harness offered by the catalogue agent that runs on it, as the
+ * Studio's toolbox offers them — the session's own agent left out. A swap
+ * may cross kinds (a model agent to a harness and back): what the person
+ * chooses among is what the catalogue has.
+ */
+export function agentChoices(session) {
+    const specs = listAgentspecs();
+    return listHarnesses()
+        .filter(harness => harness.id !== 'custom' && harness.enabled)
+        .flatMap(harness => {
+        const agent = specs.find(spec => spec.harness === harness.id);
+        if (!agent || agent.id === session.agent) {
+            return [];
+        }
+        return [
+            {
+                id: agent.id,
+                label: `${agent.name} (${harness.name})`,
+                description: harness.description,
+            },
+        ];
+    });
+}
+/** A harness's name, or the agent's id when it runs on none. */
+const spokenAs = (agent, harness) => {
+    const known = harness
+        ? listHarnesses().find(h => h.id === harness)
+        : undefined;
+    return known?.name ?? (harness || agent);
+};
+/**
+ * What the new agent is told, shown before the swap is sent: the sentence
+ * the runtime says on the swap, in its first two clauses; the runtime's own
+ * `said` — whose last clause follows what the old harness can load again —
+ * is shown once the swap is done.
+ */
+export function swapSentence(session, to) {
+    const from = spokenAs(session.agent, session.harness);
+    const target = to.label.replace(/\s*\(.*\)$/, '');
+    return `This conversation was with ${from} until turn ${session.turns}; from here it is with ${target}. What was said stays.`;
+}
+/** An open session whose turn is idle: the only one whose agent is swapped. */
+const idle = (session) => session.state === 'open' && session.turn === 'idle';
+/** The redactions a session file's first line counts. */
+export function redactionsOf(text) {
+    const head = text.split('\n')[0] ?? '';
+    try {
+        return Number(JSON.parse(head).redactions ?? 0) || 0;
+    }
+    catch {
+        return 0;
+    }
+}
+export const SWITCH_AGENT = {
+    id: 'switch-agent',
+    label: SESSION_ACTION_WORDS.switchAgent,
+    order: 10,
+    when: idle,
+    run: async (session, context) => {
+        if (!context.choose) {
+            context.say(SESSION_ACTION_WORDS.noPicker);
+            return;
+        }
+        const options = agentChoices(session);
+        if (options.length === 0) {
+            context.say(SESSION_ACTION_WORDS.noAgents);
+            return;
+        }
+        const chosen = await context.choose({
+            title: SESSION_ACTION_WORDS.switchTitle(session.agent),
+            options,
+            says: async (id) => {
+                const choice = options.find(option => option.id === id);
+                return choice ? swapSentence(session, choice) : '';
+            },
+        });
+        if (!chosen) {
+            return;
+        }
+        const answer = await context.client.swap(session.uid, chosen);
+        context.say(String(answer.said ?? `Swapped to ${chosen}.`));
+    },
+};
+export const CLONE_FROM_HERE = {
+    id: 'clone-from-here',
+    label: SESSION_ACTION_WORDS.cloneFromHere,
+    order: 20,
+    placement: 'both',
+    when: session => session.turns > 0,
+    run: async (session, context) => {
+        const upToTurn = context.atTurn ?? session.turns;
+        const answer = await context.client.clone(session.uid, { upToTurn });
+        const uid = String(answer.uid ?? '');
+        if (!uid) {
+            throw new Error(`The runtime cloned session ${session.uid} and named no new session.`);
+        }
+        context.say(SESSION_ACTION_WORDS.cloned(upToTurn, uid));
+        context.openThread?.(uid);
+    },
+};
+export const EXPORT = {
+    id: 'export',
+    label: SESSION_ACTION_WORDS.export,
+    order: 30,
+    when: session => session.turns > 0,
+    run: async (session, context) => {
+        const text = await context.client.exportFile(session.uid);
+        const name = sessionFileName(session);
+        context.download?.(name, text, 'application/x-ndjson');
+        context.say(SESSION_ACTION_WORDS.exported(session.turns, redactionsOf(text), name));
+    },
+};
+export const IMPORT = {
+    id: 'import',
+    label: SESSION_ACTION_WORDS.import,
+    order: 35,
+    when: () => true,
+    run: async (_session, context) => {
+        if (!context.pickFile) {
+            context.say(SESSION_ACTION_WORDS.noFilePicker);
+            return;
+        }
+        const text = await context.pickFile('.jsonl,application/x-ndjson');
+        if (!text) {
+            return;
+        }
+        const answer = await context.client.importFile(text);
+        const uid = String(answer.uid ?? '');
+        if (!uid) {
+            throw new Error('The runtime imported the file and named no session.');
+        }
+        context.say(SESSION_ACTION_WORDS.imported(uid, Number(answer.turns ?? 0) || 0, Number(answer.redactions ?? 0) || 0));
+        context.openThread?.(uid);
+    },
+};
+export const RESUME = {
+    id: 'resume',
+    label: SESSION_ACTION_WORDS.resume,
+    order: 40,
+    divider: true,
+    when: session => session.state === 'paused',
+    run: async (session, context) => {
+        await context.client.resume(session.uid, session.agent, {
+            onEvent: () => undefined,
+        });
+        context.say(SESSION_ACTION_WORDS.resumed(session.uid));
+        // Drawn again from the runtime, which holds it now.
+        context.openThread?.(session.uid);
+    },
+};
+/** The chat's entries, in the order they are drawn. */
+export const CHAT_SESSION_ACTIONS = [
+    SWITCH_AGENT,
+    CLONE_FROM_HERE,
+    EXPORT,
+    IMPORT,
+    RESUME,
+];

package/lib/chat/Chat.d.ts

@@ -1,9 +1,49 @@
 import type { OAuthProvider, OAuthProviderConfig, Identity } from '../identity';
-import type { ChatCommonProps, Extension, Protocol, ProtocolConfig } from '../types';
+import type { ChatBaseProps, ChatCommonProps, Extension, Protocol, ProtocolConfig, ResumedThread } from '../types';
+import type { SessionActionContext } from '../apps/core';
+/**
+ * What a host lends the thread's `⋯` menu (VSCODE VS-24): the ways an
+ * entry may use that only the page has — a file saved, a pick, a file
+ * picked — and what it is told. The menu itself is drawn from the
+ * `loop.session.action` registry of the Reactor registered on the page
+ * (`SessionActionsMenu`, the one the apps' chat view draws): nothing of it
+ * is copied here, and no Reactor registered means no menu.
+ */
+export interface ChatSessionActions {
+    /** Hand the person a file to save, when the host can. */
+    download?: SessionActionContext['download'];
+    /** Ask the person to pick one of several, when the host can. */
+    choose?: SessionActionContext['choose'];
+    /** Ask the person for a file, when the host can. */
+    pickFile?: SessionActionContext['pickFile'];
+    /** Told what an entry said: a swap's sentence, a refusal as the runtime said it. */
+    onSaid?: (sentence: string) => void;
+    /**
+     * Told the thread an entry opened (a clone's, an import's, a resumed
+     * one's) — which this chat opens in place too.
+     */
+    onOpenThread?: (uid: string) => void;
+}
 /**
  * Chat props — extends ChatCommonProps with transport-specific configuration.
  */
 export interface ChatProps extends ChatCommonProps {
+    /**
+     * The conversation to go on with (D-13, VS-24): an application's session,
+     * read from its runtime by uid when `fromRuntime` is set (`GET
+     * …/apps/sessions/{uid}/messages`, else resumed from its record), and
+     * drawn in place of the runtime's history. The chat is remounted on
+     * another thread's id; a thread that cannot be opened is said, and a
+     * new one starts.
+     */
+    thread?: ResumedThread;
+    /**
+     * The thread's `⋯` menu, drawn when a Reactor is registered on the page:
+     * what the host lends its entries. Absent, no menu is drawn.
+     */
+    sessionActions?: ChatSessionActions;
+    /** Hands the chat's send, stop, new-chat and thread to the host (`ChatBase`'s). */
+    onSendReady?: ChatBaseProps['onSendReady'];
     /**
      * Transport to use — REQUIRED.
      *
@@ -119,5 +159,5 @@ export interface ChatProps extends ChatCommonProps {
  * />
  * ```
  */
-export declare function Chat({ protocol: transport, extensions: _extensions, baseUrl, endpoint: endpointProp, configEndpoint: configEndpointProp, enableConfigQuery: enableConfigQueryProp, wsUrl, agentId, authToken: authTokenProp, placeholder, title, subtitle, brandIcon, autoConnect, streaming: _streaming, onMessageSent: _onMessageSent, onMessageReceived: _onMessageReceived, onDisconnect, onLogout: _onLogout, onCollapsePanel: _onCollapsePanel, className, height, showHeader, showNewChatButton, showClearButton, showModelSelector, showToolsMenu, showInput, disableInputPrompt, disabled, disableReason, overlay, launching, launchingMessage, showSkillsMenu, codemodeEnabled, onToggleCodemode, showTokenUsage, initialModel, availableModels, mcpServers, initialSkills, clearOnMount: _clearOnMount, suggestions, submitOnSuggestionClick, description, headerContent, headerActions, autoFocus, identityProviders, onIdentityConnect, onIdentityDisconnect, runtimeId, historyEndpoint, pendingPrompt, errorBanner, showInformation, chatViewMode, onChatViewModeChange, frontendTools, enableEphemeralNotebook, initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange, enableEphemeralDocument, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, onToolCallStart, onToolCallComplete, hideMessagesAfterToolUI, contextSnapshot, mcpStatusData, codemodeStatusData, sandboxStatusData, kernel, kernelIndicatorPlacement, kernelEnvironmentName, kernelCpu, kernelMemory, kernelGpu, themeVariant, colorMode, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, disableInternalJupyterTheme, }: ChatProps): import("react").JSX.Element;
+export declare function Chat({ protocol: transport, extensions: _extensions, baseUrl, endpoint: endpointProp, configEndpoint: configEndpointProp, enableConfigQuery: enableConfigQueryProp, wsUrl, agentId, authToken: authTokenProp, placeholder, title, subtitle, brandIcon, autoConnect, streaming: _streaming, onMessageSent: _onMessageSent, onMessageReceived: _onMessageReceived, onDisconnect, onLogout: _onLogout, onCollapsePanel: _onCollapsePanel, className, height, showHeader, showNewChatButton, showClearButton, showModelSelector, showToolsMenu, showInput, disableInputPrompt, disabled, disableReason, overlay, launching, launchingMessage, showSkillsMenu, codemodeEnabled, onToggleCodemode, showTokenUsage, initialModel, availableModels, mcpServers, initialSkills, clearOnMount: _clearOnMount, suggestions, submitOnSuggestionClick, description, headerContent, headerActions, autoFocus, identityProviders, onIdentityConnect, onIdentityDisconnect, runtimeId, historyEndpoint, pendingPrompt, errorBanner, showInformation, chatViewMode, onChatViewModeChange, frontendTools, enableEphemeralNotebook, initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange, enableEphemeralDocument, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, onToolCallStart, onToolCallComplete, hideMessagesAfterToolUI, contextSnapshot, mcpStatusData, codemodeStatusData, sandboxStatusData, kernel, kernelIndicatorPlacement, kernelEnvironmentName, kernelCpu, kernelMemory, kernelGpu, themeVariant, colorMode, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, disableInternalJupyterTheme, thread: givenThread, sessionActions, onSendReady, onToolCallUpdate, }: ChatProps): import("react").JSX.Element;
 export default Chat;

package/lib/chat/Chat.js

@@ -24,8 +24,13 @@ import { Text, Button, Spinner, ThemeProvider } from '@primer/react';
 import { AlertIcon, SyncIcon } from '@primer/octicons-react';
 import { Box } from '@datalayer/primer-addons';
 import { useConnectedIdentities } from '../identity';
+import { useOptionalReactorPlatform } from '@datalayer/reactor/react';
 import { ChatBase } from './base/ChatBase';
 import { AgentDetails } from '../agents/AgentDetails';
+import { SessionActionsMenu } from '../apps/plugins/chat/SessionActionsMenu';
+import { appSessionsClient } from '../portable/sessions';
+import { openThread, THREAD_WORDS } from '../portable/thread';
+import { generateMessageId } from '../types/messages';
 // Try to get Jupyter settings if available
 let getJupyterSettings;
 try {
@@ -140,7 +145,7 @@ function getProtocolType(protocol) {
  * />
  * ```
  */
-export function Chat({ protocol: transport, extensions: _extensions, baseUrl = 'http://localhost:8765', endpoint: endpointProp, configEndpoint: configEndpointProp, enableConfigQuery: enableConfigQueryProp, wsUrl, agentId, authToken: authTokenProp, placeholder = 'Type your message...', title, subtitle, brandIcon, autoConnect = true, streaming: _streaming = true, onMessageSent: _onMessageSent, onMessageReceived: _onMessageReceived, onDisconnect, onLogout: _onLogout, onCollapsePanel: _onCollapsePanel, className, height = '600px', showHeader = true, showNewChatButton = true, showClearButton = true, showModelSelector = true, showToolsMenu = true, showInput = true, disableInputPrompt = false, disabled, disableReason, overlay, launching = false, launchingMessage, showSkillsMenu = true, codemodeEnabled = false, onToggleCodemode, showTokenUsage = true, initialModel, availableModels, mcpServers, initialSkills, clearOnMount: _clearOnMount = true, suggestions, submitOnSuggestionClick = true, description, headerContent, headerActions, autoFocus = false, identityProviders, onIdentityConnect, onIdentityDisconnect, runtimeId, historyEndpoint, pendingPrompt, errorBanner, showInformation = true, chatViewMode, onChatViewModeChange, frontendTools, enableEphemeralNotebook, initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange, enableEphemeralDocument, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed = false, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, onToolCallStart, onToolCallComplete, hideMessagesAfterToolUI = false, contextSnapshot, mcpStatusData, codemodeStatusData, sandboxStatusData, kernel, kernelIndicatorPlacement, kernelEnvironmentName, kernelCpu, kernelMemory, kernelGpu, themeVariant, colorMode, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, disableInternalJupyterTheme = false, }) {
+export function Chat({ protocol: transport, extensions: _extensions, baseUrl = 'http://localhost:8765', endpoint: endpointProp, configEndpoint: configEndpointProp, enableConfigQuery: enableConfigQueryProp, wsUrl, agentId, authToken: authTokenProp, placeholder = 'Type your message...', title, subtitle, brandIcon, autoConnect = true, streaming: _streaming = true, onMessageSent: _onMessageSent, onMessageReceived: _onMessageReceived, onDisconnect, onLogout: _onLogout, onCollapsePanel: _onCollapsePanel, className, height = '600px', showHeader = true, showNewChatButton = true, showClearButton = true, showModelSelector = true, showToolsMenu = true, showInput = true, disableInputPrompt = false, disabled, disableReason, overlay, launching = false, launchingMessage, showSkillsMenu = true, codemodeEnabled = false, onToggleCodemode, showTokenUsage = true, initialModel, availableModels, mcpServers, initialSkills, clearOnMount: _clearOnMount = true, suggestions, submitOnSuggestionClick = true, description, headerContent, headerActions, autoFocus = false, identityProviders, onIdentityConnect, onIdentityDisconnect, runtimeId, historyEndpoint, pendingPrompt, errorBanner, showInformation = true, chatViewMode, onChatViewModeChange, frontendTools, enableEphemeralNotebook, initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange, enableEphemeralDocument, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed = false, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, onToolCallStart, onToolCallComplete, hideMessagesAfterToolUI = false, contextSnapshot, mcpStatusData, codemodeStatusData, sandboxStatusData, kernel, kernelIndicatorPlacement, kernelEnvironmentName, kernelCpu, kernelMemory, kernelGpu, themeVariant, colorMode, showToolApprovalBanner, pendingApprovals, onApproveApproval, onRejectApproval, disableInternalJupyterTheme = false, thread: givenThread, sessionActions, onSendReady, onToolCallUpdate, }) {
     const resolvedAgentId = typeof agentId === 'string' && agentId.trim().length > 0
         ? agentId.trim()
         : 'default';
@@ -312,6 +317,142 @@ export function Chat({ protocol: transport, extensions: _extensions, baseUrl = '
         lastMessageCountRef.current = nextCount;
         setMessageCount(nextCount);
     }, []);
+    /*
+     * The thread (VS-24): the host's, or the one a menu entry opened in its
+     * place (a clone's, an import's). One read from its runtime is opened
+     * here first — held there, else resumed from its record — and drawn in
+     * place of the runtime's history; one that cannot be opened is said, and
+     * a new one starts.
+     */
+    const [actionThread, setActionThread] = useState(undefined);
+    const wantedThread = actionThread ?? givenThread;
+    const [openedThread, setOpenedThread] = useState(null);
+    const opening = Boolean(wantedThread?.fromRuntime && openedThread?.given !== wantedThread.id);
+    useEffect(() => {
+        if (!wantedThread?.fromRuntime) {
+            return undefined;
+        }
+        let current = true;
+        void (async () => {
+            let failure = '';
+            for (let attempt = 0; attempt < 4 && current; attempt += 1) {
+                try {
+                    const messages = await openThread({
+                        agentBaseUrl: baseUrl,
+                        agentId: resolvedAgentId,
+                        uid: wantedThread.id,
+                        token: authTokenProp,
+                    });
+                    if (current) {
+                        setOpenedThread({
+                            given: wantedThread.id,
+                            thread: { ...wantedThread, fromRuntime: false, messages },
+                            said: '',
+                        });
+                    }
+                    return;
+                }
+                catch (error) {
+                    failure = error instanceof Error ? error.message : String(error);
+                    // The runtime may still be making the application's agent.
+                    await new Promise(resolve => setTimeout(resolve, 1500));
+                }
+            }
+            if (current) {
+                setOpenedThread({
+                    given: wantedThread.id,
+                    thread: {
+                        id: generateMessageId(),
+                        messages: [],
+                        onStarted: wantedThread.onStarted,
+                    },
+                    said: THREAD_WORDS.notOpened(failure),
+                });
+            }
+        })();
+        return () => {
+            current = false;
+        };
+        // By the thread's id: its object is the host's.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [
+        wantedThread?.id,
+        wantedThread?.fromRuntime,
+        baseUrl,
+        resolvedAgentId,
+        authTokenProp,
+    ]);
+    const chatThread = wantedThread?.fromRuntime
+        ? openedThread?.given === wantedThread.id
+            ? openedThread.thread
+            : undefined
+        : wantedThread;
+    const threadSaid = wantedThread?.fromRuntime && openedThread?.given === wantedThread.id
+        ? openedThread.said
+        : '';
+    /*
+     * The thread's menu (VS-24): the `loop.session.action` entries of the
+     * Reactor registered on the page, for the session the thread is — the
+     * uid the next message goes to, as the chat says it (`onSendReady`'s
+     * `thread`), kept here so the menu follows the header's +.
+     */
+    const reactor = useOptionalReactorPlatform();
+    const [threadId, setThreadId] = useState(chatThread?.id ?? '');
+    const hostSendReadyRef = useRef(onSendReady);
+    hostSendReadyRef.current = onSendReady;
+    const handleSendReady = useCallback(controls => {
+        if (controls) {
+            setThreadId(controls.thread());
+        }
+        hostSendReadyRef.current?.(controls);
+    }, []);
+    const threadForBase = useMemo(() => chatThread
+        ? {
+            ...chatThread,
+            onStarted: started => {
+                setThreadId(started);
+                chatThread.onStarted?.(started);
+            },
+        }
+        : undefined, [chatThread]);
+    const [actionSaid, setActionSaid] = useState('');
+    const sessionsClient = useMemo(() => appSessionsClient({
+        baseUrl,
+        getAccessToken: () => authTokenProp,
+        fetch: (input, init) => fetch(input, init),
+    }), [baseUrl, authTokenProp]);
+    const sessionActionsRef = useRef(sessionActions);
+    sessionActionsRef.current = sessionActions;
+    const sessionContext = useMemo(() => ({
+        client: sessionsClient,
+        say: sentence => {
+            setActionSaid(sentence);
+            sessionActionsRef.current?.onSaid?.(sentence);
+        },
+        openThread: uid => {
+            setActionThread({ id: uid, messages: [], fromRuntime: true });
+            sessionActionsRef.current?.onOpenThread?.(uid);
+        },
+        ...(sessionActionsRef.current?.download
+            ? { download: sessionActionsRef.current.download }
+            : {}),
+        ...(sessionActionsRef.current?.choose
+            ? { choose: sessionActionsRef.current.choose }
+            : {}),
+        ...(sessionActionsRef.current?.pickFile
+            ? { pickFile: sessionActionsRef.current.pickFile }
+            : {}),
+    }), [sessionsClient]);
+    const describeSession = useCallback((uid) => sessionsClient.described(uid), [sessionsClient]);
+    const menuDrawn = Boolean(sessionActions && reactor);
+    const mergedHeaderActions = useMemo(() => menuDrawn ? (_jsxs(Box, { display: "inline-flex", alignItems: "center", gap: 2, children: [headerActions, _jsx(SessionActionsMenu, { uid: threadId || chatThread?.id || undefined, describe: describeSession, context: sessionContext })] })) : (headerActions), [
+        menuDrawn,
+        headerActions,
+        threadId,
+        chatThread?.id,
+        describeSession,
+        sessionContext,
+    ]);
     const headerButtons = useMemo(() => ({
         showNewChat: showNewChatButton,
         showClear: showClearButton,
@@ -338,6 +479,11 @@ export function Chat({ protocol: transport, extensions: _extensions, baseUrl = '
                                                 ? 'attention.fg'
                                                 : 'danger.fg',
                                             flex: 1,
-                                        }, children: errorBanner.message })] })), _jsx(ChatBase, { title: title, subtitle: subtitle, brandIcon: brandIcon, showHeader: showHeader, protocol: protocolConfig, placeholder: placeholder, description: description, suggestions: suggestions, submitOnSuggestionClick: submitOnSuggestionClick, autoFocus: autoFocus, runtimeId: runtimeId, historyEndpoint: historyEndpoint, pendingPrompt: pendingPrompt, showInformation: showInformation, onInformationClick: handleInformationClick, headerContent: headerContent, headerActions: headerActions, showModelSelector: showModelSelector, showToolsMenu: showToolsMenu, showInput: showInput, disableInputPrompt: disableInputPrompt, disabled: disabled, disableReason: disableReason, overlay: overlay, launching: launching, launchingMessage: launchingMessage, autoConnect: autoConnect, showSkillsMenu: showSkillsMenu, showTokenUsage: showTokenUsage, codemodeEnabled: codemodeEnabled, onToggleCodemode: onToggleCodemode, initialModel: initialModel, availableModels: availableModels, mcpServers: mcpServers, initialSkills: initialSkills, connectedIdentities: identitiesForChat, onNewChat: handleNewChat, onMessagesChange: handleMessagesChange, headerButtons: headerButtons, avatarConfig: avatarConfig, backgroundColor: "canvas.default", focusTrigger: focusTrigger, chatViewMode: chatViewMode, onChatViewModeChange: onChatViewModeChange, frontendTools: frontendTools, enableEphemeralNotebook: enableEphemeralNotebook, initialEphemeralNotebookOpen: initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange: onEphemeralNotebookOpenChange, enableEphemeralDocument: enableEphemeralDocument, initialEphemeralSurfaceMode: initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange: onEphemeralSurfaceModeChange, collapsed: collapsed, onExpandFromCollapsed: onExpandFromCollapsed, ephemeralNotebookToolbar: ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems: ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems: ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider: ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId: ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration: ephemeralDocumentCollaboration, ephemeralRuntimeOverride: ephemeralRuntimeOverride, onToolCallStart: onToolCallStart, onToolCallComplete: onToolCallComplete, hideMessagesAfterToolUI: hideMessagesAfterToolUI, contextSnapshot: contextSnapshot, mcpStatusData: mcpStatusData, sandboxStatusData: sandboxStatusData, kernel: kernel, kernelIndicatorPlacement: kernelIndicatorPlacement, kernelEnvironmentName: kernelEnvironmentName, kernelCpu: kernelCpu, kernelMemory: kernelMemory, kernelGpu: kernelGpu, themeVariant: themeVariant, colorMode: colorMode, showToolApprovalBanner: showToolApprovalBanner, pendingApprovals: pendingApprovals, onApproveApproval: onApproveApproval, onRejectApproval: onRejectApproval, disableInternalJupyterTheme: disableInternalJupyterTheme })] })] }) }) }));
+                                        }, children: errorBanner.message })] })), threadSaid || actionSaid ? (
+                            // What opening the thread, or a menu entry, said: a refusal
+                            // as the runtime said it, a swap's sentence — until dismissed.
+                            _jsxs(Box, { display: "flex", alignItems: "center", gap: 2, px: 3, py: 2, bg: "attention.subtle", borderBottom: "1px solid", borderColor: "attention.muted", "data-testid": "chat-thread-said", children: [_jsx(Text, { sx: { fontSize: 1, color: 'attention.fg', flex: 1 }, children: actionSaid || threadSaid }), _jsx(Button, { size: "small", variant: "invisible", onClick: () => setActionSaid(''), children: "Dismiss" })] })) : null, opening ? (_jsx(Text, { as: "p", role: "status", sx: { m: 0, p: 3, fontSize: 1, color: 'fg.muted' }, children: THREAD_WORDS.opening })) : (_jsx(ChatBase
+                            // Another thread is another conversation: remounted on its id.
+                            , { thread: threadForBase, onSendReady: handleSendReady, onToolCallUpdate: onToolCallUpdate, title: title, subtitle: subtitle, brandIcon: brandIcon, showHeader: showHeader, protocol: protocolConfig, placeholder: placeholder, description: description, suggestions: suggestions, submitOnSuggestionClick: submitOnSuggestionClick, autoFocus: autoFocus, runtimeId: runtimeId, historyEndpoint: historyEndpoint, pendingPrompt: pendingPrompt, showInformation: showInformation, onInformationClick: handleInformationClick, headerContent: headerContent, headerActions: mergedHeaderActions, showModelSelector: showModelSelector, showToolsMenu: showToolsMenu, showInput: showInput, disableInputPrompt: disableInputPrompt, disabled: disabled, disableReason: disableReason, overlay: overlay, launching: launching, launchingMessage: launchingMessage, autoConnect: autoConnect, showSkillsMenu: showSkillsMenu, showTokenUsage: showTokenUsage, codemodeEnabled: codemodeEnabled, onToggleCodemode: onToggleCodemode, initialModel: initialModel, availableModels: availableModels, mcpServers: mcpServers, initialSkills: initialSkills, connectedIdentities: identitiesForChat, onNewChat: handleNewChat, onMessagesChange: handleMessagesChange, headerButtons: headerButtons, avatarConfig: avatarConfig, backgroundColor: "canvas.default", focusTrigger: focusTrigger, chatViewMode: chatViewMode, onChatViewModeChange: onChatViewModeChange, frontendTools: frontendTools, enableEphemeralNotebook: enableEphemeralNotebook, initialEphemeralNotebookOpen: initialEphemeralNotebookOpen, onEphemeralNotebookOpenChange: onEphemeralNotebookOpenChange, enableEphemeralDocument: enableEphemeralDocument, initialEphemeralSurfaceMode: initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange: onEphemeralSurfaceModeChange, collapsed: collapsed, onExpandFromCollapsed: onExpandFromCollapsed, ephemeralNotebookToolbar: ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems: ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems: ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider: ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId: ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration: ephemeralDocumentCollaboration, ephemeralRuntimeOverride: ephemeralRuntimeOverride, onToolCallStart: onToolCallStart, onToolCallComplete: onToolCallComplete, hideMessagesAfterToolUI: hideMessagesAfterToolUI, contextSnapshot: contextSnapshot, mcpStatusData: mcpStatusData, sandboxStatusData: sandboxStatusData, kernel: kernel, kernelIndicatorPlacement: kernelIndicatorPlacement, kernelEnvironmentName: kernelEnvironmentName, kernelCpu: kernelCpu, kernelMemory: kernelMemory, kernelGpu: kernelGpu, themeVariant: themeVariant, colorMode: colorMode, showToolApprovalBanner: showToolApprovalBanner, pendingApprovals: pendingApprovals, onApproveApproval: onApproveApproval, onRejectApproval: onRejectApproval, disableInternalJupyterTheme: disableInternalJupyterTheme }, chatThread?.id ?? 'own'))] })] }) }) }));
 }
 export default Chat;

package/lib/chat/base/ChatBase.js

@@ -37,7 +37,7 @@ import { extractChatMessagesFromFullContext } from './fullContextMessages';
 import { generateMessageId, createUserMessage } from '../../types/messages';
 import { AI_MODEL_CATALOGUE, DEFAULT_MODEL, isChatModel, } from '../../specs/models';
 import { internalQueryClient, isToolCallMessage, getMessageText, createProtocolAdapter, getApiBaseFromConfig, sanitizeAssistantContent, } from '../../utils';
-import { BROWSER_LIMITS, emptyConversation, reduceConversation, withError, withoutItems, withPrompt, withTurnEnded, } from '../../portable/conversation';
+import { BROWSER_LIMITS, emptyConversation, HARNESS_TOOL_CALL, reduceConversation, withError, withoutItems, withPrompt, withTurnEnded, } from '../../portable/conversation';
 import { conversationEventsOf, snapshotOfMessages, } from '../../portable/adapterEvents';
 import { conversationDrawer, emptyChatLayer, rowIdOf, toolCallOf, } from './conversationItems';
 import { useConfig, useSkills, useSkillActions, useContextSnapshot, useSandbox, } from '../../hooks';
@@ -426,9 +426,9 @@ function ChatBaseInner({ title, subtitle, showHeader = false, showTokenUsage = t
 // Mode selection
 useStore: useStoreMode = true, protocol: protocolRaw, onSendMessage, onSendReady, onLoadingChange, onSpeakingChange, onContextSnapshot, enableStreaming = false, 
 // Extended props
-brandIcon, avatarConfig, headerButtons, showPoweredBy = false, poweredByProps, emptyState, renderHeader, showTurnFooter = true, notebookToolSurfacesId, footerContent, welcome, trailingContent, voice, voiceSpeaking = false, voiceSentence, onStopSpeaking, voiceLevel, onReadAloud, showInformation = false, onInformationClick, headerContent, children, borderRadius, backgroundColor, border, boxShadow, compact = false, placeholder, description = 'Start a conversation with the AI agent.', onStateUpdate, onNewChat, onClear, onMessagesChange, onItemsChange, onDisplayItemsChange, autoFocus = false, suggestions, submitOnSuggestionClick = true, hideMessagesAfterToolUI = false, focusTrigger, frontendTools: frontendToolsProp, enableEphemeralNotebook = false, initialEphemeralNotebookOpen = true, onEphemeralNotebookOpenChange, enableEphemeralDocument = false, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed = false, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, 
+brandIcon, avatarConfig, headerButtons, showPoweredBy = false, poweredByProps, emptyState, renderHeader, showTurnFooter = true, renderMessageFooter, notebookToolSurfacesId, footerContent, welcome, trailingContent, voice, voiceSpeaking = false, voiceSentence, onStopSpeaking, voiceLevel, onReadAloud, showInformation = false, onInformationClick, headerContent, children, borderRadius, backgroundColor, border, boxShadow, compact = false, placeholder, description = 'Start a conversation with the AI agent.', onStateUpdate, onNewChat, onClear, onMessagesChange, onItemsChange, onDisplayItemsChange, autoFocus = false, suggestions, submitOnSuggestionClick = true, hideMessagesAfterToolUI = false, focusTrigger, frontendTools: frontendToolsProp, enableEphemeralNotebook = false, initialEphemeralNotebookOpen = true, onEphemeralNotebookOpenChange, enableEphemeralDocument = false, initialEphemeralSurfaceMode, onEphemeralSurfaceModeChange, collapsed = false, onExpandFromCollapsed, ephemeralNotebookToolbar, ephemeralNotebookToolbarExtraItems, ephemeralDocumentToolbarExtraItems, ephemeralNotebookCollaborationProvider, ephemeralNotebookCollaborationDocumentId, ephemeralDocumentCollaboration, ephemeralRuntimeOverride, 
 // Tool invocation hooks
-onToolCallStart, onToolCallComplete, inspector: inspectorGiven, 
+onToolCallStart, onToolCallComplete, onToolCallUpdate, inspector: inspectorGiven, 
 // Identity/Authorization props
 onAuthorizationRequired: _onAuthorizationRequired, connectedIdentities, 
 // Conversation persistence
@@ -1803,6 +1803,8 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
     onToolCallStartRef.current = onToolCallStart;
     const onToolCallCompleteRef = useRef(onToolCallComplete);
     onToolCallCompleteRef.current = onToolCallComplete;
+    const onToolCallUpdateRef = useRef(onToolCallUpdate);
+    onToolCallUpdateRef.current = onToolCallUpdate;
     // The Agent Inspector: the turns and tool calls, as spans, as they happen.
     const inspectorFromContext = useAgentInspectorTracer();
     const inspectorTracer = inspectorGiven ?? inspectorFromContext;
@@ -2810,6 +2812,24 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
                         voiceSayRef.current?.(event.activity);
                     }
                     read();
+                    // A running row said again with its display (VS-24): the host
+                    // drawing it elsewhere follows it as it streams.
+                    if (event.activity?.type === HARNESS_TOOL_CALL &&
+                        onToolCallUpdateRef.current) {
+                        const data = event.activity.data;
+                        const toolCallId = data && typeof data === 'object' && 'id' in data
+                            ? String(data.id ?? '')
+                            : '';
+                        const row = conversationRef.current.items.find(item => item.kind === 'tool' && item.id === toolCallId);
+                        if (row && row.kind === 'tool' && row.display) {
+                            onToolCallUpdateRef.current({
+                                toolName: row.name,
+                                toolCallId,
+                                args: row.input ?? {},
+                                display: row.display,
+                            });
+                        }
+                    }
                     break;
                 case 'done':
                     /*
@@ -3808,10 +3828,17 @@ showToolApprovalBanner = true, pendingApprovals: pendingApprovalsProp, onApprove
             .reverse()
             .find((item) => !isToolCallMessage(item) && item.role === 'assistant')?.id
         : undefined;
-    const readAloudFooter = readAnswerAloud || interruptedIds.size
-        ? (message) => {
+    const readAloudFooter = readAnswerAloud || interruptedIds.size || renderMessageFooter
+        ? (message, at) => {
             const text = getMessageText(message);
-            return (_jsxs(_Fragment, { children: [interruptedIds.has(message.id) ? (_jsx(Text, { sx: { fontSize: 0, color: 'fg.muted', fontStyle: 'italic' }, "data-interrupted": "", children: "interrupted" })) : null, readAnswerAloud && readsAloud(message, text, writingId) ? (_jsx(ReadAloud, { onRead: () => readAnswerAloud(text) })) : null] }));
+            // The host's row, asked once: nothing when it draws nothing.
+            const hosts = renderMessageFooter?.(message, at) ?? null;
+            const interrupted = interruptedIds.has(message.id);
+            const reads = Boolean(readAnswerAloud && readsAloud(message, text, writingId));
+            if (!hosts && !interrupted && !reads) {
+                return null;
+            }
+            return (_jsxs(_Fragment, { children: [interrupted ? (_jsx(Text, { sx: { fontSize: 0, color: 'fg.muted', fontStyle: 'italic' }, "data-interrupted": "", children: "interrupted" })) : null, reads && readAnswerAloud ? (_jsx(ReadAloud, { onRead: () => readAnswerAloud(text) })) : null, hosts] }));
         }
         : undefined;
     const messagesContent = children ? (children) : (_jsxs(Box, { ref: saidConversationRef, display: "flex", flexDirection: "column", minHeight: 0,