@nextclaw/ui 0.13.13 → 0.14.0

package/src/features/chat/{components/conversation → features/input/components}/chat-input-bar.container.tsx

@@ -3,22 +3,34 @@ import { ChatInputBar, type ChatInputBarHandle } from '@nextclaw/agent-chat-ui';
 import { DEFAULT_NCP_ATTACHMENT_MAX_BYTES, uploadFilesAsNcpDraftAttachments } from '@nextclaw/ncp-react';
 import { uploadNcpAssets } from '@/shared/lib/api';
 import type { SessionSkillEntryView } from '@/shared/lib/api';
-import { buildChatSlashItems, buildModelStateHint, buildModelToolbarSelect, buildSkillPickerModel, buildThinkingToolbarSelect, type ChatModelRecord, type ChatSkillRecord, type ChatThinkingLevel } from '@/features/chat/utils/chat-input-bar.utils';
+import { buildChatSlashItems, buildModelStateHint, buildModelToolbarSelect, buildSkillPickerModel, buildThinkingToolbarSelect, type ChatModelRecord, type ChatSkillRecord, type ChatThinkingLevel } from '@/features/chat/features/input/utils/chat-input-bar.utils';
 import { usePresenter } from '@/features/chat/components/providers/chat-presenter.provider';
 import { useI18n } from '@/app/components/i18n-provider';
 import { useViewportLayout } from '@/app/hooks/use-viewport-layout';
 import { useChatInputStore } from '@/features/chat/stores/chat-input.store';
+import {
+  useNcpChatProviderStateResolved,
+  useNcpChatSelectedSession,
+} from '@/features/chat/features/ncp/hooks/use-ncp-chat-derived-state';
+import { useChatQueryStore } from '@/features/chat/stores/ncp-chat-query.store';
+import { useChatSessionListStore } from '@/features/chat/stores/chat-session-list.store';
+import {
+  buildNcpChatProviderModelOptions,
+  filterNcpChatModelOptionsBySessionType,
+} from '@/features/chat/features/ncp/utils/ncp-chat-query-derived.utils';
+import { useChatSessionTypeState } from '@/features/chat/features/session-type/hooks/use-chat-session-type-state';
 import { chatRecentModelsManager, CHAT_RECENT_MODELS_MIN_OPTIONS } from '@/features/chat/managers/chat-recent-models.manager';
 import { chatRecentSkillsManager, CHAT_RECENT_SKILLS_MIN_OPTIONS } from '@/features/chat/managers/chat-recent-skills.manager';
-import { deriveSelectedSkillsFromComposer } from '@/features/chat/utils/chat-composer-state.utils';
-import { hasNcpChatModelOptions, isNcpChatComposerDisabled, isNcpChatModelOptionsEmpty, isNcpChatModelOptionsLoading, isNcpChatSendDisabled } from '@/features/chat/utils/ncp-chat-input-availability.utils';
-import { useSelectedSessionContextWindowIndicator } from '@/features/chat/hooks/use-selected-session-context-window-indicator';
+import { deriveSelectedSkillsFromComposer } from '@/features/chat/features/input/utils/chat-composer-state.utils';
+import { hasNcpChatModelOptions, isNcpChatComposerDisabled, isNcpChatModelOptionsEmpty, isNcpChatModelOptionsLoading, isNcpChatSendDisabled } from '@/features/chat/features/input/utils/ncp-chat-input-availability.utils';
+import { useSelectedSessionContextWindowIndicator } from '@/features/chat/features/session/hooks/use-selected-session-context-window-indicator';
 import { useSystemStatus } from '@/features/system-status';
-import { isNcpChatRuntimeBlocked } from '@/features/chat/utils/ncp-chat-runtime-availability.utils';
+import { isNcpChatRuntimeBlocked } from '@/features/chat/features/runtime/utils/ncp-chat-runtime-availability.utils';
 import { t } from '@/shared/lib/i18n';
 import { toast } from 'sonner';
 
