@nextclaw/ui 0.17.1 → 0.18.0

package/src/features/chat/features/conversation/hooks/use-session-conversation-controller.ts

@@ -3,7 +3,10 @@ import { buildNcpRequestEnvelope } from '@nextclaw/ncp-react';
 import type { UiNcpSessionQueuedInputView } from '@nextclaw/client-sdk';
 import type { NcpAgentSendEnvelope, NcpRunHandle } from '@nextclaw/ncp';
 
-import { deriveNcpMessagePartsFromComposer } from '@/features/chat/features/input/utils/chat-composer-state.utils';
+import {
+  createChatComposerNodesFromDraft,
+  deriveNcpMessagePartsFromComposer,
+} from '@/features/chat/features/input/utils/chat-composer-state.utils';
 import { isNcpChatSendDisabled } from '@/features/chat/features/input/utils/ncp-chat-input-availability.utils';
 import { buildChatRunMetadata } from '@/features/chat/features/session/utils/chat-run-metadata.utils';
 import { createNcpSessionId } from '@/features/chat/features/session/utils/ncp-session-adapter.utils';
@@ -74,6 +77,7 @@ type UseSessionConversationControllerParams = {
 
 type BuildSubmissionDraftParams = {
   readonly agentIsSending: boolean;
+  readonly composerSnapshot?: ComposerDraftSnapshot;
   readonly inputSnapshot: SessionConversationInputSnapshot;
   readonly inputQuery: SessionConversationInputQuery;
   readonly isRuntimeBlocked: boolean;
@@ -87,6 +91,8 @@ type SubmissionDraft = {
   readonly metadata: Record<string, unknown>;
 };
 
+type SubmissionComposerBehavior = 'preserve' | 'reset-and-restore';
+
 type SubmittingQueuedInput = {
   readonly id: string;
   readonly preview: string;
@@ -113,6 +119,7 @@ function buildInputAvailabilitySnapshot(inputQuery: SessionConversationInputQuer
 function buildSubmissionDraft(params: BuildSubmissionDraftParams): SubmissionDraft | null {
   const {
     agentIsSending,
+    composerSnapshot: requestedComposerSnapshot,
     inputQuery,
     inputSnapshot,
     isRuntimeBlocked,
@@ -120,9 +127,16 @@ function buildSubmissionDraft(params: BuildSubmissionDraftParams): SubmissionDra
     selectedAgentId,
     sessionKey,
   } = params;
+  const composerSnapshot: ComposerDraftSnapshot = requestedComposerSnapshot ?? {
+    text: inputSnapshot.text,
+    nodes: [...inputSnapshot.nodes],
+    selectedSkills: [...inputSnapshot.selectedSkills],
+    skillRecords: [...inputSnapshot.skillRecords],
+    attachments: [...inputSnapshot.attachments],
+  };
   const currentParts = deriveNcpMessagePartsFromComposer(
-    [...inputSnapshot.nodes],
-    inputSnapshot.attachments,
+    [...composerSnapshot.nodes],
+    composerSnapshot.attachments,
   );
   if (
     isNcpChatSendDisabled({
@@ -134,13 +148,6 @@ function buildSubmissionDraft(params: BuildSubmissionDraftParams): SubmissionDra
   ) {
     return null;
   }
-  const composerSnapshot: ComposerDraftSnapshot = {
-    text: inputSnapshot.text,
-    nodes: [...inputSnapshot.nodes],
-    selectedSkills: [...inputSnapshot.selectedSkills],
-    skillRecords: [...inputSnapshot.skillRecords],
-    attachments: [...inputSnapshot.attachments],
-  };
   return {
     composerSnapshot,
     metadata: buildChatRunMetadata({
@@ -165,11 +172,11 @@ function buildSubmissionDraft(params: BuildSubmissionDraftParams): SubmissionDra
         : sessionKey
           ? inputQuery.selectedSession?.projectRoot ?? null
           : inputSnapshot.pendingProjectRoot,
-      requestedSkills: [...inputSnapshot.selectedSkills],
+      requestedSkills: [...composerSnapshot.selectedSkills],
       skillRecords: inputQuery.skillRecords.filter((record) =>
-        inputSnapshot.selectedSkills.includes(record.ref)
+        composerSnapshot.selectedSkills.includes(record.ref)
       ),
-      composerNodes: [...inputSnapshot.nodes],
+      composerNodes: [...composerSnapshot.nodes],
       sessionMaterialization: materializationContext
         ? {
             kind: materializationContext.kind,
@@ -288,6 +295,72 @@ function useQueuedInputActions(params: {
   return { deleteQueuedInput, editQueuedInput };
 }
 
+function useSubmissionDraftRunner(params: {
+  readonly agent: SessionConversationAgent;
+  readonly clearSubmittingInput: (input: SubmittingQueuedInput) => void;
+  readonly materializationContext?: SessionConversationMaterializationContext | null;
+  readonly onSessionMaterialized?: (sessionKey: string) => void;
+  readonly resetComposer: () => void;
+  readonly restoreComposer: (snapshot: ComposerDraftSnapshot) => void;
+  readonly runQueue: SessionRunQueue;
+  readonly sessionKey: string | null;
+  readonly setSendError: (message: string | null) => void;
+  readonly stageSubmittingInput: (envelope: NcpAgentSendEnvelope) => SubmittingQueuedInput | null;
+}) {
+  const {
+    agent,
+    clearSubmittingInput,
+    materializationContext,
+    onSessionMaterialized,
+    resetComposer,
+    restoreComposer,
+    runQueue,
+    sessionKey,
+    setSendError,
+    stageSubmittingInput,
+  } = params;
+  return useCallback(async (
+    draft: SubmissionDraft,
+    composerBehavior: SubmissionComposerBehavior,
+  ) => {
+    const submissionSessionKey =
+      sessionKey ?? (materializationContext ? null : createNcpSessionId());
+    const envelope = buildSubmissionEnvelope(draft, submissionSessionKey);
+    if (!envelope) return;
+    const queuedSubmission = agent.isRunning ? stageSubmittingInput(envelope) : null;
+    if (composerBehavior === 'reset-and-restore') resetComposer();
+    setSendError(null);
+    try {
+      const handle = await agent.send(envelope);
+      if (queuedSubmission && handle?.runId === null) {
+        await runQueue.refreshQueuedInputs().catch(() => undefined);
+      }
+      if (queuedSubmission) clearSubmittingInput(queuedSubmission);
+      const materializedSessionKey =
+        handle?.sessionId?.trim() || agent.snapshot.activeRun?.sessionId?.trim() || null;
+      if (!sessionKey && materializedSessionKey) {
+        onSessionMaterialized?.(materializedSessionKey);
+      }
+    } catch (error) {
+      if (queuedSubmission) clearSubmittingInput(queuedSubmission);
+      if (composerBehavior === 'reset-and-restore') restoreComposer(draft.composerSnapshot);
+      setSendError(error instanceof Error ? error.message : String(error));
+      throw error;
+    }
+  }, [
+    agent,
+    clearSubmittingInput,
+    materializationContext,
+    onSessionMaterialized,
+    resetComposer,
+    restoreComposer,
+    runQueue,
+    sessionKey,
+    setSendError,
+    stageSubmittingInput,
+  ]);
+}
+
 export function useSessionConversationController(params: UseSessionConversationControllerParams) {
   const {
     agent,
@@ -343,6 +416,19 @@ export function useSessionConversationController(params: UseSessionConversationC
     setSendError,
   });
 
+  const submitDraft = useSubmissionDraftRunner({
+    agent,
+    clearSubmittingInput,
+    materializationContext,
+    onSessionMaterialized,
+    resetComposer,
+    restoreComposer,
+    runQueue,
+    sessionKey,
+    setSendError,
+    stageSubmittingInput,
+  });
+
   const send = useCallback(async () => {
     if (primaryAction === 'continue') {
       await continueRun();
@@ -357,58 +443,55 @@ export function useSessionConversationController(params: UseSessionConversationC
       selectedAgentId,
       sessionKey,
     });
-    if (!draft) {
-      return;
+    if (draft) {
+      await submitDraft(draft, 'reset-and-restore');
     }
-    const submissionSessionKey =
-      sessionKey ?? (materializationContext ? null : createNcpSessionId());
-    const envelope = buildSubmissionEnvelope(draft, submissionSessionKey);
-    if (!envelope) {
+  }, [
+    agent.isSending,
+    continueRun,
+    inputQuery,
+    inputSnapshot,
+    isRuntimeBlocked,
+    materializationContext,
+    primaryAction,
+    selectedAgentId,
+    sessionKey,
+    submitDraft,
+  ]);
+
+  const sendPresetMessage = useCallback(async (message: string) => {
+    const text = message.trim();
+    if (!text) {
       return;
     }
-    const queuedSubmission = agent.isRunning ? stageSubmittingInput(envelope) : null;
-    resetComposer();
-    setSendError(null);
-    try {
-      const handle = await agent.send(envelope);
-      if (queuedSubmission && handle?.runId === null) {
-        await runQueue.refreshQueuedInputs().catch(() => undefined);
-      }
-      if (queuedSubmission) {
-        clearSubmittingInput(queuedSubmission);
-      }
-      const materializedSessionKey =
-        handle?.sessionId?.trim() ||
-        agent.snapshot.activeRun?.sessionId?.trim() ||
-        null;
-      if (!sessionKey && materializedSessionKey) {
-        onSessionMaterialized?.(materializedSessionKey);
-      }
-    } catch (error) {
-      if (queuedSubmission) {
-        clearSubmittingInput(queuedSubmission);
-      }
-      restoreComposer(draft.composerSnapshot);
-      setSendError(error instanceof Error ? error.message : String(error));
-      throw error;
+    const draft = buildSubmissionDraft({
+      agentIsSending: agent.isSending,
+      composerSnapshot: {
+        text,
+        nodes: createChatComposerNodesFromDraft(text),
+        selectedSkills: [],
+        skillRecords: [],
+        attachments: [],
+      },
+      inputSnapshot,
+      inputQuery,
+      isRuntimeBlocked,
+      materializationContext,
+      selectedAgentId,
+      sessionKey,
+    });
+    if (draft) {
+      await submitDraft(draft, 'preserve');
     }
   }, [
-    agent,
-    clearSubmittingInput,
-    continueRun,
+    agent.isSending,
     inputQuery,
     inputSnapshot,
     isRuntimeBlocked,
     materializationContext,
-    onSessionMaterialized,
-    resetComposer,
-    restoreComposer,
     selectedAgentId,
     sessionKey,
-    setSendError,
-    stageSubmittingInput,
-    primaryAction,
-    runQueue,
+    submitDraft,
   ]);
 
   const stop = useCallback(async () => {
@@ -426,6 +509,7 @@ export function useSessionConversationController(params: UseSessionConversationC
     isSending,
     queuedInputs,
     send,
+    sendPresetMessage,
     sendDisabled,
     primaryAction,
     stop,

package/src/features/chat/features/conversation/hooks/use-session-conversation-slash-commands.ts

@@ -8,9 +8,15 @@ import type { ChatSlashCommandDescriptor } from '@/features/chat/features/input/
 export function useSessionConversationSlashCommands(params: {
   language: I18nLanguage;
   onContextCompactingChange?: (sessionId: string, isCompacting: boolean) => void;
+  onSendPresetMessage: (message: string) => Promise<void> | void;
   selectedSessionKey?: string | null;
 }): readonly ChatSlashCommandDescriptor[] {
-  const { language, onContextCompactingChange, selectedSessionKey } = params;
+  const {
+    language,
+    onContextCompactingChange,
+    onSendPresetMessage,
+    selectedSessionKey,
+  } = params;
   const presenter = usePresenter();
   const compactingSessionIdsRef = useRef(new Set<string>());
   const compactContext = useCallback(async (sessionId: string) => {
@@ -46,6 +52,17 @@ export function useSessionConversationSlashCommands(params: {
         keywords: ['side', 'chat', 'child', 'branch', 'new'],
         onSelect: () => presenter.chatThreadManager.openSideChatDraft(sessionId),
       },
+      {
+        key: 'update-session-title',
+        icon: 'command',
+        title: t('chatSlashCommandUpdateSessionTitleTitle', language),
+        description: t('chatSlashCommandUpdateSessionTitleDescription', language),
+        detailLines: [t('chatSlashCommandUpdateSessionTitleDetail', language)],
+        keywords: ['update', 'rename', 'title', 'session', '更新', '重命名', '标题', '会话'],
+        onSelect: () => void onSendPresetMessage(
+          t('chatSlashCommandUpdateSessionTitlePrompt', language),
+        ),
+      },
       {
         key: 'compact-context',
         icon: 'list-collapse',
@@ -56,5 +73,11 @@ export function useSessionConversationSlashCommands(params: {
         onSelect: () => void compactContext(sessionId),
       },
     ];
-  }, [compactContext, language, presenter.chatThreadManager, selectedSessionKey]);
+  }, [
+    compactContext,
+    language,
+    onSendPresetMessage,
+    presenter.chatThreadManager,
+    selectedSessionKey,
+  ]);
 }

package/src/features/chat/features/message/utils/__tests__/chat-message-show-content-tool-card.utils.test.ts

@@ -237,3 +237,49 @@ describe("buildShowContentToolCard", () => {
     });
   });
 });
+
+describe("buildToolCard terminal outcome and timing", () => {
+  it.each([
+    [{ command: "false", ok: false, exitCode: 1 }, "error", "Failed"],
+    [{ command: "rm -rf /", blocked: true, status: "blocked" }, "error", "Failed"],
+    [{ command: "sleep 5", status: "cancelled" }, "cancelled", "Cancelled"],
+    [{ command: "pwd", status: "completed", exit_code: 0 }, "success", "Completed"],
+  ] as const)("normalizes terminal result %o", (outputData, statusTone, statusLabel) => {
+    expect(buildToolCard({
+      kind: "result",
+      name: "commandExecution",
+      detail: "command: pwd",
+      hasResult: true,
+      statusTone: "success",
+      statusLabel: "Completed",
+      outputData,
+    }, TEXTS)).toMatchObject({ statusTone, statusLabel });
+  });
+
+  it("only exposes standard execution timing and preserves the stable tool call identity", () => {
+    const card = buildToolCard({
+      kind: "result",
+      name: "exec",
+      detail: "command: pnpm test",
+      hasResult: true,
+      statusTone: "success",
+      statusLabel: "Completed",
+      toolCallId: "tool-timing-1",
+      outputData: { command: "pnpm test", durationMs: 999_999 },
+      execution: { durationMs: 4270 },
+    }, TEXTS);
+    expect(card).toMatchObject({
+      toolCallId: "tool-timing-1",
+      execution: { durationMs: 4270 },
+    });
+    expect(buildToolCard({
+      kind: "result",
+      name: "exec",
+      detail: "command: pnpm test",
+      hasResult: true,
+      statusTone: "success",
+      statusLabel: "Completed",
+      outputData: { command: "pnpm test", durationMs: 999_999 },
+    }, TEXTS).execution).toBeUndefined();
+  });
+});

package/src/features/chat/features/message/utils/chat-message-part.utils.ts

@@ -179,6 +179,8 @@ function buildToolInvocationPart(
     text: shouldShowRawResult && rawResult ? rawResult : undefined,
     outputData: invocation.result,
     callId: invocation.toolCallId || undefined,
+    toolCallId: invocation.toolCallId || undefined,
+    ...(invocation.execution ? { execution: invocation.execution } : {}),
     hasResult: statusView.hasResult,
     statusTone: invalidArgsError ? "error" : statusView.statusTone,
     statusLabel: invalidArgsError ? texts.toolStatusFailedLabel : statusView.statusLabel,

package/src/features/chat/features/message/utils/chat-message-tool-card.utils.ts

@@ -15,6 +15,8 @@ export type ToolCardViewSource = ToolCard & {
   action?: ChatToolPartViewModel["action"];
   fileOperation?: ChatToolPartViewModel["fileOperation"];
   outputData?: unknown;
+  execution?: ChatToolPartViewModel["execution"];
+  toolCallId?: string;
   panelApp?: ChatToolPartViewModel["panelApp"];
 };
 
@@ -62,6 +64,43 @@ export function isTerminalResultRecord(
   );
 }
 
+function readTerminalStatus(value: unknown): string {
+  return typeof value === "string" ? value.trim().toLowerCase() : "";
+}
+
+export function resolveTerminalResultStatus(
+  value: unknown,
+): "success" | "error" | "cancelled" | null {
+  if (!isTerminalResultRecord(value)) return null;
+  const status = readTerminalStatus(value.status ?? value.outcome);
+  if (
+    value.cancelled === true ||
+    value.aborted === true ||
+    status === "cancelled" ||
+    status === "canceled" ||
+    status === "aborted" ||
+    status === "interrupted"
+  ) {
+    return "cancelled";
+  }
+  const exitCode = readOptionalNumber(value.exitCode ?? value.exit_code);
+  if (
+    value.ok === false ||
+    value.blocked === true ||
+    value.timedOut === true ||
+    value.killed === true ||
+    status === "error" ||
+    status === "failed" ||
+    status === "blocked" ||
+    status === "declined" ||
+    status === "timed_out" ||
+    (exitCode != null && exitCode !== 0)
+  ) {
+    return "error";
+  }
+  return "success";
+}
+
 export function extractAssetFileView(
   value: unknown,
   texts: ChatMessageAdapterTexts,
@@ -107,9 +146,19 @@ export function buildToolCard(
   toolCard: ToolCardViewSource,
   texts: ChatMessageAdapterTexts,
 ): ChatToolPartViewModel {
+  const terminalStatus = toolCard.statusTone === "success"
+    ? resolveTerminalResultStatus(toolCard.outputData)
+    : null;
+  const statusTone = terminalStatus ?? toolCard.statusTone;
+  const statusLabel = statusTone === "error"
+    ? texts.toolStatusFailedLabel
+    : statusTone === "cancelled"
+      ? texts.toolStatusCancelledLabel
+      : toolCard.statusLabel;
   return {
     kind: toolCard.kind,
     toolName: toolCard.name,
+    ...(toolCard.toolCallId ? { toolCallId: toolCard.toolCallId } : {}),
     ...("agentId" in toolCard && toolCard.agentId
       ? { agentId: toolCard.agentId }
       : {}),
@@ -121,9 +170,10 @@ export function buildToolCard(
         : undefined,
     output: toolCard.text,
     outputData: toolCard.outputData,
+    ...(toolCard.execution ? { execution: { ...toolCard.execution } } : {}),
     hasResult: Boolean(toolCard.hasResult),
-    statusTone: toolCard.statusTone,
-    statusLabel: toolCard.statusLabel,
+    statusTone,
+    statusLabel,
     titleLabel:
       toolCard.kind === "call" ? texts.toolCallLabel : texts.toolResultLabel,
     outputLabel: texts.toolOutputLabel,

package/src/features/chat/features/ncp/hooks/__tests__/use-hydrated-ncp-agent.test.tsx

@@ -85,7 +85,10 @@ describe("useHydratedNcpAgent", () => {
     await waitFor(() => {
       expect(result.current.isHydrating).toBe(false);
     });
-    expect(mocks.stream).toHaveBeenCalledWith({ sessionId: "session-a" });
+    expect(mocks.stream).toHaveBeenCalledWith(
+      { sessionId: "session-a" },
+      expect.objectContaining({ onOpen: expect.any(Function) }),
+    );
 
     rerender({ sessionId: "session-b" });
 
@@ -94,7 +97,10 @@ describe("useHydratedNcpAgent", () => {
     await waitFor(() => {
       expect(result.current.isHydrating).toBe(false);
     });
-    expect(mocks.stream).toHaveBeenCalledWith({ sessionId: "session-b" });
+    expect(mocks.stream).toHaveBeenCalledWith(
+      { sessionId: "session-b" },
+      expect.objectContaining({ onOpen: expect.any(Function) }),
+    );
     expect(mocks.stream).toHaveBeenCalledTimes(2);
   });
 
@@ -207,12 +213,13 @@ describe("useHydratedNcpAgent", () => {
       expect(result.current.isHydrating).toBe(false);
     });
     expect(loadSeed).not.toHaveBeenCalled();
-    expect(mocks.stream).toHaveBeenCalledWith({
-      sessionId: "session-materialized",
-    });
+    expect(mocks.stream).toHaveBeenCalledWith(
+      { sessionId: "session-materialized" },
+      expect.objectContaining({ onOpen: expect.any(Function) }),
+    );
   });
 
-  it("reloads missed state and reconnects after the live stream disconnects", async () => {
+  it("reloads missed state and remains usable after repeated live stream disconnects", async () => {
     vi.useFakeTimers();
     try {
       const connected = new Promise<void>(() => {});
@@ -220,9 +227,15 @@ describe("useHydratedNcpAgent", () => {
         stop: mocks.stop.mockResolvedValue(undefined),
         stream: mocks.stream
           .mockRejectedValueOnce(new Error("stream disconnected"))
+          .mockRejectedValueOnce(new Error("stream disconnected again"))
           .mockImplementationOnce(() => connected),
         subscribe: vi.fn(() => () => {}),
-        send: mocks.send,
+        send: mocks.send.mockResolvedValue({
+          sessionId: "session-recovery",
+          userMessageId: "user-after-recovery",
+          assistantMessageId: null,
+          runId: null,
+        }),
       } as unknown as NcpAgentClientEndpoint;
       const recoveredMessage = {
         id: "message-recovered",
@@ -235,6 +248,7 @@ describe("useHydratedNcpAgent", () => {
       const loadSeed = vi
         .fn()
         .mockResolvedValueOnce({ messages: [], status: "running" })
+        .mockResolvedValueOnce({ messages: [], status: "running" })
         .mockResolvedValueOnce({
           messages: [recoveredMessage],
           status: "idle",
@@ -254,15 +268,22 @@ describe("useHydratedNcpAgent", () => {
       await act(async () => {
         await vi.runOnlyPendingTimersAsync();
       });
+      await vi.waitFor(() => expect(mocks.stream).toHaveBeenCalledTimes(2));
+      await act(async () => {
+        await vi.runOnlyPendingTimersAsync();
+      });
       await vi.waitFor(() => {
         expect(result.current.visibleMessages).toEqual([recoveredMessage]);
       });
 
-      expect(loadSeed).toHaveBeenCalledTimes(2);
-      expect(mocks.stream).toHaveBeenCalledTimes(2);
-      expect(mocks.send).not.toHaveBeenCalled();
+      expect(loadSeed).toHaveBeenCalledTimes(3);
+      expect(mocks.stream).toHaveBeenCalledTimes(3);
       expect(result.current.hydrateError).toBeNull();
       expect(result.current.isRunning).toBe(false);
+      await act(async () => {
+        await result.current.send("after recovery");
+      });
+      expect(mocks.send).toHaveBeenCalledOnce();
     } finally {
       vi.useRealTimers();
     }
@@ -306,3 +327,69 @@ describe("useHydratedNcpAgent", () => {
     }
   });
 });
+
+describe("useHydratedNcpAgent stream reconciliation", () => {
+  it("reconciles history after the stream opens without overwriting newer live completion", async () => {
+    let subscriber: NcpEndpointSubscriber | null = null;
+    let resolveReconcile: ((seed: { messages: readonly NcpMessage[]; status: "running" }) => void) | null = null;
+    const reconcileSeed = new Promise<{ messages: readonly NcpMessage[]; status: "running" }>((resolve) => {
+      resolveReconcile = resolve;
+    });
+    const client = {
+      stop: mocks.stop.mockResolvedValue(undefined),
+      stream: mocks.stream.mockImplementation((_payload, observer) => {
+        observer?.onOpen?.();
+        return new Promise<void>(() => {});
+      }),
+      subscribe: vi.fn((nextSubscriber: NcpEndpointSubscriber) => {
+        subscriber = nextSubscriber;
+        return () => {};
+      }),
+    } as unknown as NcpAgentClientEndpoint;
+    const loadSeed = vi
+      .fn()
+      .mockResolvedValueOnce({ messages: [], status: "running" })
+      .mockImplementationOnce(() => reconcileSeed);
+    const finalMessage: NcpMessage = {
+      id: "assistant-gap",
+      sessionId: "session-gap",
+      role: "assistant",
+      status: "final",
+      parts: [{ type: "text", text: "Recovered without refresh" }],
+      timestamp: "2026-08-14T00:00:00.000Z",
+    };
+    const { result } = renderHook(() =>
+      useHydratedNcpAgent({
+        sessionId: "session-gap",
+        client,
+        loadSeed,
+      }),
+    );
+
+    await waitFor(() => expect(loadSeed).toHaveBeenCalledTimes(2));
+    act(() => {
+      subscriber?.({
+        type: NcpEventType.MessageSent,
+        payload: { sessionId: "session-gap", message: finalMessage },
+      });
+      subscriber?.({
+        type: NcpEventType.RunFinished,
+        payload: { sessionId: "session-gap", runId: "run-gap" },
+      });
+    });
+    await waitFor(() => expect(result.current.visibleMessages).toEqual([finalMessage]));
+
+    await act(async () => {
+      resolveReconcile?.({
+        messages: [{ ...finalMessage, status: "streaming", parts: [{ type: "text", text: "Recovered" }] }],
+        status: "running",
+      });
+      await Promise.resolve();
+    });
+
+    await waitFor(() => {
+      expect(result.current.visibleMessages).toEqual([finalMessage]);
+      expect(result.current.isRunning).toBe(false);
+    });
+  });
+});

package/src/features/chat/features/ncp/hooks/use-ncp-session-conversation.ts

@@ -19,6 +19,8 @@ import { nextclawClient } from "@/shared/lib/api";
 
 const NCP_AGENT_UNAVAILABLE_DURING_STARTUP =
   "ncp agent unavailable during startup";
+const NCP_AGENT_STREAM_OPEN_TIMEOUT_MS = 15_000;
+const NCP_AGENT_STREAM_IDLE_TIMEOUT_MS = 70_000;
 
 export { fetchNcpSessionConversationSeed } from "@/features/chat/features/ncp/hooks/use-ncp-session-message-history";
 
@@ -42,6 +44,8 @@ export function createNcpSessionConversationClient(): NcpHttpAgentClientEndpoint
     baseUrl: API_BASE,
     basePath: "/api/ncp/agent",
     fetchImpl: createNcpAppClientFetch(),
+    streamOpenTimeoutMs: NCP_AGENT_STREAM_OPEN_TIMEOUT_MS,
+    streamIdleTimeoutMs: NCP_AGENT_STREAM_IDLE_TIMEOUT_MS,
   });
 }
 

package/src/features/chat/features/ncp/hooks/use-ncp-session-queries.ts

@@ -1,6 +1,7 @@
 import { useQuery } from '@tanstack/react-query';
 import {
   fetchNcpSessionSkills,
+  fetchNcpSessionTokenUsage,
   fetchNcpSessions
 } from '@/shared/lib/api';
 
@@ -30,3 +31,12 @@ export function useNcpSessionSkills(params: {
     ...ncpSessionQueryDefaults
   });
 }
+
+export function useNcpSessionTokenUsage(sessionId: string | null) {
+  return useQuery({
+    queryKey: ['ncp-session-token-usage', sessionId],
+    queryFn: () => fetchNcpSessionTokenUsage(sessionId as string),
+    enabled: Boolean(sessionId),
+    ...ncpSessionQueryDefaults
+  });
+}