[codex] fix profile scoped model selection (#881)

* fix profile scoped model selection

* test profile scoped provider refresh

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hermes-web-ui",
-  "version": "0.5.31",
+  "version": "0.5.32",
   "description": "Self-hosted AI chat dashboard for Hermes Agent — multi-model web UI with multi-platform integration",
   "repository": {
     "type": "git",

packages/client/src/api/hermes/system.ts

@@ -84,15 +84,11 @@ export async function fetchConfigModels(): Promise<ConfigModelsResponse> {
   return request<ConfigModelsResponse>('/api/hermes/config/models')
 }
 
-function currentProfileName(): string {
+export async function fetchAvailableModels(): Promise<AvailableModelsResponse> {
-  try {
+  return request<AvailableModelsResponse>('/api/hermes/available-models')
-    return localStorage.getItem('hermes_active_profile_name') || 'default'
-  } catch {
-    return 'default'
-  }
 }
 
-export async function fetchAvailableModels(profile = currentProfileName()): Promise<AvailableModelsResponse> {
+export async function fetchAvailableModelsForProfile(profile: string): Promise<AvailableModelsResponse> {
   const params = new URLSearchParams()
   params.set('profile', profile || 'default')
   return request<AvailableModelsResponse>(`/api/hermes/available-models?${params.toString()}`)

packages/client/src/components/hermes/chat/ChatPanel.vue

@@ -157,7 +157,7 @@ function getModelGroupsForProfile(profile: string) {
   const profileModels = appStore.profileModelGroups.find(
     (entry) => entry.profile === profile,
   );
-  return profileModels?.groups?.length ? profileModels.groups : appStore.modelGroups;
+  return profileModels?.groups || [];
 }
 
 function getDefaultModelForProfile(profile: string) {
@@ -449,7 +449,7 @@ async function handleContextMenuSelect(key: string) {
     workspaceValue.value = session?.workspace || "";
     showWorkspaceModal.value = true;
   } else if (key === "model") {
-    openSessionModelModal(contextSessionId.value);
+    await openSessionModelModal(contextSessionId.value);
   } else if (key === "rename") {
     const session = chatStore.sessions.find(
       (s) => s.id === contextSessionId.value,
@@ -522,13 +522,13 @@ const sessionModelProvider = ref("");
 const sessionModelCustomInput = ref("");
 const sessionModelCustomProvider = ref("");
 
-const sessionModelProfile = computed(() => {
+const sessionModelProfile = computed<string | null>(() => {
   const session = chatStore.sessions.find((s) => s.id === sessionModelSessionId.value);
-  return session?.profile || profilesStore.activeProfileName || "default";
+  return session?.profile || null;
 });
 
 const sessionModelBaseGroups = computed(() =>
-  getModelGroupsForProfile(sessionModelProfile.value),
+  sessionModelProfile.value ? getModelGroupsForProfile(sessionModelProfile.value) : [],
 );
 
 const sessionModelProviderOptions = computed(() =>
@@ -561,9 +561,14 @@ const filteredSessionModelGroups = computed(() => {
     .filter((group) => group.models.length > 0 || group.label.toLowerCase().includes(query));
 });
 
-function openSessionModelModal(sessionId: string) {
+async function openSessionModelModal(sessionId: string) {
+  if (appStore.modelGroups.length === 0 && appStore.profileModelGroups.length === 0) {
+    await appStore.loadModels();
+  }
   const session = chatStore.sessions.find((s) => s.id === sessionId);
-  const defaults = getDefaultModelForProfile(session?.profile || profilesStore.activeProfileName || "default");
+  const defaults = session?.profile
+    ? getDefaultModelForProfile(session.profile)
+    : { provider: "", model: "" };
   sessionModelSessionId.value = sessionId;
   sessionModelValue.value = session?.model || defaults.model || "";
   sessionModelProvider.value = session?.provider || defaults.provider || "";
@@ -1626,6 +1631,26 @@ async function handleSessionModelCustomSubmit() {
   &.active .session-item-title {
     color: $accent-primary;
   }
+
+  &.missing-models {
+    color: #b42318;
+    background: rgba(220, 38, 38, 0.08);
+
+    .session-item-title,
+    .session-item-profile-name,
+    .session-item-time {
+      color: #b42318;
+    }
+
+    .session-item-model {
+      color: #b42318;
+      background: rgba(220, 38, 38, 0.12);
+    }
+
+    &:hover {
+      background: rgba(220, 38, 38, 0.12);
+    }
+  }
 }
 
 :deep(.session-item-content) {

packages/client/src/components/hermes/chat/SessionListItem.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, ref, onUnmounted } from 'vue'
-import { NPopconfirm, NCheckbox } from 'naive-ui'
+import { NPopconfirm, NCheckbox, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import type { Session } from '@/stores/hermes/chat'
 import { useAppStore } from '@/stores/hermes/app'
@@ -38,6 +38,13 @@ const sessionModelName = computed(() =>
 )
 const profileName = computed(() => props.session.profile || 'default')
 const profileAvatar = computed(() => profilesStore.profiles.find(profile => profile.name === profileName.value)?.avatar)
+const profileHasModels = computed(() => {
+  const profileModels = appStore.profileModelGroups.find(profile => profile.profile === profileName.value)
+  return !!profileModels?.groups?.some(group => group.models.length > 0)
+})
+const profileModelsMissing = computed(() =>
+  appStore.profileModelGroups.length > 0 && !profileHasModels.value,
+)
 
 let longPressTimer: ReturnType<typeof setTimeout> | null = null
 const longPressTriggered = ref(false)
@@ -86,7 +93,7 @@ onUnmounted(() => {
 <template>
   <button
     class="session-item"
-    :class="{ active, 'batch-mode': selectable }"
+    :class="{ active, 'batch-mode': selectable, 'missing-models': profileModelsMissing }"
     :aria-current="active ? 'page' : undefined"
     @click="onClick"
     @contextmenu="emit('contextmenu', $event)"
@@ -110,6 +117,14 @@ onUnmounted(() => {
           <svg v-if="streaming" class="session-item-streaming" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><path d="M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"/></svg>
           {{ session.title }}
         </span>
+        <NTooltip v-if="profileModelsMissing" trigger="click" placement="top">
+          <template #trigger>
+            <button class="session-item-warning" type="button" @click.stop>
+              !
+            </button>
+          </template>
+          {{ t('chat.profileMissingModelsTip', { profile: profileName }) }}
+        </NTooltip>
       </span>
       <span class="session-item-meta">
         <span v-if="sessionModelName" class="session-item-model" :title="session.model">{{ sessionModelName }}</span>
@@ -153,4 +168,18 @@ onUnmounted(() => {
   line-height: 16px;
   color: var(--text-muted);
 }
+
+.session-item-warning {
+  flex-shrink: 0;
+  width: 16px;
+  height: 16px;
+  border: 1px solid rgba(180, 35, 24, 0.35);
+  border-radius: 50%;
+  background: rgba(220, 38, 38, 0.1);
+  color: #b42318;
+  font-size: 11px;
+  font-weight: 700;
+  line-height: 14px;
+  cursor: pointer;
+}
 </style>

packages/client/src/components/layout/ModelSelector.vue

@@ -15,11 +15,10 @@ const collapsedGroups = ref<Record<string, boolean>>({})
 const customInput = ref('')
 const customProvider = ref('')
 
-const selectedDisplayName = computed(() => appStore.displayModelName(appStore.selectedModel, appStore.selectedProvider))
 const activeProfileName = computed(() => profilesStore.activeProfileName || 'default')
 const activeModelGroups = computed(() => {
   const profileModels = appStore.profileModelGroups.find(entry => entry.profile === activeProfileName.value)
-  return profileModels?.groups?.length ? profileModels.groups : appStore.modelGroups
+  return profileModels?.groups || []
 })
 
 const providerOptions = computed(() => {
@@ -38,6 +37,18 @@ const modelGroupsWithCustom = computed(() =>
   }))
 )
 
+const selectedModelInActiveProfile = computed(() =>
+  modelGroupsWithCustom.value.some(group =>
+    group.provider === appStore.selectedProvider && group.models.includes(appStore.selectedModel),
+  ),
+)
+
+const selectedDisplayName = computed(() =>
+  selectedModelInActiveProfile.value
+    ? appStore.displayModelName(appStore.selectedModel, appStore.selectedProvider)
+    : '',
+)
+
 function isCustomModel(model: string, provider: string) {
   return (appStore.customModels[provider] || []).includes(model)
 }

packages/client/src/data/changelog.ts

@@ -6,7 +6,7 @@ export interface ChangelogEntry {
 
 export const changelog: ChangelogEntry[] = [
   {
-    version: '0.5.31',
+    version: '0.5.32',
     date: '2026-05-20',
     changes: [
       'changelog.new_0_5_31_1',

packages/client/src/i18n/locales/de.ts

@@ -168,6 +168,7 @@ export default {
     sessions: 'Sitzungen',
     webUiSessions: 'Sitzungen',
     allProfiles: 'Alle Profile',
+    profileMissingModelsTip: 'Profil "{profile}" hat keinen verfuegbaren Provider oder kein Modell fuer diese Sitzung',
     sessionScopeHint: 'Chat zeigt nur Web-UI/API-Server-Sitzungen. CLI-, Telegram-, Discord-, Cron- und andere Kanal-Sitzungen sind schreibgeschützt im Verlauf.',
     openHistory: 'Verlauf öffnen',
     hermesHistory: 'Hermes-Verlauf',

packages/client/src/i18n/locales/en.ts

@@ -172,6 +172,7 @@ export default {
     sessions: 'Sessions',
     webUiSessions: 'Sessions',
     allProfiles: 'All profiles',
+    profileMissingModelsTip: 'Profile "{profile}" has no available provider or model for this session',
     sessionScopeHint: 'Chat shows Web UI/API Server sessions only. CLI, Telegram, Discord, Cron, and other channel sessions are read-only in History.',
     openHistory: 'Open History',
     hermesHistory: 'Hermes History',

packages/client/src/i18n/locales/es.ts

@@ -168,6 +168,7 @@ export default {
     sessions: 'Sesiones',
     webUiSessions: 'Sesiones',
     allProfiles: 'Todos los perfiles',
+    profileMissingModelsTip: 'El perfil "{profile}" no tiene proveedor ni modelo disponible para esta sesión',
     sessionScopeHint: 'Chat solo muestra sesiones de Web UI/API Server. Las sesiones de CLI, Telegram, Discord, Cron y otros canales son de solo lectura en Historial.',
     openHistory: 'Abrir historial',
     hermesHistory: 'Historial de Hermes',

packages/client/src/i18n/locales/fr.ts

@@ -168,6 +168,7 @@ export default {
     sessions: 'Sessions',
     webUiSessions: 'Sessions',
     allProfiles: 'Tous les profils',
+    profileMissingModelsTip: 'Le profil "{profile}" n’a aucun fournisseur ni modèle disponible pour cette session',
     sessionScopeHint: 'Le chat affiche uniquement les sessions Web UI/API Server. Les sessions CLI, Telegram, Discord, Cron et autres canaux sont en lecture seule dans Historique.',
     openHistory: 'Ouvrir l’historique',
     hermesHistory: 'Historique Hermes',

packages/client/src/i18n/locales/ja.ts

@@ -168,6 +168,7 @@ export default {
     sessions: 'セッション',
     webUiSessions: 'セッション',
     allProfiles: 'すべてのプロファイル',
+    profileMissingModelsTip: 'このセッションのプロファイル「{profile}」には利用可能なプロバイダーまたはモデルがありません',
     sessionScopeHint: 'チャットには Web UI/API Server セッションのみ表示されます。CLI、Telegram、Discord、Cron などのチャンネルセッションは履歴で読み取り専用として表示されます。',
     openHistory: '履歴を開く',
     hermesHistory: 'Hermes 履歴',

packages/client/src/i18n/locales/ko.ts

@@ -168,6 +168,7 @@ export default {
     sessions: '세션',
     webUiSessions: '세션',
     allProfiles: '모든 프로필',
+    profileMissingModelsTip: '이 세션의 프로필 "{profile}"에는 사용 가능한 공급자 또는 모델이 없습니다',
     sessionScopeHint: '채팅에는 Web UI/API Server 세션만 표시됩니다. CLI, Telegram, Discord, Cron 등 채널 세션은 기록에서 읽기 전용으로 볼 수 있습니다.',
     openHistory: '기록 열기',
     hermesHistory: 'Hermes 기록',

packages/client/src/i18n/locales/pt.ts

@@ -168,6 +168,7 @@ export default {
     sessions: 'Sessoes',
     webUiSessions: 'Sessões',
     allProfiles: 'Todos os perfis',
+    profileMissingModelsTip: 'O perfil "{profile}" não tem provider ou modelo disponível para esta sessão',
     sessionScopeHint: 'O chat mostra apenas sessões da Web UI/API Server. Sessões de CLI, Telegram, Discord, Cron e outros canais são somente leitura no Histórico.',
     openHistory: 'Abrir histórico',
     hermesHistory: 'Histórico Hermes',

packages/client/src/i18n/locales/zh-TW.ts

@@ -171,6 +171,7 @@ export default {
     sessions: '工作階段',
     webUiSessions: '工作階段',
     allProfiles: '全部設定',
+    profileMissingModelsTip: '此工作階段所屬設定「{profile}」沒有可用的 provider 或模型',
     sessionScopeHint: '這裡只顯示目前工作階段；CLI、Telegram、Discord、Cron 等頻道工作階段在歷史中以唯讀方式查看。',
     openHistory: '開啟歷史',
     hermesHistory: 'Hermes 歷史',

packages/client/src/i18n/locales/zh.ts

@@ -172,6 +172,7 @@ export default {
     sessions: '会话',
     webUiSessions: '会话',
     allProfiles: '全部配置',
+    profileMissingModelsTip: '该会话所属配置「{profile}」没有可用的 provider 或模型',
     sessionScopeHint: '这里只显示当前会话；CLI、Telegram、Discord、Cron 等通道会话在历史中只读查看。',
     openHistory: '打开历史',
     hermesHistory: 'Hermes 历史',

packages/client/src/stores/hermes/models.ts

@@ -4,6 +4,7 @@ import * as systemApi from '@/api/hermes/system'
 import type { AvailableModelGroup, CustomProvider } from '@/api/hermes/system'
 import { hasApiKey } from '@/api/client'
 import { useAppStore } from './app'
+import { useProfilesStore } from './profiles'
 
 export const useModelsStore = defineStore('models', () => {
   const providers = ref<AvailableModelGroup[]>([])
@@ -36,13 +37,12 @@ export const useModelsStore = defineStore('models', () => {
     if (!hasApiKey()) return
     loading.value = true
     try {
-      const res = await systemApi.fetchAvailableModels()
+      const profile = useProfilesStore().activeProfileName || 'default'
+      const res = await systemApi.fetchAvailableModelsForProfile(profile)
       providers.value = res.groups
       allProviders.value = res.allProviders
       defaultModel.value = res.default
       defaultProvider.value = res.default_provider || ''
-      const appStore = useAppStore()
-      appStore.applyAvailableModelsResponse(res)
     } catch (err) {
       console.error('Failed to fetch providers:', err)
     } finally {
@@ -61,11 +61,13 @@ export const useModelsStore = defineStore('models', () => {
   async function addProvider(data: CustomProvider) {
     await systemApi.addCustomProvider(data)
     await fetchProviders()
+    await useAppStore().reloadModels()
   }
 
   async function removeProvider(name: string) {
     await systemApi.removeCustomProvider(name)
     await fetchProviders()
+    await useAppStore().reloadModels()
   }
 
   return {

packages/client/src/stores/hermes/profiles.ts

@@ -2,6 +2,7 @@ import { defineStore } from 'pinia'
 import { ref } from 'vue'
 import * as profilesApi from '@/api/hermes/profiles'
 import type { HermesProfile, HermesProfileDetail } from '@/api/hermes/profiles'
+import { useAppStore } from './app'
 
 const ACTIVE_PROFILE_STORAGE_KEY = 'hermes_active_profile_name'
 
@@ -141,6 +142,7 @@ export const useProfilesStore = defineStore('profiles', () => {
           // 假设切换成功（API 返回了 200），保持已设置的状态
           console.warn('Failed to refresh profiles list after switch, assuming switch succeeded:', err)
         }
+        await useAppStore().reloadModels()
       }
       return ok
     } finally {

tests/client/models-store.test.ts

@@ -4,6 +4,7 @@ import { createPinia, setActivePinia } from 'pinia'
 
 const mockSystemApi = vi.hoisted(() => ({
   fetchAvailableModels: vi.fn(),
+  fetchAvailableModelsForProfile: vi.fn(),
   updateDefaultModel: vi.fn(),
   addCustomProvider: vi.fn(),
   removeCustomProvider: vi.fn(),
@@ -36,7 +37,7 @@ describe('Models Store', () => {
         },
       },
     ]
-    mockSystemApi.fetchAvailableModels.mockResolvedValue({
+    const availableModelsResponse = {
       default: 'deepseek-v4-flash',
       default_provider: 'deepseek',
       groups: visibleGroups,
@@ -44,7 +45,18 @@ describe('Models Store', () => {
       model_visibility: {
         deepseek: { mode: 'include', models: ['deepseek-v4-flash', 'deepseek-v4-pro'] },
       },
-    })
+      profiles: [
+        {
+          profile: 'default',
+          default: 'deepseek-v4-flash',
+          default_provider: 'deepseek',
+          groups: visibleGroups,
+        },
+      ],
+    }
+    mockSystemApi.fetchAvailableModelsForProfile.mockResolvedValue(availableModelsResponse)
+    mockSystemApi.fetchAvailableModels.mockResolvedValue(availableModelsResponse)
+    mockSystemApi.addCustomProvider.mockResolvedValue(undefined)
 
     const appStore = useAppStore()
     appStore.modelGroups = [
@@ -59,8 +71,15 @@ describe('Models Store', () => {
     ]
 
     const modelsStore = useModelsStore()
-    await modelsStore.fetchProviders()
+    await modelsStore.addProvider({
+      name: 'deepseek',
+      base_url: 'https://api.deepseek.com/v1',
+      api_key: 'sk-test',
+      model: 'deepseek-v4-flash',
+    })
 
+    expect(mockSystemApi.fetchAvailableModelsForProfile).toHaveBeenCalledWith('default')
+    expect(mockSystemApi.fetchAvailableModels).toHaveBeenCalled()
     expect(modelsStore.providers[0].models).toEqual(['deepseek-v4-flash', 'deepseek-v4-pro'])
     expect(appStore.modelGroups[0].models).toEqual(['deepseek-v4-flash', 'deepseek-v4-pro'])
     expect(appStore.modelGroups[0].available_models).toEqual(['deepseek-v4-flash', 'deepseek-v4-pro'])