feat: add Codex OAuth login and fix channel config display

- Add OpenAI Codex Device Code Flow login (backend polling + frontend modal)
- Codex provider integrated into preset dropdown (hides URL/API key fields)
- Sync provider model catalogs with Hermes system
- Fix channel config not displaying on first visit (wait for data load)
- Fix sidebar model list not refreshing after adding provider
- Add autocomplete="off" to API key input to prevent browser autofill

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

packages/client/src/api/hermes/codex-auth.ts

@@ -0,0 +1,30 @@
+import { request } from '../client'
+
+export interface CodexStartResult {
+  session_id: string
+  user_code: string
+  verification_url: string
+  expires_in: number
+}
+
+export interface CodexPollResult {
+  status: 'pending' | 'approved' | 'expired' | 'error'
+  error: string | null
+}
+
+export interface CodexStatusResult {
+  authenticated: boolean
+  last_refresh?: string
+}
+
+export async function startCodexLogin(): Promise<CodexStartResult> {
+  return request<CodexStartResult>('/api/hermes/auth/codex/start', { method: 'POST' })
+}
+
+export async function pollCodexLogin(sessionId: string): Promise<CodexPollResult> {
+  return request<CodexPollResult>(`/api/hermes/auth/codex/poll/${sessionId}`)
+}
+
+export async function getCodexAuthStatus(): Promise<CodexStatusResult> {
+  return request<CodexStatusResult>('/api/hermes/auth/codex/status')
+}

packages/client/src/components/hermes/models/CodexLoginModal.vue

