@nextclaw/ui 0.15.2 → 0.15.4

package/src/features/chat/components/layout/chat-sidebar-toolbar.tsx

@@ -3,9 +3,9 @@ import { IconActionButton } from "@/shared/components/ui/actions/icon-action-but
 import { Input } from "@/shared/components/ui/input";
 import {
   Popover,
-  PopoverContent,
   PopoverTrigger,
 } from "@/shared/components/ui/popover";
+import { ChatPopoverContent } from "@/features/chat/components/chat-popover-content";
 import { SessionContextIconNode } from "@/features/chat/features/session/components/session-context-icon";
 import { ChatSessionTypeMenu } from "@/features/chat/features/session-type/components/chat-session-type-menu";
 import type { ChatSessionTypeOption } from "@/features/chat/features/session-type/utils/chat-session-type.utils";
@@ -175,7 +175,7 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
                   )}
                 />
               </PopoverTrigger>
-              <PopoverContent
+              <ChatPopoverContent
                 align="start"
                 side="right"
                 className="w-56 rounded-2xl border border-border bg-popover p-1.5 text-popover-foreground shadow-[0_24px_60px_-28px_rgba(15,23,42,0.38)]"
@@ -188,7 +188,7 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
                     onCreateMenuOpenChange(false);
                   }}
                 />
-              </PopoverContent>
+              </ChatPopoverContent>
             </Popover>
           ) : null}
         </div>
@@ -238,7 +238,7 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
                   )}
                 />
               </PopoverTrigger>
-              <PopoverContent
+              <ChatPopoverContent
                 align="end"
                 className="w-56 rounded-2xl border border-border bg-popover p-1.5 text-popover-foreground shadow-[0_24px_60px_-28px_rgba(15,23,42,0.38)]"
               >
@@ -250,7 +250,7 @@ export function ChatSidebarDesktopToolbar(props: ChatSidebarToolbarProps) {
                     onCreateMenuOpenChange(false);
                   }}
                 />
-              </PopoverContent>
+              </ChatPopoverContent>
             </Popover>
           ) : null}
         </div>
@@ -315,7 +315,7 @@ export function ChatSidebarMobileToolbar(props: ChatSidebarToolbarProps) {
                 className="h-9 w-9 shrink-0 rounded-full bg-muted text-foreground shadow-none hover:bg-accent hover:text-accent-foreground"
               />
             </PopoverTrigger>
-            <PopoverContent
+            <ChatPopoverContent
               align="end"
               className="w-60 rounded-3xl border border-border bg-popover p-2 text-popover-foreground shadow-[0_24px_70px_-30px_rgba(15,23,42,0.45)]"
             >
@@ -329,7 +329,7 @@ export function ChatSidebarMobileToolbar(props: ChatSidebarToolbarProps) {
                   onCreateMenuOpenChange(false);
                 }}
               />
