@nextclaw/ui 0.12.7 → 0.12.9

package/src/components/chat/managers/chat-session-list.manager.test.ts

@@ -2,9 +2,20 @@ import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { ChatSessionListManager } from '@/components/chat/managers/chat-session-list.manager';
 import { useChatInputStore } from '@/components/chat/stores/chat-input.store';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
+import { useChatThreadStore } from '@/components/chat/stores/chat-thread.store';
+
+const mocks = vi.hoisted(() => ({
+  updateNcpSession: vi.fn(),
+}));
+
+vi.mock('@/api/ncp-session', () => ({
+  updateNcpSession: mocks.updateNcpSession,
+}));
 
 describe('ChatSessionListManager', () => {
   beforeEach(() => {
+    mocks.updateNcpSession.mockReset();
+    mocks.updateNcpSession.mockResolvedValue({});
     useChatInputStore.setState({
       snapshot: {
         ...useChatInputStore.getState().snapshot,
@@ -15,8 +26,7 @@ describe('ChatSessionListManager', () => {
       }
     });
     useChatSessionListStore.setState({
-      readUpdatedAtBySessionKey: {},
-      hasHydratedReadWatermarks: false,
+      optimisticReadAtBySessionKey: {},
       snapshot: {
         ...useChatSessionListStore.getState().snapshot,
         selectedSessionKey: 'session-1',
@@ -24,22 +34,33 @@ describe('ChatSessionListManager', () => {
         listMode: 'time-first'
       }
     });
+    useChatThreadStore.setState({
+      snapshot: {
+        ...useChatThreadStore.getState().snapshot,
+        workspacePanelParentKey: 'session-1',
+        activeChildSessionKey: 'child-session-1',
+        activeWorkspaceFileKey: 'session-1::/tmp/demo.md',
+      },
+    });
   });
 
   it('applies the requested session type when creating a session', () => {
     const uiManager = {
-      goToSession: vi.fn()
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {
       resetStreamState: vi.fn()
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[1];
 
     const manager = new ChatSessionListManager(uiManager, streamActionsManager);
-    manager.createSession('codex');
+    const sessionKey = manager.createSession('codex');
 
     expect(streamActionsManager.resetStreamState).toHaveBeenCalledTimes(1);
-    expect(uiManager.goToSession).toHaveBeenCalledWith('draft-root-1');
-    expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBe('session-1');
+    expect(uiManager.goToChatRoot).toHaveBeenCalledTimes(1);
+    expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBeNull();
+    expect(useChatSessionListStore.getState().snapshot.draftSessionKey).toBe(sessionKey);
     expect(useChatSessionListStore.getState().snapshot.draftSessionKey).not.toBe('draft-root-1');
     expect(useChatInputStore.getState().snapshot.pendingSessionType).toBe('codex');
     expect(useChatInputStore.getState().snapshot.pendingProjectRoot).toBeNull();
@@ -48,20 +69,22 @@ describe('ChatSessionListManager', () => {
 
   it('hydrates the draft project root when creating a session inside a project group', () => {
     const uiManager = {
-      goToSession: vi.fn()
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {
       resetStreamState: vi.fn()
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[1];
 
     const manager = new ChatSessionListManager(uiManager, streamActionsManager);
-    manager.createSession('native', '/tmp/project-alpha');
+    const sessionKey = manager.createSession('native', '/tmp/project-alpha');
 
     expect(useChatInputStore.getState().snapshot.pendingProjectRoot).toBe('/tmp/project-alpha');
-    expect(useChatInputStore.getState().snapshot.pendingProjectRootSessionKey).toBe('draft-root-1');
+    expect(useChatInputStore.getState().snapshot.pendingProjectRootSessionKey).toBe(sessionKey);
   });
 
-  it('promotes the current root draft when send flow needs a concrete session key', () => {
+  it('reuses the current root draft when send flow needs a concrete session key', () => {
     useChatSessionListStore.setState({
       snapshot: {
         ...useChatSessionListStore.getState().snapshot,
@@ -70,7 +93,9 @@ describe('ChatSessionListManager', () => {
       }
     });
     const uiManager = {
-      goToSession: vi.fn()
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {
       resetStreamState: vi.fn()
@@ -80,28 +105,33 @@ describe('ChatSessionListManager', () => {
     const sessionKey = manager.ensureDraftSession('native');
 
     expect(sessionKey).toBe('draft-root-2');
-    expect(uiManager.goToSession).toHaveBeenCalledWith('draft-root-2');
+    expect(uiManager.goToChatRoot).not.toHaveBeenCalled();
+    expect(uiManager.goToSession).not.toHaveBeenCalled();
     expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBeNull();
   });
 
   it('does not eagerly replace the old selected session before the route finishes switching', () => {
     const uiManager = {
-      goToSession: vi.fn()
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {
       resetStreamState: vi.fn()
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[1];
 
     const manager = new ChatSessionListManager(uiManager, streamActionsManager);
-    manager.createSession('native', '/tmp/project-alpha');
+    const sessionKey = manager.createSession('native', '/tmp/project-alpha');
 
-    expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBe('session-1');
-    expect(useChatInputStore.getState().snapshot.pendingProjectRootSessionKey).toBe('draft-root-1');
+    expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBeNull();
+    expect(useChatInputStore.getState().snapshot.pendingProjectRootSessionKey).toBe(sessionKey);
   });
 
   it('delegates existing-session selection to routing without eagerly mutating the selected session state', () => {
     const uiManager = {
-      goToSession: vi.fn()
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
     } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {
       resetStreamState: vi.fn()
@@ -112,10 +142,15 @@ describe('ChatSessionListManager', () => {
 
     expect(uiManager.goToSession).toHaveBeenCalledWith('session-2');
     expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBe('session-1');
+    expect(useChatThreadStore.getState().snapshot.workspacePanelParentKey).toBeNull();
+    expect(useChatThreadStore.getState().snapshot.activeChildSessionKey).toBeNull();
+    expect(useChatThreadStore.getState().snapshot.activeWorkspaceFileKey).toBeNull();
   });
 
   it('updates the sidebar list mode without touching other session list state', () => {
-    const uiManager = {} as ConstructorParameters<typeof ChatSessionListManager>[0];
+    const uiManager = {
+      isAtChatRoot: vi.fn(() => true),
+    } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
     const streamActionsManager = {} as ConstructorParameters<typeof ChatSessionListManager>[1];
 
     const manager = new ChatSessionListManager(uiManager, streamActionsManager);
@@ -127,33 +162,61 @@ describe('ChatSessionListManager', () => {
 
   it('marks a session as read through the session list owner boundary', () => {
     const manager = new ChatSessionListManager(
-      {} as ConstructorParameters<typeof ChatSessionListManager>[0],
+      {
+        isAtChatRoot: vi.fn(() => true),
+      } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0],
       {} as ConstructorParameters<typeof ChatSessionListManager>[1]
     );
 
     manager.markSessionRead('session-2', '2026-04-10T10:00:00.000Z');
 
-    expect(useChatSessionListStore.getState().readUpdatedAtBySessionKey['session-2']).toBe(
+    expect(useChatSessionListStore.getState().optimisticReadAtBySessionKey['session-2']).toBe(
       '2026-04-10T10:00:00.000Z'
     );
+    expect(mocks.updateNcpSession).toHaveBeenCalledWith('session-2', {
+      uiReadAt: '2026-04-10T10:00:00.000Z'
+    });
   });
 
-  it('hydrates the initial unread baseline through the session list owner boundary', () => {
+  it('skips persisting read state when the backend already has the same watermark', () => {
     const manager = new ChatSessionListManager(
-      {} as ConstructorParameters<typeof ChatSessionListManager>[0],
+      {
+        isAtChatRoot: vi.fn(() => true),
+      } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0],
       {} as ConstructorParameters<typeof ChatSessionListManager>[1]
     );
 
-    manager.hydrateReadWatermarks([
-      {
-        sessionKey: 'session-2',
-        updatedAt: '2026-04-10T10:00:00.000Z'
-      }
-    ]);
-
-    expect(useChatSessionListStore.getState().readUpdatedAtBySessionKey['session-2']).toBe(
+    manager.markSessionRead(
+      'session-2',
+      '2026-04-10T10:00:00.000Z',
       '2026-04-10T10:00:00.000Z'
     );
-    expect(useChatSessionListStore.getState().hasHydratedReadWatermarks).toBe(true);
+
+    expect(useChatSessionListStore.getState().optimisticReadAtBySessionKey['session-2']).toBeUndefined();
+    expect(mocks.updateNcpSession).not.toHaveBeenCalled();
+  });
+
+  it('promotes the active root draft to a concrete session route after the draft has been sent successfully', () => {
+    useChatSessionListStore.setState({
+      snapshot: {
+        ...useChatSessionListStore.getState().snapshot,
+        selectedSessionKey: null,
+        draftSessionKey: 'draft-root-2',
+      }
+    });
+    const uiManager = {
+      goToChatRoot: vi.fn(),
+      goToSession: vi.fn(),
+      isAtChatRoot: vi.fn(() => true),
+    } as unknown as ConstructorParameters<typeof ChatSessionListManager>[0];
+    const streamActionsManager = {
+      resetStreamState: vi.fn()
+    } as unknown as ConstructorParameters<typeof ChatSessionListManager>[1];
+    const manager = new ChatSessionListManager(uiManager, streamActionsManager);
+
+    manager.ensureDraftSession('native');
+    manager.promoteRootDraftSessionRoute('draft-root-2');
+
+    expect(uiManager.goToSession).toHaveBeenCalledWith('draft-root-2', { replace: true });
   });
 });

package/src/components/chat/managers/chat-session-list.manager.ts

@@ -1,10 +1,12 @@
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
 import { useChatInputStore } from '@/components/chat/stores/chat-input.store';
+import { useChatThreadStore } from '@/components/chat/stores/chat-thread.store';
 import type { ChatUiManager } from '@/components/chat/managers/chat-ui.manager';
 import type { SetStateAction } from 'react';
 import type { ChatStreamActionsManager } from '@/components/chat/managers/chat-stream-actions.manager';
 import { normalizeSessionProjectRootValue } from '@/lib/session-project/session-project.utils';
 import { createNcpSessionId } from '@/components/chat/ncp/ncp-session-adapter';
+import { updateNcpSession } from '@/api/ncp-session';
 
 export class ChatSessionListManager {
   constructor(
@@ -12,6 +14,24 @@ export class ChatSessionListManager {
     private streamActionsManager: ChatStreamActionsManager
   ) {}
 
+  private syncDraftThreadState = (sessionKey: string) => {
+    useChatThreadStore.getState().setSnapshot({
+      sessionKey,
+      sessionDisplayName: undefined,
+      canDeleteSession: false,
+      isHistoryLoading: false,
+      messages: [],
+      isSending: false,
+      isAwaitingAssistantOutput: false,
+      parentSessionKey: null,
+      parentSessionLabel: null,
+      workspacePanelParentKey: null,
+      childSessionTabs: [],
+      activeChildSessionKey: null,
+      activeWorkspaceFileKey: null,
+    });
+  };
+
   private resolveUpdateValue = <T>(prev: T, next: SetStateAction<T>): T => {
     if (typeof next === 'function') {
       return (next as (value: T) => T)(prev);
@@ -19,6 +39,22 @@ export class ChatSessionListManager {
     return next;
   };
 
+  private shouldPersistReadAt = (
+    sessionKey: string,
+    readAt: string,
+    currentReadAt?: string | null,
+  ): boolean => {
+    const optimisticReadAt = useChatSessionListStore.getState().optimisticReadAtBySessionKey[sessionKey];
+    const effectiveCurrentReadAt =
+      optimisticReadAt && currentReadAt
+        ? (optimisticReadAt.localeCompare(currentReadAt) > 0 ? optimisticReadAt : currentReadAt)
+        : optimisticReadAt ?? currentReadAt ?? undefined;
+    if (!effectiveCurrentReadAt) {
+      return true;
+    }
+    return readAt.localeCompare(effectiveCurrentReadAt) > 0;
+  };
+
   setSelectedAgentId = (next: SetStateAction<string>) => {
     const prev = useChatSessionListStore.getState().snapshot.selectedAgentId;
     const value = this.resolveUpdateValue(prev, next);
@@ -46,22 +82,25 @@ export class ChatSessionListManager {
     useChatSessionListStore.getState().setSnapshot({ listMode: value });
   };
 
-  markSessionRead = (sessionKey: string | null | undefined, updatedAt: string | null | undefined) => {
-    if (!sessionKey) {
+  markSessionRead = (
+    sessionKey: string | null | undefined,
+    readAt: string | null | undefined,
+    currentReadAt?: string | null,
+  ) => {
+    const normalizedSessionKey = sessionKey?.trim();
+    const normalizedReadAt = readAt?.trim();
+    if (!normalizedSessionKey || !normalizedReadAt) {
       return;
     }
-    useChatSessionListStore.getState().markSessionRead(sessionKey, updatedAt);
-  };
-
-  hydrateReadWatermarks = (
-    entries: readonly { sessionKey: string; updatedAt: string | null | undefined }[],
-  ) => {
-    useChatSessionListStore.getState().hydrateReadWatermarks(entries);
+    if (!this.shouldPersistReadAt(normalizedSessionKey, normalizedReadAt, currentReadAt)) {
+      return;
+    }
+    useChatSessionListStore.getState().markSessionRead(normalizedSessionKey, normalizedReadAt);
+    void updateNcpSession(normalizedSessionKey, { uiReadAt: normalizedReadAt }).catch(() => undefined);
   };
 
   createSession = (sessionType?: string, projectRoot?: string | null): string => {
     const { snapshot } = useChatInputStore.getState();
-    const { snapshot: sessionListSnapshot } = useChatSessionListStore.getState();
     const { defaultSessionType: configuredDefaultSessionType } = snapshot;
     const defaultSessionType = configuredDefaultSessionType || 'native';
     const nextSessionType =
@@ -69,17 +108,19 @@ export class ChatSessionListManager {
         ? sessionType.trim()
         : defaultSessionType;
     const normalizedProjectRoot = normalizeSessionProjectRootValue(projectRoot);
-    const nextSessionKey = sessionListSnapshot.draftSessionKey;
+    const nextSessionKey = createNcpSessionId();
     this.streamActionsManager.resetStreamState();
     useChatSessionListStore.getState().setSnapshot({
-      draftSessionKey: createNcpSessionId()
+      selectedSessionKey: null,
+      draftSessionKey: nextSessionKey
     });
+    this.syncDraftThreadState(nextSessionKey);
     useChatInputStore.getState().setSnapshot({
       pendingSessionType: nextSessionType,
       pendingProjectRoot: normalizedProjectRoot,
       pendingProjectRootSessionKey: normalizedProjectRoot ? nextSessionKey : null
     });
-    this.uiManager.goToSession(nextSessionKey);
+    this.uiManager.goToChatRoot();
     return nextSessionKey;
   };
 
@@ -88,10 +129,41 @@ export class ChatSessionListManager {
     if (snapshot.selectedSessionKey) {
       return snapshot.selectedSessionKey;
     }
-    return this.createSession(sessionType);
+    const normalizedSessionType =
+      typeof sessionType === 'string' && sessionType.trim().length > 0
+        ? sessionType.trim()
+        : null;
+    this.syncDraftThreadState(snapshot.draftSessionKey);
+    if (normalizedSessionType) {
+      useChatInputStore.getState().setSnapshot({ pendingSessionType: normalizedSessionType });
+    }
+    return snapshot.draftSessionKey;
+  };
+
+  promoteRootDraftSessionRoute = (sessionKey: string) => {
+    const normalizedSessionKey = sessionKey.trim();
+    if (!normalizedSessionKey) {
+      return;
+    }
+    const { snapshot } = useChatSessionListStore.getState();
+    const { sessionKey: currentThreadSessionKey } = useChatThreadStore.getState().snapshot;
+    if (
+      snapshot.selectedSessionKey !== null ||
+      snapshot.draftSessionKey !== normalizedSessionKey ||
+      currentThreadSessionKey !== normalizedSessionKey ||
+      !this.uiManager.isAtChatRoot()
+    ) {
+      return;
+    }
+    this.uiManager.goToSession(normalizedSessionKey, { replace: true });
   };
 
   selectSession = (sessionKey: string) => {
+    useChatThreadStore.getState().setSnapshot({
+      workspacePanelParentKey: null,
+      activeChildSessionKey: null,
+      activeWorkspaceFileKey: null,
+    });
     this.uiManager.goToSession(sessionKey);
   };
 

package/src/components/chat/managers/chat-ui.manager.ts

@@ -59,6 +59,8 @@ export class ChatUiManager {
     this.navigateTo('/chat', options);
   };
 
+  isAtChatRoot = () => this.state.pathname === '/chat';
+
   goToSession = (sessionKey: string, options?: NavigateOptions) => {
     this.navigateTo(buildSessionPath(sessionKey), options);
   };

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

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

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

@@ -15,6 +15,7 @@ import {
 } from '@/components/chat/chat-composer-state';
 import { useChatInputStore } from '@/components/chat/stores/chat-input.store';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
+import { useChatThreadStore } from '@/components/chat/stores/chat-thread.store';
 import type { ChatInputSnapshot } from '@/components/chat/stores/chat-input.store';
 import type { ChatStreamActionsManager } from '@/components/chat/managers/chat-stream-actions.manager';
 import type { ChatUiManager } from '@/components/chat/managers/chat-ui.manager';
@@ -170,6 +171,7 @@ export class NcpChatInputManager {
   send = async () => {
     const inputSnapshot = useChatInputStore.getState().snapshot;
     const sessionSnapshot = useChatSessionListStore.getState().snapshot;
+    const threadSnapshot = useChatThreadStore.getState().snapshot;
     const message = inputSnapshot.draft.trim();
     const attachments = inputSnapshot.attachments;
     const parts = deriveNcpMessagePartsFromComposer(inputSnapshot.composerNodes, attachments);
@@ -180,7 +182,10 @@ export class NcpChatInputManager {
       return;
     }
     const { selectedSkills: requestedSkills, composerNodes } = inputSnapshot;
-    const sessionKey = sessionSnapshot.selectedSessionKey ?? this.sessionListManager.ensureDraftSession(inputSnapshot.selectedSessionType);
+    const sessionKey =
+      threadSnapshot.sessionKey ??
+      sessionSnapshot.selectedSessionKey ??
+      this.sessionListManager.ensureDraftSession(inputSnapshot.selectedSessionType);
     this.setComposerNodes(createInitialChatComposerNodes());
     await this.streamActionsManager.sendMessage({
       message,
@@ -196,6 +201,7 @@ export class NcpChatInputManager {
       restoreDraftOnError: true,
       composerNodes
     });
+    this.sessionListManager.promoteRootDraftSessionRoute(sessionKey);
   };
 
   stop = async () => {

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

@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { buildNcpSendMetadata } from '@/components/chat/ncp/NcpChatPage';
+import { buildNcpSendMetadata } from '@/components/chat/ncp/ncp-chat-page';
 import { filterModelOptionsBySessionType } from '@/components/chat/ncp/ncp-chat-page-data';
 import type { ChatModelOption } from '@/components/chat/chat-input.types';
 

package/src/components/chat/ncp/{NcpChatPage.tsx → ncp-chat-page.tsx}

@@ -2,6 +2,7 @@ import {
   useEffect,
   useMemo,
   useRef,
+  useState,
 } from "react";
 import {
   buildNcpRequestEnvelope,
@@ -98,11 +99,7 @@ export function shouldClearPendingProjectRootOverride(params: {
 }
 
 export function NcpChatPage({ view }: ChatPageProps) {
-  const presenterRef = useRef<NcpChatPresenter | null>(null);
-  if (!presenterRef.current) {
-    presenterRef.current = new NcpChatPresenter();
-  }
-  const presenter = presenterRef.current;
+  const [presenter] = useState(() => new NcpChatPresenter());
   const query = useChatSessionListStore((state) => state.snapshot.query);
   const selectedSessionKey = useChatSessionListStore(
     (state) => state.snapshot.selectedSessionKey,
@@ -306,8 +303,10 @@ export function NcpChatPage({ view }: ChatPageProps) {
     currentAgentId,
     currentAgent,
     parentSession,
-    currentSessionTypeLabel
+    currentSessionTypeLabel,
+    currentChildSessionTabs,
   } = useNcpChatDerivedState({
+    sessionKey,
     selectedSession,
     selectedAgentId,
     availableAgents,
@@ -352,7 +351,8 @@ export function NcpChatPage({ view }: ChatPageProps) {
     threadRef,
     agent,
     isAwaitingAssistantOutput,
-    parentSession
+    parentSession,
+    childSessionTabs: currentChildSessionTabs,
   });
 
   return (