@nextclaw/ui 0.13.13 → 0.14.1-beta.0

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

@@ -3,22 +3,23 @@ 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 { 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 { useChatInputBarQueryState } from '@/features/chat/features/input/hooks/use-chat-input-bar-query-state';
+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'];
 
 function buildThinkingLabels(): Record<ChatThinkingLevel, string> {
   return {
@@ -92,12 +93,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 +120,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 +162,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 +171,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 +183,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 +210,32 @@ function buildSkillPicker(params: { allSkillsLabel: string; presenter: ChatPrese
     }
   });
 }
+
 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 +250,45 @@ 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(() => {
+    presenter.chatInputManager.syncSnapshot({
+      isProviderStateResolved: inputQueryState.isProviderStateResolved,
+      modelOptions: inputQueryState.modelOptions,
+      skillRecords: inputQueryState.skillRecords,
+      defaultSessionType: inputQueryState.sessionTypeState.defaultSessionType,
+      sessionTypeOptions: inputQueryState.sessionTypeState.sessionTypeOptions,
+      selectedSessionType: inputQueryState.sessionTypeState.selectedSessionType,
+      canEditSessionType: inputQueryState.sessionTypeState.canEditSessionType,
+      sessionTypeUnavailable: inputQueryState.sessionTypeState.sessionTypeUnavailable,
+      sessionTypeUnavailableMessage: inputQueryState.sessionTypeState.sessionTypeUnavailableMessage,
+    });
+    presenter.chatInputManager.syncSessionPreferences({
+      selectedSessionKey: inputQueryState.selectedSessionKey,
+      selectedSessionExists: Boolean(inputQueryState.selectedSession),
+      selectedSessionPreferredModel: inputQueryState.selectedSession?.preferredModel,
+      selectedSessionPreferredThinking: inputQueryState.selectedSession?.preferredThinking ?? null,
+      fallbackPreferredModel: inputQueryState.fallbackPreferredModel,
+      fallbackPreferredThinking: inputQueryState.fallbackPreferredThinking,
+      defaultModel: inputQueryState.defaultModel,
+    });
+  }, [
+    inputQueryState.defaultModel,
+    inputQueryState.fallbackPreferredModel,
+    inputQueryState.fallbackPreferredThinking,
+    inputQueryState.isProviderStateResolved,
+    inputQueryState.modelOptions,
+    inputQueryState.selectedSession,
+    inputQueryState.selectedSessionKey,
+    inputQueryState.sessionTypeState.canEditSessionType,
+    inputQueryState.sessionTypeState.defaultSessionType,
+    inputQueryState.sessionTypeState.selectedSessionType,
+    inputQueryState.sessionTypeState.sessionTypeOptions,
+    inputQueryState.sessionTypeState.sessionTypeUnavailable,
+    inputQueryState.sessionTypeState.sessionTypeUnavailableMessage,
+    inputQueryState.skillRecords,
+    presenter.chatInputManager,
+  ]);
   useEffect(() => {
     const request = snapshot.composerFocusRequest;
     if (!request) {
@@ -249,7 +304,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 +319,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 +342,7 @@ export function ChatInputBarContainer() {
           onSlashQueryChange: setSlashQuery
         }}
         slashMenu={{
-          isLoading: snapshot.isSkillsLoading,
+          isLoading: inputQueryState.isSkillsLoading,
           items: slashItems,
           onSelectItem: (item: { value?: string }) => {
             if (item.value) {
@@ -299,7 +360,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 +390,7 @@ export function ChatInputBarContainer() {
             isSending: snapshot.isSending,
             canStopGeneration: snapshot.canStopGeneration,
             sendDisabled: isNcpChatSendDisabled({
-              snapshot,
+              snapshot: availabilitySnapshot,
               hasSendableDraft,
               isRuntimeBlocked
             }),

package/src/features/chat/features/input/hooks/use-chat-input-bar-query-state.ts

@@ -0,0 +1,118 @@
+import { useMemo } from 'react';
+import type { NcpSessionSummaryView, SessionSkillEntryView } from '@/shared/lib/api';
+import { t } from '@/shared/lib/i18n';
+import { usePresenter } from '@/features/chat/components/providers/chat-presenter.provider';
+import {
+  buildNcpChatProviderModelOptions,
+  filterNcpChatModelOptionsBySessionType,
+} from '@/features/chat/features/ncp/utils/ncp-chat-query-derived.utils';
+import { useNcpChatProviderStateResolved } from '@/features/chat/features/ncp/hooks/use-ncp-chat-derived-state';
+import { useChatSessionTypeState } from '@/features/chat/features/session-type/hooks/use-chat-session-type-state';
+import { adaptNcpSessionSummaries } from '@/features/chat/features/session/utils/ncp-session-adapter.utils';
+import { resolveRecentSessionPreferredValue } from '@/features/chat/features/session/utils/chat-session-preference-governance.utils';
+import { chatRecentModelsManager } from '@/features/chat/managers/chat-recent-models.manager';
+import type { ChatInputSnapshot } from '@/features/chat/stores/chat-input.store';
+import { useChatQueryStore } from '@/features/chat/stores/ncp-chat-query.store';
+import { useChatSessionListStore } from '@/features/chat/stores/chat-session-list.store';
+
+const EMPTY_SESSION_SKILL_RECORDS: SessionSkillEntryView[] = [];
+const EMPTY_NCP_SESSION_SUMMARIES: NcpSessionSummaryView[] = [];
+
+export function useChatInputBarQueryState(snapshot: ChatInputSnapshot) {
+  const presenter = usePresenter();
+  const selectedSessionKey = useChatSessionListStore(
+    (state) => state.snapshot.selectedSessionKey,
+  );
+  const isProviderStateResolved = useNcpChatProviderStateResolved();
+  const querySnapshot = useChatQueryStore((state) => state.snapshot);
+  const config = querySnapshot.configQuery?.data ?? null;
+  const sessionSummaries =
+    querySnapshot.sessionsQuery?.data?.sessions ?? EMPTY_NCP_SESSION_SUMMARIES;
+  const skillRecords =
+    querySnapshot.sessionSkillsQuery?.data?.records ?? EMPTY_SESSION_SKILL_RECORDS;
+  const isSkillsLoading = Boolean(
+    querySnapshot.sessionSkillsQuery?.isLoading ||
+      querySnapshot.sessionSkillsQuery?.isFetching,
+  );
+  const sessions = useMemo(
+    () => adaptNcpSessionSummaries(sessionSummaries),
+    [sessionSummaries],
+  );
+  const selectedSession = useMemo(
+    () => sessions.find((session) => session.key === selectedSessionKey) ?? null,
+    [selectedSessionKey, sessions],
+  );
+  const sessionTypeState = useChatSessionTypeState({
+    selectedSession,
+    pendingSessionType: snapshot.pendingSessionType,
+    setPendingSessionType: presenter.chatInputManager.setPendingSessionType,
+    sessionTypesData: querySnapshot.sessionTypesQuery?.data ?? null,
+  });
+  const providerModelOptions = useMemo(
+    () =>
+      buildNcpChatProviderModelOptions({
+        config,
+        providersView: querySnapshot.providersQuery?.data ?? null,
+        templatesView: querySnapshot.providerTemplatesQuery?.data ?? null,
+      }),
+    [config, querySnapshot.providerTemplatesQuery?.data, querySnapshot.providersQuery?.data],
+  );
+  const modelOptions = useMemo(
+    () =>
+      filterNcpChatModelOptionsBySessionType({
+        modelOptions: providerModelOptions,
+        modelSelectionMode: sessionTypeState.selectedSessionTypeOption?.modelSelectionMode,
+        runtimeDefaultThinkingCapability:
+          sessionTypeState.selectedSessionTypeOption?.runtimeDefaultThinking ?? null,
+        runtimeDefaultModelLabel: t('chatRuntimeDefaultModel'),
+        supportedModels: sessionTypeState.selectedSessionTypeOption?.supportedModels,
+      }),
+    [
+      providerModelOptions,
+      sessionTypeState.selectedSessionTypeOption?.modelSelectionMode,
+      sessionTypeState.selectedSessionTypeOption?.runtimeDefaultThinking,
+      sessionTypeState.selectedSessionTypeOption?.supportedModels,
+    ],
+  );
+  const availableModelValueSet = useMemo(
+    () => new Set(modelOptions.map((option) => option.value)),
+    [modelOptions],
+  );
+  const recentSessionTypeModel = chatRecentModelsManager
+    .read({ namespace: sessionTypeState.selectedSessionType })
+    .find((value) => availableModelValueSet.has(value));
+  const fallbackPreferredModel = useMemo(
+    () =>
+      recentSessionTypeModel ??
+      resolveRecentSessionPreferredValue<string>({
+        sessions,
+        selectedSessionKey,
+        sessionType: sessionTypeState.selectedSessionType,
+        readPreference: (session) => session.preferredModel?.trim() || undefined,
+      }),
+    [recentSessionTypeModel, selectedSessionKey, sessionTypeState.selectedSessionType, sessions],
+  );
+  const fallbackPreferredThinking = useMemo(
+    () =>
+      resolveRecentSessionPreferredValue({
+        sessions,
+        selectedSessionKey,
+        sessionType: sessionTypeState.selectedSessionType,
+        readPreference: (session) => session.preferredThinking ?? undefined,
+      }),
+    [selectedSessionKey, sessionTypeState.selectedSessionType, sessions],
+  );
+
+  return {
+    defaultModel: config?.agents.defaults.model,
+    fallbackPreferredModel,
+    fallbackPreferredThinking,
+    isProviderStateResolved,
+    isSkillsLoading,
+    modelOptions,
+    selectedSession,
+    selectedSessionKey,
+    sessionTypeState,
+    skillRecords,
+  };
+}

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

@@ -1,10 +1,9 @@
 import {
   buildChatSlashItems,
   buildModelToolbarSelect,
-  buildSelectedSkillItems,
   buildSkillPickerModel
-} from './chat-input-bar.utils';
-import type { ChatSkillRecord } from './chat-input-bar.utils';
+} from '@/features/chat/features/input/utils/chat-input-bar.utils';
+import type { ChatSkillRecord } from '@/features/chat/features/input/utils/chat-input-bar.utils';
 
 function createSkillRecord(partial: Partial<ChatSkillRecord>): ChatSkillRecord {
   return {
@@ -72,20 +71,6 @@ describe('buildChatSlashItems', () => {
   });
 });
 
-describe('buildSelectedSkillItems', () => {
-  it('keeps selected specs and resolves labels when available', () => {
-    const chips = buildSelectedSkillItems(
-      ['web-search', 'missing-skill'],
-      [createSkillRecord({ key: 'web-search', label: 'Web Search' })]
-    );
-
-    expect(chips).toEqual([
-      { key: 'web-search', label: 'Web Search' },
-      { key: 'missing-skill', label: 'missing-skill' }
-    ]);
-  });
-});
-
 describe('buildSkillPickerModel', () => {
   it('builds a stable semantic model for toolbar skill picker', () => {
     const onSelectedKeysChange = vi.fn();

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}/chat-input-bar.utils.ts

@@ -1,5 +1,4 @@
 import type {
-  ChatSelectedItem,
   ChatSkillPickerOption,
   ChatSkillPickerProps,
   ChatSlashItem,
@@ -7,7 +6,6 @@ import type {
 export {
   buildModelStateHint,
   buildModelToolbarSelect,
-  buildSessionTypeToolbarSelect,
   buildThinkingToolbarSelect,
 } from "./chat-input-toolbar.utils";
 import type {
@@ -35,14 +33,6 @@ const SLASH_ITEM_MATCH_SCORE = {
   fallback: 1
 } as const;
 
-export function resolveSlashQuery(draft: string): string | null {
-  const match = /^\/([^\s]*)$/.exec(draft);
-  if (!match) {
-    return null;
-  }
-  return (match[1] ?? '').trim().toLowerCase();
-}
-
 function normalizeSearchText(value: string | null | undefined): string {
   return (value ?? '').trim().toLowerCase();
 }
@@ -192,20 +182,7 @@ export function buildChatSlashItems(
     }));
 }
 
-export function buildSelectedSkillItems(
-  selectedSkills: string[],
-  skillRecords: ChatSkillRecord[]
-): ChatSelectedItem[] {
-  return selectedSkills.map((spec) => {
-    const matched = skillRecords.find((record) => record.key === spec);
-    return {
-      key: spec,
-      label: matched?.label || spec
-    };
-  });
-}
-
-export function buildSkillPickerOptions(skillRecords: ChatSkillRecord[]): ChatSkillPickerOption[] {
+function buildSkillPickerOptions(skillRecords: ChatSkillRecord[]): ChatSkillPickerOption[] {
   return skillRecords.map((record) => ({
     key: record.key,
     label: record.label,

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

@@ -128,33 +128,6 @@ export function buildModelToolbarSelect({
   };
 }
 
-export function buildSessionTypeToolbarSelect(params: {
-  selectedSessionType?: string;
-  selectedSessionTypeOption: { value: string; label: string } | null;
-  sessionTypeOptions: Array<{ value: string; label: string }>;
-  onValueChange: (value: string) => void;
-  canEditSessionType: boolean;
-  shouldShow: boolean;
-  texts: Pick<ChatInputBarAdapterTexts, "sessionTypePlaceholder">;
-}): ChatToolbarSelect | null {
-  if (!params.shouldShow) {
-    return null;
-  }
-
-  return {
-    key: "session-type",
-    value: params.selectedSessionType,
-    placeholder: params.texts.sessionTypePlaceholder,
-    selectedLabel: params.selectedSessionTypeOption?.label,
-    options: params.sessionTypeOptions.map((option) => ({
-      value: option.value,
-      label: option.label,
-    })),
-    disabled: !params.canEditSessionType,
-    onValueChange: params.onValueChange,
-  };
-}
-
 export function buildThinkingToolbarSelect(params: {
   supportedLevels: ChatThinkingLevel[];
   selectedThinkingLevel: ChatThinkingLevel | null;

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/features/message/components/__tests__/chat-inline-panel-app-card.test.tsx

@@ -0,0 +1,89 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+import { beforeEach, expect, it, vi } from 'vitest';
+import { ChatInlinePanelAppCard } from '@/features/chat/features/message/components/chat-inline-panel-app-card';
+
+const mocks = vi.hoisted(() => ({
+  handleIframeMessage: vi.fn(),
+  open: vi.fn(),
+  openTarget: vi.fn(),
+  panelApps: {
+    data: {
+      entries: [
+        {
+          appId: 'weather-card',
+          contentPath: '/api/panel-apps/weather-card/content',
+          fileName: 'weather-card.panel.html',
+          icon: '*',
+          id: 'weather-card',
+          title: 'Weather',
+        },
+      ],
+    },
+    isLoading: false,
+  },
+}));
+
+vi.mock('@/app/presenters/app.presenter', () => ({
+  getPresenter: () => ({
+    panelAppBridgeManager: {
+      handleIframeMessage: mocks.handleIframeMessage,
+    },
+  }),
+}));
+
+vi.mock('@/features/panel-apps', () => ({
+  findPanelAppEntryByDisplayId: (entries: Array<{ appId: string; id: string; title: string }>, value: string) =>
+    entries.find((entry) => [entry.appId, entry.id, entry.title].includes(value)) ?? null,
+  usePanelApps: () => mocks.panelApps,
+}));
+
+vi.mock('@/shared/components/doc-browser', () => ({
+  useDocBrowser: () => ({
+    open: mocks.open,
+    openTarget: mocks.openTarget,
+  }),
+}));
+
+vi.mock('@/shared/lib/i18n', () => ({
+  t: (key: string) => key,
+}));
+
+beforeEach(() => {
+  mocks.handleIframeMessage.mockReset();
+  mocks.open.mockReset();
+  mocks.openTarget.mockReset();
+});
+
+it('renders inline panel apps as bounded card-mode iframes with an expand action', () => {
+  render(<ChatInlinePanelAppCard panelApp={{
+    action: {
+      kind: 'show-content',
+      label: 'Show content',
+      request: {
+        placement: 'side_panel',
+        target: {
+          payload: { appId: 'weather-card' },
+          type: 'panel_app',
+        },
+        title: 'Weather',
+      },
+    },
+    appId: 'weather-card',
+    title: 'Weather',
+  }} />);
+
+  const iframe = screen.getByTitle('Weather');
+  expect(iframe.getAttribute('src')).toBe(
+    '/api/panel-apps/weather-card/content?nextclawDisplayMode=card&nextclawPlacement=inline',
+  );
+  expect(iframe.getAttribute('scrolling')).toBe('auto');
+
+  fireEvent.click(screen.getByLabelText('chatPanelCardExpand'));
+
+  expect(mocks.openTarget).toHaveBeenCalledWith(expect.objectContaining({
+    dedupeKey: 'panel-app:weather-card',
+    kind: 'panel-app',
+    title: 'Weather',
+    url: '/api/panel-apps/weather-card/content',
+  }));
+});