-            </PopoverContent>
+            </ChatPopoverContent>
           </Popover>
         ) : (
           <IconActionButton

package/src/features/chat/components/layout/chat-sidebar-utility-menu.tsx

@@ -1,9 +1,9 @@
 import { NavLink } from "react-router-dom";
 import {
   Popover,
-  PopoverContent,
   PopoverTrigger,
 } from "@/shared/components/ui/popover";
+import { ChatPopoverContent } from "@/features/chat/components/chat-popover-content";
 import {
   Select,
   SelectContent,
@@ -52,12 +52,6 @@ type ChatSidebarUtilityMenuProps = {
   collapsed?: boolean;
 };
 
-function isChatComposerFocusTarget(target: EventTarget | null): boolean {
-  return target instanceof HTMLElement && Boolean(
-    target.closest('.nextclaw-chat-input-bar-shell [role="textbox"][contenteditable="true"]'),
-  );
-}
-
 export function ChatSidebarUtilityMenu({
   isOpen,
   onOpenChange,
@@ -108,7 +102,7 @@ export function ChatSidebarUtilityMenu({
           <button
             type="button"
             aria-label={t("settingsMenu")}
-            className="flex w-full items-center gap-2.5 rounded-xl px-3 py-2 text-[13px] font-medium text-muted-foreground transition-colors duration-base hover:bg-gray-200/60 hover:text-gray-900 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/35"
+            className="flex w-full items-center gap-2.5 rounded-xl px-3 py-2 text-[13px] font-medium text-muted-foreground transition-colors duration-base hover:bg-gray-200/60 hover:text-gray-900 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border"
           >
             <Settings className="h-4 w-4 shrink-0 text-muted-foreground/70" />
             <span className="min-w-0 flex-1 text-left">{t("settings")}</span>
@@ -118,15 +112,10 @@ export function ChatSidebarUtilityMenu({
           </button>
         </PopoverTrigger>
       )}
-      <PopoverContent
+      <ChatPopoverContent
         side={collapsed ? "right" : "top"}
         align={collapsed ? "end" : "start"}
         className="w-64 p-2"
-        onFocusOutside={(event) => {
-          if (isChatComposerFocusTarget(event.detail.originalEvent.target)) {
-            event.preventDefault();
-          }
-        }}
       >
         <div className="space-y-1">
           <NavLink
@@ -177,7 +166,7 @@ export function ChatSidebarUtilityMenu({
           onSelect={onSelectLanguage}
           onCloseMenu={() => onOpenChange(false)}
         />
-      </PopoverContent>
+      </ChatPopoverContent>
     </Popover>
   );
 }

package/src/features/chat/features/conversation/components/__tests__/session-conversation-input.streaming.test.tsx

@@ -6,7 +6,7 @@ import {
   type MutableRefObject,
 } from 'react';
 import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
+import { afterEach, describe, expect, it, vi } from 'vitest';
 import {
   createChatComposerTextNode,
   type ChatComposerNode,
@@ -26,9 +26,14 @@ import type {
   SessionConversationInputSnapshot,
 } from '@/features/chat/features/conversation/hooks/use-session-conversation-input-state';
 import { useSessionConversationInputState } from '@/features/chat/features/conversation/hooks/use-session-conversation-input-state';
+import { useChatMessageLayoutStore } from '@/features/chat/stores/chat-message-layout.store';
 
 const uploadNcpAssetsMock = vi.hoisted(() => vi.fn());
 
+afterEach(() => {
+  useChatMessageLayoutStore.getState().setLayout('card');
+});
+
 vi.mock('@/app/hooks/use-viewport-layout', () => ({
   useViewportLayout: () => ({ isDesktop: true, isMobile: false }),
 }));
@@ -190,6 +195,20 @@ function StreamingSessionConversationInputHarness({
 }
 
 describe('SessionConversationInput streaming stability', () => {
+  it('aligns the default input with the flat message reading track', () => {
+    useChatMessageLayoutStore.getState().setLayout('flat');
+    const controlRef: MutableRefObject<StreamingInputControl | null> = { current: null };
+
+    render(<StreamingSessionConversationInputHarness controlRef={controlRef} />);
+
+    const track = document.querySelector(
+      '[data-chat-conversation-track="flat"][data-chat-conversation-track-width="composer"]',
+    );
+    expect(track?.className).toContain('max-w-[min(54rem,100%)]');
+    expect(track?.querySelector('.nextclaw-chat-input-bar-shell')).toBeTruthy();
+    expect(track?.firstElementChild?.className).toContain('px-0');
+  });
+
   it('keeps IME composition stable while simulated streamed output rerenders the owner', async () => {
     const controlRef: MutableRefObject<StreamingInputControl | null> = { current: null };
     render(<StreamingSessionConversationInputHarness controlRef={controlRef} />);

package/src/features/chat/features/conversation/components/session-conversation-input.tsx

@@ -49,6 +49,8 @@ import {
 } from '@/features/chat/managers/chat-recent-skills.manager';
 
 import { useSessionConversationInputAttachments } from '@/features/chat/features/conversation/hooks/use-session-conversation-input-attachments';
+import { ChatConversationTrack } from '@/features/chat/components/conversation/chat-conversation-track';
+import { useChatMessageLayoutStore } from '@/features/chat/stores/chat-message-layout.store';
 import type { useSessionConversationInputQuery } from '@/features/chat/features/conversation/hooks/use-session-conversation-input-query';
 import type {
   SessionConversationQueuedInput,
@@ -187,6 +189,7 @@ export const SessionConversationInput = memo(function SessionConversationInput(p
   } = props;
   const presenter = usePresenter();
   const { language } = useI18n();
+  const messageLayout = useChatMessageLayoutStore((state) => state.layout);
   const { isMobile } = useViewportLayout();
   const inputBarRef = useRef<ChatInputBarHandle | null>(null);
   const fileInputRef = useRef<HTMLInputElement | null>(null);
@@ -389,62 +392,74 @@ export const SessionConversationInput = memo(function SessionConversationInput(p
     selectedSkills: inputSnapshot.selectedSkills,
   });
 
+  const useReadingTrack = surface === 'default' && messageLayout === 'flat';
+  const inputBar = (
+    <ChatInputBar
+      ref={inputBarRef}
+      surface={useReadingTrack ? 'embedded' : surface}
+      sendError={inputSnapshot.sendError}
+      sendErrorDetailsLabel={t('chatErrorDetails', language)}
+      topSlot={controller.queuedInputs.length > 0
+        ? <SessionQueuedInputRows controller={controller} />
+        : null}
+      composer={{
+        nodes: [...inputSnapshot.nodes],
+        placeholder: textareaPlaceholder,
+        disabled: inputDisabled,
+        onNodesChange: handleNodesChange,
+        onFilesAdd: handleFilesAdd,
+        inputSurfaceTriggerSpecs: inputSurfaceState.triggerSpecs,
+        onInputSurfaceTriggerChange: setInputSurfaceTrigger,
+      }}
+      inputSurface={inputSurfaceState.panel ?? undefined}
+      hint={buildModelStateHint({
+        isModelOptionsLoading,
+        isModelOptionsEmpty,
+        onGoToProviders: presenter.chatUiManager.goToProviders,
+        texts: {
+          noModelOptionsLabel: t('chatModelNoOptions'),
+          configureProviderLabel: t('chatGoConfigureProvider'),
+        },
+      })}
+      toolbar={{
+        selects: [],
+        trailingSelects: toolbarSelects,
+        accessories: [
+          {
+            key: 'attach',
+            label: t('chatInputAttach'),
+            icon: 'paperclip' as const,
+            iconOnly: true,
+            disabled: !attachmentSupported || inputDisabled,
+            onClick: () => fileInputRef.current?.click(),
+          },
+        ],
+        skillPicker,
+        actions: {
+          isSending: controller.isSending,
+          canStopGeneration: controller.canStopGeneration,
+          sendDisabled: controller.sendDisabled,
+          stopDisabled: controller.stopDisabled,
+          stopHint: t('chatStopUnavailable'),
+          sendButtonLabel: controller.isSending ? t('chatQueueSend') : t('chatSend'),
+          stopButtonLabel: t('chatStop'),
+          contextWindow,
+          onSend: controller.send,
+          onStop: controller.stop,
+        },
+      }}
+    />
+  );
+
   return (
     <>
-      <ChatInputBar
-        ref={inputBarRef}
-        surface={surface}
-        topSlot={controller.queuedInputs.length > 0
-          ? <SessionQueuedInputRows controller={controller} />
-          : null}
-        composer={{
-          nodes: [...inputSnapshot.nodes],
-          placeholder: textareaPlaceholder,
-          disabled: inputDisabled,
-          onNodesChange: handleNodesChange,
-          onFilesAdd: handleFilesAdd,
-          inputSurfaceTriggerSpecs: inputSurfaceState.triggerSpecs,
-          onInputSurfaceTriggerChange: setInputSurfaceTrigger,
-        }}
-        inputSurface={inputSurfaceState.panel ?? undefined}
-        hint={buildModelStateHint({
-          isModelOptionsLoading,
-          isModelOptionsEmpty,
-          onGoToProviders: presenter.chatUiManager.goToProviders,
-          texts: {
-            noModelOptionsLabel: t('chatModelNoOptions'),
-            configureProviderLabel: t('chatGoConfigureProvider'),
-          },
-        })}
-        toolbar={{
-          selects: [],
-          trailingSelects: toolbarSelects,
-          accessories: [
-            {
-              key: 'attach',
-              label: t('chatInputAttach'),
-              icon: 'paperclip' as const,
-              iconOnly: true,
-              disabled: !attachmentSupported || inputDisabled,
-              onClick: () => fileInputRef.current?.click(),
-            },
-          ],
-          skillPicker,
-          actions: {
-            sendError: inputSnapshot.sendError,
-            isSending: controller.isSending,
-            canStopGeneration: controller.canStopGeneration,
-            sendDisabled: controller.sendDisabled,
-            stopDisabled: controller.stopDisabled,
-            stopHint: t('chatStopUnavailable'),
-            sendButtonLabel: controller.isSending ? t('chatQueueSend') : t('chatSend'),
-            stopButtonLabel: t('chatStop'),
-            contextWindow,
-            onSend: controller.send,
-            onStop: controller.stop,
-          },
-        }}
-      />
+      {useReadingTrack ? (
+        <ChatConversationTrack className="pb-4 pt-2" width="composer">
+          {inputBar}
+        </ChatConversationTrack>
+      ) : (
+        inputBar
+      )}
       <input
         ref={fileInputRef}
         type="file"

package/src/features/chat/features/conversation/components/session-queued-input-rows.tsx

@@ -44,7 +44,7 @@ function QueuedInputIconButton({
             aria-label={label}
             disabled={disabled}
             onClick={onClick}
-            className="inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:text-muted-foreground/50"
+            className="inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:cursor-not-allowed disabled:text-muted-foreground/50"
           >
             {children}
           </button>

package/src/features/chat/features/message/components/__tests__/chat-message-list.container.test.tsx

@@ -9,6 +9,8 @@ const captures = vi.hoisted(() => ({
     messages: unknown[];
     onToolAction?: (action: unknown) => void;
     onFileOpen?: (action: unknown) => void;
+    onAttachmentOpen?: (file: unknown) => void;
+    onInlineTokenClick?: (token: unknown) => void;
     renderInlineDisplay?: (display: unknown) => unknown;
     renderPanelAppCard?: (panelApp: unknown) => unknown;
     texts?: Record<string, unknown>;
@@ -16,6 +18,7 @@ const captures = vi.hoisted(() => ({
   language: "en",
   openFilePreview: vi.fn(),
   handleToolAction: vi.fn(),
+  showContent: vi.fn(),
 }));
 
 vi.mock("@nextclaw/agent-chat-ui", async (importOriginal) => {
@@ -26,6 +29,7 @@ vi.mock("@nextclaw/agent-chat-ui", async (importOriginal) => {
       messages: unknown[];
       onToolAction?: (action: unknown) => void;
       onFileOpen?: (action: unknown) => void;
+      onAttachmentOpen?: (file: unknown) => void;
       renderInlineDisplay?: (display: unknown) => unknown;
       renderPanelAppCard?: (panelApp: unknown) => unknown;
       texts?: Record<string, unknown>;
@@ -42,6 +46,9 @@ vi.mock("@/features/chat/components/providers/chat-presenter.provider", () => ({
       openFilePreview: captures.openFilePreview,
       handleToolAction: captures.handleToolAction,
     },
+    chatUiManager: {
+      showContent: captures.showContent,
+    },
   }),
 }));
 
@@ -59,6 +66,7 @@ beforeEach(() => {
   captures.language = "en";
   captures.openFilePreview.mockReset();
   captures.handleToolAction.mockReset();
+  captures.showContent.mockReset();
 });
 
 it("reuses adapted message references when the source message object is unchanged", () => {
@@ -300,6 +308,41 @@ it("wires markdown file link actions to the workspace file preview manager", ()
   expect(captures.openFilePreview).toHaveBeenCalledWith(action);
 });
 
+it("opens message attachments in the workspace file preview", () => {
+  const message = {
+    id: "assistant-attachment",
+    sessionId: "session-1",
+    role: "assistant",
+    status: "final",
+    timestamp: "2026-03-31T10:05:00.000Z",
+    parts: [
+      {
+        type: "file",
+        name: "spec.pdf",
+        mimeType: "application/pdf",
+        contentBase64: "cGRm",
+      },
+    ],
+  } satisfies NcpMessage;
+
+  render(<ChatMessageListContainer messages={[message]} isSending={false} />);
+  captures.renders[captures.renders.length - 1]?.onAttachmentOpen?.({
+    label: "spec.pdf",
+    mimeType: "application/pdf",
+    dataUrl: "data:application/pdf;base64,cGRm",
+    isImage: false,
+  });
+
+  expect(captures.openFilePreview).toHaveBeenCalledWith({
+    path: "spec.pdf",
+    label: "spec.pdf",
+    viewMode: "preview",
+    contentUrl: "data:application/pdf;base64,cGRm",
+    mimeType: "application/pdf",
+  });
+  expect(captures.showContent).not.toHaveBeenCalled();
+});
+
 it("renders context inheritance as a divider without repeating inherited messages", () => {
   const inheritedMessage = {
     id: "child-session:inherited:1",
@@ -387,7 +430,7 @@ it("keeps Hermes tool invocation parts as tool cards instead of flattening them
   });
 });
 
-it("passes localized attachment card texts to the shared chat UI", () => {
+it("passes localized message presentation texts to the shared chat UI", () => {
   captures.language = "zh";
 
   render(<ChatMessageListContainer messages={[]} isSending={false} />);
@@ -400,6 +443,24 @@ it("passes localized attachment card texts to the shared chat UI", () => {
       pdf: "chatAttachmentCategoryPdf",
       generic: "chatAttachmentCategoryGeneric",
     },
+    reasoningCharacterCountTemplates: {
+      inProgress: "chatReasoningInProgressCharacterCount",
+      completed: "chatReasoningCompletedCharacterCount",
+    },
+    toolStatusLabels: {
+      terminal: {
+        running: "chatToolTerminalRunning",
+        success: "chatToolTerminalSuccess",
+        error: "chatToolTerminalError",
+        cancelled: "chatToolTerminalCancelled",
+      },
+      fileEdit: {
+        running: "chatToolFileEditRunning",
+        success: "chatToolFileEditSuccess",
+        error: "chatToolFileEditError",
+        cancelled: "chatToolFileEditCancelled",
+      },
+    },
   });
 });
 

package/src/features/chat/features/message/components/chat-message-list.container.tsx

@@ -1,7 +1,8 @@
-import { useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import type { NcpMessage } from "@nextclaw/ncp";
 import {
   type ChatInlineDisplayViewModel,
+  type ChatInlineTokenViewModel,
   type ChatMessageViewModel,
   ChatMessageList,
 } from "@nextclaw/agent-chat-ui";
@@ -23,7 +24,12 @@ import {
 } from "@/features/chat/features/session/utils/ncp-session-context-metadata.utils";
 import { AgentIdentityAvatar } from "@/shared/components/common/agent-identity";
 import { ChatInlinePanelAppCard } from "@/features/chat/features/message/components/chat-inline-panel-app-card";
+import { useChatQueryStore } from "@/features/chat/stores/ncp-chat-query.store";
+import { useChatSessionListStore } from "@/features/chat/stores/chat-session-list.store";
+import { useChatMessageLayoutStore } from "@/features/chat/stores/chat-message-layout.store";
+import { useNcpChatSelectedSession } from "@/features/chat/features/ncp/hooks/use-ncp-chat-derived-state";
 import { useI18n } from "@/app/components/i18n-provider";
+import { buildServerPathContentUrl } from "@/shared/lib/api";
 import { formatDateTime, t } from "@/shared/lib/i18n";
 
 type ChatMessageListContainerProps = {
@@ -56,7 +62,6 @@ function renderChatInlineDisplay(display: ChatInlineDisplayViewModel) {
     />
   );
 }
-
 type ContextInheritanceTimelineView = {
   sourceSessionId: string;
   inheritedMessageCount: number;
@@ -284,6 +289,16 @@ export function ChatMessageListContainer({
 }: ChatMessageListContainerProps) {
   const presenter = usePresenter();
   const { language } = useI18n();
+  const messageLayout = useChatMessageLayoutStore((state) => state.layout);
+  const selectedSessionKey = useChatSessionListStore(
+    (state) => state.snapshot.selectedSessionKey,
+  );
+  const selectedSession = useNcpChatSelectedSession(selectedSessionKey);
+  const localFileBasePath = selectedSession?.workingDir ?? selectedSession?.projectRoot ?? null;
+  const resolveFileContentUrl = useCallback(
+    (action: { path: string }) => buildServerPathContentUrl(action.path, localFileBasePath),
+    [localFileBasePath],
+  );
   const texts = useMemo(
     () => buildChatMessageAdapterTexts(language),
     [language],
@@ -342,6 +357,48 @@ export function ChatMessageListContainer({
     () => buildTimelineItems({ rawMessages, messages }),
     [messages, rawMessages],
   );
+  const sessionSkillsQuery = useChatQueryStore((state) => state.snapshot.sessionSkillsQuery);
+  const handleInlineTokenClick = useCallback(
+    (token: ChatInlineTokenViewModel) => {
+      if (token.kind !== "skill") {
+        return;
+      }
+      const skillKey = token.key.trim();
+      if (!skillKey) {
+        return;
+      }
+      const records = sessionSkillsQuery?.data?.records ?? [];
+      const matched = records.find((record) => record.ref === skillKey || record.name === skillKey);
+      const skillPath = matched?.path?.trim();
+      if (!skillPath) {
+        return;
+      }
+      presenter.chatThreadManager.openFilePreview({
+        path: skillPath,
+        label: token.label || matched?.name || skillKey,
+        viewMode: "preview",
+        previewViewer: "rendered",
+      });
+    },
+    [presenter.chatThreadManager, sessionSkillsQuery],
+  );
+  const handleAttachmentOpen = useCallback(
+    (file: { label: string; mimeType: string; dataUrl?: string; sizeBytes?: number; isImage: boolean }) => {
+      const contentUrl = file.dataUrl?.trim();
+      if (!contentUrl) {
+        return;
+      }
+      const label = file.label.trim() || "attachment";
+      presenter.chatThreadManager.openFilePreview({
+        path: label,
+        label,
+        viewMode: "preview",
+        contentUrl,
+        mimeType: file.mimeType,
+      });
+    },
+    [presenter.chatThreadManager],
+  );
   return (
     <div className={className}>
       {timelineItems.map((item, index) =>
@@ -352,12 +409,16 @@ export function ChatMessageListContainer({
         ) : (
           <ChatMessageList
             key={item.key}
+            layout={messageLayout}
             messages={item.messages}
             isSending={index === timelineItems.length - 1 ? isSending : false}
             hasAssistantDraft={hasAssistantDraft}
             texts={messageTexts}
             onToolAction={presenter.chatThreadManager.handleToolAction}
             onFileOpen={presenter.chatThreadManager.openFilePreview}
+            onAttachmentOpen={handleAttachmentOpen}
+            onInlineTokenClick={handleInlineTokenClick}
+            resolveFileContentUrl={resolveFileContentUrl}
             renderInlineDisplay={renderChatInlineDisplay}
             renderToolAgent={(agentId) => (
               <AgentIdentityAvatar

package/src/features/chat/features/message/utils/__tests__/chat-message-file-operation.utils.test.ts

@@ -63,6 +63,36 @@ it("builds edit-file previews from structured args before the tool finishes", ()
   expect(editLines[1]).not.toHaveProperty("newLineNumber");
 });
 
+it("keeps incomplete edit-file arguments available before preview fields arrive", () => {
+  const partialArgs = '{"path":"src/app.ts","oldText":';
+  const adapted = adapt([
+    {
+      id: "assistant-partial-edit-input",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.PARTIAL_CALL,
+            toolCallId: "edit-partial-1",
+            toolName: "edit_file",
+            args: partialArgs,
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "edit_file",
+      input: partialArgs,
+      statusTone: "running",
+    },
+  });
+});
+
 it("uses structured edit-file result line numbers after the tool finishes", () => {
   const adapted = adapt([
     {

package/src/features/chat/features/message/utils/__tests__/chat-message-process-summary.utils.test.ts

@@ -18,7 +18,7 @@ const baseAssistantMessage = {
       toolCallId: "tool-1",
       toolName: "exec_command",
       state: "result",
-      args: "{\"cmd\":\"git status\"}",
+      args: '{"cmd":"git status"}',
       result: "clean",
     },
     {
@@ -56,4 +56,14 @@ describe("buildChatMessageProcessSummary", () => {
       label: "Processed 3m 51s",
     });
   });
+
+  it("stays free of tool-activity semantics", () => {
+    const summary = buildChatMessageProcessSummary({
+      message: baseAssistantMessage,
+      processedLabel: "Processed",
+    });
+    expect(summary?.label).toBe("Processed");
+    expect(summary?.label.toLowerCase()).not.toContain("bash");
+    expect(summary?.label.toLowerCase()).not.toContain("read");
+  });
 });

package/src/features/chat/features/message/utils/__tests__/chat-message-texts.utils.test.ts

@@ -0,0 +1,23 @@
+import { expect, it, vi } from "vitest";
+import { buildChatMessageTexts } from "@/features/chat/features/message/utils/chat-message-texts.utils";
+
+vi.mock("@/shared/lib/i18n", () => ({
+  t: (key: string) => key,
+}));
+
+it("provides localized status keys for built-in tool categories", () => {
+  expect(buildChatMessageTexts("zh").toolStatusLabels?.builtIn).toMatchObject({
+    directory: {
+      running: "chatToolDirectoryRunning",
+      success: "chatToolDirectorySuccess",
+      error: "chatToolDirectoryError",
+      cancelled: "chatToolDirectoryCancelled",
+    },
+    memory: {
+      running: "chatToolMemoryRunning",
+      success: "chatToolMemorySuccess",
+      error: "chatToolMemoryError",
+      cancelled: "chatToolMemoryCancelled",
+    },
+  });
+});

package/src/features/chat/features/message/utils/chat-message-process-summary.utils.ts

@@ -68,6 +68,11 @@ function formatLifecycleDuration(message: NcpMessage): string | null {
   return `${seconds}s`;
 }
 
+/**
+ * Outer process collapse only.
+ * Tool activity grouping is a separate layer over consecutive tool-cards
+ * and must not be mixed into this summary.
+ */
 export function buildChatMessageProcessSummary({
   message,
   processedLabel,