@nextclaw/ui 0.8.0 → 0.9.1

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

@@ -1,9 +1,12 @@
-import { useMemo } from 'react';
-import { type UiMessage } from '@nextclaw/agent-chat';
-import { ChatMessageList } from '@nextclaw/agent-chat-ui';
-import { adaptChatMessages, type ChatMessageSource } from '@/components/chat/adapters/chat-message.adapter';
-import { useI18n } from '@/components/providers/I18nProvider';
-import { formatDateTime, t } from '@/lib/i18n';
+import { useMemo } from "react";
+import { type UiMessage } from "@nextclaw/agent-chat";
+import { ChatMessageList } from "@nextclaw/agent-chat-ui";
+import {
+  adaptChatMessages,
+  type ChatMessageSource,
+} from "@/components/chat/adapters/chat-message.adapter";
+import { useI18n } from "@/components/providers/I18nProvider";
+import { formatDateTime, t } from "@/lib/i18n";
 
 type ChatMessageListContainerProps = {
   uiMessages: UiMessage[];
@@ -20,11 +23,11 @@ export function ChatMessageListContainer(props: ChatMessageListContainerProps) {
         role: message.role,
         meta: {
           timestamp: message.meta?.timestamp,
-          status: message.meta?.status
+          status: message.meta?.status,
         },
-        parts: message.parts as unknown as ChatMessageSource['parts']
+        parts: message.parts as unknown as ChatMessageSource["parts"],
       })),
-    [props.uiMessages]
+    [props.uiMessages],
   );
 
   const messages = useMemo(
@@ -34,21 +37,21 @@ export function ChatMessageListContainer(props: ChatMessageListContainerProps) {
         formatTimestamp: (value) => formatDateTime(value, language),
         texts: {
           roleLabels: {
-            user: t('chatRoleUser'),
-            assistant: t('chatRoleAssistant'),
-            tool: t('chatRoleTool'),
-            system: t('chatRoleSystem'),
-            fallback: t('chatRoleMessage')
+            user: t("chatRoleUser"),
+            assistant: t("chatRoleAssistant"),
+            tool: t("chatRoleTool"),
+            system: t("chatRoleSystem"),
+            fallback: t("chatRoleMessage"),
           },
-          reasoningLabel: t('chatReasoning'),
-          toolCallLabel: t('chatToolCall'),
-          toolResultLabel: t('chatToolResult'),
-          toolNoOutputLabel: t('chatToolNoOutput'),
-          toolOutputLabel: t('chatToolOutput'),
-          unknownPartLabel: t('chatUnknownPart')
-        }
+          reasoningLabel: t("chatReasoning"),
+          toolCallLabel: t("chatToolCall"),
+          toolResultLabel: t("chatToolResult"),
+          toolNoOutputLabel: t("chatToolNoOutput"),
+          toolOutputLabel: t("chatToolOutput"),
+          unknownPartLabel: t("chatUnknownPart"),
+        },
       }),
