@nextclaw/ui 0.11.23 → 0.12.1

package/src/components/chat/ncp/NcpChatPage.tsx

@@ -1,48 +1,36 @@
 import {
-  useCallback,
   useEffect,
   useMemo,
   useRef,
   useState,
-  type MutableRefObject,
 } from "react";
-import { NcpHttpAgentClientEndpoint } from "@nextclaw/ncp-http-agent-client";
 import {
   buildNcpRequestEnvelope,
-  useHydratedNcpAgent,
-  type NcpConversationSeed,
-  type NcpConversationSeedLoader,
 } from "@nextclaw/ncp-react";
 import { useLocation, useNavigate, useParams } from "react-router-dom";
-import { API_BASE } from "@/api/api-base";
-import { fetchNcpSessionMessages } from "@/api/ncp-session";
 import {
   ChatPageLayout,
   type ChatPageProps,
   useChatSessionSync,
 } from "@/components/chat/chat-page-shell";
-import { sessionDisplayName } from "@/components/chat/chat-session-display";
 import {
   buildInlineSkillTokensFromComposer,
   CHAT_UI_INLINE_TOKENS_METADATA_KEY,
 } from "@/components/chat/chat-inline-token.utils";
-import { createNcpAppClientFetch } from "@/components/chat/ncp/ncp-app-client-fetch";
 import {
   parseSessionKeyFromRoute,
-  resolveAgentIdFromSessionKey,
 } from "@/components/chat/chat-session-route";
 import { useNcpChatPageData } from "@/components/chat/ncp/ncp-chat-page-data";
 import { NcpChatPresenter } from "@/components/chat/ncp/ncp-chat.presenter";
-import {
-  adaptNcpSessionSummary,
-  createNcpSessionId,
-} from "@/components/chat/ncp/ncp-session-adapter";
+import { createNcpSessionId } from "@/components/chat/ncp/ncp-session-adapter";
+import { useNcpSessionConversation } from "@/components/chat/ncp/session-conversation/use-ncp-session-conversation";
+import { useNcpChatDerivedState, useNcpChatSnapshotSync } from "@/components/chat/ncp/page/ncp-chat-derived-state";
 import { ChatPresenterProvider } from "@/components/chat/presenter/chat-presenter-context";
 import type { ResumeRunParams } from "@/components/chat/chat-stream/types";
 import { useChatInputStore } from "@/components/chat/stores/chat-input.store";
 import { useChatSessionListStore } from "@/components/chat/stores/chat-session-list.store";
-import { resolveSessionTypeLabel } from "@/components/chat/useChatSessionTypeState";
 import { useConfirmDialog } from "@/hooks/useConfirmDialog";