-type ChatInputStoreSnapshot = ReturnType<typeof useChatInputStore.getState>['snapshot']; type ChatPresenter = ReturnType<typeof usePresenter>;
+type ChatInputStoreSnapshot = ReturnType<typeof useChatInputStore.getState>['snapshot'];
+const EMPTY_SESSION_SKILL_RECORDS: SessionSkillEntryView[] = [];
 
 function buildThinkingLabels(): Record<ChatThinkingLevel, string> {
   return {
@@ -92,12 +104,16 @@ function useChatInputBarLabels(language: string) {
     allSkillsLabel: t('chatPickerAllSkills')
   };
 }
-function useChatInputBarCollections(snapshot: ChatInputStoreSnapshot, skillScopeLabels: Record<'builtin' | 'project' | 'workspace', string>) {
+function useChatInputBarCollections(params: {
+  modelOptions: ChatInputStoreSnapshot['modelOptions'];
+  skillRecords: SessionSkillEntryView[];
+  skillScopeLabels: Record<'builtin' | 'project' | 'workspace', string>;
+}) {
   const skillRecords = useMemo(
-    () => toSkillRecords(snapshot.skillRecords, skillScopeLabels),
-    [snapshot.skillRecords, skillScopeLabels]
+    () => toSkillRecords(params.skillRecords, params.skillScopeLabels),
+    [params.skillRecords, params.skillScopeLabels]
   );
-  const modelRecords = useMemo(() => toModelRecords(snapshot.modelOptions), [snapshot.modelOptions]);
+  const modelRecords = useMemo(() => toModelRecords(params.modelOptions), [params.modelOptions]);
   return {
     skillRecords,
     modelRecords,
@@ -115,8 +131,9 @@ function useChatInputBarCollections(snapshot: ChatInputStoreSnapshot, skillScope
     })
   };
 }
-function useChatInputBarAttachments(params: { attachmentSupported: boolean; inputBarRef: RefObject<ChatInputBarHandle | null>; presenter: ChatPresenter; }) {
-  const { attachmentSupported, inputBarRef, presenter } = params;
+function useChatInputBarAttachments(params: { attachmentSupported: boolean; inputBarRef: RefObject<ChatInputBarHandle | null>; }) {
+  const { attachmentSupported, inputBarRef } = params;
+  const presenter = usePresenter();
   const showAttachmentError = useCallback((reason: 'unsupported-type' | 'too-large' | 'read-failed') => {
     if (reason === 'unsupported-type') {
       toast.error(t('chatInputAttachmentUnsupported'));
@@ -156,8 +173,8 @@ function useChatInputBarAttachments(params: { attachmentSupported: boolean; inpu
     }, [handleFilesAdd])
   };
 }
-function buildToolbarSelects(params: { allModelsLabel: string; hasModelOptions: boolean; isModelOptionsLoading: boolean; modelRecords: ChatModelRecord[]; presenter: ChatPresenter; recentModelValues: string[]; recentModelsLabel: string; selectedModel: string; selectedThinkingLevel: ChatThinkingLevel | null; thinkingSupportedLevels: ChatThinkingLevel[]; thinkingDefaultLevel: ChatThinkingLevel | null; }) {
-  const { allModelsLabel, hasModelOptions, isModelOptionsLoading, modelRecords, presenter, recentModelValues, recentModelsLabel, selectedModel, selectedThinkingLevel, thinkingSupportedLevels, thinkingDefaultLevel } = params;
+function buildToolbarSelects(params: { allModelsLabel: string; hasModelOptions: boolean; isModelOptionsLoading: boolean; modelRecords: ChatModelRecord[]; onModelChange: (value: string) => void; onThinkingChange: (value: ChatThinkingLevel | null) => void; recentModelValues: string[]; recentModelsLabel: string; selectedModel: string; selectedThinkingLevel: ChatThinkingLevel | null; thinkingSupportedLevels: ChatThinkingLevel[]; thinkingDefaultLevel: ChatThinkingLevel | null; }) {
+  const { allModelsLabel, hasModelOptions, isModelOptionsLoading, modelRecords, onModelChange, onThinkingChange, recentModelValues, recentModelsLabel, selectedModel, selectedThinkingLevel, thinkingSupportedLevels, thinkingDefaultLevel } = params;
   return [
     buildModelToolbarSelect({
       modelOptions: modelRecords,
@@ -165,7 +182,7 @@ function buildToolbarSelects(params: { allModelsLabel: string; hasModelOptions:
       selectedModel,
       isModelOptionsLoading,
       hasModelOptions,
-      onValueChange: presenter.chatInputManager.selectModel,
+      onValueChange: onModelChange,
       texts: {
         modelSelectPlaceholder: t('chatSelectModel'),
         modelNoOptionsLabel: t('chatModelNoOptions'),
@@ -177,22 +194,22 @@ function buildToolbarSelects(params: { allModelsLabel: string; hasModelOptions:
       supportedLevels: thinkingSupportedLevels,
       selectedThinkingLevel,
       defaultThinkingLevel: thinkingDefaultLevel,
-      onValueChange: (value) => presenter.chatInputManager.selectThinkingLevel(value),
+      onValueChange: onThinkingChange,
       texts: {
         thinkingLabels: buildThinkingLabels()
       }
     })
   ].filter((item): item is NonNullable<typeof item> => item !== null);
 }
-function buildSkillPicker(params: { allSkillsLabel: string; presenter: ChatPresenter; recentSkillGroupValues: string[]; recentSkillValues: string[]; recentSkillsLabel: string; skillRecords: ChatSkillRecord[]; snapshot: ChatInputStoreSnapshot; }) {
-  const { allSkillsLabel, presenter, recentSkillGroupValues, recentSkillValues, recentSkillsLabel, skillRecords, snapshot } = params;
+function buildSkillPicker(params: { allSkillsLabel: string; isSkillsLoading: boolean; onSelectedKeysChange: (keys: string[]) => void; recentSkillGroupValues: string[]; recentSkillValues: string[]; recentSkillsLabel: string; skillRecords: ChatSkillRecord[]; snapshot: ChatInputStoreSnapshot; }) {
+  const { allSkillsLabel, isSkillsLoading, onSelectedKeysChange, recentSkillGroupValues, recentSkillValues, recentSkillsLabel, skillRecords, snapshot } = params;
   return buildSkillPickerModel({
     skillRecords,
     recentSkillValues,
     groupedRecentSkillValues: recentSkillGroupValues,
     selectedSkills: snapshot.selectedSkills,
-    isLoading: snapshot.isSkillsLoading,
-    onSelectedKeysChange: presenter.chatInputManager.selectSkills,
+    isLoading: isSkillsLoading,
+    onSelectedKeysChange,
     texts: {
       title: t('chatSkillsPickerTitle'),
       searchPlaceholder: t('chatSkillsPickerSearchPlaceholder'),
@@ -204,21 +221,100 @@ function buildSkillPicker(params: { allSkillsLabel: string; presenter: ChatPrese
     }
   });
 }
+
+function useChatInputBarQueryState(snapshot: ChatInputStoreSnapshot) {
+  const presenter = usePresenter();
+  const selectedSessionKey = useChatSessionListStore(
+    (state) => state.snapshot.selectedSessionKey,
+  );
+  const selectedSession = useNcpChatSelectedSession(selectedSessionKey);
+  const isProviderStateResolved = useNcpChatProviderStateResolved();
+  const config = useChatQueryStore(
+    (state) => state.snapshot.configQuery?.data ?? null,
+  );
+  const providersView = useChatQueryStore(
+    (state) => state.snapshot.providersQuery?.data ?? null,
+  );
+  const templatesView = useChatQueryStore(
+    (state) => state.snapshot.providerTemplatesQuery?.data ?? null,
+  );
+  const sessionTypesData = useChatQueryStore(
+    (state) => state.snapshot.sessionTypesQuery?.data ?? null,
+  );
+  const skillRecords = useChatQueryStore(
+    (state) =>
+      state.snapshot.sessionSkillsQuery?.data?.records ?? EMPTY_SESSION_SKILL_RECORDS,
+  );
+  const isSkillsLoading = useChatQueryStore(
+    (state) =>
+      Boolean(
+        state.snapshot.sessionSkillsQuery?.isLoading ||
+          state.snapshot.sessionSkillsQuery?.isFetching,
+      ),
+  );
+  const sessionTypeState = useChatSessionTypeState({
+    selectedSession,
+    pendingSessionType: snapshot.pendingSessionType,
+    setPendingSessionType: presenter.chatInputManager.setPendingSessionType,
+    sessionTypesData,
+  });
+  const providerModelOptions = useMemo(
+    () =>
+      buildNcpChatProviderModelOptions({
+        config,
+        providersView,
+        templatesView,
+      }),
+    [config, providersView, templatesView],
+  );
+  const modelOptions = useMemo(
+    () =>
+      filterNcpChatModelOptionsBySessionType({
+        modelOptions: providerModelOptions,
+        modelSelectionMode: sessionTypeState.selectedSessionTypeOption?.modelSelectionMode,
+        runtimeDefaultModelLabel: t('chatRuntimeDefaultModel'),
+        supportedModels: sessionTypeState.selectedSessionTypeOption?.supportedModels,
+      }),
+    [
+      providerModelOptions,
+      sessionTypeState.selectedSessionTypeOption?.modelSelectionMode,
+      sessionTypeState.selectedSessionTypeOption?.supportedModels,
+    ],
+  );
+
+  return {
+    isProviderStateResolved,
+    isSkillsLoading,
+    modelOptions,
+    skillRecords,
+  };
+}
+
 export function ChatInputBarContainer() {
   const presenter = usePresenter();
   const { language } = useI18n();
   const { isMobile } = useViewportLayout();
   const snapshot = useChatInputStore((state) => state.snapshot);
+  const inputQueryState = useChatInputBarQueryState(snapshot);
   const isRuntimeBlocked = isNcpChatRuntimeBlocked(useSystemStatus());
   const [slashQuery, setSlashQuery] = useState<string | null>(null);
   const inputBarRef = useRef<ChatInputBarHandle | null>(null);
   const fileInputRef = useRef<HTMLInputElement | null>(null);
   const labels = useChatInputBarLabels(language);
-  const { skillRecords, modelRecords, recentModelValues, recentSkillValues, recentSkillGroupValues } = useChatInputBarCollections(snapshot, labels.skillScopeLabels);
-  const hasModelOptions = hasNcpChatModelOptions(snapshot);
-  const isModelOptionsLoading = isNcpChatModelOptionsLoading(snapshot);
-  const isModelOptionsEmpty = isNcpChatModelOptionsEmpty(snapshot);
-  const inputDisabled = isNcpChatComposerDisabled(snapshot);
+  const { skillRecords, modelRecords, recentModelValues, recentSkillValues, recentSkillGroupValues } = useChatInputBarCollections({
+    modelOptions: inputQueryState.modelOptions,
+    skillRecords: inputQueryState.skillRecords,
+    skillScopeLabels: labels.skillScopeLabels
+  });
+  const availabilitySnapshot = {
+    ...snapshot,
+    isProviderStateResolved: inputQueryState.isProviderStateResolved,
+    modelOptions: inputQueryState.modelOptions
+  };
+  const hasModelOptions = hasNcpChatModelOptions(availabilitySnapshot);
+  const isModelOptionsLoading = isNcpChatModelOptionsLoading(availabilitySnapshot);
+  const isModelOptionsEmpty = isNcpChatModelOptionsEmpty(availabilitySnapshot);
+  const inputDisabled = isNcpChatComposerDisabled(availabilitySnapshot);
   const attachmentSupported = typeof presenter.chatInputManager.addAttachments === 'function';
   const textareaPlaceholder = isModelOptionsEmpty
     ? t('chatModelNoOptions')
@@ -233,7 +329,7 @@ export function ChatInputBarContainer() {
   const resolvedStopHint = snapshot.stopDisabledReason === '__preparing__'
     ? t('chatStopPreparing')
     : snapshot.stopDisabledReason?.trim() || t('chatStopUnavailable');
-  const { handleFilesAdd, handleFileInputChange } = useChatInputBarAttachments({ attachmentSupported, inputBarRef, presenter });
+  const { handleFilesAdd, handleFileInputChange } = useChatInputBarAttachments({ attachmentSupported, inputBarRef });
   useEffect(() => {
     const request = snapshot.composerFocusRequest;
     if (!request) {
@@ -249,7 +345,12 @@ export function ChatInputBarContainer() {
     hasModelOptions,
     isModelOptionsLoading,
     modelRecords,
-    presenter,
+    onModelChange: presenter.chatInputManager.selectModel,
+    onThinkingChange: (value) => {
+      if (value) {
+        presenter.chatInputManager.selectThinkingLevel(value);
+      }
+    },
     recentModelValues,
     recentModelsLabel: labels.recentModelsLabel,
     selectedModel: snapshot.selectedModel,
@@ -259,10 +360,11 @@ export function ChatInputBarContainer() {
   });
   const skillPicker = buildSkillPicker({
     allSkillsLabel: labels.allSkillsLabel,
-    presenter,
+    onSelectedKeysChange: presenter.chatInputManager.selectSkills,
     recentSkillGroupValues,
     recentSkillValues,
     recentSkillsLabel: labels.recentSkillsLabel,
+    isSkillsLoading: inputQueryState.isSkillsLoading,
     skillRecords,
     snapshot
   });
@@ -281,7 +383,7 @@ export function ChatInputBarContainer() {
           onSlashQueryChange: setSlashQuery
         }}
         slashMenu={{
-          isLoading: snapshot.isSkillsLoading,
+          isLoading: inputQueryState.isSkillsLoading,
           items: slashItems,
           onSelectItem: (item: { value?: string }) => {
             if (item.value) {
@@ -299,7 +401,7 @@ export function ChatInputBarContainer() {
         hint={buildModelStateHint({
           isModelOptionsLoading,
           isModelOptionsEmpty,
-          onGoToProviders: presenter.chatInputManager.goToProviders,
+          onGoToProviders: presenter.chatUiManager.goToProviders,
           texts: {
             noModelOptionsLabel: t('chatModelNoOptions'),
             configureProviderLabel: t('chatGoConfigureProvider')
@@ -329,7 +431,7 @@ export function ChatInputBarContainer() {
             isSending: snapshot.isSending,
             canStopGeneration: snapshot.canStopGeneration,
             sendDisabled: isNcpChatSendDisabled({
-              snapshot,
+              snapshot: availabilitySnapshot,
               hasSendableDraft,
               isRuntimeBlocked
             }),

package/src/features/chat/{hooks → features/input/hooks/__tests__}/use-chat-input-bar-controller.test.tsx

@@ -1,6 +1,6 @@
 import type { KeyboardEvent as ReactKeyboardEvent } from 'react';
 import { renderHook, act } from '@testing-library/react';
-import { useChatInputBarController } from '@/features/chat/hooks/use-chat-input-bar-controller';
+import { useChatInputBarController } from '@/features/chat/features/input/hooks/use-chat-input-bar-controller';
 
 function createKeyEvent(
   key: string,

package/src/features/chat/{utils → features/input/utils/__tests__}/chat-composer-state.utils.test.ts

@@ -1,5 +1,5 @@
 import { createChatComposerTextNode, createChatComposerTokenNode } from '@nextclaw/agent-chat-ui';
-import { deriveNcpMessagePartsFromComposer } from './chat-composer-state.utils';
+import { deriveNcpMessagePartsFromComposer } from '../chat-composer-state.utils';
 
 describe('deriveNcpMessagePartsFromComposer', () => {
   it('preserves interleaved text and image token order while serializing skill tokens inline', () => {

package/src/features/chat/{utils → features/input/utils/__tests__}/chat-inline-token.utils.test.ts

@@ -4,7 +4,7 @@ import {
   CHAT_UI_INLINE_TOKENS_METADATA_KEY,
   readInlineTokensFromMetadata,
   splitTextByInlineTokens
-} from './chat-inline-token.utils';
+} from '../chat-inline-token.utils';
 
 describe('chat-inline-token utils', () => {
   it('builds ordered inline skill tokens from composer nodes', () => {

package/src/features/chat/{utils → features/input/utils/__tests__}/chat-input-bar.utils.test.ts

@@ -3,8 +3,8 @@ import {
   buildModelToolbarSelect,
   buildSelectedSkillItems,
   buildSkillPickerModel
-} from './chat-input-bar.utils';
-import type { ChatSkillRecord } from './chat-input-bar.utils';
+} from '../chat-input-bar.utils';
+import type { ChatSkillRecord } from '../chat-input-bar.utils';
 
 function createSkillRecord(partial: Partial<ChatSkillRecord>): ChatSkillRecord {
   return {

package/src/features/chat/{utils → features/input/utils/__tests__}/ncp-chat-input-availability.utils.test.ts

@@ -5,7 +5,7 @@ import {
   isNcpChatModelOptionsEmpty,
   isNcpChatModelOptionsLoading,
   isNcpChatSendDisabled,
-} from '@/features/chat/utils/ncp-chat-input-availability.utils';
+} from '@/features/chat/features/input/utils/ncp-chat-input-availability.utils';
 import type { ChatInputSnapshot } from '@/features/chat/stores/chat-input.store';
 
 function createSnapshot(
@@ -33,6 +33,7 @@ function createSnapshot(
     stopReason: undefined,
     canEditSessionType: true,
     sessionTypeUnavailable: false,
+    sessionTypeUnavailableMessage: null,
     skillRecords: [],
     isSkillsLoading: false,
     selectedSkills: [],

package/src/features/chat/{utils → features/input/utils}/ncp-chat-input-availability.utils.ts

@@ -1,37 +1,37 @@
 import type { ChatInputSnapshot } from '@/features/chat/stores/chat-input.store';
 
-type NcpChatInputAvailabilitySnapshot = Pick<
+type ChatInputAvailabilitySnapshot = Pick<
   ChatInputSnapshot,
   'isProviderStateResolved' | 'modelOptions' | 'sessionTypeUnavailable'
 >;
 
 export function hasNcpChatModelOptions(
-  snapshot: NcpChatInputAvailabilitySnapshot
+  snapshot: ChatInputAvailabilitySnapshot
 ): boolean {
   return snapshot.modelOptions.length > 0;
 }
 
 export function isNcpChatModelOptionsLoading(
-  snapshot: NcpChatInputAvailabilitySnapshot
+  snapshot: ChatInputAvailabilitySnapshot
 ): boolean {
   return !snapshot.isProviderStateResolved && !hasNcpChatModelOptions(snapshot);
 }
 
 export function isNcpChatModelOptionsEmpty(
-  snapshot: NcpChatInputAvailabilitySnapshot
+  snapshot: ChatInputAvailabilitySnapshot
 ): boolean {
   return snapshot.isProviderStateResolved && !hasNcpChatModelOptions(snapshot);
 }
 
 export function isNcpChatComposerDisabled(
-  _snapshot: NcpChatInputAvailabilitySnapshot
+  _snapshot: ChatInputAvailabilitySnapshot
 ): boolean {
   return false;
 }
 
 export function isNcpChatSendDisabled(params: {
   hasSendableDraft: boolean;
-  snapshot: NcpChatInputAvailabilitySnapshot;
+  snapshot: ChatInputAvailabilitySnapshot;
   isRuntimeBlocked: boolean;
 }): boolean {
   const { hasSendableDraft, isRuntimeBlocked } = params;

package/src/features/chat/{components/conversation → features/message/components/__tests__}/chat-message-list.container.test.tsx

@@ -1,24 +1,43 @@
 import { render } from "@testing-library/react";
 import type { NcpMessage } from "@nextclaw/ncp";
 import { beforeEach, expect, it, vi } from "vitest";
-import { ChatMessageListContainer } from "./chat-message-list.container";
+import { ChatMessageListContainer } from "../chat-message-list.container";
 
 const captures = vi.hoisted(() => ({
-  renders: [] as Array<{ messages: unknown[]; texts?: Record<string, unknown> }>,
+  renders: [] as Array<{
+    messages: unknown[];
+    onToolAction?: (action: unknown) => void;
+    texts?: Record<string, unknown>;
+  }>,
   language: "en",
+  openFilePreview: vi.fn(),
+  handleToolAction: vi.fn(),
 }));
 
 vi.mock("@nextclaw/agent-chat-ui", async (importOriginal) => {
   const actual = await importOriginal();
   return {
     ...(actual as object),
-    ChatMessageList: (props: { messages: unknown[]; texts?: Record<string, unknown> }) => {
+    ChatMessageList: (props: {
+      messages: unknown[];
+      onToolAction?: (action: unknown) => void;
+      texts?: Record<string, unknown>;
+    }) => {
       captures.renders.push(props);
       return <div data-testid="chat-message-list" />;
     },
   };
 });
 
+vi.mock("@/features/chat/components/providers/chat-presenter.provider", () => ({
+  usePresenter: () => ({
+    chatThreadManager: {
+      openFilePreview: captures.openFilePreview,
+      handleToolAction: captures.handleToolAction,
+    },
+  }),
+}));
+
 vi.mock("@/app/components/i18n-provider", () => ({
   useI18n: () => ({ language: captures.language }),
 }));
@@ -31,6 +50,8 @@ vi.mock("@/shared/lib/i18n", () => ({
 beforeEach(() => {
   captures.renders = [];
   captures.language = "en";
+  captures.openFilePreview.mockReset();
+  captures.handleToolAction.mockReset();
 });
 
 it("reuses adapted message references when the source message object is unchanged", () => {
@@ -216,6 +237,20 @@ it("passes localized attachment card texts to the shared chat UI", () => {
   });
 });
 
+it("delegates tool actions to the chat thread manager owner", () => {
+  const toolAction = {
+    kind: "open-session",
+    sessionId: "child-session-1",
+    sessionKind: "child",
+  };
+
+  render(<ChatMessageListContainer messages={[]} isSending={false} />);
+
+  captures.renders[captures.renders.length - 1]?.onToolAction?.(toolAction);
+
+  expect(captures.handleToolAction).toHaveBeenCalledWith(toolAction);
+});
+
 it("renders context compaction as an in-flow divider instead of a chat message", () => {
   const beforeMessage = {
     id: "message-before",

package/src/features/chat/{components/conversation → features/message/components}/chat-message-list.container.tsx

@@ -1,22 +1,21 @@
 import { useMemo } from "react";
 import type { NcpMessage } from "@nextclaw/ncp";
 import {
-  type ChatFileOpenActionViewModel,
-  type ChatToolActionViewModel,
   type ChatMessageViewModel,
   ChatMessageList,
 } from "@nextclaw/agent-chat-ui";
+import { usePresenter } from "@/features/chat/components/providers/chat-presenter.provider";
 import {
   adaptChatMessage,
   type ChatMessageAdapterTexts,
   type ChatMessageSource,
-} from "@/features/chat/utils/chat-message.utils";
-import { readInlineTokensFromMetadata } from "@/features/chat/utils/chat-inline-token.utils";
-import { adaptNcpMessageToUiMessage } from "@/features/chat/utils/ncp-session-adapter.utils";
+} from "@/features/chat/features/message/utils/chat-message.utils";
+import { readInlineTokensFromMetadata } from "@/features/chat/features/input/utils/chat-inline-token.utils";
+import { adaptNcpMessageToUiMessage } from "@/features/chat/features/session/utils/ncp-session-adapter.utils";
 import {
   readContextCompactionTimeline,
   type ContextCompactionTimelineView,
-} from "@/features/chat/utils/ncp-session-context-metadata.utils";
+} from "@/features/chat/features/session/utils/ncp-session-context-metadata.utils";
 import { AgentIdentityAvatar } from "@/shared/components/common/agent-identity";
 import { useI18n } from "@/app/components/i18n-provider";
 import { formatDateTime, t } from "@/shared/lib/i18n";
@@ -25,8 +24,6 @@ type ChatMessageListContainerProps = {
   messages: readonly NcpMessage[];
   isSending: boolean;
   className?: string;
-  onToolAction?: (action: ChatToolActionViewModel) => void;
-  onFileOpen?: (action: ChatFileOpenActionViewModel) => void;
 };
 
 const messageViewModelCache = new WeakMap<
@@ -69,6 +66,7 @@ function buildChatMessageAdapterTexts(
     toolStatusCompletedLabel: t("chatToolStatusCompleted"),
     toolStatusFailedLabel: t("chatToolStatusFailed"),
     toolStatusCancelledLabel: t("chatToolStatusCancelled"),
+    showContentActionLabel: t("chatShowContentAction"),
     imageAttachmentLabel: t("chatImageAttachment"),
     fileAttachmentLabel: t("chatFileAttachment"),
     unknownPartLabel: t("chatUnknownPart"),
@@ -235,9 +233,8 @@ export function ChatMessageListContainer({
   messages: rawMessages,
   isSending,
   className,
-  onToolAction,
-  onFileOpen,
 }: ChatMessageListContainerProps) {
+  const presenter = usePresenter();
   const { language } = useI18n();
   const texts = useMemo<ChatMessageAdapterTexts>(
     () => buildChatMessageAdapterTexts(language),
@@ -292,7 +289,6 @@ export function ChatMessageListContainer({
     () => buildTimelineItems({ rawMessages, messages }),
     [messages, rawMessages],
   );
-
   return (
     <div className={className}>
       {timelineItems.map((item, index) =>
@@ -305,8 +301,8 @@ export function ChatMessageListContainer({
             isSending={index === timelineItems.length - 1 ? isSending : false}
             hasAssistantDraft={hasAssistantDraft}
             texts={messageTexts}
-            onToolAction={onToolAction}
-            onFileOpen={onFileOpen}
+            onToolAction={presenter.chatThreadManager.handleToolAction}
+            onFileOpen={presenter.chatThreadManager.openFilePreview}
             renderToolAgent={(agentId) => (
               <AgentIdentityAvatar
                 agentId={agentId}

package/src/features/chat/{utils → features/message/utils/__tests__}/chat-message-invalid-tool-arguments.utils.test.ts

@@ -1,6 +1,6 @@
 import { ToolInvocationStatus, type UiMessage } from "@nextclaw/agent-chat";
-import { adaptChatMessages } from "./chat-message.utils";
-import type { ChatMessageSource } from "./chat-message.utils";
+import { adaptChatMessages } from "../chat-message.utils";
+import type { ChatMessageSource } from "../chat-message.utils";
 
 const defaultTexts = {
   roleLabels: {

package/src/features/chat/{utils → features/message/utils/__tests__}/chat-message-session-spawn-tool-card.utils.test.ts

@@ -1,6 +1,6 @@
 import { ToolInvocationStatus, type UiMessage } from "@nextclaw/agent-chat";
-import { adaptChatMessages } from "./chat-message.utils";
-import type { ChatMessageSource } from "./chat-message.utils";
+import { adaptChatMessages } from "../chat-message.utils";
+import type { ChatMessageSource } from "../chat-message.utils";
 
 const defaultTexts = {
   roleLabels: {

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

@@ -0,0 +1,54 @@
+import { describe, expect, it } from "vitest";
+import { buildShowContentToolCard } from "../chat-message-show-content-tool-card.utils";
+
+describe("buildShowContentToolCard", () => {
+  it("builds a show-content action from a normalized show_content result", () => {
+    const card = buildShowContentToolCard({
+      invocation: {
+        status: "result",
+        toolCallId: "call-show-content",
+        toolName: "show_content",
+        result: {
+          ok: true,
+          action: "showContent",
+          request: {
+            target: {
+              type: "file",
+              payload: {
+                path: "docs/example.md",
+                line: 2,
+              },
+            },
+            title: "Example",
+            purpose: "read",
+          },
+        },
+      },
+      actionLabel: "Show content",
+      statusLabel: "Completed",
+    });
+
+    expect(card).toMatchObject({
+      kind: "result",
+      name: "show_content",
+      detail: "Example",
+      statusTone: "success",
+      statusLabel: "Completed",
+      action: {
+        kind: "show-content",
+        label: "Show content",
+        request: {
+          target: {
+            type: "file",
+            payload: {
+              path: "docs/example.md",
+              line: 2,
+            },
+          },
+          title: "Example",
+          purpose: "read",
+        },
+      },
+    });
+  });
+});

package/src/features/chat/{utils → features/message/utils/__tests__}/chat-message-summary-truncation.utils.test.ts

@@ -1,6 +1,6 @@
 import { ToolInvocationStatus, type UiMessage } from "@nextclaw/agent-chat";
-import { adaptChatMessages } from "./chat-message.utils";
-import type { ChatMessageSource } from "./chat-message.utils";
+import { adaptChatMessages } from "../chat-message.utils";
+import type { ChatMessageSource } from "../chat-message.utils";
 import type { ChatMessagePartViewModel } from "@nextclaw/agent-chat-ui";
 
 const defaultTexts = {

package/src/features/chat/{utils → features/message/utils/__tests__}/chat-message-tool-agent-id.utils.test.ts

@@ -1,5 +1,5 @@
 import { ToolInvocationStatus } from "@nextclaw/agent-chat";
-import { adaptChatMessages, type ChatMessageSource } from "./chat-message.utils";
+import { adaptChatMessages, type ChatMessageSource } from "../chat-message.utils";
 
 const defaultTexts = {
   roleLabels: {

package/src/features/chat/{utils → features/message/utils/__tests__}/chat-message.utils.test.ts

@@ -1,6 +1,6 @@
 import { ToolInvocationStatus, type UiMessage } from "@nextclaw/agent-chat";
-import { adaptChatMessages } from "./chat-message.utils";
-import type { ChatMessageSource } from "./chat-message.utils";
+import { adaptChatMessages } from "../chat-message.utils";
+import type { ChatMessageSource } from "../chat-message.utils";
 
 function toSource(uiMessages: UiMessage[]): ChatMessageSource[] {
   return uiMessages as unknown as ChatMessageSource[];

package/src/features/chat/{utils → features/message/utils}/chat-message-inline-content.utils.ts

@@ -1,7 +1,7 @@
 import {
   splitTextByInlineTokens,
   type ChatInlineTokenSource,
-} from "@/features/chat/utils/chat-inline-token.utils";
+} from "@/features/chat/features/input/utils/chat-inline-token.utils";
 import type {
   ChatInlineContentSegmentViewModel,
   ChatMessagePartViewModel,