-    [language, sourceMessages]
+    [language, sourceMessages],
   );
 
   return (
@@ -57,14 +60,15 @@ export function ChatMessageListContainer(props: ChatMessageListContainerProps) {
       isSending={props.isSending}
       hasAssistantDraft={props.uiMessages.some(
         (message) =>
-          message.role === 'assistant' &&
-          (message.meta?.status === 'streaming' || message.meta?.status === 'pending')
+          message.role === "assistant" &&
+          (message.meta?.status === "streaming" ||
+            message.meta?.status === "pending"),
       )}
       className={props.className}
       texts={{
-        copyCodeLabel: t('chatCodeCopy'),
-        copiedCodeLabel: t('chatCodeCopied'),
-        typingLabel: t('chatTyping')
+        copyCodeLabel: t("chatCodeCopy"),
+        copiedCodeLabel: t("chatCodeCopied"),
+        typingLabel: t("chatTyping"),
       }}
     />
   );

package/src/components/chat/legacy/LegacyChatPage.tsx

@@ -8,6 +8,7 @@ import { parseSessionKeyFromRoute, resolveAgentIdFromSessionKey } from '@/compon
 import { ChatPresenterProvider } from '@/components/chat/presenter/chat-presenter-context';
 import { ChatPresenter } from '@/components/chat/presenter/chat.presenter';
 import { useChatRuntimeController } from '@/components/chat/useChatRuntimeController';
+import { resolveSessionTypeLabel } from '@/components/chat/useChatSessionTypeState';
 import { useChatInputStore } from '@/components/chat/stores/chat-input.store';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
 
@@ -23,6 +24,7 @@ export function LegacyChatPage({ view }: ChatPageProps) {
   const { sessionId: routeSessionIdParam } = useParams<{ sessionId?: string }>();
   const threadRef = useRef<HTMLDivElement | null>(null);
   const selectedSessionKeyRef = useRef<string | null>(selectedSessionKey);
+  const modelHydratedSessionKeyRef = useRef<string | null>(null);
   const thinkingHydratedSessionKeyRef = useRef<string | null>(null);
   const routeSessionKey = useMemo(
     () => parseSessionKeyFromRoute(routeSessionIdParam),
@@ -38,6 +40,7 @@ export function LegacyChatPage({ view }: ChatPageProps) {
     sessions,
     skillRecords,
     selectedSession,
+    hydratedSessionModel,
     historyMessages,
     selectedSessionThinkingLevel,
     sessionTypeOptions,
@@ -72,6 +75,7 @@ export function LegacyChatPage({ view }: ChatPageProps) {
       selectedSessionKeyRef,
       setSelectedSessionKey: presenter.chatSessionListManager.setSelectedSessionKey,
       setDraft: presenter.chatInputManager.setDraft,
+      setComposerNodes: presenter.chatInputManager.setComposerNodes,
       refetchSessions: sessionsQuery.refetch,
       refetchHistory: historyQuery.refetch
     },
@@ -125,6 +129,9 @@ export function LegacyChatPage({ view }: ChatPageProps) {
   }, [confirm, location.pathname, navigate, presenter]);
 
   const currentSessionDisplayName = selectedSession ? sessionDisplayName(selectedSession) : undefined;
+  const currentSessionTypeLabel =
+    sessionTypeOptions.find((option) => option.value === selectedSessionType)?.label ??
+    resolveSessionTypeLabel(selectedSessionType);
 
   useEffect(() => {
     presenter.chatThreadManager.bindActions({
@@ -133,10 +140,19 @@ export function LegacyChatPage({ view }: ChatPageProps) {
   }, [presenter, sessionsQuery.refetch]);
 
   useEffect(() => {
+    const shouldHydrateModelFromSession =
+      !isSending &&
+      !isAwaitingAssistantOutput &&
+      !sessionsQuery.isLoading &&
+      isProviderStateResolved &&
+      modelOptions.length > 0 &&
+      selectedSessionKey !== modelHydratedSessionKeyRef.current;
     const shouldHydrateThinkingFromHistory =
       !isSending &&
       !isAwaitingAssistantOutput &&
       !historyQuery.isLoading &&
+      isProviderStateResolved &&
+      modelOptions.length > 0 &&
       selectedSessionKey !== thinkingHydratedSessionKeyRef.current;
 
     presenter.chatInputManager.syncSnapshot({
@@ -149,6 +165,7 @@ export function LegacyChatPage({ view }: ChatPageProps) {
       sendError: lastSendError,
       isSending,
       modelOptions,
+      ...(shouldHydrateModelFromSession ? { selectedModel: hydratedSessionModel } : {}),
       sessionTypeOptions,
       selectedSessionType,
       ...(shouldHydrateThinkingFromHistory ? { selectedThinkingLevel: selectedSessionThinkingLevel } : {}),
@@ -157,10 +174,14 @@ export function LegacyChatPage({ view }: ChatPageProps) {
       skillRecords,
       isSkillsLoading: installedSkillsQuery.isLoading
     });
+    if (shouldHydrateModelFromSession) {
+      modelHydratedSessionKeyRef.current = selectedSessionKey;
+    }
     if (shouldHydrateThinkingFromHistory) {
       thinkingHydratedSessionKeyRef.current = selectedSessionKey;
     }
     if (!selectedSessionKey) {
+      modelHydratedSessionKeyRef.current = null;
       thinkingHydratedSessionKeyRef.current = null;
     }
     presenter.chatSessionListManager.syncSnapshot({
@@ -178,6 +199,7 @@ export function LegacyChatPage({ view }: ChatPageProps) {
       modelOptions,
       sessionTypeUnavailable,
       sessionTypeUnavailableMessage,
+      sessionTypeLabel: currentSessionTypeLabel,
       selectedSessionKey,
       sessionDisplayName: currentSessionDisplayName,
       canDeleteSession: Boolean(selectedSession),
@@ -192,15 +214,18 @@ export function LegacyChatPage({ view }: ChatPageProps) {
     canEditSessionType,
     canStopCurrentRun,
     currentSessionDisplayName,
+    currentSessionTypeLabel,
     chatCapabilitiesQuery.data?.stopReason,
     chatCapabilitiesQuery.data?.stopSupported,
     defaultSessionType,
     historyQuery.isLoading,
     installedSkillsQuery.isLoading,
     isAwaitingAssistantOutput,
+    hydratedSessionModel,
     isProviderStateResolved,
     isSending,
     lastSendError,
+    modelOptions.length,
     modelOptions,
     presenter,
     query,

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

@@ -1,3 +1,11 @@
+import type { ChatComposerNode } from '@nextclaw/agent-chat-ui';
+import {
+  createInitialChatComposerNodes,
+  createChatComposerNodesFromDraft,
+  deriveChatComposerDraft,
+  deriveSelectedSkillsFromComposer,
+  syncComposerSkills
+} from '@/components/chat/chat-composer-state';
 import { updateSession } from '@/api/config';
 import { useChatInputStore } from '@/components/chat/stores/chat-input.store';
 import { buildNewSessionKey } from '@/components/chat/chat-session-route';
@@ -5,12 +13,15 @@ import type { ChatUiManager } from '@/components/chat/managers/chat-ui.manager';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
 import { normalizeSessionType } from '@/components/chat/useChatSessionTypeState';
 import type { ChatInputSnapshot } from '@/components/chat/stores/chat-input.store';
+import { ChatSessionPreferenceSync } from '@/components/chat/chat-session-preference-sync';
 import type { SetStateAction } from 'react';
 import type { ChatStreamActionsManager } from '@/components/chat/managers/chat-stream-actions.manager';
 import type { ThinkingLevel } from '@/api/types';
 import type { ChatModelOption } from '@/components/chat/chat-input.types';
 
 export class ChatInputManager {
+  private readonly sessionPreferenceSync = new ChatSessionPreferenceSync(updateSession);
+
   constructor(
     private uiManager: ChatUiManager,
     private streamActionsManager: ChatStreamActionsManager
@@ -33,6 +44,17 @@ export class ChatInputManager {
     return next;
   };
 
+  private isSameStringArray = (left: string[], right: string[]): boolean =>
+    left.length === right.length && left.every((value, index) => value === right[index]);
+
+  private syncComposerSnapshot = (nodes: ChatComposerNode[]) => {
+    useChatInputStore.getState().setSnapshot({
+      composerNodes: nodes,
+      draft: deriveChatComposerDraft(nodes),
+      selectedSkills: deriveSelectedSkillsFromComposer(nodes)
+    });
+  };
+
   syncSnapshot = (patch: Partial<ChatInputSnapshot>) => {
     if (!this.hasSnapshotChanges(patch)) {
       return;
@@ -43,8 +65,8 @@ export class ChatInputManager {
       Object.prototype.hasOwnProperty.call(patch, 'selectedModel') ||
       Object.prototype.hasOwnProperty.call(patch, 'selectedThinkingLevel')
     ) {
-      const snapshot = useChatInputStore.getState().snapshot;
-      this.reconcileThinkingForModel(snapshot.selectedModel);
+      const { selectedModel } = useChatInputStore.getState().snapshot;
+      this.reconcileThinkingForModel(selectedModel);
     }
   };
 
@@ -54,7 +76,16 @@ export class ChatInputManager {
     if (value === prev) {
       return;
     }
-    useChatInputStore.getState().setSnapshot({ draft: value });
+    this.syncComposerSnapshot(createChatComposerNodesFromDraft(value));
+  };
+
+  setComposerNodes = (next: SetStateAction<ChatComposerNode[]>) => {
+    const prev = useChatInputStore.getState().snapshot.composerNodes;
+    const value = this.resolveUpdateValue(prev, next);
+    if (Object.is(value, prev)) {
+      return;
+    }
+    this.syncComposerSnapshot(value);
   };
 
   setPendingSessionType = (next: SetStateAction<string>) => {
@@ -73,14 +104,13 @@ export class ChatInputManager {
     if (!message) {
       return;
     }
-    const requestedSkills = inputSnapshot.selectedSkills;
+    const { selectedSkills: requestedSkills, composerNodes } = inputSnapshot;
     const hasSelectedSession = Boolean(sessionSnapshot.selectedSessionKey);
     const sessionKey = sessionSnapshot.selectedSessionKey ?? buildNewSessionKey(sessionSnapshot.selectedAgentId);
     if (!hasSelectedSession) {
       this.uiManager.goToSession(sessionKey, { replace: true });
     }
-    this.setDraft('');
-    this.setSelectedSkills([]);
+    this.setComposerNodes(createInitialChatComposerNodes());
     await this.streamActionsManager.sendMessage({
       message,
       sessionKey,
@@ -91,7 +121,8 @@ export class ChatInputManager {
       stopSupported: inputSnapshot.stopSupported,
       stopReason: inputSnapshot.stopReason,
       requestedSkills,
-      restoreDraftOnError: true
+      restoreDraftOnError: true,
+      composerNodes
     });
   };
 
@@ -129,20 +160,23 @@ export class ChatInputManager {
   };
 
   setSelectedSkills = (next: SetStateAction<string[]>) => {
-    const prev = useChatInputStore.getState().snapshot.selectedSkills;
+    const snapshot = useChatInputStore.getState().snapshot;
+    const { selectedSkills: prev } = snapshot;
     const value = this.resolveUpdateValue(prev, next);
-    if (Object.is(value, prev)) {
+    if (this.isSameStringArray(value, prev)) {
       return;
     }
-    useChatInputStore.getState().setSnapshot({ selectedSkills: value });
+    this.syncComposerSnapshot(syncComposerSkills(snapshot.composerNodes, value, snapshot.skillRecords));
   };
 
   selectModel = (value: string) => {
     this.setSelectedModel(value);
+    this.sessionPreferenceSync.syncSelectedSessionPreferences();
   };
 
   selectThinkingLevel = (value: ThinkingLevel) => {
     this.setSelectedThinkingLevel(value);
+    this.sessionPreferenceSync.syncSelectedSessionPreferences();
   };
 
   selectSkills = (next: string[]) => {
@@ -169,15 +203,16 @@ export class ChatInputManager {
   private reconcileThinkingForModel(model: string): void {
     const snapshot = useChatInputStore.getState().snapshot;
     const modelOption = snapshot.modelOptions.find((option) => option.value === model);
-    const nextThinking = this.resolveThinkingForModel(modelOption, snapshot.selectedThinkingLevel);
-    if (nextThinking !== snapshot.selectedThinkingLevel) {
+    const { selectedThinkingLevel } = snapshot;
+    const nextThinking = this.resolveThinkingForModel(modelOption, selectedThinkingLevel);
+    if (nextThinking !== selectedThinkingLevel) {
       useChatInputStore.getState().setSnapshot({ selectedThinkingLevel: nextThinking });
     }
   }
 
   private syncRemoteSessionType = async (normalizedType: string) => {
     const sessionSnapshot = useChatSessionListStore.getState().snapshot;
-    const selectedSessionKey = sessionSnapshot.selectedSessionKey;
+    const { selectedSessionKey } = sessionSnapshot;
     if (!selectedSessionKey) {
       return;
     }

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

@@ -0,0 +1,39 @@
+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';
+
+describe('ChatSessionListManager', () => {
+  beforeEach(() => {
+    useChatInputStore.setState({
+      snapshot: {
+        ...useChatInputStore.getState().snapshot,
+        defaultSessionType: 'native',
+        pendingSessionType: 'native'
+      }
+    });
+    useChatSessionListStore.setState({
+      snapshot: {
+        ...useChatSessionListStore.getState().snapshot,
+        selectedSessionKey: 'session-1'
+      }
+    });
+  });
+
+  it('applies the requested session type when creating a session', () => {
+    const uiManager = {
+      goToChatRoot: vi.fn()
+    } 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');
+
+    expect(streamActionsManager.resetStreamState).toHaveBeenCalledTimes(1);
+    expect(uiManager.goToChatRoot).toHaveBeenCalledTimes(1);
+    expect(useChatSessionListStore.getState().snapshot.selectedSessionKey).toBeNull();
+    expect(useChatInputStore.getState().snapshot.pendingSessionType).toBe('codex');
+  });
+});

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

@@ -53,11 +53,17 @@ export class ChatSessionListManager {
     useChatSessionListStore.getState().setSnapshot({ selectedSessionKey: value });
   };
 
-  createSession = () => {
-    const defaultSessionType = useChatInputStore.getState().snapshot.defaultSessionType || 'native';
+  createSession = (sessionType?: string) => {
+    const { snapshot } = useChatInputStore.getState();
+    const { defaultSessionType: configuredDefaultSessionType } = snapshot;
+    const defaultSessionType = configuredDefaultSessionType || 'native';
+    const nextSessionType =
+      typeof sessionType === 'string' && sessionType.trim().length > 0
+        ? sessionType.trim()
+        : defaultSessionType;
     this.streamActionsManager.resetStreamState();
     this.setSelectedSessionKey(null);
-    useChatInputStore.getState().setSnapshot({ pendingSessionType: defaultSessionType });
+    useChatInputStore.getState().setSnapshot({ pendingSessionType: nextSessionType });
     this.uiManager.goToChatRoot();
   };
 

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

@@ -3,17 +3,18 @@ import { NcpHttpAgentClientEndpoint } from '@nextclaw/ncp-http-agent-client';
 import { useHydratedNcpAgent, type NcpConversationSeed } from '@nextclaw/ncp-react';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { API_BASE } from '@/api/client';
-import { fetchNcpSessionMessages } from '@/api/config';
+import { fetchNcpSessionMessages } from '@/api/ncp-session';
 import type { ChatRunView } from '@/api/types';
 import { sessionDisplayName } from '@/components/chat/chat-page-data';
 import { ChatPageLayout, type ChatPageProps, useChatSessionSync } from '@/components/chat/chat-page-shell';
 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 { adaptNcpMessagesToUiMessages, createNcpSessionId } from '@/components/chat/ncp/ncp-session-adapter';
+import { adaptNcpMessagesToUiMessages, buildNcpSessionRunStatusByKey, createNcpSessionId } from '@/components/chat/ncp/ncp-session-adapter';
 import { ChatPresenterProvider } from '@/components/chat/presenter/chat-presenter-context';
 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 { normalizeRequestedSkills } from '@/lib/chat-runtime-utils';
 
@@ -70,6 +71,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
   const { sessionId: routeSessionIdParam } = useParams<{ sessionId?: string }>();
   const threadRef = useRef<HTMLDivElement | null>(null);
   const selectedSessionKeyRef = useRef<string | null>(selectedSessionKey);
+  const modelHydratedSessionKeyRef = useRef<string | null>(null);
   const thinkingHydratedSessionKeyRef = useRef<string | null>(null);
   const routeSessionKey = useMemo(
     () => parseSessionKeyFromRoute(routeSessionIdParam),
@@ -84,6 +86,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
     sessions,
     skillRecords,
     selectedSession,
+    hydratedSessionModel,
     selectedSessionThinkingLevel,
     sessionTypeOptions,
     defaultSessionType,
@@ -98,6 +101,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
     setPendingSessionType: presenter.chatInputManager.setPendingSessionType,
     setSelectedModel: presenter.chatInputManager.setSelectedModel
   });
+  const refetchSessions = sessionsQuery.refetch;
 
   const activeSessionId = selectedSessionKey ?? draftSessionId;
   const sessionSummariesRef = useRef(sessionSummaries);
@@ -161,15 +165,22 @@ export function NcpChatPage({ view }: ChatPageProps) {
   const stopDisabledReason = agent.isRunning ? null : '__preparing__';
   const lastSendError = agent.hydrateError?.message ?? agent.snapshot.error?.message ?? null;
   const activeBackendRunId = agent.activeRunId;
-  const sessionRunStatusByKey = useMemo(() => {
-    const map = new Map<string, 'running'>();
-    for (const sessionSummary of sessionSummaries) {
-      if (sessionSummary.status === 'running') {
-        map.set(sessionSummary.sessionId, 'running');
-      }
+  const sessionRunStatusByKey = useMemo(
+    () =>
+      buildNcpSessionRunStatusByKey({
+        summaries: sessionSummaries,
+        activeSessionId,
+        isLocallyRunning: isSending || Boolean(activeBackendRunId)
+      }),
+    [activeBackendRunId, activeSessionId, isSending, sessionSummaries]
+  );
+
+  useEffect(() => {
+    if (!isSending && !activeBackendRunId) {
+      return;
     }
-    return map;
-  }, [sessionSummaries]);
+    void refetchSessions();
+  }, [activeBackendRunId, isSending, refetchSessions]);
 
   useEffect(() => {
     presenter.chatStreamActionsManager.bind({
@@ -201,9 +212,17 @@ export function NcpChatPage({ view }: ChatPageProps) {
           await sessionsQuery.refetch();
         } catch (error) {
           if (payload.restoreDraftOnError) {
-            presenter.chatInputManager.setDraft((currentDraft) =>
-              currentDraft.trim().length === 0 ? payload.message : currentDraft
-            );
+            if (payload.composerNodes && payload.composerNodes.length > 0) {
+              presenter.chatInputManager.setComposerNodes((currentNodes) =>
+                currentNodes.length === 1 && currentNodes[0]?.type === 'text' && currentNodes[0].text.length === 0
+                  ? payload.composerNodes ?? currentNodes
+                  : currentNodes
+              );
+            } else {
+              presenter.chatInputManager.setDraft((currentDraft) =>
+                currentDraft.trim().length === 0 ? payload.message : currentDraft
+              );
+            }
           }
           throw error;
         }
@@ -248,6 +267,9 @@ export function NcpChatPage({ view }: ChatPageProps) {
   }, [confirm, location.pathname, navigate, presenter]);
 
   const currentSessionDisplayName = selectedSession ? sessionDisplayName(selectedSession) : undefined;
+  const currentSessionTypeLabel =
+    sessionTypeOptions.find((option) => option.value === selectedSessionType)?.label ??
+    resolveSessionTypeLabel(selectedSessionType);
 
   useEffect(() => {
     presenter.chatThreadManager.bindActions({
@@ -256,10 +278,19 @@ export function NcpChatPage({ view }: ChatPageProps) {
   }, [presenter, sessionsQuery.refetch]);
 
   useEffect(() => {
+    const shouldHydrateModelFromSession =
+      !isSending &&
+      !isAwaitingAssistantOutput &&
+      !sessionsQuery.isLoading &&
+      isProviderStateResolved &&
+      modelOptions.length > 0 &&
+      selectedSessionKey !== modelHydratedSessionKeyRef.current;
     const shouldHydrateThinkingFromSession =
       !isSending &&
       !isAwaitingAssistantOutput &&
       !agent.isHydrating &&
+      isProviderStateResolved &&
+      modelOptions.length > 0 &&
       selectedSessionKey !== thinkingHydratedSessionKeyRef.current;
 
     presenter.chatInputManager.syncSnapshot({
@@ -272,6 +303,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
       sendError: lastSendError,
       isSending,
       modelOptions,
+      ...(shouldHydrateModelFromSession ? { selectedModel: hydratedSessionModel } : {}),
       sessionTypeOptions,
       selectedSessionType,
       ...(shouldHydrateThinkingFromSession ? { selectedThinkingLevel: selectedSessionThinkingLevel } : {}),
@@ -280,10 +312,14 @@ export function NcpChatPage({ view }: ChatPageProps) {
       skillRecords,
       isSkillsLoading: installedSkillsQuery.isLoading
     });
+    if (shouldHydrateModelFromSession) {
+      modelHydratedSessionKeyRef.current = selectedSessionKey;
+    }
     if (shouldHydrateThinkingFromSession) {
       thinkingHydratedSessionKeyRef.current = selectedSessionKey;
     }
     if (!selectedSessionKey) {
+      modelHydratedSessionKeyRef.current = null;
       thinkingHydratedSessionKeyRef.current = null;
     }
     presenter.chatSessionListManager.syncSnapshot({
@@ -301,6 +337,7 @@ export function NcpChatPage({ view }: ChatPageProps) {
       modelOptions,
       sessionTypeUnavailable,
       sessionTypeUnavailableMessage,
+      sessionTypeLabel: currentSessionTypeLabel,
       selectedSessionKey,
       sessionDisplayName: currentSessionDisplayName,
       canDeleteSession: Boolean(selectedSession),
@@ -316,12 +353,15 @@ export function NcpChatPage({ view }: ChatPageProps) {
     canEditSessionType,
     canStopCurrentRun,
     currentSessionDisplayName,
+    currentSessionTypeLabel,
     defaultSessionType,
     installedSkillsQuery.isLoading,
     isAwaitingAssistantOutput,
+    hydratedSessionModel,
     isProviderStateResolved,
     isSending,
     lastSendError,
+    modelOptions.length,
     modelOptions,
     presenter,
     query,