+import { useAgents } from "@/hooks/agents/useAgents";
 import { normalizeRequestedSkills } from "@/lib/chat-runtime-utils";
 import {
   getSessionProjectName,
@@ -50,6 +38,7 @@ import {
 } from "@/lib/session-project/session-project.utils";
 
 export function buildNcpSendMetadata(payload: {
+  agentId?: string;
   model?: string;
   thinkingLevel?: string;
   sessionType?: string;
@@ -69,6 +58,9 @@ export function buildNcpSendMetadata(payload: {
   if (payload.sessionType?.trim()) {
     metadata.session_type = payload.sessionType.trim();
   }
+  if (payload.agentId?.trim()) {
+    metadata.agent_id = payload.agentId.trim();
+  }
   const projectRoot = normalizeSessionProjectRootValue(payload.projectRoot);
   if (projectRoot) {
     metadata.project_root = projectRoot;
@@ -86,48 +78,14 @@ export function buildNcpSendMetadata(payload: {
   return metadata;
 }
 
-function isMissingNcpSessionError(error: unknown): boolean {
-  if (!(error instanceof Error)) {
-    return false;
-  }
-  return error.message.includes("ncp session not found:");
-}
-
-type NcpSeedSessionSummary = {
-  sessionId: string;
-  status?: string;
-};
-
-function useNcpConversationSeedLoader<T extends NcpSeedSessionSummary>(
-  sessionSummariesRef: MutableRefObject<readonly T[]>,
-): NcpConversationSeedLoader {
-  return useCallback(
-    async (
-      sessionId: string,
-      signal: AbortSignal,
-    ): Promise<NcpConversationSeed> => {
-      signal.throwIfAborted();
-      let history: Awaited<ReturnType<typeof fetchNcpSessionMessages>> | null =
-        null;
-      try {
-        history = await fetchNcpSessionMessages(sessionId, 300);
-      } catch (error) {
-        if (!isMissingNcpSessionError(error)) {
-          throw error;
-        }
-      }
-      signal.throwIfAborted();
-
-      const sessionSummary =
-        sessionSummariesRef.current.find(
-          (item) => item.sessionId === sessionId,
-        ) ?? null;
-      return {
-        messages: history?.messages ?? [],
-        status: sessionSummary?.status === "running" ? "running" : "idle",
-      };
-    },
-    [sessionSummariesRef],
+export function shouldRefreshDraftSessionId(params: {
+  previousSelectedSessionKey: string | null | undefined;
+  nextSelectedSessionKey: string | null;
+}): boolean {
+  return (
+    params.nextSelectedSessionKey === null &&
+    params.previousSelectedSessionKey !== undefined &&
+    params.previousSelectedSessionKey !== null
   );
 }
 
@@ -152,6 +110,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
   const pendingProjectRootSessionKey = useChatInputStore(
     (state) => state.snapshot.pendingProjectRootSessionKey,
   );
+  const agentsQuery = useAgents();
   const currentSelectedModel = useChatInputStore(
     (state) => state.snapshot.selectedModel,
   );
@@ -163,6 +122,9 @@ export function NcpChatPage({ view }: ChatPageProps) {
   }>();
   const threadRef = useRef<HTMLDivElement | null>(null);
   const selectedSessionKeyRef = useRef<string | null>(selectedSessionKey);
+  const previousSelectedSessionKeyRef = useRef<string | null | undefined>(
+    undefined,
+  );
   const routeSessionKey = useMemo(
     () => parseSessionKeyFromRoute(routeSessionIdParam),
     [routeSessionIdParam],
@@ -198,38 +160,25 @@ export function NcpChatPage({ view }: ChatPageProps) {
       presenter.chatInputManager.setSelectedThinkingLevel,
   });
 
-  const sessionSummariesRef = useRef(sessionSummaries);
-  useEffect(() => {
-    sessionSummariesRef.current = sessionSummaries;
-  }, [sessionSummaries]);
-
-  const [ncpClient] = useState(
-    () =>
-      new NcpHttpAgentClientEndpoint({
-        baseUrl: API_BASE,
-        basePath: "/api/ncp/agent",
-        fetchImpl: createNcpAppClientFetch(),
-      }),
-  );
-
-  const loadSeed = useNcpConversationSeedLoader(sessionSummariesRef);
-
-  const agent = useHydratedNcpAgent({
-    sessionId: sessionKey,
-    client: ncpClient,
-    loadSeed,
-  });
+  const agent = useNcpSessionConversation(sessionKey);
 
   useEffect(() => {
     presenter.setDraftSessionId(draftSessionId);
   }, [draftSessionId, presenter]);
 
   useEffect(() => {
-    if (selectedSessionKey === null) {
+    if (
+      shouldRefreshDraftSessionId({
+        previousSelectedSessionKey:
+          previousSelectedSessionKeyRef.current,
+        nextSelectedSessionKey: selectedSessionKey,
+      })
+    ) {
       const nextDraftSessionId = createNcpSessionId();
       setDraftSessionId(nextDraftSessionId);
       presenter.setDraftSessionId(nextDraftSessionId);
     }
+    previousSelectedSessionKeyRef.current = selectedSessionKey;
   }, [presenter, selectedSessionKey]);
 
   const effectiveSessionProjectRoot = hasSessionProjectRootOverride
@@ -255,6 +204,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
           return;
         }
         const metadata = buildNcpSendMetadata({
+          agentId: payload.agentId,
           model: payload.model,
           thinkingLevel: payload.thinkingLevel,
           sessionType: payload.sessionType,
@@ -336,13 +286,10 @@ export function NcpChatPage({ view }: ChatPageProps) {
     view,
     routeSessionKey,
     selectedSessionKey,
-    selectedAgentId,
     setSelectedSessionKey:
       presenter.chatSessionListManager.setSelectedSessionKey,
-    setSelectedAgentId: presenter.chatSessionListManager.setSelectedAgentId,
     selectedSessionKeyRef,
     resetStreamState: presenter.chatStreamActionsManager.resetStreamState,
-    resolveAgentIdFromSessionKey,
   });
 
   useEffect(() => {
@@ -355,90 +302,62 @@ export function NcpChatPage({ view }: ChatPageProps) {
     });
   }, [confirm, location.pathname, navigate, presenter]);
 
-  const currentSessionDisplayName = selectedSession
-    ? sessionDisplayName(selectedSession)
-    : undefined;
-  const parentSession = useMemo(() => {
-    if (!parentSessionId) {
-      return null;
-    }
-    const parentSummary =
-      sessionSummaries.find(
-        (summary) => summary.sessionId === parentSessionId,
-      ) ?? null;
-    return parentSummary ? adaptNcpSessionSummary(parentSummary) : null;
-  }, [parentSessionId, sessionSummaries]);
-  const currentSessionTypeLabel =
-    sessionTypeOptions.find((option) => option.value === selectedSessionType)
-      ?.label ?? resolveSessionTypeLabel(selectedSessionType);
+  const availableAgents = (agentsQuery.data?.agents?.length ?? 0) > 0
+    ? (agentsQuery.data?.agents ?? [])
+    : [{ id: selectedSession?.agentId ?? selectedAgentId }];
+  const {
+    currentSessionDisplayName,
+    currentAgentId,
+    currentAgent,
+    parentSession,
+    currentSessionTypeLabel
+  } = useNcpChatDerivedState({
+    selectedSession,
+    selectedAgentId,
+    availableAgents,
+    parentSessionId,
+    sessionSummaries,
+    selectedSessionType,
+    sessionTypeOptions
+  });
 
   useEffect(() => {
-    presenter.chatInputManager.syncSnapshot({
-      isProviderStateResolved,
-      defaultSessionType,
-      canStopGeneration: canStopCurrentRun,
-      stopDisabledReason,
-      stopSupported: true,
-      stopReason: undefined,
-      sendError: lastSendError,
-      isSending,
-      modelOptions,
-      sessionTypeOptions,
-      selectedSessionType,
-      canEditSessionType,
-      sessionTypeUnavailable,
-      skillRecords,
-      isSkillsLoading: sessionSkillsQuery.isLoading,
-    });
-    presenter.chatThreadManager.syncSnapshot({
-      isProviderStateResolved,
-      modelOptions,
-      sessionTypeUnavailable,
-      sessionTypeUnavailableMessage,
-      sessionTypeLabel: currentSessionTypeLabel,
-      sessionKey,
-      sessionDisplayName: currentSessionDisplayName,
-      sessionProjectRoot: effectiveSessionProjectRoot,
-      sessionProjectName: effectiveSessionProjectName,
-      canDeleteSession: Boolean(selectedSession),
-      threadRef,
-      isHistoryLoading: agent.isHydrating,
-      messages: agent.visibleMessages,
-      isSending,
-      isAwaitingAssistantOutput,
-      parentSessionKey: parentSession?.key ?? null,
-      parentSessionLabel: parentSession
-        ? sessionDisplayName(parentSession)
-        : null,
-    });
-  }, [
-    agent.isHydrating,
-    canEditSessionType,
-    canStopCurrentRun,
-    currentSessionDisplayName,
-    currentSessionTypeLabel,
-    defaultSessionType,
-    sessionSkillsQuery.isLoading,
-    isAwaitingAssistantOutput,
+    if (!selectedSession?.agentId || selectedAgentId === selectedSession.agentId) {
+      return;
+    }
+    presenter.chatSessionListManager.setSelectedAgentId(selectedSession.agentId);
+  }, [presenter, selectedAgentId, selectedSession?.agentId]);
+
+  useNcpChatSnapshotSync({
+    presenter,
     isProviderStateResolved,
-    isSending,
+    defaultSessionType,
+    canStopCurrentRun,
+    stopDisabledReason,
     lastSendError,
+    isSending,
     modelOptions,
-    parentSession,
-    presenter,
-    effectiveSessionProjectName,
-    effectiveSessionProjectRoot,
-    selectedSession,
-    sessionKey,
-    selectedSessionType,
     sessionTypeOptions,
+    selectedSessionType,
+    canEditSessionType,
     sessionTypeUnavailable,
-    sessionTypeUnavailableMessage,
     skillRecords,
-    stopDisabledReason,
+    isSkillsLoading: sessionSkillsQuery.isLoading,
+    sessionTypeUnavailableMessage,
+    currentSessionTypeLabel,
+    sessionKey,
+    currentAgentId,
+    currentAgent,
+    availableAgents,
+    currentSessionDisplayName,
+    effectiveSessionProjectRoot,
+    effectiveSessionProjectName,
+    selectedSession,
     threadRef,
-    agent.visibleMessages,
-  ]);
+    agent,
+    isAwaitingAssistantOutput,
+    parentSession
+  });
 
   return (
     <ChatPresenterProvider presenter={presenter}>

package/src/components/chat/ncp/README.md

@@ -0,0 +1,3 @@
+## 子树边界豁免
+
+- 原因：`chat/ncp/` 目录是 NCP 聊天运行时的装配子树，需要并列保留页面数据、派生状态、输入/线程 manager、session adapter 与测试文件。本次新增派生状态模块是为了拆短 `NcpChatPage.tsx`，属于职责下沉，而不是继续把复杂度堆回页面壳。

package/src/components/chat/ncp/ncp-chat-page-data.test.ts

@@ -48,10 +48,12 @@ describe('buildNcpSendMetadata', () => {
   it('includes the project root in the first-message metadata when present', () => {
     expect(
       buildNcpSendMetadata({
+        agentId: 'engineer',
         sessionType: 'codex',
         projectRoot: ' /tmp/project-alpha ',
       }),
     ).toMatchObject({
+      agent_id: 'engineer',
       session_type: 'codex',
       project_root: '/tmp/project-alpha',
     });

package/src/components/chat/ncp/ncp-chat-thread.manager.ts

@@ -6,7 +6,10 @@ import type { ChatSessionListManager } from '@/components/chat/managers/chat-ses
 import type { ChatStreamActionsManager } from '@/components/chat/managers/chat-stream-actions.manager';
 import type { ChatUiManager } from '@/components/chat/managers/chat-ui.manager';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
-import type { ChatThreadSnapshot } from '@/components/chat/stores/chat-thread.store';
+import type {
+  ChatChildSessionTab,
+  ChatThreadSnapshot,
+} from '@/components/chat/stores/chat-thread.store';
 import { useChatThreadStore } from '@/components/chat/stores/chat-thread.store';
 import { t } from '@/lib/i18n';
 
@@ -46,6 +49,23 @@ export class NcpChatThreadManager {
     this.uiManager.goToProviders();
   };
 
+  private upsertChildSessionTab = (tab: ChatChildSessionTab) => {
+    const { snapshot } = useChatThreadStore.getState();
+    const existingIndex = snapshot.childSessionTabs.findIndex(
+      (item) => item.sessionKey === tab.sessionKey,
+    );
+    const nextTabs =
+      existingIndex >= 0
+        ? snapshot.childSessionTabs.map((item, index) =>
+            index === existingIndex ? { ...item, ...tab } : item,
+          )
+        : [...snapshot.childSessionTabs, tab];
+    useChatThreadStore.getState().setSnapshot({
+      childSessionTabs: nextTabs,
+      activeChildSessionKey: tab.sessionKey,
+    });
+  };
+
   openSessionFromToolAction = (action: ChatToolActionViewModel) => {
     if (action.kind !== 'open-session') {
       return;
@@ -55,31 +75,67 @@ export class NcpChatThreadManager {
         action.parentSessionId?.trim() ||
         useChatSessionListStore.getState().snapshot.selectedSessionKey ||
         null;
-      useChatThreadStore.getState().setSnapshot({
-        childSessionDetailSessionKey: action.sessionId,
-        childSessionDetailParentSessionKey: parentSessionKey,
-        childSessionDetailLabel: action.label?.trim() || null,
+      this.upsertChildSessionTab({
+        sessionKey: action.sessionId,
+        parentSessionKey,
+        label: action.label?.trim() || null,
+        agentId: action.agentId?.trim() || null,
       });
       return;
     }
     this.uiManager.goToSession(action.sessionId);
   };
 
+  selectChildSessionDetail = (sessionKey: string) => {
+    const normalizedSessionKey = sessionKey.trim();
+    if (!normalizedSessionKey) {
+      return;
+    }
+    const { childSessionTabs } = useChatThreadStore.getState().snapshot;
+    if (!childSessionTabs.some((tab) => tab.sessionKey === normalizedSessionKey)) {
+      return;
+    }
+    useChatThreadStore.getState().setSnapshot({
+      activeChildSessionKey: normalizedSessionKey,
+    });
+  };
+
   closeChildSessionDetail = () => {
+    const {
+      sessionKey,
+      childSessionTabs,
+      activeChildSessionKey,
+    } = useChatThreadStore.getState().snapshot;
+    if (!sessionKey) {
+      useChatThreadStore.getState().setSnapshot({
+        childSessionTabs: [],
+        activeChildSessionKey: null,
+      });
+      return;
+    }
+    const nextTabs = childSessionTabs.filter(
+      (tab) => tab.parentSessionKey !== sessionKey,
+    );
+    const nextActiveKey = nextTabs.some((tab) => tab.sessionKey === activeChildSessionKey)
+      ? activeChildSessionKey
+      : null;
     useChatThreadStore.getState().setSnapshot({
-      childSessionDetailSessionKey: null,
-      childSessionDetailParentSessionKey: null,
-      childSessionDetailLabel: null,
+      childSessionTabs: nextTabs,
+      activeChildSessionKey: nextActiveKey,
     });
   };
 
   goToParentSession = () => {
     const {
       parentSessionKey,
-      childSessionDetailParentSessionKey,
+      childSessionTabs,
+      activeChildSessionKey,
     } = useChatThreadStore.getState().snapshot;
+    const activeChildParentSessionKey =
+      childSessionTabs.find((tab) => tab.sessionKey === activeChildSessionKey)
+        ?.parentSessionKey ?? null;
     const resolvedParentSessionKey =
-      parentSessionKey ?? childSessionDetailParentSessionKey;
+      parentSessionKey ?? activeChildParentSessionKey;
     if (!resolvedParentSessionKey) {
       return;
     }

package/src/components/chat/ncp/ncp-session-adapter.test.ts

@@ -20,6 +20,7 @@ describe('adaptNcpSessionSummary', () => {
   it('maps session metadata into shared session entry fields', () => {
     const adapted = adaptNcpSessionSummary(
       createSummary({
+        agentId: 'engineer',
         metadata: {
           label: 'NCP Planning Thread',
           model: 'openai/gpt-5',
@@ -32,6 +33,7 @@ describe('adaptNcpSessionSummary', () => {
 
     expect(adapted).toMatchObject({
       key: 'ncp-session-1',
+      agentId: 'engineer',
       label: 'NCP Planning Thread',
       preferredModel: 'openai/gpt-5',
       preferredThinking: 'medium',

package/src/components/chat/ncp/ncp-session-adapter.ts

@@ -253,6 +253,7 @@ export function adaptNcpSessionSummary(summary: NcpSessionSummaryView): SessionE
     key: summary.sessionId,
     createdAt: summary.updatedAt,
     updatedAt: summary.updatedAt,
+    ...(typeof summary.agentId === 'string' && summary.agentId.trim().length > 0 ? { agentId: summary.agentId.trim() } : {}),
     ...(label ? { label } : {}),
     ...context,
     ...(preferredModel ? { preferredModel } : {}),

package/src/components/chat/ncp/page/ncp-chat-derived-state.ts

@@ -0,0 +1,128 @@
+import { useEffect, useMemo, type MutableRefObject } from 'react';
+import type {
+  AgentProfileView,
+  NcpSessionSummaryView,
+  SessionEntryView,
+  SessionSkillEntryView
+} from '@/api/types';
+import { sessionDisplayName } from '@/components/chat/chat-session-display';
+import { adaptNcpSessionSummary } from '@/components/chat/ncp/ncp-session-adapter';
+import type { NcpChatPresenter } from '@/components/chat/ncp/ncp-chat.presenter';
+import type { UseHydratedNcpAgentResult } from '@nextclaw/ncp-react';
+import type { ChatModelOption } from '@/components/chat/chat-input.types';
+import { resolveSessionTypeLabel } from '@/components/chat/useChatSessionTypeState';
+export function useNcpChatDerivedState(params: {
+  selectedSession: SessionEntryView | null;
+  selectedAgentId: string;
+  availableAgents: AgentProfileView[];
+  parentSessionId: string | null;
+  sessionSummaries: NcpSessionSummaryView[];
+  selectedSessionType: string;
+  sessionTypeOptions: Array<{ value: string; label: string }>;
+}) {
+  const currentSessionDisplayName = params.selectedSession
+    ? sessionDisplayName(params.selectedSession)
+    : undefined;
+  const currentAgentId = params.selectedSession?.agentId ?? params.selectedAgentId;
+  const currentAgent =
+    params.availableAgents.find((agent) => agent.id === currentAgentId) ?? null;
+  const parentSession = useMemo(() => {
+    if (!params.parentSessionId) {
+      return null;
+    }
+    const parentSummary =
+      params.sessionSummaries.find(
+        (summary) => summary.sessionId === params.parentSessionId,
+      ) ?? null;
+    return parentSummary ? adaptNcpSessionSummary(parentSummary) : null;
+  }, [params.parentSessionId, params.sessionSummaries]);
+  const currentSessionTypeLabel =
+    params.sessionTypeOptions.find((option) => option.value === params.selectedSessionType)
+      ?.label ?? resolveSessionTypeLabel(params.selectedSessionType);
+
+  return {
+    currentSessionDisplayName,
+    currentAgentId,
+    currentAgent,
+    parentSession,
+    currentSessionTypeLabel
+  };
+}
+
+export function useNcpChatSnapshotSync(params: {
+  presenter: NcpChatPresenter;
+  isProviderStateResolved: boolean;
+  defaultSessionType: string;
+  canStopCurrentRun: boolean;
+  stopDisabledReason: string | null;
+  lastSendError: string | null;
+  isSending: boolean;
+  modelOptions: ChatModelOption[];
+  sessionTypeOptions: Array<{ value: string; label: string }>;
+  selectedSessionType: string;
+  canEditSessionType: boolean;
+  sessionTypeUnavailable: boolean;
+  skillRecords: SessionSkillEntryView[];
+  isSkillsLoading: boolean;
+  sessionTypeUnavailableMessage: string | null;
+  currentSessionTypeLabel: string;
+  sessionKey: string;
+  currentAgentId: string;
+  currentAgent: AgentProfileView | null;
+  availableAgents: AgentProfileView[];
+  currentSessionDisplayName?: string;
+  effectiveSessionProjectRoot: string | null;
+  effectiveSessionProjectName: string | null;
+  selectedSession: SessionEntryView | null;
+  threadRef: MutableRefObject<HTMLDivElement | null>;
+  agent: Pick<UseHydratedNcpAgentResult, 'isHydrating' | 'visibleMessages'>;
+  isAwaitingAssistantOutput: boolean;
+  parentSession: SessionEntryView | null;
+}) {
+  useEffect(() => {
+    params.presenter.chatInputManager.syncSnapshot({
+      isProviderStateResolved: params.isProviderStateResolved,
+      defaultSessionType: params.defaultSessionType,
+      canStopGeneration: params.canStopCurrentRun,
+      stopDisabledReason: params.stopDisabledReason,
+      stopSupported: true,
+      stopReason: undefined,
+      sendError: params.lastSendError,
+      isSending: params.isSending,
+      modelOptions: params.modelOptions,
+      sessionTypeOptions: params.sessionTypeOptions,
+      selectedSessionType: params.selectedSessionType,
+      canEditSessionType: params.canEditSessionType,
+      sessionTypeUnavailable: params.sessionTypeUnavailable,
+      skillRecords: params.skillRecords,
+      isSkillsLoading: params.isSkillsLoading,
+    });
+    params.presenter.chatThreadManager.syncSnapshot({
+      isProviderStateResolved: params.isProviderStateResolved,
+      modelOptions: params.modelOptions,
+      sessionTypeUnavailable: params.sessionTypeUnavailable,
+      sessionTypeUnavailableMessage: params.sessionTypeUnavailableMessage,
+      sessionTypeLabel: params.currentSessionTypeLabel,
+      sessionKey: params.sessionKey,
+      agentId: params.currentAgentId,
+      agentDisplayName: params.currentAgent?.displayName ?? null,
+      agentAvatarUrl: params.currentAgent?.avatarUrl ?? null,
+      availableAgents: params.availableAgents,
+      sessionDisplayName: params.currentSessionDisplayName,
+      sessionProjectRoot: params.effectiveSessionProjectRoot,
+      sessionProjectName: params.effectiveSessionProjectName,
+      canDeleteSession: Boolean(params.selectedSession),
+      threadRef: params.threadRef,
+      isHistoryLoading: params.agent.isHydrating,
+      messages: params.agent.visibleMessages,
+      isSending: params.isSending,
+      isAwaitingAssistantOutput: params.isAwaitingAssistantOutput,
+      parentSessionKey: params.parentSession?.key ?? null,
+      parentSessionLabel: params.parentSession
+        ? sessionDisplayName(params.parentSession)
+        : null,
+    });
+  }, [
+    params
+  ]);
+}

package/src/components/chat/ncp/session-conversation/use-ncp-child-session-tabs-view.ts

@@ -0,0 +1,52 @@
+import { useMemo } from 'react';
+import type { SessionEntryView } from '@/api/types';
+import { sessionDisplayName } from '@/components/chat/chat-session-display';
+import { adaptNcpSessionSummaries } from '@/components/chat/ncp/ncp-session-adapter';
+import type { ChatChildSessionTab } from '@/components/chat/stores/chat-thread.store';
+import { useNcpSessions } from '@/hooks/useConfig';
+
+export type ResolvedChildSessionTab = {
+  sessionKey: string;
+  parentSessionKey: string | null;
+  title: string;
+  agentId: string | null;
+};
+
+function resolveChildSessionTitle(
+  tab: ChatChildSessionTab,
+  session: SessionEntryView | null,
+): string {
+  if (tab.label?.trim()) {
+    return tab.label.trim();
+  }
+  if (session) {
+    return sessionDisplayName(session);
+  }
+  return tab.sessionKey;
+}
+
+export function useNcpChildSessionTabsView(
+  tabs: readonly ChatChildSessionTab[],
+): ResolvedChildSessionTab[] {
+  const sessionsQuery = useNcpSessions({ limit: 200 });
+
+  const sessionByKey = useMemo(() => {
+    const sessions = adaptNcpSessionSummaries(sessionsQuery.data?.sessions ?? []);
+    return new Map(sessions.map((session) => [session.key, session]));
+  }, [sessionsQuery.data?.sessions]);
+
+  return useMemo(
+    () =>
+      tabs.map((tab) => {
+        const session = sessionByKey.get(tab.sessionKey) ?? null;
+        const agentId = tab.agentId?.trim() || session?.agentId || null;
+        return {
+          sessionKey: tab.sessionKey,
+          parentSessionKey: tab.parentSessionKey,
+          title: resolveChildSessionTitle(tab, session),
+          agentId,
+        };
+      }),
+    [sessionByKey, tabs],
+  );
+}