@nextclaw/ui 0.12.10 → 0.12.12

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

@@ -12,29 +12,34 @@ import {
   ChatPageLayout,
   type ChatPageProps,
   useChatSessionSync,
-} from "@/components/chat/chat-page-shell";
+} from "@/features/chat/components/layout/chat-page-shell";
+import { buildInlineSkillTokensFromComposer, CHAT_UI_INLINE_TOKENS_METADATA_KEY } from "@/features/chat/utils/chat-inline-token.utils";
+import { parseSessionKeyFromRoute } from "@/features/chat/utils/chat-session-route.utils";
+import { useNcpChatPageData } from "@/features/chat/hooks/use-ncp-chat-page-data";
+import { NcpChatPresenter } from "@/features/chat/managers/ncp-chat-presenter.manager";
 import {
-  buildInlineSkillTokensFromComposer,
-  CHAT_UI_INLINE_TOKENS_METADATA_KEY,
-} from "@/components/chat/chat-inline-token.utils";
+  isNcpAgentStartupUnavailableErrorMessage,
+  useNcpSessionConversation,
+} from "@/features/chat/hooks/use-ncp-session-conversation";
 import {
-  parseSessionKeyFromRoute,
-} 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 { 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 { useConfirmDialog } from "@/hooks/useConfirmDialog";
-import { useAgents } from "@/hooks/agents/useAgents";
-import { normalizeRequestedSkills } from "@/lib/chat-runtime-utils";
+  useNcpChatDerivedState,
+  useNcpChatSnapshotSync,
+} from "@/features/chat/hooks/use-ncp-chat-derived-state";
+import { ChatPresenterProvider } from "@/features/chat/components/providers/chat-presenter.provider";
+import type { ResumeRunParams } from "@/features/chat/types/chat-stream.types";
+import { useChatInputStore } from "@/features/chat/stores/chat-input.store";
+import { useChatSessionListStore } from "@/features/chat/stores/chat-session-list.store";
+import { useConfirmDialog } from "@/shared/hooks/use-confirm-dialog";
+import { useAgents } from "@/shared/hooks/use-agents";
+import { normalizeRequestedSkills } from "@/features/chat/utils/chat-runtime.utils";
+import {
+  systemStatusManager,
+  useChatRuntimeAvailability,
+} from "@/features/system-status";
 import {
   getSessionProjectName,
   normalizeSessionProjectRootValue,
-} from "@/lib/session-project/session-project.utils";
+} from "@/shared/lib/session-project";
 
 export function buildNcpSendMetadata(payload: {
   agentId?: string;
@@ -98,8 +103,7 @@ export function shouldClearPendingProjectRootOverride(params: {
   );
 }
 
-export function NcpChatPage({ view }: ChatPageProps) {
-  const [presenter] = useState(() => new NcpChatPresenter());
+function useNcpChatPageBaseState(presenter: NcpChatPresenter) {
   const query = useChatSessionListStore((state) => state.snapshot.query);
   const selectedSessionKey = useChatSessionListStore(
     (state) => state.snapshot.selectedSessionKey,
@@ -119,16 +123,15 @@ export function NcpChatPage({ view }: ChatPageProps) {
   const pendingProjectRootSessionKey = useChatInputStore(
     (state) => state.snapshot.pendingProjectRootSessionKey,
   );
-  const agentsQuery = useAgents();
   const currentSelectedModel = useChatInputStore(
     (state) => state.snapshot.selectedModel,
   );
+  const runtimeAvailability = useChatRuntimeAvailability();
+  const agentsQuery = useAgents();
   const { confirm, ConfirmDialog } = useConfirmDialog();
   const location = useLocation();
   const navigate = useNavigate();
-  const { sessionId: routeSessionIdParam } = useParams<{
-    sessionId?: string;
-  }>();
+  const { sessionId: routeSessionIdParam } = useParams<{ sessionId?: string }>();
   const threadRef = useRef<HTMLDivElement | null>(null);
   const selectedSessionKeyRef = useRef<string | null>(selectedSessionKey);
   const routeSessionKey = useMemo(
@@ -142,20 +145,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
   const sessionProjectRootOverride = hasSessionProjectRootOverride
     ? pendingProjectRoot
     : undefined;
-  const {
-    sessionSkillsQuery,
-    isProviderStateResolved,
-    modelOptions,
-    sessionSummaries,
-    skillRecords,
-    selectedSession,
-    sessionTypeOptions,
-    defaultSessionType,
-    selectedSessionType,
-    canEditSessionType,
-    sessionTypeUnavailable,
-    sessionTypeUnavailableMessage,
-  } = useNcpChatPageData({
+  const pageData = useNcpChatPageData({
     query,
     sessionKey,
     projectRootOverride: sessionProjectRootOverride,
@@ -166,9 +156,44 @@ export function NcpChatPage({ view }: ChatPageProps) {
     setSelectedThinkingLevel:
       presenter.chatInputManager.setSelectedThinkingLevel,
   });
-
   const agent = useNcpSessionConversation(sessionKey);
+  return {
+    presenter,
+    selectedSessionKey,
+    selectedAgentId,
+    pendingProjectRoot,
+    pendingProjectRootSessionKey,
+    runtimeAvailability,
+    agentsQuery,
+    confirm,
+    ConfirmDialog,
+    location,
+    navigate,
+    threadRef,
+    selectedSessionKeyRef,
+    routeSessionKey,
+    sessionKey,
+    hasSessionProjectRootOverride,
+    agent,
+    ...pageData,
+  };
+}
 
+function useNcpChatPageState(presenter: NcpChatPresenter) {
+  const baseState = useNcpChatPageBaseState(presenter);
+  const {
+    agent,
+    agentsQuery,
+    hasSessionProjectRootOverride,
+    pendingProjectRoot,
+    runtimeAvailability,
+    selectedAgentId,
+    selectedSession,
+    selectedSessionType,
+    sessionKey,
+    sessionSummaries,
+    sessionTypeOptions,
+  } = baseState;
   const effectiveSessionProjectRoot = hasSessionProjectRootOverride
     ? pendingProjectRoot
     : (selectedSession?.projectRoot ?? null);
@@ -176,15 +201,56 @@ export function NcpChatPage({ view }: ChatPageProps) {
     ? getSessionProjectName(effectiveSessionProjectRoot)
     : (selectedSession?.projectName ??
       getSessionProjectName(effectiveSessionProjectRoot));
-  const parentSessionId = selectedSession?.parentSessionId ?? null;
-
-  const isSending = agent.isSending || agent.isRunning;
-  const isAwaitingAssistantOutput = agent.isRunning;
-  const canStopCurrentRun = agent.isRunning;
-  const stopDisabledReason = agent.isRunning ? null : "__preparing__";
-  const lastSendError =
+  const rawLastSendError =
     agent.hydrateError?.message ?? agent.snapshot.error?.message ?? null;
+  const filteredLastSendError =
+    runtimeAvailability.phase === "ready" &&
+    isNcpAgentStartupUnavailableErrorMessage(rawLastSendError)
+      ? null
+      : rawLastSendError;
+  const availableAgents = (agentsQuery.data?.agents?.length ?? 0) > 0
+    ? (agentsQuery.data?.agents ?? [])
+    : [{ id: selectedSession?.agentId ?? selectedAgentId }];
+  const derivedState = useNcpChatDerivedState({
+    sessionKey,
+    selectedSession,
+    selectedAgentId,
+    availableAgents,
+    parentSessionId: selectedSession?.parentSessionId ?? null,
+    sessionSummaries,
+    selectedSessionType,
+    sessionTypeOptions,
+  });
+  return {
+    ...baseState,
+    availableAgents,
+    effectiveSessionProjectRoot,
+    effectiveSessionProjectName,
+    isSending: agent.isSending || agent.isRunning,
+    isAwaitingAssistantOutput: agent.isRunning,
+    canStopCurrentRun: agent.isRunning,
+    stopDisabledReason: agent.isRunning ? null : "__preparing__",
+    lastSendError:
+      runtimeAvailability.isBlocked
+        ? null
+        : runtimeAvailability.phase === "ready"
+        ? filteredLastSendError
+        : systemStatusManager.getDisplayMessage(filteredLastSendError),
+    ...derivedState,
+  };
+}
 
+function useNcpChatStreamBindings(params: ReturnType<typeof useNcpChatPageState>) {
+  const {
+    agent,
+    pendingProjectRoot,
+    pendingProjectRootSessionKey,
+    presenter,
+    selectedSession,
+    selectedSessionKey,
+    selectedSessionKeyRef,
+    sessionKey,
+  } = params;
   useEffect(() => {
     presenter.chatStreamActionsManager.bind({
       sendMessage: async (payload) => {
@@ -254,9 +320,20 @@ export function NcpChatPage({ view }: ChatPageProps) {
     presenter,
     selectedSessionKey,
     selectedSession?.projectRoot,
+    selectedSessionKeyRef,
     sessionKey,
   ]);
+}
 
+function usePendingProjectRootOverrideCleanup(
+  params: ReturnType<typeof useNcpChatPageState>,
+) {
+  const {
+    pendingProjectRoot,
+    pendingProjectRootSessionKey,
+    selectedSession,
+    selectedSessionKey,
+  } = params;
   useEffect(() => {
     if (
       !selectedSession ||
@@ -273,18 +350,16 @@ export function NcpChatPage({ view }: ChatPageProps) {
       pendingProjectRoot: null,
       pendingProjectRootSessionKey: null,
     });
-  }, [pendingProjectRoot, pendingProjectRootSessionKey, selectedSession, selectedSessionKey]);
-
-  useChatSessionSync({
-    view,
-    routeSessionKey,
+  }, [
+    pendingProjectRoot,
+    pendingProjectRootSessionKey,
+    selectedSession,
     selectedSessionKey,
-    setSelectedSessionKey:
-      presenter.chatSessionListManager.setSelectedSessionKey,
-    selectedSessionKeyRef,
-    resetStreamState: presenter.chatStreamActionsManager.resetStreamState,
-  });
+  ]);
+}
 
+function useNcpChatUiBindings(params: ReturnType<typeof useNcpChatPageState>) {
+  const { confirm, location, navigate, presenter } = params;
   useEffect(() => {
     presenter.chatUiManager.syncState({
       pathname: location.pathname,
@@ -294,72 +369,68 @@ export function NcpChatPage({ view }: ChatPageProps) {
       confirm,
     });
   }, [confirm, location.pathname, navigate, presenter]);
+}
 
-  const availableAgents = (agentsQuery.data?.agents?.length ?? 0) > 0
-    ? (agentsQuery.data?.agents ?? [])
-    : [{ id: selectedSession?.agentId ?? selectedAgentId }];
-  const {
-    currentSessionDisplayName,
-    currentAgentId,
-    currentAgent,
-    parentSession,
-    currentSessionTypeLabel,
-    currentSessionTypeIcon,
-    currentChildSessionTabs,
-  } = useNcpChatDerivedState({
-    sessionKey,
-    selectedSession,
-    selectedAgentId,
-    availableAgents,
-    parentSessionId,
-    sessionSummaries,
-    selectedSessionType,
-    sessionTypeOptions
-  });
-
+function useSelectedSessionAgentSync(params: ReturnType<typeof useNcpChatPageState>) {
+  const { presenter, selectedAgentId, selectedSession } = params;
   useEffect(() => {
     if (!selectedSession?.agentId || selectedAgentId === selectedSession.agentId) {
       return;
     }
     presenter.chatSessionListManager.setSelectedAgentId(selectedSession.agentId);
   }, [presenter, selectedAgentId, selectedSession?.agentId]);
+}
 
+export function NcpChatPage({ view }: ChatPageProps) {
+  const [presenter] = useState(() => new NcpChatPresenter());
+  const state = useNcpChatPageState(presenter);
+  useNcpChatStreamBindings(state);
+  usePendingProjectRootOverrideCleanup(state);
+  useNcpChatUiBindings(state);
+  useSelectedSessionAgentSync(state);
+  useChatSessionSync({
+    view,
+    routeSessionKey: state.routeSessionKey,
+    selectedSessionKey: state.selectedSessionKey,
+    setSelectedSessionKey: presenter.chatSessionListManager.setSelectedSessionKey,
+    selectedSessionKeyRef: state.selectedSessionKeyRef,
+    resetStreamState: presenter.chatStreamActionsManager.resetStreamState,
+  });
   useNcpChatSnapshotSync({
     presenter,
-    isProviderStateResolved,
-    defaultSessionType,
-    canStopCurrentRun,
-    stopDisabledReason,
-    lastSendError,
-    isSending,
-    modelOptions,
-    sessionTypeOptions,
-    selectedSessionType,
-    canEditSessionType,
-    sessionTypeUnavailable,
-    skillRecords,
-    isSkillsLoading: sessionSkillsQuery.isLoading,
-    sessionTypeUnavailableMessage,
-    currentSessionTypeLabel,
-    currentSessionTypeIcon,
-    sessionKey,
-    currentAgentId,
-    currentAgent,
-    availableAgents,
-    currentSessionDisplayName,
-    effectiveSessionProjectRoot,
-    effectiveSessionProjectName,
-    selectedSession,
-    threadRef,
-    agent,
-    isAwaitingAssistantOutput,
-    parentSession,
-    childSessionTabs: currentChildSessionTabs,
+    isProviderStateResolved: state.isProviderStateResolved,
+    defaultSessionType: state.defaultSessionType,
+    canStopCurrentRun: state.canStopCurrentRun,
+    stopDisabledReason: state.stopDisabledReason,
+    lastSendError: state.lastSendError,
+    isSending: state.isSending,
+    modelOptions: state.modelOptions,
+    sessionTypeOptions: state.sessionTypeOptions,
+    selectedSessionType: state.selectedSessionType,
+    canEditSessionType: state.canEditSessionType,
+    sessionTypeUnavailable: state.sessionTypeUnavailable,
+    skillRecords: state.skillRecords,
+    isSkillsLoading: state.sessionSkillsQuery.isLoading,
+    sessionTypeUnavailableMessage: state.sessionTypeUnavailableMessage,
+    currentSessionTypeLabel: state.currentSessionTypeLabel,
+    currentSessionTypeIcon: state.currentSessionTypeIcon,
+    sessionKey: state.sessionKey,
+    currentAgentId: state.currentAgentId,
+    currentAgent: state.currentAgent,
+    availableAgents: state.availableAgents,
+    currentSessionDisplayName: state.currentSessionDisplayName,
+    effectiveSessionProjectRoot: state.effectiveSessionProjectRoot,
+    effectiveSessionProjectName: state.effectiveSessionProjectName,
+    selectedSession: state.selectedSession,
+    threadRef: state.threadRef,
+    agent: state.agent,
+    isAwaitingAssistantOutput: state.isAwaitingAssistantOutput,
+    parentSession: state.parentSession,
+    childSessionTabs: state.currentChildSessionTabs,
   });
-
   return (
     <ChatPresenterProvider presenter={presenter}>
-      <ChatPageLayout view={view} confirmDialog={<ConfirmDialog />} />
+      <ChatPageLayout view={view} confirmDialog={<state.ConfirmDialog />} />
     </ChatPresenterProvider>
   );
 }

package/src/features/chat/pages/sessions-config-page.test.tsx

@@ -0,0 +1,152 @@
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { SessionsConfig } from '@/features/chat/pages/sessions-config-page';
+import type { NcpMessageView, NcpSessionMessagesView, NcpSessionsListView } from '@/shared/lib/api';
+import { setLanguage } from '@/shared/lib/i18n';
+
+const mocks = vi.hoisted(() => ({
+  confirm: vi.fn(),
+  refetch: vi.fn(),
+  updateMutate: vi.fn(),
+  deleteMutate: vi.fn(),
+  sessionsQuery: null as unknown as {
+    data?: NcpSessionsListView;
+    isLoading: boolean;
+    isFetching: boolean;
+    refetch: () => void;
+  },
+  messagesQuery: null as unknown as {
+    data?: NcpSessionMessagesView;
+    isLoading: boolean;
+    error: Error | null;
+  }
+}));
+
+vi.mock('@/shared/hooks/use-confirm-dialog', () => ({
+  useConfirmDialog: () => ({
+    confirm: mocks.confirm,
+    ConfirmDialog: () => null
+  })
+}));
+
+vi.mock('@/shared/hooks/use-config', () => ({
+  useNcpSessions: () => mocks.sessionsQuery,
+  useNcpSessionMessages: () => mocks.messagesQuery,
+  useUpdateNcpSession: () => ({
+    mutate: mocks.updateMutate,
+    isPending: false
+  }),
+  useDeleteNcpSession: () => ({
+    mutate: mocks.deleteMutate,
+    isPending: false
+  })
+}));
+
+function createSessionSummary(overrides: Partial<NcpSessionsListView['sessions'][number]> = {}) {
+  return {
+    sessionId: 'discord:session-1',
+    messageCount: 2,
+    updatedAt: '2026-04-20T20:00:00.000Z',
+    status: 'running' as const,
+    metadata: {
+      label: 'Release 42',
+      preferredModel: 'gpt-4.1'
+    },
+    ...overrides
+  };
+}
+
+function createMessage(overrides: Partial<NcpMessageView> = {}): NcpMessageView {
+  return {
+    id: 'message-1',
+    sessionId: 'discord:session-1',
+    role: 'assistant',
+    status: 'final',
+    timestamp: '2026-04-20T20:00:00.000Z',
+    parts: [{ type: 'text', text: 'History payload' }],
+    ...overrides
+  };
+}
+
+describe('SessionsConfig', () => {
+  beforeEach(() => {
+    setLanguage('en');
+    mocks.confirm.mockReset();
+    mocks.refetch.mockReset();
+    mocks.updateMutate.mockReset();
+    mocks.deleteMutate.mockReset();
+    mocks.confirm.mockResolvedValue(true);
+    mocks.sessionsQuery = {
+      data: {
+        total: 1,
+        sessions: [createSessionSummary()]
+      },
+      isLoading: false,
+      isFetching: false,
+      refetch: mocks.refetch
+    };
+    mocks.messagesQuery = {
+      data: {
+        sessionId: 'discord:session-1',
+        status: 'idle',
+        total: 1,
+        messages: [createMessage()]
+      },
+      isLoading: false,
+      error: null
+    };
+    if (!HTMLElement.prototype.hasPointerCapture) {
+      HTMLElement.prototype.hasPointerCapture = () => false;
+    }
+    if (!HTMLElement.prototype.setPointerCapture) {
+      HTMLElement.prototype.setPointerCapture = () => {};
+    }
+    if (!HTMLElement.prototype.releasePointerCapture) {
+      HTMLElement.prototype.releasePointerCapture = () => {};
+    }
+  });
+
+  it('saves session metadata through the feature-root page', async () => {
+    const user = userEvent.setup();
+
+    render(<SessionsConfig />);
+
+    expect(screen.getByText('No Session Selected')).toBeTruthy();
+
+    await user.click(screen.getByRole('button', { name: /Release 42/i }));
+    expect(screen.getByText('History payload')).toBeTruthy();
+
+    await user.click(screen.getByRole('button', { name: 'Metadata' }));
+    await user.clear(screen.getByPlaceholderText('Session label (optional)'));
+    await user.type(screen.getByPlaceholderText('Session label (optional)'), '  Batch 30  ');
+    await user.clear(screen.getByPlaceholderText('Preferred model (optional)'));
+    await user.type(screen.getByPlaceholderText('Preferred model (optional)'), '  gpt-5.4  ');
+    await user.click(screen.getByRole('button', { name: 'Save metadata' }));
+
+    expect(mocks.updateMutate).toHaveBeenCalledWith({
+      sessionId: 'discord:session-1',
+      data: {
+        label: 'Batch 30',
+        preferredModel: 'gpt-5.4'
+      }
+    });
+  });
+
+  it('deletes the selected session after confirmation', async () => {
+    const user = userEvent.setup();
+
+    render(<SessionsConfig />);
+
+    await user.click(screen.getByRole('button', { name: /Release 42/i }));
+    await user.click(screen.getByRole('button', { name: 'Delete' }));
+
+    expect(mocks.confirm).toHaveBeenCalledTimes(1);
+    expect(mocks.deleteMutate).toHaveBeenCalledWith(
+      { sessionId: 'discord:session-1' },
+      expect.objectContaining({
+        onSuccess: expect.any(Function)
+      })
+    );
+  });
+});