@@ -0,0 +1,239 @@
+<script setup lang="ts">
+import { ref, onUnmounted } from 'vue'
+import { NModal, NButton, useMessage } from 'naive-ui'
+import { useI18n } from 'vue-i18n'
+import { startCodexLogin, pollCodexLogin } from '@/api/hermes/codex-auth'
+
+const { t } = useI18n()
+const emit = defineEmits<{ close: []; success: [] }>()
+const message = useMessage()
+
+const showModal = ref(true)
+const status = ref<'idle' | 'loading' | 'waiting' | 'approved' | 'expired' | 'error'>('idle')
+const userCode = ref('')
+const verificationUrl = ref('')
+const sessionId = ref('')
+const errorMessage = ref('')
+let pollTimer: ReturnType<typeof setTimeout> | null = null
+
+async function startLogin() {
+  status.value = 'loading'
+  errorMessage.value = ''
+
+  try {
+    const data = await startCodexLogin()
+    userCode.value = data.user_code
+    verificationUrl.value = data.verification_url
+    sessionId.value = data.session_id
+    status.value = 'waiting'
+    startPolling()
+  } catch (err: any) {
+    status.value = 'error'
+    const msg = err.message || ''
+    // Try to extract friendly error from response
+    try {
+      const match = msg.match(/\{[\s\S]*\}$/)
+      if (match) {
+        const body = JSON.parse(match[0])
+        errorMessage.value = body.error || msg
+      } else {
+        errorMessage.value = msg
+      }
+    } catch {
+      errorMessage.value = msg
+    }
+    message.error(errorMessage.value)
+  }
+}
+
+function startPolling() {
+  stopPolling()
+  pollTimer = setTimeout(async () => {
+    try {
+      const result = await pollCodexLogin(sessionId.value)
+      if (result.status === 'pending') {
+        startPolling()
+      } else if (result.status === 'approved') {
+        status.value = 'approved'
+        message.success(t('models.codexApproved'))
+        setTimeout(() => {
+          showModal.value = false
+          setTimeout(() => emit('success'), 200)
+        }, 1000)
+      } else if (result.status === 'expired') {
+        status.value = 'expired'
+      } else if (result.status === 'error') {
+        status.value = 'error'
+        errorMessage.value = result.error || 'Unknown error'
+      }
+    } catch {
+      startPolling()
+    }
+  }, 3000)
+}
+
+function stopPolling() {
+  if (pollTimer) {
+    clearTimeout(pollTimer)
+    pollTimer = null
+  }
+}
+
+function handleClose() {
+  stopPolling()
+  showModal.value = false
+  setTimeout(() => emit('close'), 200)
+}
+
+function copyCode() {
+  navigator.clipboard.writeText(userCode.value)
+  message.success(t('models.codexCopyCode'))
+}
+
+function openLink() {
+  window.open(verificationUrl.value, '_blank')
+}
+
+function retry() {
+  status.value = 'idle'
+  userCode.value = ''
+  verificationUrl.value = ''
+  sessionId.value = ''
+  errorMessage.value = ''
+  startLogin()
+}
+
+onUnmounted(() => {
+  stopPolling()
+})
+
+// Auto-start when modal opens
+startLogin()
+</script>
+
+<template>
+  <NModal
+    v-model:show="showModal"
+    preset="card"
+    :title="t('models.codexLoginTitle')"
+    :style="{ width: 'min(440px, calc(100vw - 32px))' }"
+    :mask-closable="status !== 'waiting'"
+    @after-leave="emit('close')"
+  >
+    <div class="codex-login">
+      <!-- Idle / Loading -->
+      <div v-if="status === 'idle' || status === 'loading'" class="codex-login__state">
+        <NSpin size="small" />
+      </div>
+
+      <!-- Waiting for authorization -->
+      <div v-else-if="status === 'waiting'" class="codex-login__state">
+        <p class="codex-login__hint">{{ t('models.codexWaiting') }}</p>
+        <div class="codex-login__code" @click="copyCode">
+          <span class="codex-login__code-text">{{ userCode }}</span>
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/></svg>
+        </div>
+        <NButton type="primary" block @click="openLink">
+          <template #icon>
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
+          </template>
+          {{ t('models.codexOpenLink') }}
+        </NButton>
+      </div>
+
+      <!-- Approved -->
+      <div v-else-if="status === 'approved'" class="codex-login__state codex-login__state--success">
+        <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 11.08V12a10 10 0 11-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>
+        <p>{{ t('models.codexApproved') }}</p>
+      </div>
+
+      <!-- Expired -->
+      <div v-else-if="status === 'expired'" class="codex-login__state">
+        <p class="codex-login__error">{{ t('models.codexExpired') }}</p>
+        <NButton size="small" @click="retry">{{ t('common.retry') }}</NButton>
+      </div>
+
+      <!-- Error -->
+      <div v-else-if="status === 'error'" class="codex-login__state">
+        <p class="codex-login__error">{{ errorMessage }}</p>
+        <NButton size="small" @click="retry">{{ t('common.retry') }}</NButton>
+      </div>
+    </div>
+
+    <template #footer>
+      <div class="modal-footer">
+        <NButton :disabled="status === 'waiting'" @click="handleClose">{{ t('common.cancel') }}</NButton>
+      </div>
+    </template>
+  </NModal>
+</template>
+
+<style scoped lang="scss">
+.codex-login {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 8px 0;
+}
+
+.codex-login__state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  min-height: 120px;
+  justify-content: center;
+  width: 100%;
+}
+
+.codex-login__hint {
+  font-size: 14px;
+  color: var(--n-text-color, inherit);
+  text-align: center;
+  line-height: 1.6;
+}
+
+.codex-login__code {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px 20px;
+  border: 1px solid var(--n-border-color, #e0e0e6);
+  border-radius: 8px;
+  cursor: pointer;
+  transition: border-color 0.2s;
+  background: var(--n-color, #fafafa);
+
+  &:hover {
+    border-color: var(--n-primary-color, #18a058);
+  }
+}
+
+.codex-login__code-text {
+  font-size: 28px;
+  font-weight: 700;
+  font-family: monospace;
+  letter-spacing: 4px;
+  color: var(--n-text-color, inherit);
+}
+
+.codex-login__state--success {
+  color: #18a058;
+
+  svg {
+    stroke: #18a058;
+  }
+}
+
+.codex-login__error {
+  color: #d03050;
+  text-align: center;
+  font-size: 13px;
+}
+
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+}
+</style>

packages/client/src/components/hermes/models/ProviderFormModal.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
-import { ref, watch } from 'vue'
+import { ref, watch, computed } from 'vue'
 import { NModal, NForm, NFormItem, NInput, NButton, NSelect, useMessage } from 'naive-ui'
 import { useModelsStore } from '@/stores/hermes/models'
 import { PROVIDER_PRESETS } from '@/shared/providers'
 import { useI18n } from 'vue-i18n'
+import CodexLoginModal from './CodexLoginModal.vue'
 
 const { t } = useI18n()
 
@@ -18,6 +19,7 @@ const message = useMessage()
 const showModal = ref(true)
 const loading = ref(false)
 const fetchingModels = ref(false)
+const showCodexLogin = ref(false)
 
 const providerType = ref<'preset' | 'custom'>('preset')
 const selectedPreset = ref<string | null>(null)
@@ -32,6 +34,10 @@ const modelOptions = ref<Array<{ label: string; value: string }>>([])
 
 const PRESET_PROVIDERS = PROVIDER_PRESETS as any[]
 
+const CODEX_KEY = 'openai-codex'
+
+const isCodex = computed(() => selectedPreset.value === CODEX_KEY)
+
 function autoGenerateName(url: string): string {
   const clean = url.replace(/^https?:\/\//, '').replace(/\/v1\/?$/, '')
   const host = clean.split('/')[0]
@@ -104,6 +110,13 @@ async function handleSave() {
     message.warning(t('models.selectProviderRequired'))
     return
   }
+
+  // Codex: 弹出授权码弹窗
+  if (isCodex.value) {
+    showCodexLogin.value = true
+    return
+  }
+
   if (!formData.value.base_url.trim()) {
     message.warning(t('models.baseUrlRequired'))
     return
@@ -139,6 +152,12 @@ async function handleSave() {
   }
 }
 
+async function handleCodexSuccess() {
+  showCodexLogin.value = false
+  message.success(t('models.providerAdded'))
+  emit('saved')
+}
+
 function handleClose() {
   showModal.value = false
   setTimeout(() => emit('close'), 200)
@@ -151,7 +170,7 @@ function handleClose() {
     preset="card"
     :title="t('models.addProvider')"
     :style="{ width: 'min(520px, calc(100vw - 32px))' }"
-    :mask-closable="!loading"
+    :mask-closable="!loading && !showCodexLogin"
     @after-leave="emit('close')"
   >
     <NForm label-placement="top">
@@ -191,7 +210,7 @@ function handleClose() {
         />
       </NFormItem>
 
-      <NFormItem :label="t('models.baseUrl')" required>
+      <NFormItem v-if="!isCodex" :label="t('models.baseUrl')" required>
         <NInput
           v-model:value="formData.base_url"
           :placeholder="t('models.baseUrlPlaceholder')"
@@ -199,12 +218,13 @@ function handleClose() {
         />
       </NFormItem>
 
-      <NFormItem :label="t('models.apiKey')" required>
+      <NFormItem v-if="!isCodex" :label="t('models.apiKey')" required>
         <NInput
           v-model:value="formData.api_key"
           type="password"
           show-password-on="click"
           :placeholder="t('models.apiKeyPlaceholder')"
+          autocomplete="off"
         />
       </NFormItem>
 
@@ -237,6 +257,12 @@ function handleClose() {
         </NButton>
       </div>
     </template>
+
+    <CodexLoginModal
+      v-if="showCodexLogin"
+      @close="showCodexLogin = false"
+      @success="handleCodexSuccess"
+    />
   </NModal>
 </template>
 

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: 'Laden...',
     cancel: 'Abbrechen',
+    retry: 'Erneutern',
     delete: 'Loschen',
     edit: 'Bearbeiten',
     save: 'Speichern',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Anbieter geloscht',
     deleteProvider: 'Anbieter loschen',
     deleteConfirm: 'Mochten Sie "{name}" wirklich loschen?',
+    codexLoginTitle: 'OpenAI Codex Anmeldung',
+    codexWaiting: 'Geben Sie diesen Code auf der Autorisierungsseite ein, um sich anzumelden:',
+    codexCopyCode: 'Code kopiert',
+    codexOpenLink: 'Autorisierungsseite öffnen',
+    codexApproved: 'Anmeldung erfolgreich',
+    codexExpired: 'Die Autorisierung ist abgelaufen. Bitte versuchen Sie es erneut.',
     noProviders: 'Keine Anbieter gefunden. Fugen Sie einen benutzerdefinierten Anbieter hinzu, um zu beginnen.',
     builtIn: 'Integriert',
     customType: 'Benutzerdefiniert',

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

@@ -17,6 +17,7 @@ export default {
     delete: 'Delete',
     edit: 'Edit',
     save: 'Save',
+    retry: 'Retry',
     saved: 'Saved',
     update: 'Update',
     create: 'Create',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Provider deleted',
     deleteProvider: 'Delete Provider',
     deleteConfirm: 'Are you sure you want to delete "{name}"?',
+    codexLoginTitle: 'OpenAI Codex Login',
+    codexWaiting: 'Enter this code at the authorization page to complete login:',
+    codexCopyCode: 'Code copied',
+    codexOpenLink: 'Open authorization page',
+    codexApproved: 'Login successful',
+    codexExpired: 'Authorization expired. Please try again.',
     noProviders: 'No providers found. Add a custom provider to get started.',
     builtIn: 'Built-in',
     customType: 'Custom',

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: 'Cargando...',
     cancel: 'Cancelar',
+    retry: 'Reintentar',
     delete: 'Eliminar',
     edit: 'Editar',
     save: 'Guardar',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Proveedor eliminado',
     deleteProvider: 'Eliminar proveedor',
     deleteConfirm: 'Estas seguro de que quieres eliminar "{name}"?',
+    codexLoginTitle: 'Inicio de sesión de OpenAI Codex',
+    codexWaiting: 'Ingrese este código en la página de autorización para iniciar sesión:',
+    codexCopyCode: 'Código copiado',
+    codexOpenLink: 'Abrir página de autorización',
+    codexApproved: 'Inicio de sesión exitoso',
+    codexExpired: 'La autorización ha expirado. Por favor, inténtelo de nuevo.',
     noProviders: 'No se encontraron proveedores. Anade un proveedor personalizado para comenzar.',
     builtIn: 'Integrado',
     customType: 'Personalizado',

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: 'Chargement...',
     cancel: 'Annuler',
+    retry: 'Réessayer',
     delete: 'Supprimer',
     edit: 'Modifier',
     save: 'Enregistrer',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Fournisseur supprime',
     deleteProvider: 'Supprimer le fournisseur',
     deleteConfirm: 'Etes-vous sur de vouloir supprimer "{name}" ?',
+    codexLoginTitle: 'Connexion OpenAI Codex',
+    codexWaiting: 'Entrez ce code sur la page d\'autorisation pour vous connecter :',
+    codexCopyCode: 'Code copié',
+    codexOpenLink: 'Ouvrir la page d\'autorisation',
+    codexApproved: 'Connexion réussie',
+    codexExpired: 'L\'autorisation a expiré. Veuillez réessayer.',
     noProviders: 'Aucun fournisseur trouve. Ajoutez un fournisseur personnalise pour commencer.',
     builtIn: 'Integre',
     customType: 'Personnalise',

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: '読み込み中...',
     cancel: 'キャンセル',
+    retry: '再試行',
     delete: '削除',
     edit: '編集',
     save: '保存',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'プロバイダーを削除しました',
     deleteProvider: 'プロバイダーを削除',
     deleteConfirm: '「{name}」を削除しますか？',
+    codexLoginTitle: 'OpenAI Codex ログイン',
+    codexWaiting: '認証ページで以下のコードを入力してログインしてください：',
+    codexCopyCode: 'コードをコピーしました',
+    codexOpenLink: '認証ページを開く',
+    codexApproved: 'ログイン成功',
+    codexExpired: '認証の有効期限が切れました。もう一度お試しください。',
     noProviders: 'プロバイダーがありません。カスタムプロバイダーを追加して始めましょう。',
     builtIn: '組み込み',
     customType: 'カスタム',

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: '로딩 중...',
     cancel: '취소',
+    retry: '재시도',
     delete: '삭제',
     edit: '편집',
     save: '저장',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Provider가 삭제되었습니다',
     deleteProvider: 'Provider 삭제',
     deleteConfirm: '"{name}"을(를) 삭제하시겠습니까?',
+    codexLoginTitle: 'OpenAI Codex 로그인',
+    codexWaiting: '인증 페이지에서 아래 코드를 입력하여 로그인하세요:',
+    codexCopyCode: '코드가 복사되었습니다',
+    codexOpenLink: '인증 페이지 열기',
+    codexApproved: '로그인 성공',
+    codexExpired: '인증이 만료되었습니다. 다시 시도해주세요.',
     noProviders: 'Provider가 없습니다. 사용자 지정 Provider를 추가하여 시작하세요.',
     builtIn: '내장',
     customType: '사용자 지정',

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

@@ -14,6 +14,7 @@ export default {
   common: {
     loading: 'Carregando...',
     cancel: 'Cancelar',
+    retry: 'Tentar novamente',
     delete: 'Excluir',
     edit: 'Editar',
     save: 'Salvar',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Provedor excluido',
     deleteProvider: 'Excluir provedor',
     deleteConfirm: 'Tem certeza de que deseja excluir "{name}"?',
+    codexLoginTitle: 'Login do OpenAI Codex',
+    codexWaiting: 'Digite este código na página de autorização para fazer login:',
+    codexCopyCode: 'Código copiado',
+    codexOpenLink: 'Abrir página de autorização',
+    codexApproved: 'Login bem-sucedido',
+    codexExpired: 'A autorização expirou. Por favor, tente novamente.',
     noProviders: 'Nenhum provedor encontrado. Adicione um provedor personalizado para comecar.',
     builtIn: 'Integrado',
     customType: 'Personalizado',

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

@@ -15,6 +15,7 @@ export default {
     loading: '加载中...',
     cancel: '取消',
     delete: '删除',
+    retry: '重试',
     edit: '编辑',
     save: '保存',
     saved: '已保存',
@@ -195,6 +196,12 @@ export default {
     providerDeleted: 'Provider 已删除',
     deleteProvider: '删除 Provider',
     deleteConfirm: '确定删除 "{name}" 吗？',
+    codexLoginTitle: 'OpenAI Codex 登录',
+    codexWaiting: '在授权页面输入以下代码完成登录：',
+    codexCopyCode: '代码已复制',
+    codexOpenLink: '打开授权页面',
+    codexApproved: '登录成功',
+    codexExpired: '授权已过期，请重试。',
     noProviders: '暂无 Provider，添加一个开始吧。',
     builtIn: '内置',
     customType: '自定义',

packages/client/src/shared/providers.ts

@@ -221,6 +221,12 @@ export const PROVIDER_PRESETS: ProviderPreset[] = [
     base_url: 'https://opencode.ai/zen/go/v1',
     models: ['glm-5.1', 'glm-5', 'kimi-k2.5', 'mimo-v2-pro', 'mimo-v2-omni', 'minimax-m2.7', 'minimax-m2.5'],
   },
+  {
+    label: 'OpenAI Codex',
+    value: 'openai-codex',
+    base_url: 'https://chatgpt.com/backend-api/codex',
+    models: ['gpt-5.4-mini', 'gpt-5.4', 'gpt-5.3-codex', 'gpt-5.2-codex', 'gpt-5.1-codex-max', 'gpt-5.1-codex-mini'],
+  },
   {
     label: 'Arcee AI',
     value: 'arcee',

packages/client/src/views/hermes/ChannelsView.vue

@@ -21,7 +21,7 @@ onMounted(() => {
 
     <div class="channels-content">
       <NSpin :show="settingsStore.loading || settingsStore.saving" size="large" :description="t('common.loading')">
-        <PlatformSettings />
+        <PlatformSettings v-if="!settingsStore.loading" />
       </NSpin>
     </div>
   </div>

packages/client/src/views/hermes/ModelsView.vue

@@ -5,9 +5,11 @@ import { useI18n } from 'vue-i18n'
 import ProvidersPanel from '@/components/hermes/models/ProvidersPanel.vue'
 import ProviderFormModal from '@/components/hermes/models/ProviderFormModal.vue'
 import { useModelsStore } from '@/stores/hermes/models'
+import { useAppStore } from '@/stores/hermes/app'
 
 const { t } = useI18n()
 const modelsStore = useModelsStore()
+const appStore = useAppStore()
 const showModal = ref(false)
 
 onMounted(() => {
@@ -24,6 +26,7 @@ function handleModalClose() {
 
 async function handleSaved() {
   await modelsStore.fetchProviders()
+  appStore.loadModels()
   handleModalClose()
 }
 </script>