feat: desktop setting provider

desktop/index.html

@@ -12,7 +12,7 @@
     </style>
     <script>
       (function () {
-        var bootDeadlineMs = 8000
+        var bootDeadlineMs = 30000
 
         function summarize(value) {
           if (!value) return 'Unknown startup error'
@@ -27,6 +27,8 @@
 
         function renderStartupError(reason) {
           if (window.__CC_HAHA_BOOTSTRAPPED__) return
+          if (window.__CC_HAHA_STARTUP_ERROR_SHOWN__) return
+          window.__CC_HAHA_STARTUP_ERROR_SHOWN__ = true
           var root = document.getElementById('root')
           if (!root) return
 
@@ -94,8 +96,13 @@
         })
 
         window.setTimeout(function () {
+          if (window.__CC_HAHA_STARTUP_ERROR_SHOWN__) return
           renderStartupError('Desktop app did not finish bootstrapping within ' + bootDeadlineMs + 'ms. This usually means the WebView could not execute the app bundle or startup code stopped before React mounted.')
         }, bootDeadlineMs)
+
+        window.addEventListener('load', function () {
+          window.__CC_HAHA_PAGE_LOADED__ = true
+        })
       })()
     </script>
   </head>

desktop/package.json

@@ -5,12 +5,13 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
+    "dev:kill": "fuser -k 1420/tcp 2>/dev/null; bun run dev",
     "build": "tsc -b && vite build",
     "build:sidecars": "bun run ./scripts/build-sidecars.ts",
     "build:macos-arm64": "bash ./scripts/build-macos-arm64.sh",
     "build:windows-x64": "powershell -ExecutionPolicy Bypass -File ./scripts/build-windows-x64.ps1",
     "preview": "vite preview",
-    "tauri": "GDK_BACKEND=x11 WEBKIT_DISABLE_COMPOSITING_MODE=1 tauri",
+    "tauri": "lsof -ti:1420 | xargs kill -9 2>/dev/null; GDK_BACKEND=x11 WEBKIT_DISABLE_COMPOSITING_MODE=1 tauri",
     "test": "vitest",
     "test:ui": "vitest --ui",
     "lint": "tsc --noEmit"

desktop/src-tauri/tauri.conf.json

@@ -6,7 +6,7 @@
   "build": {
     "frontendDist": "../dist",
     "devUrl": "http://localhost:1420",
-    "beforeDevCommand": "bun run build:sidecars && bun run dev",
+    "beforeDevCommand": "lsof -ti:1420 | xargs kill -9 2>/dev/null; bun run build:sidecars && bun run dev",
     "beforeBuildCommand": "bun run build && bun run build:sidecars"
   },
   "app": {

desktop/src/api/cliAuth.ts

@@ -0,0 +1,31 @@
+import { api } from './client'
+
+type AuthProvider = 'anthropic' | 'openai' | 'openrouter' | 'local' | 'opencode' | 'nvidia'
+
+type CliAuthConfig = {
+  authProvider: AuthProvider | null
+  nvidiaApiKey?: string
+  openRouterApiKey?: string
+  openAiApiKey?: string
+  openAiAccessToken?: string
+  openCodeApiKey?: string
+  openCodeModelName?: string
+  localBaseUrl?: string
+  localModelName?: string
+}
+
+export type { AuthProvider, CliAuthConfig }
+
+export const cliAuthApi = {
+  get(): Promise<CliAuthConfig> {
+    return api.get<CliAuthConfig>('/api/cli-auth')
+  },
+
+  update(config: Partial<CliAuthConfig>): Promise<{ ok: true }> {
+    return api.put<{ ok: true }>('/api/cli-auth', config)
+  },
+
+  invalidateCache(): Promise<{ ok: true }> {
+    return api.post<{ ok: true }>('/api/cli-auth/invalidate', {})
+  },
+}

desktop/src/components/settings/AnthropicLoginPanel.tsx

@@ -0,0 +1,101 @@
+import { useEffect } from 'react'
+import { open as shellOpen } from '@tauri-apps/plugin-shell'
+import { useHahaOAuthStore } from '../../stores/hahaOAuthStore'
+import { useTranslation } from '../../i18n'
+
+export function AnthropicLoginPanel() {
+  const t = useTranslation()
+  const {
+    status,
+    isLoading,
+    error,
+    fetchStatus,
+    login,
+    logout,
+    startPolling,
+    stopPolling,
+  } = useHahaOAuthStore()
+
+  useEffect(() => {
+    fetchStatus()
+    return () => stopPolling()
+  }, [fetchStatus, stopPolling])
+
+  const handleLogin = async () => {
+    try {
+      const { authorizeUrl } = await login()
+      try {
+        await shellOpen(authorizeUrl)
+        startPolling()
+      } catch (err) {
+        console.error('[AnthropicLoginPanel] shellOpen failed:', err)
+        useHahaOAuthStore.setState({
+          error: t('settings.claudeOfficialLogin.openBrowserFailed'),
+        })
+      }
+    } catch {
+      // store.login() errors are already captured into store.error
+    }
+  }
+
+  if (status === null) {
+    if (error) {
+      return (
+        <div className="text-xs text-[var(--color-error)] py-2">
+          {t('settings.claudeOfficialLogin.errorPrefix')}{error}
+        </div>
+      )
+    }
+    return (
+      <div className="text-xs text-[var(--color-text-tertiary)] py-2">
+        {t('common.loading')}
+      </div>
+    )
+  }
+
+  if (status.loggedIn) {
+    const subTypeLabel = status.subscriptionType
+      ? status.subscriptionType.toUpperCase()
+      : t('settings.claudeOfficialLogin.subTypeUnknown')
+    return (
+      <div className="flex items-center gap-3 py-2">
+        <span className="text-sm text-[var(--color-success)]">
+          ✓ {t('settings.claudeOfficialLogin.loggedInPrefix')} {subTypeLabel})
+        </span>
+        <button
+          type="button"
+          onClick={logout}
+          disabled={isLoading}
+          className="px-3 py-1 text-xs rounded-md border border-[var(--color-border-separator)] bg-[var(--color-surface)] hover:bg-[var(--color-surface-hover)] disabled:opacity-50 transition-colors"
+        >
+          {isLoading
+            ? t('settings.claudeOfficialLogin.logoutProcessing')
+            : t('settings.claudeOfficialLogin.logoutButton')}
+        </button>
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex flex-col gap-2 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        {t('settings.claudeOfficialLogin.intro')}
+      </div>
+      <button
+        type="button"
+        onClick={handleLogin}
+        disabled={isLoading}
+        className="self-start rounded-md bg-[image:var(--gradient-btn-primary)] px-4 py-2 text-sm text-[var(--color-btn-primary-fg)] shadow-[var(--shadow-button-primary)] hover:brightness-105 disabled:opacity-50 transition-opacity"
+      >
+        {isLoading
+          ? t('settings.claudeOfficialLogin.loginStarting')
+          : t('settings.claudeOfficialLogin.loginButton')}
+      </button>
+      {error && (
+        <div className="text-xs text-[var(--color-error)]">
+          {t('settings.claudeOfficialLogin.errorPrefix')}{error}
+        </div>
+      )}
+    </div>
+  )
+}

desktop/src/components/settings/CliLoginProviderSettings.tsx

@@ -0,0 +1,125 @@
+import { useEffect, useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+import { AnthropicLoginPanel } from './AnthropicLoginPanel'
+import { OpenAILoginPanel } from './OpenAILoginPanel'
+import { NvidiaLoginPanel } from './NvidiaLoginPanel'
+import { OpenRouterLoginPanel } from './OpenRouterLoginPanel'
+import { OpenCodeLoginPanel } from './OpenCodeLoginPanel'
+import { LocalLoginPanel } from './LocalLoginPanel'
+import type { AuthProvider } from '../../api/cliAuth'
+
+const PROVIDER_OPTIONS: { id: AuthProvider; name: string; description: string; icon: string }[] = [
+  { id: 'anthropic', name: 'Anthropic', description: 'Subscription login, Console API billing, or Bedrock/Foundry/Vertex', icon: '🤖' },
+  { id: 'openai', name: 'OpenAI / Codex', description: 'Codex login, Codex auth import, or OpenAI API key', icon: '🤖' },
+  { id: 'openrouter', name: 'OpenRouter', description: 'OpenRouter API key via Responses API', icon: '🔀' },
+  { id: 'opencode', name: 'OpenCode Zen', description: 'Free models (Big Pickle, GPT 5 Nano) or Zen API key', icon: '✨' },
+  { id: 'local', name: 'Local', description: 'Local model server (Ollama, LM Studio, vLLM, etc.)', icon: '💻' },
+  { id: 'nvidia', name: 'NVIDIA', description: 'NVIDIA NIM API key from build.nvidia.com', icon: '🔷' },
+]
+
+const LOGIN_PANEL_MAP: Record<AuthProvider, React.FC> = {
+  anthropic: AnthropicLoginPanel,
+  openai: OpenAILoginPanel,
+  openrouter: OpenRouterLoginPanel,
+  opencode: OpenCodeLoginPanel,
+  local: LocalLoginPanel,
+  nvidia: NvidiaLoginPanel,
+}
+
+export function CliLoginProviderSettings() {
+  const { authProvider, isLoading, fetchAuth, clearAuth } = useCliAuthStore()
+  const [expandedProvider, setExpandedProvider] = useState<AuthProvider | null>(null)
+
+  useEffect(() => {
+    fetchAuth()
+  }, [fetchAuth])
+
+  const handleProviderClick = (providerId: AuthProvider) => {
+    if (expandedProvider === providerId) {
+      setExpandedProvider(null)
+    } else {
+      setExpandedProvider(providerId)
+    }
+  }
+
+  return (
+    <div className="max-w-2xl">
+      <div className="mb-4">
+        <h2 className="text-base font-semibold text-[var(--color-text-primary)]">Provider</h2>
+        <p className="text-sm text-[var(--color-text-tertiary)] mt-0.5">
+          Choose which provider to use. Pick a provider first, then configure the login method.
+        </p>
+      </div>
+
+      {authProvider && (
+        <div className="mb-3 px-4 py-2 rounded-lg bg-[var(--color-surface-container)] border border-[var(--color-border)]">
+          <div className="flex items-center justify-between">
+            <span className="text-sm text-[var(--color-text-secondary)]">
+              Current provider: <strong className="text-[var(--color-text-primary)]">{PROVIDER_OPTIONS.find(p => p.id === authProvider)?.name || authProvider}</strong>
+            </span>
+            <button
+              onClick={clearAuth}
+              disabled={isLoading}
+              className="text-xs text-[var(--color-text-tertiary)] hover:text-[var(--color-error)] disabled:opacity-50"
+            >
+              Clear &amp; change
+            </button>
+          </div>
+        </div>
+      )}
+
+      <div className="flex flex-col gap-2">
+        {PROVIDER_OPTIONS.map((provider) => {
+          const isActive = provider.id === authProvider
+          const isExpanded = expandedProvider === provider.id
+          const LoginPanel = LOGIN_PANEL_MAP[provider.id]
+
+          return (
+            <div
+              key={provider.id}
+              className={`rounded-xl border transition-all ${
+                isExpanded && isActive
+                  ? 'border-[var(--color-brand)] bg-[var(--color-surface-container)] shadow-[var(--shadow-focus-ring)]'
+                  : isActive
+                    ? 'border-[var(--color-success)]/30 bg-[var(--color-surface-container)]'
+                    : isExpanded
+                      ? 'border-[var(--color-border-focus)]'
+                      : 'border-[var(--color-border)] hover:border-[var(--color-border-focus)]'
+              }`}
+            >
+              <button
+                className={`w-full flex items-center gap-4 px-4 py-3.5 text-left ${!isExpanded && !isActive ? 'cursor-pointer' : ''}`}
+                onClick={() => handleProviderClick(provider.id)}
+              >
+                <span className={`w-2.5 h-2.5 rounded-full flex-shrink-0 ${
+                  isActive ? 'bg-[var(--color-success)]' : isExpanded ? 'bg-[var(--color-brand)]' : 'bg-[var(--color-text-tertiary)]'
+                }`} />
+                <div className="flex-1 min-w-0">
+                  <div className="flex items-center gap-2">
+                    <span className="text-sm font-semibold text-[var(--color-text-primary)]">{provider.name}</span>
+                    {isActive && authProvider && (
+                      <span className="px-1.5 py-0.5 text-[10px] font-bold rounded border border-[var(--color-success)]/18 bg-[var(--color-success)]/14 text-[var(--color-success)] leading-none">Active</span>
+                    )}
+                  </div>
+                  <div className="text-xs text-[var(--color-text-tertiary)] mt-0.5">{provider.description}</div>
+                </div>
+                <svg
+                  className={`w-4 h-4 text-[var(--color-text-tertiary)] transition-transform ${isExpanded ? 'rotate-180' : ''}`}
+                  fill="none" stroke="currentColor" viewBox="0 0 24 24"
+                >
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
+                </svg>
+              </button>
+
+              {isExpanded && (
+                <div className="px-4 pb-4 pt-2 border-t border-[var(--color-border-separator)]">
+                  <LoginPanel />
+                </div>
+              )}
+            </div>
+          )
+        })}
+      </div>
+    </div>
+  )
+}

desktop/src/components/settings/LocalLoginPanel.tsx

@@ -0,0 +1,78 @@
+import { useEffect, useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+
+export function LocalLoginPanel() {
+  const { localBaseUrl, localModelName, saveLocalModelConfig, isLoading } = useCliAuthStore()
+  const [url, setUrl] = useState('')
+  const [modelName, setModelName] = useState('')
+  const [status, setStatus] = useState<string | null>(null)
+  const defaultUrl = 'http://127.0.0.1:8001'
+
+  useEffect(() => {
+    if (localBaseUrl) setUrl(localBaseUrl)
+    if (localModelName) setModelName(localModelName)
+  }, [localBaseUrl, localModelName])
+
+  const handleSave = async () => {
+    const finalUrl = url.trim() || defaultUrl
+    const finalModel = modelName.trim() || 'default'
+    if (!finalUrl) { setStatus('Please enter a URL'); return }
+    try {
+      new URL(finalUrl) // validate URL
+    } catch {
+      setStatus('Invalid URL format')
+      return
+    }
+    setStatus(null)
+    try {
+      await saveLocalModelConfig(finalUrl, finalModel)
+      setStatus('Saved!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-3 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        Configure a local model server (Ollama, LM Studio, vLLM, etc.).
+      </div>
+      <div className="flex flex-col gap-2">
+        <div>
+          <label className="text-xs text-[var(--color-text-tertiary)] mb-1 block">Server URL</label>
+          <input
+            type="text"
+            value={url}
+            onChange={e => setUrl(e.target.value)}
+            placeholder={localBaseUrl || defaultUrl}
+            className="w-full rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+          />
+        </div>
+        <div>
+          <label className="text-xs text-[var(--color-text-tertiary)] mb-1 block">Model Name</label>
+          <input
+            type="text"
+            value={modelName}
+            onChange={e => setModelName(e.target.value)}
+            placeholder={localModelName || 'default'}
+            className="w-full rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+          />
+        </div>
+      </div>
+      <div className="flex items-center gap-2">
+        <button
+          onClick={handleSave}
+          disabled={isLoading}
+          className="rounded-md bg-[var(--color-brand)] px-4 py-2 text-sm text-white hover:brightness-105 disabled:opacity-50"
+        >
+          {isLoading ? 'Saving...' : 'Save'}
+        </button>
+      </div>
+      {status && (
+        <div className={`text-xs ${status === 'Saved!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+          {status}
+        </div>
+      )}
+    </div>
+  )
+}

desktop/src/components/settings/NvidiaLoginPanel.tsx

@@ -0,0 +1,66 @@
+import { useEffect, useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+
+export function NvidiaLoginPanel() {
+  const { nvidiaApiKey, saveNvidiaApiKey, isLoading } = useCliAuthStore()
+  const [apiKey, setApiKey] = useState('')
+  const [status, setStatus] = useState<string | null>(null)
+
+  useEffect(() => {
+    if (nvidiaApiKey) setApiKey(nvidiaApiKey)
+  }, [nvidiaApiKey])
+
+  const handleSave = async () => {
+    if (!apiKey.trim()) { setStatus('Please enter an API key'); return }
+    setStatus(null)
+    try {
+      await saveNvidiaApiKey(apiKey.trim())
+      setStatus('Saved!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  const handleClear = async () => {
+    await useCliAuthStore.getState().clearAuth()
+    setApiKey('')
+    setStatus('Cleared')
+  }
+
+  return (
+    <div className="flex flex-col gap-3 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        Paste your NVIDIA API key to use models from the NVIDIA API catalog via the OpenAI-compatible endpoint.
+      </div>
+      <div className="flex items-center gap-2">
+        <input
+          type="password"
+          value={apiKey}
+          onChange={e => setApiKey(e.target.value)}
+          placeholder={nvidiaApiKey ? '••••••••' : 'sk-...'}
+          className="flex-1 rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+        />
+        <button
+          onClick={handleSave}
+          disabled={isLoading}
+          className="rounded-md bg-[var(--color-brand)] px-4 py-2 text-sm text-white hover:brightness-105 disabled:opacity-50"
+        >
+          {isLoading ? 'Saving...' : 'Save'}
+        </button>
+        {nvidiaApiKey && (
+          <button
+            onClick={handleClear}
+            className="rounded-md border border-[var(--color-border)] px-3 py-2 text-sm text-[var(--color-text-secondary)] hover:bg-[var(--color-surface-hover)]"
+          >
+            Clear
+          </button>
+        )}
+      </div>
+      {status && (
+        <div className={`text-xs ${status === 'Saved!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+          {status}
+        </div>
+      )}
+    </div>
+  )
+}

desktop/src/components/settings/OpenAILoginPanel.tsx

@@ -0,0 +1,66 @@
+import { useEffect, useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+
+export function OpenAILoginPanel() {
+  const { openAiApiKey, saveOpenAIApiKey, isLoading } = useCliAuthStore()
+  const [apiKey, setApiKey] = useState('')
+  const [status, setStatus] = useState<string | null>(null)
+
+  useEffect(() => {
+    if (openAiApiKey) setApiKey(openAiApiKey)
+  }, [openAiApiKey])
+
+  const handleSave = async () => {
+    if (!apiKey.trim()) { setStatus('Please enter an API key'); return }
+    setStatus(null)
+    try {
+      await saveOpenAIApiKey(apiKey.trim())
+      setStatus('Saved!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  const handleClear = async () => {
+    await useCliAuthStore.getState().clearAuth()
+    setApiKey('')
+    setStatus('Cleared')
+  }
+
+  return (
+    <div className="flex flex-col gap-3 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        Paste your OpenAI API key to use OpenAI models with standard platform billing.
+      </div>
+      <div className="flex items-center gap-2">
+        <input
+          type="password"
+          value={apiKey}
+          onChange={e => setApiKey(e.target.value)}
+          placeholder={openAiApiKey ? '••••••••' : 'sk-...'}
+          className="flex-1 rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+        />
+        <button
+          onClick={handleSave}
+          disabled={isLoading}
+          className="rounded-md bg-[var(--color-brand)] px-4 py-2 text-sm text-white hover:brightness-105 disabled:opacity-50"
+        >
+          {isLoading ? 'Saving...' : 'Save'}
+        </button>
+        {openAiApiKey && (
+          <button
+            onClick={handleClear}
+            className="rounded-md border border-[var(--color-border)] px-3 py-2 text-sm text-[var(--color-text-secondary)] hover:bg-[var(--color-surface-hover)]"
+          >
+            Clear
+          </button>
+        )}
+      </div>
+      {status && (
+        <div className={`text-xs ${status === 'Saved!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+          {status}
+        </div>
+      )}
+    </div>
+  )
+}

desktop/src/components/settings/OpenCodeLoginPanel.tsx

@@ -0,0 +1,115 @@
+import { useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+
+export function OpenCodeLoginPanel() {
+  const { openCodeApiKey, saveOpenCodeApiKey, isLoading } = useCliAuthStore()
+  const [mode, setMode] = useState<'menu' | 'api_key'>('menu')
+  const [apiKey, setApiKey] = useState('')
+  const [status, setStatus] = useState<string | null>(null)
+
+  const handleFreeModels = async () => {
+    setStatus(null)
+    try {
+      await saveOpenCodeApiKey('', '')
+      setStatus('Free models configured!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  const handleSave = async () => {
+    if (!apiKey.trim()) { setStatus('Please enter an API key'); return }
+    setStatus(null)
+    try {
+      await saveOpenCodeApiKey(apiKey.trim(), '')
+      setStatus('Saved!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  const handleClear = async () => {
+    await useCliAuthStore.getState().clearAuth()
+    setApiKey('')
+    setStatus('Cleared')
+  }
+
+  if (mode === 'api_key') {
+    return (
+      <div className="flex flex-col gap-3 py-2">
+        <div className="text-sm text-[var(--color-text-secondary)]">
+          OpenCode Zen API keys use pay-as-you-go billing. Sign up at <a href="https://opencode.ai/zen" className="text-[var(--color-brand)]" target="_blank">opencode.ai/zen</a> to get your key.
+        </div>
+        <div className="flex items-center gap-2">
+          <input
+            type="password"
+            value={apiKey}
+            onChange={e => setApiKey(e.target.value)}
+            placeholder={openCodeApiKey ? '••••••••' : 'oc-...'}
+            className="flex-1 rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+          />
+          <button
+            onClick={handleSave}
+            disabled={isLoading}
+            className="rounded-md bg-[var(--color-brand)] px-4 py-2 text-sm text-white hover:brightness-105 disabled:opacity-50"
+          >
+            {isLoading ? 'Saving...' : 'Save'}
+          </button>
+        </div>
+        <button
+          onClick={() => { setMode('menu'); setApiKey(''); setStatus(null) }}
+          className="self-start text-xs text-[var(--color-text-tertiary)] hover:text-[var(--color-text-primary)]"
+        >
+          &larr; Back to options
+        </button>
+        {status && (
+          <div className={`text-xs ${status === 'Saved!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+            {status}
+          </div>
+        )}
+      </div>
+    )
+  }
+
+  return (
+    <div className="flex flex-col gap-3 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        OpenCode Zen offers free models (no API key needed) or paid models via API key.
+      </div>
+      {status && (
+        <div className={`text-xs ${status === 'Saved!' || status === 'Free models configured!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+          {status}
+        </div>
+      )}
+      <div className="flex flex-col gap-2">
+        <button
+          onClick={handleFreeModels}
+          disabled={isLoading}
+          className="flex items-center gap-3 rounded-lg border border-[var(--color-border)] px-4 py-3 text-left hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-hover)] disabled:opacity-50"
+        >
+          <div>
+            <div className="text-sm font-medium text-[var(--color-text-primary)]">Use free models</div>
+            <div className="text-xs text-[var(--color-text-tertiary)]">No API key required</div>
+          </div>
+        </button>
+        <button
+          onClick={() => { setMode('api_key'); setApiKey('') }}
+          className="flex items-center gap-3 rounded-lg border border-[var(--color-border)] px-4 py-3 text-left hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-hover)]"
+        >
+          <div>
+            <div className="text-sm font-medium text-[var(--color-text-primary)]">Paste OpenCode Zen API key</div>
+            <div className="text-xs text-[var(--color-text-tertiary)]">Access paid models, pay-as-you-go</div>
+          </div>
+        </button>
+        {openCodeApiKey && (
+          <button
+            onClick={handleClear}
+            className="self-start text-xs text-[var(--color-text-tertiary)] hover:text-[var(--color-error)]"
+          >
+            Clear credentials
+          </button>
+        )}
+      </div>
+    </div>
+  )
+}

desktop/src/components/settings/OpenRouterLoginPanel.tsx

@@ -0,0 +1,66 @@
+import { useEffect, useState } from 'react'
+import { useCliAuthStore } from '../../stores/cliAuthStore'
+
+export function OpenRouterLoginPanel() {
+  const { openRouterApiKey, saveOpenRouterApiKey, isLoading } = useCliAuthStore()
+  const [apiKey, setApiKey] = useState('')
+  const [status, setStatus] = useState<string | null>(null)
+
+  useEffect(() => {
+    if (openRouterApiKey) setApiKey(openRouterApiKey)
+  }, [openRouterApiKey])
+
+  const handleSave = async () => {
+    if (!apiKey.trim()) { setStatus('Please enter an API key'); return }
+    setStatus(null)
+    try {
+      await saveOpenRouterApiKey(apiKey.trim())
+      setStatus('Saved!')
+    } catch (err) {
+      setStatus(err instanceof Error ? err.message : String(err))
+    }
+  }
+
+  const handleClear = async () => {
+    await useCliAuthStore.getState().clearAuth()
+    setApiKey('')
+    setStatus('Cleared')
+  }
+
+  return (
+    <div className="flex flex-col gap-3 py-2">
+      <div className="text-sm text-[var(--color-text-secondary)]">
+        Paste your OpenRouter key to use the Anthropic-compatible OpenRouter base URL at <code>https://openrouter.ai/api</code>.
+      </div>
+      <div className="flex items-center gap-2">
+        <input
+          type="password"
+          value={apiKey}
+          onChange={e => setApiKey(e.target.value)}
+          placeholder={openRouterApiKey ? '••••••••' : 'sk-or-...'}
+          className="flex-1 rounded-md border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-sm text-[var(--color-text-primary)] placeholder-[var(--color-text-tertiary)] focus:border-[var(--color-brand)] focus:outline-none"
+        />
+        <button
+          onClick={handleSave}
+          disabled={isLoading}
+          className="rounded-md bg-[var(--color-brand)] px-4 py-2 text-sm text-white hover:brightness-105 disabled:opacity-50"
+        >
+          {isLoading ? 'Saving...' : 'Save'}
+        </button>
+        {openRouterApiKey && (
+          <button
+            onClick={handleClear}
+            className="rounded-md border border-[var(--color-border)] px-3 py-2 text-sm text-[var(--color-text-secondary)] hover:bg-[var(--color-surface-hover)]"
+          >
+            Clear
+          </button>
+        )}
+      </div>
+      {status && (
+        <div className={`text-xs ${status === 'Saved!' ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
+          {status}
+        </div>
+      )}
+    </div>
+  )
+}

desktop/src/main.tsx

@@ -7,6 +7,8 @@ import { runDesktopPersistenceMigrations } from './lib/persistenceMigrations'
 declare global {
   interface Window {
     __CC_HAHA_BOOTSTRAPPED__?: boolean
+    __CC_HAHA_PAGE_LOADED__?: boolean
+    __CC_HAHA_STARTUP_ERROR_SHOWN__?: boolean
     __CC_HAHA_SHOW_STARTUP_ERROR__?: (reason: unknown) => void
   }
 }
@@ -32,7 +34,10 @@ export async function bootstrapDesktopApp(
   loadModules: () => Promise<DesktopBootstrapModules> = loadDesktopBootstrapModules,
 ) {
   try {
+    console.log('[desktop] Loading desktop bootstrap modules...')
     const [{ App }, { ErrorBoundary }, { installClientDiagnosticsCapture }, { initializeTheme }] = await loadModules()
+    console.log('[desktop] Bootstrap modules loaded')
+
     initializeTheme()
     installClientDiagnosticsCapture()
 
@@ -40,6 +45,7 @@ export async function bootstrapDesktopApp(
       throw new Error('Desktop root element not found')
     }
 
+    console.log('[desktop] Rendering React...')
     ReactDOM.createRoot(root).render(
       <React.StrictMode>
         <ErrorBoundary>
@@ -48,6 +54,7 @@ export async function bootstrapDesktopApp(
       </React.StrictMode>,
     )
     window.__CC_HAHA_BOOTSTRAPPED__ = true
+    console.log('[desktop] React rendered, app bootstrapped')
   } catch (error) {
     console.error('[desktop] Failed to bootstrap app', error)
     if (root) {
@@ -60,7 +67,14 @@ export async function bootstrapDesktopApp(
   }
 }
 
-runDesktopPersistenceMigrations()
-void initializeAppZoom()
+console.log('[desktop] Starting migrations...')
+const migrationReport = runDesktopPersistenceMigrations()
+console.log('[desktop] Migrations complete', migrationReport)
+
+console.log('[desktop] Initializing app zoom...')
+const zoomPromise = initializeAppZoom()
+zoomPromise.then(level => console.log('[desktop] App zoom initialized:', level))
+           .catch(err => console.error('[desktop] App zoom failed:', err))
 
+console.log('[desktop] Bootstrapping desktop app...')
 void bootstrapDesktopApp()

desktop/src/pages/Settings.tsx

@@ -2,17 +2,13 @@ import { useState, useEffect, useMemo, useRef, type CSSProperties, type ReactNod
 import QRCode from 'qrcode'
 import { Copy, Eye, EyeOff, PowerOff, QrCode, RotateCw } from 'lucide-react'
 import { useSettingsStore, UI_ZOOM_DEFAULT, UI_ZOOM_MIN, UI_ZOOM_MAX, UI_ZOOM_STEP } from '../stores/settingsStore'
-import { useProviderStore } from '../stores/providerStore'
 import { useTranslation } from '../i18n'
-import { Modal } from '../components/shared/Modal'
 import { ConfirmDialog } from '../components/shared/ConfirmDialog'
 import { Input } from '../components/shared/Input'
 import { Button } from '../components/shared/Button'
 import { Dropdown } from '../components/shared/Dropdown'
 import type { PermissionMode, EffortLevel, ThemeMode, UpdateProxyMode, NetworkProxyMode, WebSearchMode, AppMode } from '../types/settings'
 import type { Locale } from '../i18n'
-import type { SavedProvider, UpdateProviderInput, ProviderTestResult, ModelMapping, ApiFormat, ProviderAuthStrategy } from '../types/provider'
-import type { ProviderPreset } from '../types/providerPreset'
 import { AdapterSettings } from './AdapterSettings'
 import { useAgentStore } from '../stores/agentStore'
 import { useSessionStore } from '../stores/sessionStore'
@@ -31,9 +27,7 @@ import { DiagnosticsSettings } from './DiagnosticsSettings'
 import { ActivitySettings } from './ActivitySettings'
 import { MemorySettings } from './MemorySettings'
 import { useUIStore, type SettingsTab } from '../stores/uiStore'
-import { ClaudeOfficialLogin } from '../components/settings/ClaudeOfficialLogin'
-import { ChatGPTOfficialLogin } from '../components/settings/ChatGPTOfficialLogin'
-import { OPENAI_OFFICIAL_PROVIDER_ID } from '../constants/openaiOfficialProvider'
+import { CliLoginProviderSettings } from '../components/settings/CliLoginProviderSettings'
 import { useUpdateStore } from '../stores/updateStore'
 import { formatBytes } from '../lib/formatBytes'
 import { isTauriRuntime } from '../lib/desktopRuntime'
@@ -44,12 +38,6 @@ import {
   requestDesktopNotificationPermission,
   type DesktopNotificationPermission,
 } from '../lib/desktopNotifications'
-import {
-  API_KEY_JSON_PLACEHOLDER,
-  maskSettingsJsonSecrets,
-  restoreSettingsJsonSecrets,
-  stripProviderSettingsJsonEnv,
-} from '../lib/providerSettingsJson'
 import { copyTextToClipboard } from '../components/chat/clipboard'
 
 const NETWORK_TIMEOUT_MIN_SECONDS = 5
@@ -204,1221 +192,9 @@ function TabButton({ icon, label, active, onClick }: { icon: string; label: stri
 // ─── Provider Settings ──────────────────────────────────────
 
 function ProviderSettings() {
-  const {
-    providers,
-    activeId,
-    hasLoadedProviders,
-    presets,
-    isLoading,
-    isPresetsLoading,
-    fetchProviders,
-    fetchPresets,
-    deleteProvider,
-    activateProvider,
-    activateOfficial,
-    testProvider,
-  } = useProviderStore()
-  const fetchSettings = useSettingsStore((s) => s.fetchAll)
-  const t = useTranslation()
-  const [editingProvider, setEditingProvider] = useState<SavedProvider | null>(null)
-  const [showCreateModal, setShowCreateModal] = useState(false)
-  const [pendingDeleteProvider, setPendingDeleteProvider] = useState<SavedProvider | null>(null)
-  const [isDeletingProvider, setIsDeletingProvider] = useState(false)
-  const [testResults, setTestResults] = useState<Record<string, { loading: boolean; result?: ProviderTestResult }>>({})
-
-  useEffect(() => {
-    void fetchProviders()
-    void fetchPresets()
-  }, [fetchPresets, fetchProviders])
-
-  const presetMap = useMemo(
-    () => new Map(presets.map((preset) => [preset.id, preset])),
-    [presets],
-  )
-
-  const handleDelete = async (provider: SavedProvider) => {
-    if (activeId === provider.id) return
-    setPendingDeleteProvider(provider)
-  }
-
-  const confirmDelete = async () => {
-    if (!pendingDeleteProvider) return
-    setIsDeletingProvider(true)
-    try {
-      await deleteProvider(pendingDeleteProvider.id)
-      setPendingDeleteProvider(null)
-    } catch (error) {
-      console.error(error)
-    } finally {
-      setIsDeletingProvider(false)
-    }
-  }
-
-  const handleTest = async (provider: SavedProvider) => {
-    setTestResults((r) => ({ ...r, [provider.id]: { loading: true } }))
-    try {
-      const result = await testProvider(provider.id)
-      setTestResults((r) => ({ ...r, [provider.id]: { loading: false, result } }))
-    } catch {
-      setTestResults((r) => ({ ...r, [provider.id]: { loading: false, result: { connectivity: { success: false, latencyMs: 0, error: t('settings.providers.requestFailed') } } } }))
-    }
-  }
-
-  const handleActivate = async (id: string) => {
-    await activateProvider(id)
-    await fetchSettings()
-  }
-
-  const handleActivateOfficial = async () => {
-    await activateOfficial()
-    await fetchSettings()
-  }
-
-  const isClaudeOfficialActive = hasLoadedProviders && activeId === null
-  const isOpenAIOfficialActive = hasLoadedProviders && activeId === OPENAI_OFFICIAL_PROVIDER_ID
-
-  return (
-    <div className="max-w-2xl">
-      <div className="flex items-center justify-between mb-4">
-        <div>
-          <h2 className="text-base font-semibold text-[var(--color-text-primary)]">{t('settings.providers.title')}</h2>
-          <p className="text-sm text-[var(--color-text-tertiary)] mt-0.5">{t('settings.providers.description')}</p>
-        </div>
-        <Button size="sm" onClick={() => setShowCreateModal(true)} disabled={isPresetsLoading || presets.length === 0}>
-          <span className="material-symbols-outlined text-[16px]">add</span>
-          {t('settings.providers.addProvider')}
-        </Button>
-      </div>
-
-      {/* Official provider — always visible at top */}
-      <div
-        data-testid="claude-official-provider"
-        className={`relative flex flex-col rounded-xl border transition-all mb-2 ${
-          isClaudeOfficialActive
-            ? 'border-[var(--color-brand)] bg-[var(--color-surface-container)] shadow-[var(--shadow-focus-ring)]'
-            : 'border-[var(--color-border)] hover:border-[var(--color-border-focus)] cursor-pointer'
-        }`}
-      >
-        <div
-          className="flex items-center gap-4 px-4 py-3.5"
-          onClick={() => !isClaudeOfficialActive && handleActivateOfficial()}
-        >
-          <span className={`w-2.5 h-2.5 rounded-full flex-shrink-0 ${isClaudeOfficialActive ? 'bg-[var(--color-success)]' : 'bg-[var(--color-text-tertiary)]'}`} />
-          <div className="flex-1 min-w-0">
-            <div className="flex items-center gap-2">
-              <span className="text-sm font-semibold text-[var(--color-text-primary)]">{t('settings.providers.officialName')}</span>
-              {isClaudeOfficialActive && (
-                <span className="px-1.5 py-0.5 text-[10px] font-bold rounded border border-[var(--color-brand)]/18 bg-[var(--color-brand)]/14 text-[var(--color-brand)] leading-none">{t('settings.providers.default')}</span>
-              )}
-            </div>
-            <div className="text-xs text-[var(--color-text-tertiary)] mt-0.5">{t('settings.providers.officialDesc')}</div>
-          </div>
-        </div>
-
-        {isClaudeOfficialActive && (
-          <div className="px-4 pb-4 pt-3 border-t border-[var(--color-border-separator)]">
-            <ClaudeOfficialLogin />
-          </div>
-        )}
-      </div>
-
-      <div
-        data-testid="openai-official-provider"
-        className={`relative flex flex-col rounded-xl border transition-all mb-2 ${
-          isOpenAIOfficialActive
-            ? 'border-[var(--color-brand)] bg-[var(--color-surface-container)] shadow-[var(--shadow-focus-ring)]'
-            : 'border-[var(--color-border)] hover:border-[var(--color-border-focus)] cursor-pointer'
-        }`}
-      >
-        <div
-          className="flex items-center gap-4 px-4 py-3.5"
-          onClick={() => !isOpenAIOfficialActive && handleActivate(OPENAI_OFFICIAL_PROVIDER_ID)}
-        >
-          <span className={`w-2.5 h-2.5 rounded-full flex-shrink-0 ${isOpenAIOfficialActive ? 'bg-[var(--color-success)]' : 'bg-[var(--color-text-tertiary)]'}`} />
-          <div className="flex-1 min-w-0">
-            <div className="flex items-center gap-2">
-              <span className="text-sm font-semibold text-[var(--color-text-primary)]">{t('settings.providers.openaiOfficialName')}</span>
-              {isOpenAIOfficialActive && (
-                <span className="px-1.5 py-0.5 text-[10px] font-bold rounded border border-[var(--color-brand)]/18 bg-[var(--color-brand)]/14 text-[var(--color-brand)] leading-none">{t('settings.providers.default')}</span>
-              )}
-            </div>
-            <div className="text-xs text-[var(--color-text-tertiary)] mt-0.5">{t('settings.providers.openaiOfficialDesc')}</div>
-          </div>
-        </div>
-
-        {isOpenAIOfficialActive && (
-          <div className="px-4 pb-4 pt-3 border-t border-[var(--color-border-separator)]">
-            <ChatGPTOfficialLogin />
-          </div>
-        )}
-      </div>
-
-      {/* Saved providers */}
-      {isLoading && providers.length === 0 ? (
-        <div className="flex justify-center py-8">
-          <div className="animate-spin w-5 h-5 border-2 border-[var(--color-brand)] border-t-transparent rounded-full" />
-        </div>
-      ) : (
-        <div className="flex flex-col gap-2">
-          {providers.map((provider) => {
-            const isActive = activeId === provider.id
-            const test = testResults[provider.id]
-            const preset = presetMap.get(provider.presetId)
-            return (
-              <div
-                key={provider.id}
-                className={`relative flex items-center gap-4 px-4 py-3.5 rounded-xl border transition-all group ${
-                  isActive
-                    ? 'border-[var(--color-brand)] bg-[var(--color-surface-container)] shadow-[var(--shadow-focus-ring)]'
-                    : 'border-[var(--color-border)] hover:border-[var(--color-border-focus)]'
-                }`}
-              >
-                <span className={`w-2.5 h-2.5 rounded-full flex-shrink-0 ${isActive ? 'bg-[var(--color-success)]' : 'bg-[var(--color-text-tertiary)]'}`} />
-                <div className="flex-1 min-w-0">
-                  <div className="flex items-center gap-2">
-                    <span className="text-sm font-semibold text-[var(--color-text-primary)] truncate">{provider.name}</span>
-                    {preset && preset.id !== 'custom' && (
-                      <span className="px-1.5 py-0.5 text-[10px] font-medium rounded bg-[var(--color-surface-container-high)] text-[var(--color-text-tertiary)] leading-none">{preset.name}</span>
-                    )}
-                    {provider.apiFormat && provider.apiFormat !== 'anthropic' && (
-                      <span className="px-1.5 py-0.5 text-[10px] font-medium rounded bg-[var(--color-surface-container-high)] text-[var(--color-warning)] leading-none">
-                        {provider.apiFormat === 'openai_chat' ? 'OpenAI Chat' : 'OpenAI Responses'}
-                      </span>
-                    )}
-                    {isActive && (
-                      <span className="px-1.5 py-0.5 text-[10px] font-bold rounded border border-[var(--color-brand)]/18 bg-[var(--color-brand)]/14 text-[var(--color-brand)] leading-none">{t('settings.providers.default')}</span>
-                    )}
-                  </div>
-                  <div className="text-xs text-[var(--color-text-tertiary)] truncate mt-0.5">
-                    {provider.baseUrl} &middot; {provider.models.main}
-                  </div>
-                  {test && !test.loading && test.result && (
-                    <div className="text-xs mt-1 flex flex-col gap-0.5">
-                      <span className={test.result.connectivity.success ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}>
-                        {test.result.connectivity.success
-                          ? t('settings.providers.connectivityOk', { latency: String(test.result.connectivity.latencyMs) })
-                          : t('settings.providers.connectivityFailed', { error: test.result.connectivity.error || '' })}
-                      </span>
-                      {test.result.proxy && (
-                        <span className={test.result.proxy.success ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}>
-                          {test.result.proxy.success
-                            ? t('settings.providers.proxyOk', { latency: String(test.result.proxy.latencyMs) })
-                            : t('settings.providers.proxyFailed', { error: test.result.proxy.error || '' })}
-                        </span>
-                      )}
-                    </div>
-                  )}
-                </div>
-                <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity flex-shrink-0">
-                  {!isActive && (
-                    <Button variant="ghost" size="sm" onClick={() => handleActivate(provider.id)}>{t('settings.providers.setDefault')}</Button>
-                  )}
-                  <Button variant="ghost" size="sm" onClick={() => handleTest(provider)} loading={test?.loading}>{t('settings.providers.test')}</Button>
-                  <Button variant="ghost" size="sm" onClick={() => setEditingProvider(provider)}>{t('settings.providers.edit')}</Button>
-                  {!isActive && (
-                    <Button variant="ghost" size="sm" onClick={() => handleDelete(provider)} className="text-[var(--color-error)] hover:text-[var(--color-error)]">{t('common.delete')}</Button>
-                  )}
-                </div>
-              </div>
-            )
-          })}
-        </div>
-      )}
-
-      {/* Create Modal — conditionally rendered so state resets on close */}
-      {showCreateModal && (
-        <ProviderFormModal open={true} onClose={() => setShowCreateModal(false)} mode="create" presets={presets} />
-      )}
-
-      {/* Edit Modal */}
-      {editingProvider && (
-        <ProviderFormModal key={editingProvider.id} open={true} onClose={() => setEditingProvider(null)} mode="edit" provider={editingProvider} presets={presets} />
-      )}
-
-      <ConfirmDialog
-        open={pendingDeleteProvider !== null}
-        onClose={() => {
-          if (isDeletingProvider) return
-          setPendingDeleteProvider(null)
-        }}
-        onConfirm={confirmDelete}
-        title={t('common.delete')}
-        body={pendingDeleteProvider ? t('settings.providers.confirmDelete', { name: pendingDeleteProvider.name }) : ''}
-        confirmLabel={t('common.delete')}
-        cancelLabel={t('common.cancel')}
-        confirmVariant="danger"
-        loading={isDeletingProvider}
-      />
-    </div>
-  )
-}
-
-// ─── Provider Form Modal ──────────────────────────────────────
-
-type ProviderFormProps = {
-  open: boolean
-  onClose: () => void
-  mode: 'create' | 'edit'
-  provider?: SavedProvider
-  presets: ProviderPreset[]
-}
-
-function requirePreset(preset: ProviderPreset | undefined): ProviderPreset {
-  if (!preset) {
-    throw new Error('Provider presets are not configured')
-  }
-  return preset
-}
-
-const AUTO_COMPACT_WINDOW_ENV_KEY = 'CLAUDE_CODE_AUTO_COMPACT_WINDOW'
-const MODEL_CONTEXT_WINDOWS_ENV_KEY = 'CLAUDE_CODE_MODEL_CONTEXT_WINDOWS'
-const MODEL_CONTEXT_WINDOW_MIN = 16000
-const MODEL_CONTEXT_WINDOW_MAX = 10000000
-const MODEL_SLOTS = ['main', 'haiku', 'sonnet', 'opus'] as const
-const DEFAULT_PROVIDER_AUTH_STRATEGY: ProviderAuthStrategy = 'auth_token'
-const AUTH_ENV_KEYS = new Set(['ANTHROPIC_API_KEY', 'ANTHROPIC_AUTH_TOKEN'])
-type ModelSlot = typeof MODEL_SLOTS[number]
-type ModelContextInputs = Record<ModelSlot, string>
-
-function formatContextWindow(value: number): string {
-  return value.toLocaleString('en-US')
-}
-
-function getPresetAutoCompactWindow(preset: ProviderPreset): string {
-  return preset.defaultEnv?.[AUTO_COMPACT_WINDOW_ENV_KEY] ?? ''
-}
-
-function getPresetAuthStrategy(preset: ProviderPreset): ProviderAuthStrategy {
-  return preset.authStrategy ?? DEFAULT_PROVIDER_AUTH_STRATEGY
-}
-
-function omitAuthEnv(env: Record<string, string> | undefined): Record<string, string> {
-  if (!env) return {}
-  return Object.fromEntries(
-    Object.entries(env).filter(([key]) => !AUTH_ENV_KEYS.has(key.toUpperCase())),
-  )
-}
-
-function getProviderAuthValue(apiKey: string, preset: ProviderPreset): string {
-  return apiKey || preset.defaultEnv?.ANTHROPIC_AUTH_TOKEN || preset.defaultEnv?.ANTHROPIC_API_KEY || (preset.needsApiKey ? '(your API key)' : '')
-}
-
-function buildSettingsJsonAuthEnv(
-  apiFormat: ApiFormat,
-  authStrategy: ProviderAuthStrategy,
-  apiKey: string,
-  preset: ProviderPreset,
-): Record<string, string> {
-  if (apiFormat !== 'anthropic') {
-    return { ANTHROPIC_API_KEY: 'proxy-managed' }
-  }
-
-  const value = getProviderAuthValue(apiKey, preset)
-  switch (authStrategy) {
-    case 'api_key':
-      return value ? { ANTHROPIC_API_KEY: value } : {}
-    case 'auth_token':
-      return value ? { ANTHROPIC_AUTH_TOKEN: value } : {}
-    case 'auth_token_empty_api_key':
-      return {
-        ANTHROPIC_API_KEY: '',
-        ...(value ? { ANTHROPIC_AUTH_TOKEN: value } : {}),
-      }
-    case 'dual_same_token':
-      return value ? { ANTHROPIC_API_KEY: value, ANTHROPIC_AUTH_TOKEN: value } : {}
-    case 'dual_dummy':
-      return { ANTHROPIC_API_KEY: 'dummy', ANTHROPIC_AUTH_TOKEN: 'dummy' }
-  }
-}
-
-function inferAuthStrategyFromEnv(env: Record<string, string>): ProviderAuthStrategy | null {
-  if (env.ANTHROPIC_API_KEY === 'dummy' && env.ANTHROPIC_AUTH_TOKEN === 'dummy') return 'dual_dummy'
-  if (env.ANTHROPIC_API_KEY === '' && env.ANTHROPIC_AUTH_TOKEN) return 'auth_token_empty_api_key'
-  if (env.ANTHROPIC_API_KEY && env.ANTHROPIC_AUTH_TOKEN && env.ANTHROPIC_API_KEY === env.ANTHROPIC_AUTH_TOKEN) return 'dual_same_token'
-  if (env.ANTHROPIC_AUTH_TOKEN) return 'auth_token'
-  if (env.ANTHROPIC_API_KEY) return 'api_key'
-  return null
-}
-
-function parseAutoCompactWindowInput(value: string): number | undefined {
-  const trimmed = value.trim()
-  if (!trimmed) return undefined
-  const parsed = Number(trimmed)
-  if (!Number.isInteger(parsed)) return undefined
-  if (parsed < MODEL_CONTEXT_WINDOW_MIN || parsed > MODEL_CONTEXT_WINDOW_MAX) return undefined
-  return parsed
-}
-
-function getAutoCompactWindowErrorKey(value: string): 'number' | 'range' | null {
-  const trimmed = value.trim()
-  if (!trimmed) return null
-  const parsed = Number(trimmed)
-  if (!Number.isInteger(parsed)) return 'number'
-  if (parsed < MODEL_CONTEXT_WINDOW_MIN || parsed > MODEL_CONTEXT_WINDOW_MAX) return 'range'
-  return null
-}
-
-function parseModelContextWindowsInput(value: string): number | undefined {
-  return parseAutoCompactWindowInput(value)
-}
-
-function getModelContextWindowErrorKey(value: string): 'number' | 'range' | null {
-  return getAutoCompactWindowErrorKey(value)
-}
-
-function getModelContextInputValue(
-  model: string | undefined,
-  preset: ProviderPreset,
-  provider?: SavedProvider,
-): string {
-  const trimmedModel = model?.trim()
-  if (!trimmedModel) return ''
-  const value = provider?.modelContextWindows?.[trimmedModel] ?? preset.modelContextWindows?.[trimmedModel]
-  return value !== undefined ? String(value) : ''
-}
-
-function getModelContextInputs(
-  models: ModelMapping,
-  preset: ProviderPreset,
-  provider?: SavedProvider,
-): ModelContextInputs {
-  const inputs = {} as ModelContextInputs
-  for (const slot of MODEL_SLOTS) {
-    inputs[slot] = getModelContextInputValue(models[slot], preset, provider)
-  }
-  return inputs
-}
-
-function buildModelContextWindows(
-  models: ModelMapping,
-  inputs: ModelContextInputs,
-): Record<string, number> {
-  const windows: Record<string, number> = {}
-  for (const slot of MODEL_SLOTS) {
-    const model = models[slot]?.trim()
-    const parsed = parseModelContextWindowsInput(inputs[slot])
-    if (model && parsed !== undefined) {
-      windows[model] = parsed
-    }
-  }
-  return windows
-}
-
-function normalizeModelMapping(models: ModelMapping): ModelMapping {
-  const main = models.main.trim()
-  return {
-    main,
-    haiku: models.haiku.trim() || main,
-    sonnet: models.sonnet.trim() || main,
-    opus: models.opus.trim() || main,
-  }
-}
-
-function updateSettingsJsonAutoCompactWindow(raw: string, value: string): string {
-  try {
-    const parsed = JSON.parse(raw || '{}') as { env?: Record<string, unknown> }
-    const existingEnv = parsed.env && typeof parsed.env === 'object' && !Array.isArray(parsed.env)
-      ? parsed.env
-      : {}
-    const env = { ...existingEnv }
-    const trimmed = value.trim()
-    if (trimmed) {
-      env[AUTO_COMPACT_WINDOW_ENV_KEY] = trimmed
-    } else {
-      delete env[AUTO_COMPACT_WINDOW_ENV_KEY]
-    }
-    parsed.env = env
-    return JSON.stringify(parsed, null, 2)
-  } catch {
-    return raw
-  }
-}
-
-function updateSettingsJsonModelContextWindows(
-  raw: string,
-  modelContextWindows: Record<string, number>,
-): string {
-  try {
-    const parsed = JSON.parse(raw || '{}') as { env?: Record<string, unknown> }
-    const existingEnv = parsed.env && typeof parsed.env === 'object' && !Array.isArray(parsed.env)
-      ? parsed.env
-      : {}
-    const env = { ...existingEnv }
-    if (Object.keys(modelContextWindows).length > 0) {
-      env[MODEL_CONTEXT_WINDOWS_ENV_KEY] = JSON.stringify(modelContextWindows)
-    } else {
-      delete env[MODEL_CONTEXT_WINDOWS_ENV_KEY]
-    }
-    parsed.env = env
-    return JSON.stringify(parsed, null, 2)
-  } catch {
-    return raw
-  }
-}
-
-function updateSettingsJsonModels(raw: string, models: ModelMapping): string {
-  try {
-    const parsed = JSON.parse(raw || '{}') as { env?: Record<string, unknown> }
-    const existingEnv = parsed.env && typeof parsed.env === 'object' && !Array.isArray(parsed.env)
-      ? parsed.env
-      : {}
-    parsed.env = {
-      ...existingEnv,
-      ANTHROPIC_MODEL: models.main,
-      ANTHROPIC_DEFAULT_HAIKU_MODEL: models.haiku,
-      ANTHROPIC_DEFAULT_SONNET_MODEL: models.sonnet,
-      ANTHROPIC_DEFAULT_OPUS_MODEL: models.opus,
-    }
-    return JSON.stringify(parsed, null, 2)
-  } catch {
-    return raw
-  }
-}
-
-function updateSettingsJsonProviderConnection(
-  raw: string,
-  apiFormat: ApiFormat,
-  authStrategy: ProviderAuthStrategy,
-  apiKey: string,
-  preset: ProviderPreset,
-  baseUrl: string,
-): string {
-  try {
-    const parsed = JSON.parse(raw || '{}') as { env?: Record<string, unknown> }
-    const existingEnv = parsed.env && typeof parsed.env === 'object' && !Array.isArray(parsed.env)
-      ? parsed.env
-      : {}
-    const env = { ...existingEnv }
-    delete env.ANTHROPIC_API_KEY
-    delete env.ANTHROPIC_AUTH_TOKEN
-    env.ANTHROPIC_BASE_URL = apiFormat !== 'anthropic' ? 'http://127.0.0.1:3456/proxy' : baseUrl
-    Object.assign(env, buildSettingsJsonAuthEnv(apiFormat, authStrategy, apiKey, preset))
-    parsed.env = env
-    return JSON.stringify(parsed, null, 2)
-  } catch {
-    return raw
-  }
-}
-
-function buildFallbackPreset(provider?: SavedProvider): ProviderPreset {
-  return {
-    id: provider?.presetId ?? 'custom',
-    name: provider?.name ?? 'Custom',
-    baseUrl: provider?.baseUrl ?? '',
-    apiFormat: provider?.apiFormat ?? 'anthropic',
-    authStrategy: provider?.authStrategy,
-    defaultModels: provider?.models ?? { main: '', haiku: '', sonnet: '', opus: '' },
-    modelContextWindows: provider?.modelContextWindows,
-    defaultEnv: provider?.autoCompactWindow !== undefined
-      ? { [AUTO_COMPACT_WINDOW_ENV_KEY]: String(provider.autoCompactWindow) }
-      : undefined,
-    needsApiKey: true,
-    websiteUrl: '',
-  }
-}
-
-function openExternalUrl(url: string) {
-  if (!isTauriRuntime()) {
-    window.open(url, '_blank', 'noopener,noreferrer')
-    return
-  }
-
-  void import('@tauri-apps/plugin-shell')
-    .then((mod) => mod.open(url))
-    .catch(() => window.open(url, '_blank', 'noopener,noreferrer'))
-}
-
-function ProviderFormModal({ open, onClose, mode, provider, presets }: ProviderFormProps) {
-  const { createProvider, updateProvider, testConfig } = useProviderStore()
-  const fetchSettings = useSettingsStore((s) => s.fetchAll)
-  const t = useTranslation()
-
-  const availablePresets = presets.filter((p) => p.id !== 'official')
-  const regularPresets = availablePresets.filter((p) => !p.featured)
-  const featuredPresets = availablePresets.filter((p) => p.featured)
-  const presetDefaultEnvKeys = useMemo(
-    () => presets.flatMap((preset) => Object.keys(preset.defaultEnv ?? {})),
-    [presets],
-  )
-  const fallbackPreset = provider
-    ? buildFallbackPreset(provider)
-    : requirePreset(availablePresets[availablePresets.length - 1])
-  const initialPreset = requirePreset(
-    provider
-      ? availablePresets.find((p) => p.id === provider.presetId) ?? fallbackPreset
-      : availablePresets[0] ?? fallbackPreset,
-  )
-
-  const [selectedPreset, setSelectedPreset] = useState<ProviderPreset>(initialPreset)
-  const [name, setName] = useState(provider?.name ?? initialPreset.name)
-  const [baseUrl, setBaseUrl] = useState(provider?.baseUrl ?? initialPreset.baseUrl)
-  const [apiFormat, setApiFormat] = useState<ApiFormat>(provider?.apiFormat ?? initialPreset.apiFormat ?? 'anthropic')
-  const [authStrategy, setAuthStrategy] = useState<ProviderAuthStrategy>(provider?.authStrategy ?? getPresetAuthStrategy(initialPreset))
-  const [apiKey, setApiKey] = useState(provider?.apiKey ?? '')
-  const [showApiKey, setShowApiKey] = useState(false)
-  const [notes, setNotes] = useState(provider?.notes ?? '')
-  const [models, setModels] = useState<ModelMapping>(provider?.models ?? { ...initialPreset.defaultModels })
-  const [modelContextInputs, setModelContextInputs] = useState<ModelContextInputs>(
-    getModelContextInputs(provider?.models ?? initialPreset.defaultModels, initialPreset, provider),
-  )
-  const [autoCompactWindow, setAutoCompactWindow] = useState(
-    provider?.autoCompactWindow !== undefined
-      ? String(provider.autoCompactWindow)
-      : getPresetAutoCompactWindow(initialPreset),
-  )
-  const [showContextSettings, setShowContextSettings] = useState(false)
-  const [isSubmitting, setIsSubmitting] = useState(false)
-  const [testResult, setTestResult] = useState<ProviderTestResult | null>(null)
-  const [isTesting, setIsTesting] = useState(false)
-  const [settingsJson, setSettingsJson] = useState('')
-  const [settingsJsonError, setSettingsJsonError] = useState<string | null>(null)
-  const jsonPastedRef = useRef(false)
-
-  // Load current settings.json and merge provider env vars
-  useEffect(() => {
-    // Skip if JSON was just populated by user paste
-    if (jsonPastedRef.current) {
-      jsonPastedRef.current = false
-      return
-    }
-    import('../api/providers').then(({ providersApi }) => {
-      providersApi.getSettings().then((settings) => {
-        const needsProxy = apiFormat !== 'anthropic'
-        const autoCompactWindowEnv = autoCompactWindow.trim()
-        const modelContextWindows = buildModelContextWindows(models, modelContextInputs)
-        const normalizedModels = normalizeModelMapping(models)
-        const existingEnv = (settings.env as Record<string, string>) || {}
-        const cleanedEnv = stripProviderSettingsJsonEnv(existingEnv, presetDefaultEnvKeys)
-        const merged = {
-          ...settings,
-          skipWebFetchPreflight: settings.skipWebFetchPreflight ?? true,
-          env: {
-            ...cleanedEnv,
-            ...omitAuthEnv(selectedPreset.defaultEnv),
-            ...(autoCompactWindowEnv ? { [AUTO_COMPACT_WINDOW_ENV_KEY]: autoCompactWindowEnv } : {}),
-            ...(Object.keys(modelContextWindows).length > 0
-              ? { [MODEL_CONTEXT_WINDOWS_ENV_KEY]: JSON.stringify(modelContextWindows) }
-              : {}),
-            ANTHROPIC_BASE_URL: needsProxy ? 'http://127.0.0.1:3456/proxy' : baseUrl,
-            ...buildSettingsJsonAuthEnv(apiFormat, authStrategy, apiKey, selectedPreset),
-            ANTHROPIC_MODEL: normalizedModels.main,
-            ANTHROPIC_DEFAULT_HAIKU_MODEL: normalizedModels.haiku,
-            ANTHROPIC_DEFAULT_SONNET_MODEL: normalizedModels.sonnet,
-            ANTHROPIC_DEFAULT_OPUS_MODEL: normalizedModels.opus,
-          },
-        }
-        setSettingsJson(JSON.stringify(merged, null, 2))
-      }).catch(() => {
-        setSettingsJson(JSON.stringify({}, null, 2))
-      })
-    })
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedPreset.id])
-
-  const handlePresetChange = (preset: ProviderPreset) => {
-    setSelectedPreset(preset)
-    setName(preset.name)
-    setBaseUrl(preset.baseUrl)
-    setApiFormat(preset.apiFormat ?? 'anthropic')
-    setAuthStrategy(getPresetAuthStrategy(preset))
-    setModels({ ...preset.defaultModels })
-    setModelContextInputs(getModelContextInputs(preset.defaultModels, preset))
-    setAutoCompactWindow(getPresetAutoCompactWindow(preset))
-    setShowContextSettings(false)
-    setTestResult(null)
-  }
-
-  const isCustom = selectedPreset.id === 'custom'
-  const requiresApiKey = selectedPreset.needsApiKey !== false
-  const autoCompactWindowErrorKey = getAutoCompactWindowErrorKey(autoCompactWindow)
-  const modelContextWindowErrorSlots = MODEL_SLOTS.filter((slot) => getModelContextWindowErrorKey(modelContextInputs[slot]))
-  const canSubmit = name.trim() && baseUrl.trim() && (mode === 'edit' || !requiresApiKey || apiKey.trim()) && models.main.trim() && !settingsJsonError && !autoCompactWindowErrorKey && modelContextWindowErrorSlots.length === 0
-  const apiKeyUrl = selectedPreset.apiKeyUrl?.trim()
-  const promoText = selectedPreset.promoText?.trim()
-  const displayedSettingsJson = showApiKey
-    ? settingsJson
-    : maskSettingsJsonSecrets(settingsJson)
-  const apiFormatItems = [
-    {
-      value: 'anthropic' as const,
-      label: t('settings.providers.apiFormatAnthropic'),
-      icon: <span className="material-symbols-outlined text-[17px]">hub</span>,
-    },
-    {
-      value: 'openai_chat' as const,
-      label: t('settings.providers.apiFormatOpenaiChat'),
-      icon: <span className="material-symbols-outlined text-[17px]">forum</span>,
-    },
-    {
-      value: 'openai_responses' as const,
-      label: t('settings.providers.apiFormatOpenaiResponses'),
-      icon: <span className="material-symbols-outlined text-[17px]">route</span>,
-    },
-  ]
-  const selectedApiFormatLabel = apiFormatItems.find((item) => item.value === apiFormat)?.label ?? t('settings.providers.apiFormatAnthropic')
-  const authStrategyItems = [
-    {
-      value: 'auth_token' as const,
-      label: t('settings.providers.authStrategyAuthToken'),
-      description: t('settings.providers.authStrategyAuthTokenDesc'),
-      icon: <span className="material-symbols-outlined text-[17px]">key</span>,
-    },
-    {
-      value: 'auth_token_empty_api_key' as const,
-      label: t('settings.providers.authStrategyAuthTokenEmptyApiKey'),
-      description: t('settings.providers.authStrategyAuthTokenEmptyApiKeyDesc'),
-      icon: <span className="material-symbols-outlined text-[17px]">key_off</span>,
-    },
-    {
-      value: 'api_key' as const,
-      label: t('settings.providers.authStrategyApiKey'),
-      description: t('settings.providers.authStrategyApiKeyDesc'),
-      icon: <span className="material-symbols-outlined text-[17px]">vpn_key</span>,
-    },
-    {
-      value: 'dual_same_token' as const,
-      label: t('settings.providers.authStrategyDualSameToken'),
-      description: t('settings.providers.authStrategyDualSameTokenDesc'),
-      icon: <span className="material-symbols-outlined text-[17px]">sync_alt</span>,
-    },
-    {
-      value: 'dual_dummy' as const,
-      label: t('settings.providers.authStrategyDualDummy'),
-      description: t('settings.providers.authStrategyDualDummyDesc'),
-      icon: <span className="material-symbols-outlined text-[17px]">construction</span>,
-    },
-  ] satisfies Array<{ value: ProviderAuthStrategy; label: string; description: string; icon: ReactNode }>
-  const selectedAuthStrategyLabel = authStrategyItems.find((item) => item.value === authStrategy)?.label ?? t('settings.providers.authStrategyAuthToken')
-  const configuredContextWindows = buildModelContextWindows(models, modelContextInputs)
-  const configuredContextSummary = Object.entries(configuredContextWindows)
-    .filter(([model], index, entries) => entries.findIndex(([candidate]) => candidate === model) === index)
-    .map(([model, value]) => `${model}: ${formatContextWindow(value)}`)
-  const parsedFallbackContextWindow = parseAutoCompactWindowInput(autoCompactWindow)
-  const fallbackContextSummary = parsedFallbackContextWindow !== undefined
-    ? t('settings.providers.contextFallbackSummary', {
-      tokens: formatContextWindow(parsedFallbackContextWindow),
-    })
-    : t('settings.providers.contextFallbackAuto')
-  const contextSummary = configuredContextSummary.length > 0
-    ? [...configuredContextSummary, fallbackContextSummary].join(' · ')
-    : t('settings.providers.contextSummaryAuto')
-  const shouldShowContextFields = showContextSettings || modelContextWindowErrorSlots.length > 0 || !!autoCompactWindowErrorKey
-  const handleAutoCompactWindowChange = (value: string) => {
-    setAutoCompactWindow(value)
-    setSettingsJson((current) => updateSettingsJsonAutoCompactWindow(current, value))
-  }
-  const handleBaseUrlChange = (value: string) => {
-    setBaseUrl(value)
-    setSettingsJson((current) => updateSettingsJsonProviderConnection(current, apiFormat, authStrategy, apiKey, selectedPreset, value))
-  }
-  const handleApiKeyChange = (value: string) => {
-    setApiKey(value)
-    setSettingsJson((current) => updateSettingsJsonProviderConnection(current, apiFormat, authStrategy, value, selectedPreset, baseUrl))
-  }
-  const handleApiFormatChange = (value: ApiFormat) => {
-    setApiFormat(value)
-    setSettingsJson((current) => updateSettingsJsonProviderConnection(current, value, authStrategy, apiKey, selectedPreset, baseUrl))
-  }
-  const handleAuthStrategyChange = (value: ProviderAuthStrategy) => {
-    setAuthStrategy(value)
-    setSettingsJson((current) => updateSettingsJsonProviderConnection(current, apiFormat, value, apiKey, selectedPreset, baseUrl))
-  }
-  const handleModelChange = (slot: ModelSlot, value: string) => {
-    const nextModels = { ...models, [slot]: value }
-    const nextInputs = {
-      ...modelContextInputs,
-      [slot]: getModelContextInputValue(value, selectedPreset, provider),
-    }
-    setModels(nextModels)
-    setModelContextInputs(nextInputs)
-    setSettingsJson((current) => updateSettingsJsonModelContextWindows(
-      updateSettingsJsonModels(current, normalizeModelMapping(nextModels)),
-      buildModelContextWindows(nextModels, nextInputs),
-    ))
-  }
-  const handleModelContextWindowChange = (slot: ModelSlot, value: string) => {
-    const nextInputs = { ...modelContextInputs, [slot]: value }
-    setModelContextInputs(nextInputs)
-    setSettingsJson((current) => updateSettingsJsonModelContextWindows(
-      current,
-      buildModelContextWindows(models, nextInputs),
-    ))
-  }
-  const renderPresetButton = (preset: ProviderPreset) => (
-    <button
-      key={preset.id}
-      onClick={() => handlePresetChange(preset)}
-      className={`px-3 py-1.5 text-xs font-medium rounded-full border transition-all ${
-        selectedPreset.id === preset.id
-          ? 'border-[var(--color-brand)] bg-[var(--color-surface-container-high)] text-[var(--color-brand)] shadow-[var(--shadow-focus-ring)]'
-          : 'border-[var(--color-border)] text-[var(--color-text-secondary)] hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-hover)]'
-      }`}
-    >
-      {preset.name}
-    </button>
-  )
-
-  const handleSubmit = async () => {
-    if (!canSubmit) return
-    const normalizedModels = normalizeModelMapping(models)
-    const parsedAutoCompactWindow = parseAutoCompactWindowInput(autoCompactWindow)
-    const parsedModelContextWindows = buildModelContextWindows(models, modelContextInputs)
-    setIsSubmitting(true)
-    try {
-      // Write the edited cc-haha settings.json first so provider-specific model
-      // settings never conflict with the user's global ~/.claude/settings.json.
-      if (settingsJson.trim()) {
-        try {
-          const parsed = restoreSettingsJsonSecrets(JSON.parse(settingsJson), settingsJson, apiKey)
-          const { providersApi } = await import('../api/providers')
-          await providersApi.updateSettings(parsed)
-        } catch {
-          // JSON validation already prevents this
-        }
-      }
-
-      if (mode === 'create') {
-        await createProvider({
-          presetId: selectedPreset.id,
-          name: name.trim(),
-          apiKey: apiKey.trim(),
-          authStrategy,
-          baseUrl: baseUrl.trim(),
-          apiFormat,
-          models: normalizedModels,
-          ...(parsedAutoCompactWindow !== undefined && { autoCompactWindow: parsedAutoCompactWindow }),
-          ...(Object.keys(parsedModelContextWindows).length > 0 && { modelContextWindows: parsedModelContextWindows }),
-          notes: notes.trim() || undefined,
-        })
-      } else if (provider) {
-        const input: UpdateProviderInput = {
-          name: name.trim(),
-          baseUrl: baseUrl.trim(),
-          authStrategy,
-          apiFormat,
-          models: normalizedModels,
-          autoCompactWindow: parsedAutoCompactWindow ?? null,
-          modelContextWindows: Object.keys(parsedModelContextWindows).length > 0
-            ? parsedModelContextWindows
-            : null,
-          notes: notes.trim() || undefined,
-        }
-        if (apiKey.trim()) input.apiKey = apiKey.trim()
-        await updateProvider(provider.id, input)
-      }
-      await fetchSettings()
-      onClose()
-    } catch (err) {
-      console.error('Failed to save provider:', err)
-    } finally {
-      setIsSubmitting(false)
-    }
-  }
-
-  const handleTest = async () => {
-    if (!baseUrl.trim() || !models.main.trim()) return
-    setIsTesting(true)
-    setTestResult(null)
-    try {
-      let result: ProviderTestResult
-      if (mode === 'edit' && provider && !apiKey.trim()) {
-        result = await useProviderStore.getState().testProvider(provider.id, {
-          baseUrl: baseUrl.trim(),
-          modelId: models.main.trim(),
-          apiFormat,
-          authStrategy,
-        })
-      } else {
-        if (requiresApiKey && !apiKey.trim()) return
-        result = await testConfig({
-          baseUrl: baseUrl.trim(),
-          apiKey: apiKey.trim() || selectedPreset.defaultEnv?.ANTHROPIC_AUTH_TOKEN || 'local',
-          modelId: models.main.trim(),
-          authStrategy,
-          apiFormat,
-        })
-      }
-      setTestResult(result)
-    } catch {
-      setTestResult({ connectivity: { success: false, latencyMs: 0, error: t('settings.providers.requestFailed') } })
-    } finally {
-      setIsTesting(false)
-    }
-  }
-
-  return (
-    <Modal
-      open={open}
-      onClose={onClose}
-      title={mode === 'create' ? t('settings.providers.addTitle') : t('settings.providers.editTitle')}
-      width={720}
-      footer={
-        <>
-          <Button variant="secondary" onClick={onClose}>{t('common.cancel')}</Button>
-          <Button onClick={handleSubmit} disabled={!canSubmit} loading={isSubmitting}>
-            {mode === 'create' ? t('common.add') : t('common.save')}
-          </Button>
-        </>
-      }
-    >
-      <div className="flex flex-col gap-4">
-        {/* Preset chips */}
-        {mode === 'create' && (
-          <div>
-            <label className="text-sm font-medium text-[var(--color-text-primary)] mb-2 block">{t('settings.providers.preset')}</label>
-            <div className="flex flex-col gap-2">
-              <div className="flex flex-wrap gap-2">
-                {regularPresets.map(renderPresetButton)}
-              </div>
-              {featuredPresets.length > 0 && (
-                <div className="flex flex-wrap gap-2 border-t border-[var(--color-border)]/60 pt-2">
-                  {featuredPresets.map(renderPresetButton)}
-                </div>
-              )}
-            </div>
-          </div>
-        )}
-
-        <Input label={t('settings.providers.name')} required value={name} onChange={(e) => setName(e.target.value)} placeholder={t('settings.providers.namePlaceholder')} />
-
-        <Input label={t('settings.providers.notes')} value={notes} onChange={(e) => setNotes(e.target.value)} placeholder={t('settings.providers.notesPlaceholder')} />
-
-        <Input label={t('settings.providers.baseUrl')} required value={baseUrl} onChange={(e) => handleBaseUrlChange(e.target.value)} placeholder={t('settings.providers.baseUrlPlaceholder')} />
-
-        {/* API Format */}
-        {(isCustom || mode === 'edit') ? (
-          <div>
-            <label className="text-sm font-medium text-[var(--color-text-primary)] mb-1 block">{t('settings.providers.apiFormat')}</label>
-            <Dropdown<ApiFormat>
-              items={apiFormatItems}
-              value={apiFormat}
-              onChange={handleApiFormatChange}
-              width="100%"
-              className="block w-full"
-              trigger={
-                <button
-                  type="button"
-                  className="flex h-10 w-full items-center gap-3 rounded-[var(--radius-md)] border border-[var(--color-border)] bg-[var(--color-surface)] px-3 text-left text-sm text-[var(--color-text-primary)] outline-none transition-colors hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-container-low)] focus-visible:border-[var(--color-border-focus)] focus-visible:shadow-[var(--shadow-focus-ring)]"
-                >
-                  <span className="min-w-0 flex-1 truncate">{selectedApiFormatLabel}</span>
-                  <span className="material-symbols-outlined flex-shrink-0 text-[18px] text-[var(--color-text-secondary)]">expand_more</span>
-                </button>
-              }
-            />
-            {apiFormat !== 'anthropic' && (
-              <p className="text-[11px] text-[var(--color-text-tertiary)] mt-1">{t('settings.providers.proxyHint')}</p>
-            )}
-          </div>
-        ) : apiFormat !== 'anthropic' ? (
-          <div>
-            <label className="text-sm font-medium text-[var(--color-text-primary)] mb-1 block">{t('settings.providers.apiFormat')}</label>
-            <div className="text-xs text-[var(--color-text-tertiary)] px-3 py-2 rounded-[var(--radius-md)] bg-[var(--color-surface-container-low)] border border-[var(--color-border)]">
-              {apiFormat === 'openai_chat' ? t('settings.providers.apiFormatOpenaiChat') : t('settings.providers.apiFormatOpenaiResponses')}
-            </div>
-          </div>
-        ) : null}
-
-        {apiFormat === 'anthropic' && (
-          <div>
-            <label className="text-sm font-medium text-[var(--color-text-primary)] mb-1 block">{t('settings.providers.authStrategy')}</label>
-            <Dropdown<ProviderAuthStrategy>
-              items={authStrategyItems}
-              value={authStrategy}
-              onChange={handleAuthStrategyChange}
-              width="100%"
-              className="block w-full"
-              trigger={
-                <button
-                  type="button"
-                  className="flex min-h-10 w-full items-center gap-3 rounded-[var(--radius-md)] border border-[var(--color-border)] bg-[var(--color-surface)] px-3 py-2 text-left text-sm text-[var(--color-text-primary)] outline-none transition-colors hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-container-low)] focus-visible:border-[var(--color-border-focus)] focus-visible:shadow-[var(--shadow-focus-ring)]"
-                >
-                  <span className="min-w-0 flex-1 truncate">{selectedAuthStrategyLabel}</span>
-                  <span className="material-symbols-outlined flex-shrink-0 text-[18px] text-[var(--color-text-secondary)]">expand_more</span>
-                </button>
-              }
-            />
-          </div>
-        )}
-
-        <div className="flex flex-col gap-1">
-          <label htmlFor="provider-api-key" className="text-sm font-medium text-[var(--color-text-primary)]">
-            {t('settings.providers.apiKey')}
-            {mode === 'create' && requiresApiKey && <span className="text-[var(--color-error)] ml-0.5">*</span>}
-          </label>
-          <div className="relative">
-            <input
-              id="provider-api-key"
-              type={showApiKey ? 'text' : 'password'}
-              value={apiKey}
-              onChange={(e) => handleApiKeyChange(e.target.value)}
-              placeholder="sk-..."
-              className="h-10 w-full rounded-[var(--radius-md)] border border-[var(--color-border)] bg-[var(--color-surface)] px-3 pr-10 text-sm text-[var(--color-text-primary)] outline-none transition-colors duration-150 placeholder:text-[var(--color-text-tertiary)] focus:border-[var(--color-border-focus)] focus:shadow-[var(--shadow-focus-ring)]"
-            />
-            <button
-              type="button"
-              onClick={() => setShowApiKey((visible) => !visible)}
-              aria-label={showApiKey ? 'Hide API Key' : 'Show API Key'}
-              className="absolute right-1.5 top-1/2 flex h-7 w-7 -translate-y-1/2 cursor-pointer items-center justify-center rounded-[var(--radius-sm)] text-[var(--color-text-tertiary)] transition-colors hover:bg-[var(--color-surface-hover)] hover:text-[var(--color-text-primary)] focus:outline-none focus:shadow-[var(--shadow-focus-ring)]"
-            >
-              <span className="material-symbols-outlined text-[16px]">
-                {showApiKey ? 'visibility_off' : 'visibility'}
-              </span>
-            </button>
-          </div>
-        </div>
-
-        {(apiKeyUrl || promoText) && (
-          <div className="-mt-2 flex flex-col gap-1.5">
-            {apiKeyUrl && (
-              <button
-                type="button"
-                onClick={() => openExternalUrl(apiKeyUrl)}
-                className="group inline-flex h-6 w-fit cursor-pointer items-center gap-1 rounded-[var(--radius-sm)] border border-[var(--color-border)] bg-[var(--color-surface-container-low)] px-1.5 text-[11px] font-medium leading-none text-[var(--color-brand)] transition-colors hover:border-[var(--color-border-focus)] hover:bg-[var(--color-surface-hover)] focus:outline-none focus:shadow-[var(--shadow-focus-ring)]"
-              >
-                <span className="material-symbols-outlined text-[13px]">key</span>
-                {t('settings.providers.getApiKey')}
-                <span className="material-symbols-outlined text-[9px] opacity-60 transition-transform group-hover:-translate-y-0.5 group-hover:translate-x-0.5">arrow_outward</span>
-              </button>
-            )}
-            {promoText && (
-              <button
-                type="button"
-                onClick={() => apiKeyUrl && openExternalUrl(apiKeyUrl)}
-                disabled={!apiKeyUrl}
-                className="group flex w-full cursor-pointer items-start gap-1.5 rounded-[var(--radius-sm)] border border-[var(--color-brand)]/25 bg-[var(--color-brand)]/8 px-2.5 py-1.5 text-left text-[11px] leading-5 text-[var(--color-text-primary)] transition-colors hover:border-[var(--color-brand)]/45 hover:bg-[var(--color-brand)]/12 focus:outline-none focus:shadow-[var(--shadow-focus-ring)] disabled:cursor-default disabled:hover:border-[var(--color-brand)]/25 disabled:hover:bg-[var(--color-brand)]/8"
-              >
-                <span className="material-symbols-outlined mt-0.5 text-[13px] text-[var(--color-brand)]">tips_and_updates</span>
-                <span>{promoText}</span>
-                {apiKeyUrl && (
-                  <span className="material-symbols-outlined ml-auto mt-1 text-[10px] text-[var(--color-brand)] opacity-45 transition-transform group-hover:-translate-y-0.5 group-hover:translate-x-0.5">arrow_outward</span>
-                )}
-              </button>
-            )}
-          </div>
-        )}
-
-        {/* Model Mapping */}
-        <div>
-          <label className="text-sm font-medium text-[var(--color-text-primary)] mb-2 block">{t('settings.providers.modelMapping')}</label>
-          <div className="grid grid-cols-2 gap-2">
-            <Input label={t('settings.providers.mainModel')} required value={models.main} onChange={(e) => handleModelChange('main', e.target.value)} placeholder="Model ID" />
-            <Input label={t('settings.providers.haikuModel')} value={models.haiku} onChange={(e) => handleModelChange('haiku', e.target.value)} placeholder={t('settings.providers.sameAsMain')} />
-            <Input label={t('settings.providers.sonnetModel')} value={models.sonnet} onChange={(e) => handleModelChange('sonnet', e.target.value)} placeholder={t('settings.providers.sameAsMain')} />
-            <Input label={t('settings.providers.opusModel')} value={models.opus} onChange={(e) => handleModelChange('opus', e.target.value)} placeholder={t('settings.providers.sameAsMain')} />
-          </div>
-        </div>
-
-        <div className="rounded-[var(--radius-md)] border border-[var(--color-border)] bg-[var(--color-surface-container-low)]">
-          <button
-            type="button"
-            onClick={() => setShowContextSettings((visible) => !visible)}
-            className="flex w-full items-start gap-3 px-3 py-3 text-left outline-none transition-colors hover:bg-[var(--color-surface-hover)] focus-visible:shadow-[var(--shadow-focus-ring)]"
-            aria-expanded={shouldShowContextFields}
-          >
-            <span className="material-symbols-outlined mt-0.5 text-[18px] text-[var(--color-brand)]">compress</span>
-            <span className="min-w-0 flex-1">
-              <span className="block text-sm font-medium text-[var(--color-text-primary)]">
-                {t('settings.providers.contextSettingsTitle')}
-              </span>
-              <span className="mt-1 block truncate text-xs text-[var(--color-text-secondary)]">
-                {contextSummary}
-              </span>
-              <span className="mt-1 block text-[11px] leading-5 text-[var(--color-text-tertiary)]">
-                {t('settings.providers.contextSettingsDesc')}
-              </span>
-            </span>
-            <span className="mt-0.5 inline-flex items-center gap-1 text-xs font-medium text-[var(--color-brand)]">
-              {shouldShowContextFields
-                ? t('settings.providers.contextSettingsHide')
-                : t('settings.providers.contextSettingsEdit')}
-              <span className="material-symbols-outlined text-[16px]">
-                {shouldShowContextFields ? 'expand_less' : 'expand_more'}
-              </span>
-            </span>
-          </button>
-
-          {shouldShowContextFields && (
-            <div className="border-t border-[var(--color-border)] px-3 pb-3 pt-3">
-              <div>
-                <label className="text-sm font-medium text-[var(--color-text-primary)] mb-2 block">{t('settings.providers.modelContextWindows')}</label>
-                <div className="grid grid-cols-2 gap-2">
-                  {MODEL_SLOTS.map((slot) => {
-                    const errorKey = getModelContextWindowErrorKey(modelContextInputs[slot])
-                    const labelKey = slot === 'main'
-                      ? 'settings.providers.mainContextWindow'
-                      : slot === 'haiku'
-                        ? 'settings.providers.haikuContextWindow'
-                        : slot === 'sonnet'
-                          ? 'settings.providers.sonnetContextWindow'
-                          : 'settings.providers.opusContextWindow'
-                    return (
-                      <div key={slot}>
-                        <Input
-                          label={t(labelKey)}
-                          value={modelContextInputs[slot]}
-                          onChange={(e) => handleModelContextWindowChange(slot, e.target.value)}
-                          placeholder={t('settings.providers.contextWindowPlaceholder')}
-                        />
-                        {errorKey && (
-                          <p className="text-[11px] text-[var(--color-error)] mt-1">
-                            {errorKey === 'number'
-                              ? t('settings.providers.modelContextWindowNumberError')
-                              : t('settings.providers.modelContextWindowRangeError')}
-                          </p>
-                        )}
-                      </div>
-                    )
-                  })}
-                </div>
-                <p className="text-[11px] text-[var(--color-text-tertiary)] mt-1">
-                  {t('settings.providers.modelContextWindowsDesc')}
-                </p>
-              </div>
-
-              <div className="mt-3">
-                <Input
-                  label={t('settings.providers.autoCompactWindow')}
-                  value={autoCompactWindow}
-                  onChange={(e) => handleAutoCompactWindowChange(e.target.value)}
-                  placeholder={t('settings.providers.autoCompactWindowPlaceholder')}
-                />
-                {autoCompactWindowErrorKey ? (
-                  <p className="text-[11px] text-[var(--color-error)] mt-1">
-                    {autoCompactWindowErrorKey === 'number'
-                      ? t('settings.providers.autoCompactWindowNumberError')
-                      : t('settings.providers.autoCompactWindowRangeError')}
-                  </p>
-                ) : (
-                  <p className="text-[11px] text-[var(--color-text-tertiary)] mt-1">
-                    {t('settings.providers.autoCompactWindowDesc')}
-                  </p>
-                )}
-              </div>
-            </div>
-          )}
-        </div>
-
-        {/* Test connection */}
-        <div className="flex items-center gap-3">
-          <Button variant="secondary" size="sm" onClick={handleTest} loading={isTesting} disabled={!baseUrl.trim() || !models.main.trim()}>
-            {t('settings.providers.testConnection')}
-          </Button>
-          {testResult && (
-            <div className="flex flex-col gap-0.5">
-              <span className={`text-xs ${testResult.connectivity.success ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
-                {testResult.connectivity.success
-                  ? t('settings.providers.connectivityOk', { latency: String(testResult.connectivity.latencyMs) })
-                  : t('settings.providers.connectivityFailed', { error: testResult.connectivity.error || '' })}
-              </span>
-              {testResult.proxy && (
-                <span className={`text-xs ${testResult.proxy.success ? 'text-[var(--color-success)]' : 'text-[var(--color-error)]'}`}>
-                  {testResult.proxy.success
-                    ? t('settings.providers.proxyOk', { latency: String(testResult.proxy.latencyMs) })
-                    : t('settings.providers.proxyFailed', { error: testResult.proxy.error || '' })}
-                </span>
-              )}
-            </div>
-          )}
-        </div>
-
-        {/* Settings JSON — editable, shown for all presets including official */}
-        <div>
-          <label className="text-sm font-medium text-[var(--color-text-primary)] mb-2 block">{t('settings.providers.settingsJson')}</label>
-          <textarea
-            value={displayedSettingsJson}
-            onChange={(e) => {
-              const raw = e.target.value
-              try {
-                const parsed = restoreSettingsJsonSecrets(JSON.parse(raw), settingsJson, apiKey)
-                setSettingsJson(JSON.stringify(parsed, null, 2))
-                setSettingsJsonError(null)
-                // Auto-fill form fields from parsed JSON env
-                const env = parsed.env as Record<string, string> | undefined
-                if (env) {
-                  if (env.ANTHROPIC_BASE_URL) {
-                    setBaseUrl(env.ANTHROPIC_BASE_URL)
-                    // Auto-switch to matching preset or Custom
-                    if (mode === 'create') {
-                      const matchedPreset = availablePresets.find((p) => p.id !== 'custom' && p.baseUrl === env.ANTHROPIC_BASE_URL)
-                      const targetPreset = requirePreset(
-                        matchedPreset ?? availablePresets.find((p) => p.id === 'custom'),
-                      )
-                      if (targetPreset.id !== selectedPreset.id) {
-                        jsonPastedRef.current = true
-                        setSelectedPreset(targetPreset)
-                      }
-                    }
-                  }
-                  const nextApiKey = env.ANTHROPIC_AUTH_TOKEN || env.ANTHROPIC_API_KEY
-                  if (nextApiKey && nextApiKey !== '(your API key)' && nextApiKey !== API_KEY_JSON_PLACEHOLDER) {
-                    setApiKey(nextApiKey)
-                  }
-                  const nextAuthStrategy = inferAuthStrategyFromEnv(env)
-                  if (nextAuthStrategy) {
-                    setAuthStrategy(nextAuthStrategy)
-                  }
-                  if (env[AUTO_COMPACT_WINDOW_ENV_KEY] !== undefined) {
-                    setAutoCompactWindow(String(env[AUTO_COMPACT_WINDOW_ENV_KEY]))
-                  } else {
-                    setAutoCompactWindow('')
-                  }
-                  let parsedContextWindows: Record<string, number> = {}
-                  if (typeof env[MODEL_CONTEXT_WINDOWS_ENV_KEY] === 'string') {
-                    try {
-                      const parsedContext = JSON.parse(env[MODEL_CONTEXT_WINDOWS_ENV_KEY]) as Record<string, unknown>
-                      parsedContextWindows = Object.fromEntries(
-                        Object.entries(parsedContext)
-                          .filter(([, value]) => typeof value === 'number' && Number.isInteger(value)),
-                      ) as Record<string, number>
-                    } catch {
-                      parsedContextWindows = {}
-                    }
-                  }
-                  const newModels: Partial<ModelMapping> = {}
-                  if (env.ANTHROPIC_MODEL) newModels.main = env.ANTHROPIC_MODEL
-                  if (env.ANTHROPIC_DEFAULT_HAIKU_MODEL) newModels.haiku = env.ANTHROPIC_DEFAULT_HAIKU_MODEL
-                  if (env.ANTHROPIC_DEFAULT_SONNET_MODEL) newModels.sonnet = env.ANTHROPIC_DEFAULT_SONNET_MODEL
-                  if (env.ANTHROPIC_DEFAULT_OPUS_MODEL) newModels.opus = env.ANTHROPIC_DEFAULT_OPUS_MODEL
-                  if (Object.keys(newModels).length > 0) {
-                    setModels((prev) => {
-                      const nextModels = { ...prev, ...newModels }
-                      setModelContextInputs(getModelContextInputs(nextModels, {
-                        ...selectedPreset,
-                        modelContextWindows: parsedContextWindows,
-                      }))
-                      return nextModels
-                    })
-                  } else if (Object.keys(parsedContextWindows).length > 0) {
-                    setModelContextInputs(getModelContextInputs(models, {
-                      ...selectedPreset,
-                      modelContextWindows: parsedContextWindows,
-                    }))
-                  }
-                }
-              } catch (err) {
-                setSettingsJson(raw)
-                setSettingsJsonError(err instanceof Error ? err.message : 'Invalid JSON')
-              }
-            }}
-            rows={16}
-            spellCheck={false}
-            className={`w-full text-xs px-3 py-3 rounded-[var(--radius-md)] bg-[var(--color-surface-container-low)] border font-mono leading-relaxed resize-y text-[var(--color-text-secondary)] outline-none ${
-              settingsJsonError
-                ? 'border-[var(--color-error)] focus:border-[var(--color-error)]'
-                : 'border-[var(--color-border)] focus:border-[var(--color-border-focus)]'
-            }`}
-          />
-          {settingsJsonError && (
-            <p className="text-[11px] text-[var(--color-error)] mt-1">{t('settings.providers.jsonError', { error: settingsJsonError })}</p>
-          )}
-          <p className="text-[11px] text-[var(--color-text-tertiary)] mt-1">{t('settings.providers.settingsJsonDesc')}</p>
-        </div>
-      </div>
-    </Modal>
-  )
+  return <CliLoginProviderSettings />
 }
 
-
 // ─── Permission Settings ──────────────────────────────────────
 
 function PermissionSettings() {

desktop/src/stores/cliAuthStore.ts

@@ -0,0 +1,141 @@
+import { create } from 'zustand'
+import { cliAuthApi, type AuthProvider, type CliAuthConfig } from '../api/cliAuth'
+
+type CliAuthStore = {
+  authProvider: AuthProvider | null
+  nvidiaApiKey: string | null
+  openRouterApiKey: string | null
+  openAiApiKey: string | null
+  openCodeApiKey: string | null
+  openCodeModelName: string | null
+  localBaseUrl: string | null
+  localModelName: string | null
+  isLoading: boolean
+  error: string | null
+
+  fetchAuth: () => Promise<void>
+  setAuthProvider: (provider: AuthProvider) => Promise<void>
+  saveNvidiaApiKey: (apiKey: string) => Promise<void>
+  saveOpenRouterApiKey: (apiKey: string) => Promise<void>
+  saveOpenAIApiKey: (apiKey: string) => Promise<void>
+  saveOpenCodeApiKey: (apiKey: string, modelName?: string) => Promise<void>
+  saveLocalModelConfig: (baseUrl: string, modelName: string) => Promise<void>
+  clearAuth: () => Promise<void>
+}
+
+export const useCliAuthStore = create<CliAuthStore>((set) => ({
+  authProvider: null,
+  nvidiaApiKey: null,
+  openRouterApiKey: null,
+  openAiApiKey: null,
+  openCodeApiKey: null,
+  openCodeModelName: null,
+  localBaseUrl: null,
+  localModelName: null,
+  isLoading: false,
+  error: null,
+
+  fetchAuth: async () => {
+    set({ isLoading: true, error: null })
+    try {
+      const config = await cliAuthApi.get()
+      set({
+        authProvider: config.authProvider,
+        nvidiaApiKey: config.nvidiaApiKey || null,
+        openRouterApiKey: config.openRouterApiKey || null,
+        openAiApiKey: config.openAiApiKey || config.openAiAccessToken || null,
+        openCodeApiKey: config.openCodeApiKey || null,
+        openCodeModelName: config.openCodeModelName || null,
+        localBaseUrl: config.localBaseUrl || null,
+        localModelName: config.localModelName || null,
+        isLoading: false,
+      })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  setAuthProvider: async (provider: AuthProvider) => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: provider })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: provider, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  saveNvidiaApiKey: async (apiKey: string) => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: 'nvidia', nvidiaApiKey: apiKey })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: 'nvidia', nvidiaApiKey: apiKey, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  saveOpenRouterApiKey: async (apiKey: string) => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: 'openrouter', openRouterApiKey: apiKey })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: 'openrouter', openRouterApiKey: apiKey, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  saveOpenAIApiKey: async (apiKey: string) => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: 'openai', openAiApiKey: apiKey })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: 'openai', openAiApiKey: apiKey, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  saveOpenCodeApiKey: async (apiKey: string, modelName?: string) => {
+    set({ isLoading: true, error: null })
+    try {
+      const updates: Record<string, unknown> = { authProvider: 'opencode', openCodeApiKey: apiKey }
+      if (modelName) updates.openCodeModelName = modelName
+      await cliAuthApi.update(updates as Partial<CliAuthConfig>)
+      await cliAuthApi.invalidateCache()
+      set({
+        authProvider: 'opencode',
+        openCodeApiKey: apiKey,
+        ...(modelName ? { openCodeModelName: modelName } : {}),
+        isLoading: false,
+      })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  saveLocalModelConfig: async (baseUrl: string, modelName: string) => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: 'local', localBaseUrl: baseUrl, localModelName: modelName })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: 'local', localBaseUrl: baseUrl, localModelName: modelName, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+
+  clearAuth: async () => {
+    set({ isLoading: true, error: null })
+    try {
+      await cliAuthApi.update({ authProvider: null })
+      await cliAuthApi.invalidateCache()
+      set({ authProvider: null, nvidiaApiKey: null, openRouterApiKey: null, openAiApiKey: null, openCodeApiKey: null, localBaseUrl: null, localModelName: null, isLoading: false })
+    } catch (err) {
+      set({ isLoading: false, error: err instanceof Error ? err.message : String(err) })
+    }
+  },
+}))

desktop/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["./src/App.tsx","./src/main.test.tsx","./src/main.tsx","./src/vite-env.d.ts","./src/__tests__/agentsSettings.test.tsx","./src/__tests__/diagnosticsSettings.test.tsx","./src/__tests__/generalSettings.test.tsx","./src/__tests__/mcpSettings.test.tsx","./src/__tests__/memorySettings.test.tsx","./src/__tests__/pages.test.tsx","./src/__tests__/pluginsSettings.test.tsx","./src/__tests__/skillsSettings.test.tsx","./src/__tests__/tauriCapabilities.test.ts","./src/api/activityStats.ts","./src/api/adapters.ts","./src/api/agents.ts","./src/api/cliTasks.ts","./src/api/client.test.ts","./src/api/client.ts","./src/api/computerUse.ts","./src/api/desktopUiPreferences.ts","./src/api/diagnostics.ts","./src/api/doctor.ts","./src/api/filesystem.ts","./src/api/h5Access.ts","./src/api/hahaOAuth.ts","./src/api/hahaOpenAIOAuth.ts","./src/api/mcp.ts","./src/api/memory.ts","./src/api/models.ts","./src/api/openTargets.test.ts","./src/api/openTargets.ts","./src/api/plugins.ts","./src/api/providers.ts","./src/api/search.ts","./src/api/sessions.test.ts","./src/api/sessions.ts","./src/api/settings.ts","./src/api/skills.ts","./src/api/tasks.ts","./src/api/teams.ts","./src/api/terminal.ts","./src/api/websocket.test.ts","./src/api/websocket.ts","./src/components/ErrorBoundary.test.tsx","./src/components/ErrorBoundary.tsx","./src/components/chat/AskUserQuestion.test.tsx","./src/components/chat/AskUserQuestion.tsx","./src/components/chat/AssistantMessage.tsx","./src/components/chat/AttachmentGallery.test.tsx","./src/components/chat/AttachmentGallery.tsx","./src/components/chat/ChatInput.test.tsx","./src/components/chat/ChatInput.tsx","./src/components/chat/CodeViewer.test.tsx","./src/components/chat/CodeViewer.tsx","./src/components/chat/ComposerDropOverlay.tsx","./src/components/chat/ComputerUsePermissionModal.test.tsx","./src/components/chat/ComputerUsePermissionModal.tsx","./src/components/chat/ContextUsageIndicator.test.tsx","./src/components/chat/ContextUsageIndicator.tsx","./src/components/chat/CurrentTurnChangeCard.tsx","./src/components/chat/DiffViewer.tsx","./src/components/chat/FileSearchMenu.test.tsx","./src/components/chat/FileSearchMenu.tsx","./src/components/chat/ImageGalleryModal.tsx","./src/components/chat/InlineImageGallery.tsx","./src/components/chat/InlineTaskSummary.tsx","./src/components/chat/LocalSlashCommandPanel.test.tsx","./src/components/chat/LocalSlashCommandPanel.tsx","./src/components/chat/MermaidRenderer.test.tsx","./src/components/chat/MermaidRenderer.tsx","./src/components/chat/MessageActionBar.tsx","./src/components/chat/MessageList.test.tsx","./src/components/chat/MessageList.tsx","./src/components/chat/PermissionDialog.tsx","./src/components/chat/SessionTaskBar.test.tsx","./src/components/chat/SessionTaskBar.tsx","./src/components/chat/StreamingIndicator.tsx","./src/components/chat/TerminalChrome.tsx","./src/components/chat/ThinkingBlock.tsx","./src/components/chat/ToolCallBlock.tsx","./src/components/chat/ToolCallGroup.tsx","./src/components/chat/ToolResultBlock.tsx","./src/components/chat/UserMessage.test.tsx","./src/components/chat/UserMessage.tsx","./src/components/chat/chatBlocks.test.tsx","./src/components/chat/clipboard.ts","./src/components/chat/composerUtils.test.ts","./src/components/chat/composerUtils.ts","./src/components/chat/useComposerFileDrop.ts","./src/components/companion/CompanionControls.tsx","./src/components/companion/CompanionTranscript.tsx","./src/components/companion/CompanionVideoPanel.tsx","./src/components/controls/ModelSelector.test.tsx","./src/components/controls/ModelSelector.tsx","./src/components/controls/PermissionModeSelector.test.tsx","./src/components/controls/PermissionModeSelector.tsx","./src/components/doctor/DoctorPanel.tsx","./src/components/layout/AppShell.test.tsx","./src/components/layout/AppShell.tsx","./src/components/layout/ContentRouter.test.tsx","./src/components/layout/ContentRouter.tsx","./src/components/layout/H5ConnectionView.tsx","./src/components/layout/OpenProjectMenu.test.tsx","./src/components/layout/OpenProjectMenu.tsx","./src/components/layout/Sidebar.test.tsx","./src/components/layout/Sidebar.tsx","./src/components/layout/StartupErrorView.test.tsx","./src/components/layout/StartupErrorView.tsx","./src/components/layout/StatusBar.tsx","./src/components/layout/TabBar.test.tsx","./src/components/layout/TabBar.tsx","./src/components/layout/TitleBar.tsx","./src/components/layout/WindowControls.test.tsx","./src/components/layout/WindowControls.tsx","./src/components/markdown/MarkdownRenderer.test.tsx","./src/components/markdown/MarkdownRenderer.tsx","./src/components/plugins/PluginDetail.tsx","./src/components/plugins/PluginList.tsx","./src/components/settings/ChatGPTOfficialLogin.test.tsx","./src/components/settings/ChatGPTOfficialLogin.tsx","./src/components/settings/ClaudeOfficialLogin.tsx","./src/components/shared/Button.tsx","./src/components/shared/ConfirmDialog.tsx","./src/components/shared/CopyButton.tsx","./src/components/shared/DirectoryPicker.test.tsx","./src/components/shared/DirectoryPicker.tsx","./src/components/shared/Dropdown.tsx","./src/components/shared/Input.tsx","./src/components/shared/MobileBottomSheet.tsx","./src/components/shared/Modal.test.tsx","./src/components/shared/Modal.tsx","./src/components/shared/ProjectContextChip.test.tsx","./src/components/shared/ProjectContextChip.tsx","./src/components/shared/RepositoryLaunchControls.test.tsx","./src/components/shared/RepositoryLaunchControls.tsx","./src/components/shared/Spinner.tsx","./src/components/shared/Textarea.tsx","./src/components/shared/Toast.tsx","./src/components/shared/UpdateChecker.test.tsx","./src/components/shared/UpdateChecker.tsx","./src/components/skills/SkillDetail.test.tsx","./src/components/skills/SkillDetail.tsx","./src/components/skills/SkillList.tsx","./src/components/tasks/DayOfWeekPicker.tsx","./src/components/tasks/NewTaskModal.test.tsx","./src/components/tasks/NewTaskModal.tsx","./src/components/tasks/PromptEditor.tsx","./src/components/tasks/TaskEmptyState.tsx","./src/components/tasks/TaskList.tsx","./src/components/tasks/TaskRow.tsx","./src/components/tasks/TaskRunsPanel.test.tsx","./src/components/tasks/TaskRunsPanel.tsx","./src/components/teams/TeamStatusBar.tsx","./src/components/workspace/WorkspaceCodeSurface.tsx","./src/components/workspace/WorkspacePanel.test.tsx","./src/components/workspace/WorkspacePanel.tsx","./src/config/spinnerVerbs.ts","./src/constants/modelCatalog.ts","./src/constants/openaiOfficialProvider.ts","./src/hooks/useCompanionAudio.ts","./src/hooks/useCompanionWebSocket.ts","./src/hooks/useKeyboardShortcuts.test.tsx","./src/hooks/useKeyboardShortcuts.ts","./src/hooks/useMicrophone.ts","./src/hooks/useMobileViewport.test.tsx","./src/hooks/useMobileViewport.ts","./src/hooks/useScheduledTaskDesktopNotifications.test.tsx","./src/hooks/useScheduledTaskDesktopNotifications.ts","./src/hooks/useSelectionPopoverDismiss.ts","./src/hooks/useWebcam.ts","./src/i18n/index.test.tsx","./src/i18n/index.ts","./src/i18n/locales/en.ts","./src/i18n/locales/zh.ts","./src/lib/appZoom.test.ts","./src/lib/appZoom.ts","./src/lib/audioEngine.ts","./src/lib/composerAttachments.test.ts","./src/lib/composerAttachments.ts","./src/lib/cronDescribe.ts","./src/lib/desktopNotificationNavigation.test.ts","./src/lib/desktopNotificationNavigation.ts","./src/lib/desktopNotifications.test.ts","./src/lib/desktopNotifications.ts","./src/lib/desktopRuntime.test.ts","./src/lib/desktopRuntime.ts","./src/lib/diagnosticsCapture.ts","./src/lib/doctorRepair.test.ts","./src/lib/doctorRepair.ts","./src/lib/formatBytes.ts","./src/lib/parseRunOutput.ts","./src/lib/persistenceMigrations.test.ts","./src/lib/persistenceMigrations.ts","./src/lib/providerSettingsJson.ts","./src/lib/sessionTitle.test.ts","./src/lib/sessionTitle.ts","./src/lib/__tests__/cronDescribe.test.ts","./src/lib/__tests__/providerSettingsJson.test.ts","./src/mocks/data.ts","./src/pages/ActiveSession.test.tsx","./src/pages/ActiveSession.tsx","./src/pages/ActivitySettings.test.tsx","./src/pages/ActivitySettings.tsx","./src/pages/AdapterSettings.test.tsx","./src/pages/AdapterSettings.tsx","./src/pages/AgentTeams.tsx","./src/pages/Companion.tsx","./src/pages/ComputerUseSettings.test.tsx","./src/pages/ComputerUseSettings.tsx","./src/pages/DiagnosticsSettings.tsx","./src/pages/EmptySession.test.tsx","./src/pages/EmptySession.tsx","./src/pages/McpSettings.tsx","./src/pages/MemorySettings.tsx","./src/pages/NewTaskModal.tsx","./src/pages/ScheduledTasks.tsx","./src/pages/ScheduledTasksEmpty.tsx","./src/pages/ScheduledTasksList.tsx","./src/pages/SessionControls.tsx","./src/pages/Settings.tsx","./src/pages/TerminalSettings.test.tsx","./src/pages/TerminalSettings.tsx","./src/pages/ToolInspection.tsx","./src/stores/adapterStore.test.ts","./src/stores/adapterStore.ts","./src/stores/agentStore.ts","./src/stores/chatStore.test.ts","./src/stores/chatStore.ts","./src/stores/cliTaskStore.test.ts","./src/stores/cliTaskStore.ts","./src/stores/companionStore.ts","./src/stores/hahaOAuthStore.test.ts","./src/stores/hahaOAuthStore.ts","./src/stores/hahaOpenAIOAuthStore.test.ts","./src/stores/hahaOpenAIOAuthStore.ts","./src/stores/mcpStore.ts","./src/stores/memoryStore.ts","./src/stores/openTargetStore.test.ts","./src/stores/openTargetStore.ts","./src/stores/pluginStore.test.ts","./src/stores/pluginStore.ts","./src/stores/providerStore.test.ts","./src/stores/providerStore.ts","./src/stores/sessionRuntimeStore.ts","./src/stores/sessionStore.test.ts","./src/stores/sessionStore.ts","./src/stores/settingsStore.test.ts","./src/stores/settingsStore.ts","./src/stores/skillStore.ts","./src/stores/tabStore.test.ts","./src/stores/tabStore.ts","./src/stores/taskStore.ts","./src/stores/teamStore.ts","./src/stores/terminalPanelStore.ts","./src/stores/uiStore.test.ts","./src/stores/uiStore.ts","./src/stores/updateStore.test.ts","./src/stores/updateStore.ts","./src/stores/workspaceChatContextStore.test.ts","./src/stores/workspaceChatContextStore.ts","./src/stores/workspacePanelStore.test.ts","./src/stores/workspacePanelStore.ts","./src/theme/globals.test.ts","./src/types/adapter.ts","./src/types/chat.ts","./src/types/cliTask.ts","./src/types/companion.ts","./src/types/mcp.ts","./src/types/memory.ts","./src/types/plugin.ts","./src/types/provider.ts","./src/types/providerPreset.ts","./src/types/qrcode.d.ts","./src/types/runtime.ts","./src/types/session.ts","./src/types/settings.ts","./src/types/skill.ts","./src/types/task.ts","./src/types/team.ts"],"errors":true,"version":"5.9.3"}
+{"root":["./src/App.tsx","./src/main.test.tsx","./src/main.tsx","./src/vite-env.d.ts","./src/__tests__/agentsSettings.test.tsx","./src/__tests__/diagnosticsSettings.test.tsx","./src/__tests__/generalSettings.test.tsx","./src/__tests__/mcpSettings.test.tsx","./src/__tests__/memorySettings.test.tsx","./src/__tests__/pages.test.tsx","./src/__tests__/pluginsSettings.test.tsx","./src/__tests__/skillsSettings.test.tsx","./src/__tests__/tauriCapabilities.test.ts","./src/api/activityStats.ts","./src/api/adapters.ts","./src/api/agents.ts","./src/api/cliTasks.ts","./src/api/client.test.ts","./src/api/client.ts","./src/api/computerUse.ts","./src/api/desktopUiPreferences.ts","./src/api/diagnostics.ts","./src/api/doctor.ts","./src/api/filesystem.ts","./src/api/h5Access.ts","./src/api/hahaOAuth.ts","./src/api/hahaOpenAIOAuth.ts","./src/api/mcp.ts","./src/api/memory.ts","./src/api/models.ts","./src/api/openTargets.test.ts","./src/api/openTargets.ts","./src/api/plugins.ts","./src/api/providers.ts","./src/api/search.ts","./src/api/sessions.test.ts","./src/api/sessions.ts","./src/api/settings.ts","./src/api/skills.ts","./src/api/tasks.ts","./src/api/teams.ts","./src/api/terminal.ts","./src/api/websocket.test.ts","./src/api/websocket.ts","./src/components/ErrorBoundary.test.tsx","./src/components/ErrorBoundary.tsx","./src/components/chat/AskUserQuestion.test.tsx","./src/components/chat/AskUserQuestion.tsx","./src/components/chat/AssistantMessage.tsx","./src/components/chat/AttachmentGallery.test.tsx","./src/components/chat/AttachmentGallery.tsx","./src/components/chat/ChatInput.test.tsx","./src/components/chat/ChatInput.tsx","./src/components/chat/CodeViewer.test.tsx","./src/components/chat/CodeViewer.tsx","./src/components/chat/ComposerDropOverlay.tsx","./src/components/chat/ComputerUsePermissionModal.test.tsx","./src/components/chat/ComputerUsePermissionModal.tsx","./src/components/chat/ContextUsageIndicator.test.tsx","./src/components/chat/ContextUsageIndicator.tsx","./src/components/chat/CurrentTurnChangeCard.tsx","./src/components/chat/DiffViewer.tsx","./src/components/chat/FileSearchMenu.test.tsx","./src/components/chat/FileSearchMenu.tsx","./src/components/chat/ImageGalleryModal.tsx","./src/components/chat/InlineImageGallery.tsx","./src/components/chat/InlineTaskSummary.tsx","./src/components/chat/LocalSlashCommandPanel.test.tsx","./src/components/chat/LocalSlashCommandPanel.tsx","./src/components/chat/MermaidRenderer.test.tsx","./src/components/chat/MermaidRenderer.tsx","./src/components/chat/MessageActionBar.tsx","./src/components/chat/MessageList.test.tsx","./src/components/chat/MessageList.tsx","./src/components/chat/PermissionDialog.tsx","./src/components/chat/SessionTaskBar.test.tsx","./src/components/chat/SessionTaskBar.tsx","./src/components/chat/StreamingIndicator.tsx","./src/components/chat/TerminalChrome.tsx","./src/components/chat/ThinkingBlock.tsx","./src/components/chat/ToolCallBlock.tsx","./src/components/chat/ToolCallGroup.tsx","./src/components/chat/ToolResultBlock.tsx","./src/components/chat/UserMessage.test.tsx","./src/components/chat/UserMessage.tsx","./src/components/chat/chatBlocks.test.tsx","./src/components/chat/clipboard.ts","./src/components/chat/composerUtils.test.ts","./src/components/chat/composerUtils.ts","./src/components/chat/useComposerFileDrop.ts","./src/components/companion/CompanionControls.tsx","./src/components/companion/CompanionTopBar.tsx","./src/components/companion/CompanionTranscript.tsx","./src/components/companion/CompanionVideoPanel.tsx","./src/components/companion/ScenarioSelector.tsx","./src/components/companion/ScreenShareDialog.tsx","./src/components/controls/ModelSelector.test.tsx","./src/components/controls/ModelSelector.tsx","./src/components/controls/PermissionModeSelector.test.tsx","./src/components/controls/PermissionModeSelector.tsx","./src/components/doctor/DoctorPanel.tsx","./src/components/layout/AppShell.test.tsx","./src/components/layout/AppShell.tsx","./src/components/layout/ContentRouter.test.tsx","./src/components/layout/ContentRouter.tsx","./src/components/layout/H5ConnectionView.tsx","./src/components/layout/OpenProjectMenu.test.tsx","./src/components/layout/OpenProjectMenu.tsx","./src/components/layout/Sidebar.test.tsx","./src/components/layout/Sidebar.tsx","./src/components/layout/StartupErrorView.test.tsx","./src/components/layout/StartupErrorView.tsx","./src/components/layout/StatusBar.tsx","./src/components/layout/TabBar.test.tsx","./src/components/layout/TabBar.tsx","./src/components/layout/TitleBar.tsx","./src/components/layout/WindowControls.test.tsx","./src/components/layout/WindowControls.tsx","./src/components/markdown/MarkdownRenderer.test.tsx","./src/components/markdown/MarkdownRenderer.tsx","./src/components/plugins/PluginDetail.tsx","./src/components/plugins/PluginList.tsx","./src/components/settings/ChatGPTOfficialLogin.test.tsx","./src/components/settings/ChatGPTOfficialLogin.tsx","./src/components/settings/ClaudeOfficialLogin.tsx","./src/components/shared/Button.tsx","./src/components/shared/ConfirmDialog.tsx","./src/components/shared/CopyButton.tsx","./src/components/shared/DirectoryPicker.test.tsx","./src/components/shared/DirectoryPicker.tsx","./src/components/shared/Dropdown.tsx","./src/components/shared/Input.tsx","./src/components/shared/MobileBottomSheet.tsx","./src/components/shared/Modal.test.tsx","./src/components/shared/Modal.tsx","./src/components/shared/ProjectContextChip.test.tsx","./src/components/shared/ProjectContextChip.tsx","./src/components/shared/RepositoryLaunchControls.test.tsx","./src/components/shared/RepositoryLaunchControls.tsx","./src/components/shared/Spinner.tsx","./src/components/shared/Textarea.tsx","./src/components/shared/Toast.tsx","./src/components/shared/UpdateChecker.test.tsx","./src/components/shared/UpdateChecker.tsx","./src/components/skills/SkillDetail.test.tsx","./src/components/skills/SkillDetail.tsx","./src/components/skills/SkillList.tsx","./src/components/tasks/DayOfWeekPicker.tsx","./src/components/tasks/NewTaskModal.test.tsx","./src/components/tasks/NewTaskModal.tsx","./src/components/tasks/PromptEditor.tsx","./src/components/tasks/TaskEmptyState.tsx","./src/components/tasks/TaskList.tsx","./src/components/tasks/TaskRow.tsx","./src/components/tasks/TaskRunsPanel.test.tsx","./src/components/tasks/TaskRunsPanel.tsx","./src/components/teams/TeamStatusBar.tsx","./src/components/workspace/WorkspaceCodeSurface.tsx","./src/components/workspace/WorkspacePanel.test.tsx","./src/components/workspace/WorkspacePanel.tsx","./src/config/spinnerVerbs.ts","./src/constants/modelCatalog.ts","./src/constants/openaiOfficialProvider.ts","./src/hooks/useCameraDevices.ts","./src/hooks/useCompanionAudio.ts","./src/hooks/useCompanionWebSocket.ts","./src/hooks/useKeyboardShortcuts.test.tsx","./src/hooks/useKeyboardShortcuts.ts","./src/hooks/useMicrophone.ts","./src/hooks/useMiniCPMoBackend.ts","./src/hooks/useMobileViewport.test.tsx","./src/hooks/useMobileViewport.ts","./src/hooks/useScheduledTaskDesktopNotifications.test.tsx","./src/hooks/useScheduledTaskDesktopNotifications.ts","./src/hooks/useScreenShare.ts","./src/hooks/useSelectionPopoverDismiss.ts","./src/hooks/useWebcam.ts","./src/i18n/index.test.tsx","./src/i18n/index.ts","./src/i18n/locales/en.ts","./src/i18n/locales/zh.ts","./src/lib/appZoom.test.ts","./src/lib/appZoom.ts","./src/lib/audioEngine.ts","./src/lib/composerAttachments.test.ts","./src/lib/composerAttachments.ts","./src/lib/cronDescribe.ts","./src/lib/desktopNotificationNavigation.test.ts","./src/lib/desktopNotificationNavigation.ts","./src/lib/desktopNotifications.test.ts","./src/lib/desktopNotifications.ts","./src/lib/desktopRuntime.test.ts","./src/lib/desktopRuntime.ts","./src/lib/diagnosticsCapture.ts","./src/lib/doctorRepair.test.ts","./src/lib/doctorRepair.ts","./src/lib/formatBytes.ts","./src/lib/parseRunOutput.ts","./src/lib/persistenceMigrations.test.ts","./src/lib/persistenceMigrations.ts","./src/lib/providerSettingsJson.ts","./src/lib/sessionTitle.test.ts","./src/lib/sessionTitle.ts","./src/lib/__tests__/cronDescribe.test.ts","./src/lib/__tests__/providerSettingsJson.test.ts","./src/mocks/data.ts","./src/pages/ActiveSession.test.tsx","./src/pages/ActiveSession.tsx","./src/pages/ActivitySettings.test.tsx","./src/pages/ActivitySettings.tsx","./src/pages/AdapterSettings.test.tsx","./src/pages/AdapterSettings.tsx","./src/pages/AgentTeams.tsx","./src/pages/Companion.tsx","./src/pages/ComputerUseSettings.test.tsx","./src/pages/ComputerUseSettings.tsx","./src/pages/DiagnosticsSettings.tsx","./src/pages/EmptySession.test.tsx","./src/pages/EmptySession.tsx","./src/pages/McpSettings.tsx","./src/pages/MemorySettings.tsx","./src/pages/NewTaskModal.tsx","./src/pages/ScheduledTasks.tsx","./src/pages/ScheduledTasksEmpty.tsx","./src/pages/ScheduledTasksList.tsx","./src/pages/SessionControls.tsx","./src/pages/Settings.tsx","./src/pages/TerminalSettings.test.tsx","./src/pages/TerminalSettings.tsx","./src/pages/ToolInspection.tsx","./src/stores/adapterStore.test.ts","./src/stores/adapterStore.ts","./src/stores/agentStore.ts","./src/stores/chatStore.test.ts","./src/stores/chatStore.ts","./src/stores/cliTaskStore.test.ts","./src/stores/cliTaskStore.ts","./src/stores/companionStore.ts","./src/stores/hahaOAuthStore.test.ts","./src/stores/hahaOAuthStore.ts","./src/stores/hahaOpenAIOAuthStore.test.ts","./src/stores/hahaOpenAIOAuthStore.ts","./src/stores/mcpStore.ts","./src/stores/memoryStore.ts","./src/stores/openTargetStore.test.ts","./src/stores/openTargetStore.ts","./src/stores/pluginStore.test.ts","./src/stores/pluginStore.ts","./src/stores/providerStore.test.ts","./src/stores/providerStore.ts","./src/stores/sessionRuntimeStore.ts","./src/stores/sessionStore.test.ts","./src/stores/sessionStore.ts","./src/stores/settingsStore.test.ts","./src/stores/settingsStore.ts","./src/stores/skillStore.ts","./src/stores/tabStore.test.ts","./src/stores/tabStore.ts","./src/stores/taskStore.ts","./src/stores/teamStore.ts","./src/stores/terminalPanelStore.ts","./src/stores/uiStore.test.ts","./src/stores/uiStore.ts","./src/stores/updateStore.test.ts","./src/stores/updateStore.ts","./src/stores/workspaceChatContextStore.test.ts","./src/stores/workspaceChatContextStore.ts","./src/stores/workspacePanelStore.test.ts","./src/stores/workspacePanelStore.ts","./src/theme/globals.test.ts","./src/types/adapter.ts","./src/types/chat.ts","./src/types/cliTask.ts","./src/types/companion.ts","./src/types/mcp.ts","./src/types/memory.ts","./src/types/plugin.ts","./src/types/provider.ts","./src/types/providerPreset.ts","./src/types/qrcode.d.ts","./src/types/runtime.ts","./src/types/session.ts","./src/types/settings.ts","./src/types/skill.ts","./src/types/task.ts","./src/types/team.ts"],"errors":true,"version":"5.9.3"}

src/server/api/cli-auth.ts

@@ -0,0 +1,157 @@
+/**
+ * CLI Auth Provider REST API
+ *
+ * GET  /api/cli-auth          — read current CLI auth provider config from ~/.claude.json
+ * PUT  /api/cli-auth          — update CLI auth provider config in ~/.claude.json
+ * POST /api/cli-auth/invalidate — invalidate the cliProviderModelCache
+ */
+
+import { homedir } from 'node:os'
+import { readFileSync, writeFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { ApiError, errorResponse } from '../middleware/errorHandler.js'
+
+type AuthProvider = 'anthropic' | 'openai' | 'openrouter' | 'local' | 'opencode' | 'nvidia'
+
+type CliAuthConfig = {
+  authProvider: AuthProvider | null
+  nvidiaApiKey?: string
+  openRouterApiKey?: string
+  openAiApiKey?: string
+  openAiAccessToken?: string
+  openCodeApiKey?: string
+  openCodeModelName?: string
+  localBaseUrl?: string
+  localModelName?: string
+}
+
+function getClaudeJsonPath(): string {
+  return join(homedir(), '.claude.json')
+}
+
+function readCliAuthConfig(): CliAuthConfig {
+  try {
+    const raw = readFileSync(getClaudeJsonPath(), 'utf8')
+    const config = JSON.parse(raw) as Record<string, unknown>
+    return {
+      authProvider: (config.authProvider as AuthProvider) || null,
+      nvidiaApiKey: config.nvidiaApiKey as string | undefined,
+      openRouterApiKey: config.openRouterApiKey as string | undefined,
+      openAiApiKey: config.openAiApiKey as string | undefined,
+      openAiAccessToken: config.openAiAccessToken as string | undefined,
+      openCodeApiKey: config.openCodeApiKey as string | undefined,
+      openCodeModelName: config.openCodeModelName as string | undefined,
+      localBaseUrl: config.localBaseUrl as string | undefined,
+      localModelName: config.localModelName as string | undefined,
+    }
+  } catch {
+    return { authProvider: null }
+  }
+}
+
+function writeCliAuthConfig(updates: Partial<CliAuthConfig>): void {
+  const filePath = getClaudeJsonPath()
+  let config: Record<string, unknown> = {}
+  try {
+    const raw = readFileSync(filePath, 'utf8')
+    config = JSON.parse(raw) as Record<string, unknown>
+  } catch {
+    // file doesn't exist yet, start fresh
+  }
+
+  if (updates.authProvider !== undefined) {
+    config.authProvider = updates.authProvider || undefined
+  }
+
+  if (updates.nvidiaApiKey !== undefined) {
+    config.nvidiaApiKey = updates.nvidiaApiKey || undefined
+  }
+
+  if (updates.openRouterApiKey !== undefined) {
+    config.openRouterApiKey = updates.openRouterApiKey || undefined
+  }
+
+  if (updates.openAiApiKey !== undefined) {
+    config.openAiApiKey = updates.openAiApiKey || undefined
+    config.openAiAccessToken = undefined
+    config.openAiRefreshToken = undefined
+    config.openAiTokenExpiresAt = undefined
+    config.openAiWorkspaceId = undefined
+  }
+
+  if (updates.openAiAccessToken !== undefined) {
+    config.openAiAccessToken = updates.openAiAccessToken || undefined
+    config.openAiApiKey = undefined
+    config.openAiRefreshToken = undefined
+    config.openAiTokenExpiresAt = undefined
+    config.openAiWorkspaceId = undefined
+  }
+
+  if (updates.openCodeApiKey !== undefined) {
+    config.openCodeApiKey = updates.openCodeApiKey || undefined
+  }
+
+  if (updates.openCodeModelName !== undefined) {
+    config.openCodeModelName = updates.openCodeModelName || undefined
+  }
+
+  if (updates.localBaseUrl !== undefined) {
+    config.localBaseUrl = updates.localBaseUrl || undefined
+  }
+
+  if (updates.localModelName !== undefined) {
+    config.localModelName = updates.localModelName || undefined
+  }
+
+  writeFileSync(filePath, JSON.stringify(config, null, 2) + '\n')
+}
+
+export async function handleCliAuthApi(
+  req: Request,
+  _url: URL,
+  segments: string[],
+): Promise<Response> {
+  try {
+    const sub = segments[2]
+
+    if (sub === 'invalidate') {
+      if (req.method !== 'POST') throw methodNotAllowed(req.method)
+      const { invalidateCliProviderModelCache } = await import('./models.js')
+      invalidateCliProviderModelCache()
+      return Response.json({ ok: true })
+    }
+
+    if (!sub) {
+      if (req.method === 'GET') {
+        const config = readCliAuthConfig()
+        return Response.json(config)
+      }
+
+      if (req.method === 'PUT') {
+        const body = await parseJsonBody(req)
+        writeCliAuthConfig(body as Partial<CliAuthConfig>)
+        const { invalidateCliProviderModelCache } = await import('./models.js')
+        invalidateCliProviderModelCache()
+        return Response.json({ ok: true })
+      }
+
+      throw methodNotAllowed(req.method)
+    }
+
+    throw ApiError.notFound(`Unknown cli-auth endpoint: ${sub}`)
+  } catch (error) {
+    return errorResponse(error)
+  }
+}
+
+async function parseJsonBody(req: Request): Promise<Record<string, unknown>> {
+  try {
+    return (await req.json()) as Record<string, unknown>
+  } catch {
+    throw ApiError.badRequest('Invalid JSON body')
+  }
+}
+
+function methodNotAllowed(method: string): ApiError {
+  return new ApiError(405, `Method ${method} not allowed`, 'METHOD_NOT_ALLOWED')
+}

src/server/api/models.ts

@@ -167,6 +167,11 @@ let cliProviderModelCache: ApiModelInfo[] | null = null
 let cliProviderModelCacheTime = 0
 const CLI_PROVIDER_CACHE_TTL = 5 * 60 * 1000 // 5 minutes
 
+export function invalidateCliProviderModelCache(): void {
+  cliProviderModelCache = null
+  cliProviderModelCacheTime = 0
+}
+
 async function fetchCliProviderModels(): Promise<ApiModelInfo[]> {
   if (cliProviderModelCache && Date.now() - cliProviderModelCacheTime < CLI_PROVIDER_CACHE_TTL) {
     return cliProviderModelCache
@@ -285,7 +290,57 @@ export async function handleModelsApi(
 
 // ─── Handlers ─────────────────────────────────────────────────────────────────
 
+async function readCliAuthProvider(): Promise<{
+  authProvider?: 'anthropic' | 'openai' | 'openrouter' | 'local' | 'opencode' | 'nvidia'
+} | null> {
+  try {
+    const { homedir } = await import('node:os')
+    const { readFileSync } = await import('node:fs')
+    const { join } = await import('node:path')
+    const raw = readFileSync(join(homedir(), '.claude.json'), 'utf8')
+    return JSON.parse(raw)
+  } catch {
+    return null
+  }
+}
+
+const CLI_PROVIDER_NAMES: Record<string, string> = {
+  opencode: 'OpenCode Zen',
+  nvidia: 'NVIDIA',
+  openrouter: 'OpenRouter',
+  local: 'Local',
+  anthropic: 'Anthropic',
+  openai: 'OpenAI',
+}
+
 async function handleModelsList(): Promise<Response> {
+  // First check if CLI has an authProvider configured — this takes precedence
+  // over cc-haha providers since CLI's /login command manages it
+  const cliConfig = await readCliAuthProvider()
+  const cliAuthProvider = cliConfig?.authProvider
+
+  if (cliAuthProvider && cliAuthProvider !== 'anthropic' && cliAuthProvider !== 'openai') {
+    const cliModels = await fetchCliProviderModels()
+    if (cliModels.length > 0) {
+      return Response.json({
+        models: cliModels,
+        provider: {
+          id: `cli-${cliAuthProvider}`,
+          name: CLI_PROVIDER_NAMES[cliAuthProvider] || cliAuthProvider,
+        },
+      })
+    }
+    // If no models fetched yet but authProvider is set, still return provider info
+    // The model list will be populated once available
+    return Response.json({
+      models: [],
+      provider: {
+        id: `cli-${cliAuthProvider}`,
+        name: CLI_PROVIDER_NAMES[cliAuthProvider] || cliAuthProvider,
+      },
+    })
+  }
+
   const { providers, activeId } = await providerService.listProviders()
   if (isOpenAIOfficialProviderId(activeId)) {
     return Response.json({
@@ -306,15 +361,6 @@ async function handleModelsList(): Promise<Response> {
     })
   }
 
-  // No cc-haha provider active — check if CLI has an auth provider configured
-  const cliModels = await fetchCliProviderModels()
-  if (cliModels.length > 0) {
-    return Response.json({
-      models: cliModels,
-      provider: { id: 'cli', name: 'CLI Provider' },
-    })
-  }
-
   return Response.json({ models: getStandaloneModelList(), provider: null })
 }
 

src/server/router.ts

@@ -27,6 +27,7 @@ import { handleActivityStatsApi } from './api/activityStats.js'
 import { handleOpenTargetsApi } from './api/open-targets.js'
 import { handleMemoryApi } from './api/memory.js'
 import { handleDesktopUiApi } from './api/desktop-ui.js'
+import { handleCliAuthApi } from './api/cli-auth.js'
 
 export async function handleApiRequest(req: Request, url: URL): Promise<Response> {
   const path = url.pathname
@@ -119,6 +120,9 @@ export async function handleApiRequest(req: Request, url: URL): Promise<Response
     case 'desktop-ui':
       return handleDesktopUiApi(req, url, segments)
 
+    case 'cli-auth':
+      return handleCliAuthApi(req, url, segments)
+
     case 'filesystem':
       return handleFilesystemRoute(url.pathname, url)
 

src/server/services/conversationService.ts

@@ -866,6 +866,61 @@ export class ConversationService {
     return args
   }
 
+  private readCliGlobalConfig(): {
+    authProvider?: 'anthropic' | 'openai' | 'openrouter' | 'local' | 'opencode' | 'nvidia'
+    openCodeApiKey?: string
+    openCodeModelName?: string
+    nvidiaApiKey?: string
+    openRouterApiKey?: string
+    localBaseUrl?: string
+    localModelName?: string
+  } | null {
+    const configDir = process.env.CLAUDE_CONFIG_DIR || path.join(os.homedir(), '.claude')
+    const configPath = path.join(configDir, '.claude.json')
+    try {
+      const raw = fs.readFileSync(configPath, 'utf-8')
+      return JSON.parse(raw) as ReturnType<typeof this.readCliGlobalConfig>
+    } catch {
+      return null
+    }
+  }
+
+  private buildCliProviderEnv(
+    authProvider: 'opencode' | 'nvidia' | 'openrouter' | 'local',
+    config: NonNullable<ReturnType<typeof this.readCliGlobalConfig>>,
+  ): Record<string, string> {
+    const env: Record<string, string> = {}
+
+    if (authProvider === 'opencode') {
+      if (config.openCodeApiKey) {
+        env.ANTHROPIC_API_KEY = config.openCodeApiKey
+      }
+      if (config.openCodeModelName) {
+        env.ANTHROPIC_MODEL = config.openCodeModelName
+      }
+      // opencode uses custom fetch override, no base URL override needed
+    } else if (authProvider === 'nvidia') {
+      if (config.nvidiaApiKey) {
+        env.ANTHROPIC_API_KEY = config.nvidiaApiKey
+      }
+      env.ANTHROPIC_BASE_URL = 'https://integrate.api.nvidia.com/v1'
+    } else if (authProvider === 'openrouter') {
+      if (config.openRouterApiKey) {
+        env.ANTHROPIC_API_KEY = config.openRouterApiKey
+      }
+      env.ANTHROPIC_BASE_URL = 'https://openrouter.ai/api/v1'
+    } else if (authProvider === 'local') {
+      if (config.localBaseUrl) {
+        env.ANTHROPIC_BASE_URL = config.localBaseUrl
+      }
+      if (config.localModelName) {
+        env.ANTHROPIC_MODEL = config.localModelName
+      }
+    }
+
+    return env
+  }
+
   private async buildChildEnv(
     workDir: string,
     sdkUrl?: string,
@@ -923,8 +978,25 @@ export class ConversationService {
     if (explicitProviderEnv && options?.model?.trim()) {
       explicitProviderEnv.ANTHROPIC_MODEL = options.model.trim()
     }
+
+    // Check for CLI-managed authProvider (opencode, nvidia, openrouter, local)
+    // These are configured via CLI's /login command and stored in ~/.claude.json
+    const cliConfig = this.readCliGlobalConfig()
+    const cliAuthProvider = cliConfig?.authProvider
+    const isCliManagedProvider =
+      cliAuthProvider !== undefined &&
+      cliAuthProvider !== 'anthropic' &&
+      cliAuthProvider !== 'openai'
+    const cliProviderEnv = isCliManagedProvider
+      ? this.buildCliProviderEnv(
+          cliAuthProvider as 'opencode' | 'nvidia' | 'openrouter' | 'local',
+          cliConfig!,
+        )
+      : null
+
     const attributionHeaderEnv = attributionHeaderEnvForModel(
       options?.model?.trim() ||
+        cliProviderEnv?.ANTHROPIC_MODEL ||
         explicitProviderEnv?.ANTHROPIC_MODEL ||
         cleanEnv.ANTHROPIC_MODEL,
     )
@@ -969,10 +1041,16 @@ export class ConversationService {
       // 否则 CLI 会忽略 provider 的 AUTH_TOKEN、错误地走 OAuth 打到第三方
       // endpoint。详见 src/utils/auth.ts isManagedOAuthContext()。
       ...(explicitProviderEnv ?? {}),
+      // CLI-managed provider env (opencode/nvidia/openrouter/local from ~/.claude.json)
+      // takes precedence over cc-haha provider env
+      ...(cliProviderEnv ?? {}),
       ...networkEnv,
-      ...(this.shouldMarkManagedOAuth(options?.providerId)
-        ? await this.buildOfficialOAuthEnv()
-        : {}),
+      // Skip Desktop OAuth when using CLI-managed providers (they handle their own auth)
+      ...(isCliManagedProvider
+        ? {}
+        : this.shouldMarkManagedOAuth(options?.providerId)
+          ? await this.buildOfficialOAuthEnv()
+          : {}),
       ...attributionHeaderEnv,
     }
   }
@@ -1024,6 +1102,13 @@ export class ConversationService {
       return true
     }
 
+    // Check ~/.claude.json first - if CLI has a non-anthropic/non-openai authProvider,
+    // strip inherited env so CLI reads from its own config
+    const cliConfig = this.readCliGlobalConfig()
+    if (cliConfig?.authProvider && cliConfig.authProvider !== 'anthropic' && cliConfig.authProvider !== 'openai') {
+      return true
+    }
+
     const configDir =
       process.env.CLAUDE_CONFIG_DIR || path.join(os.homedir(), '.claude')
     const ccHahaDir = path.join(configDir, 'cc-haha')
@@ -1078,6 +1163,13 @@ export class ConversationService {
       return false
     }
 
+    // Check ~/.claude.json first - if CLI has a non-anthropic/non-openai authProvider,
+    // it manages its own auth, skip Desktop OAuth injection
+    const cliConfig = this.readCliGlobalConfig()
+    if (cliConfig?.authProvider && cliConfig.authProvider !== 'anthropic' && cliConfig.authProvider !== 'openai') {
+      return false
+    }
+
     const configDir =
       process.env.CLAUDE_CONFIG_DIR || path.join(os.homedir(), '.claude')
     const settingsPath = path.join(configDir, 'cc-haha', 'settings.json')

src/server/services/providerService.ts

@@ -35,6 +35,7 @@ import {
   normalizeModelMapping,
   normalizeProvidersIndex,
 } from './providerRuntimeEnv.js'
+import { PROVIDER_PRESETS } from '../config/providerPresets.js'
 import { getProxyFetchOptions } from '../../utils/proxy.js'
 import {
   getManualNetworkProxyUrl,
@@ -82,6 +83,84 @@ export class ProviderService {
     return path.join(this.getCcHahaDir(), 'providers.json')
   }
 
+  /**
+   * Path to the TUI's global config file (~/.claude.json).
+   * Always at the home directory level, not under CLAUDE_CONFIG_DIR.
+   */
+  private getTuiConfigPath(): string {
+    return path.join(os.homedir(), '.claude.json')
+  }
+
+  /**
+   * Auto-import the provider configured in the TUI's global config (~/.claude.json).
+   * When the user configured a provider via /login in the TUI, this ensures the
+   * desktop app sees and uses the same provider automatically.
+   *
+   * Only imports when no desktop provider is currently active, to avoid overriding
+   * the user's desktop-specific choice.
+   */
+  private async autoImportTuiProvider(): Promise<void> {
+    const tuiConfigPath = this.getTuiConfigPath()
+    let raw: string
+    try {
+      raw = await fs.readFile(tuiConfigPath, 'utf-8')
+    } catch {
+      return // No TUI config file
+    }
+
+    let tuiConfig: {
+      authProvider?: string
+      nvidiaApiKey?: string
+    }
+    try {
+      tuiConfig = JSON.parse(raw)
+    } catch {
+      return // Invalid JSON
+    }
+
+    const providerId = tuiConfig.authProvider
+    if (!providerId) return // No TUI provider configured
+
+    // Read current index to check if already imported
+    const index = await this.readIndex()
+    if (index.activeId) return // already has a desktop provider active
+
+    // Check if a TUI-imported provider already exists (e.g. from a previous import)
+    const tuiProviderTag = `tui-${providerId}`
+    const existing = index.providers.find(p => p.presetId === tuiProviderTag)
+    if (existing) {
+      index.activeId = existing.id
+      await this.writeIndex(index)
+      return
+    }
+
+    // Find the matching preset
+    const preset = PROVIDER_PRESETS.find(p => p.id === providerId)
+    if (!preset) return // No matching desktop preset for this TUI provider
+
+    // Extract API key based on provider type
+    let apiKey = ''
+    if (providerId === 'nvidia') {
+      apiKey = tuiConfig.nvidiaApiKey || ''
+      if (!apiKey) return
+    }
+
+    const provider: SavedProvider = {
+      id: crypto.randomUUID(),
+      presetId: tuiProviderTag,
+      name: `TUI: ${preset.name}`,
+      apiKey,
+      baseUrl: preset.baseUrl,
+      apiFormat: preset.apiFormat,
+      runtimeKind: 'anthropic_compatible',
+      models: preset.defaultModels,
+    }
+
+    index.providers.push(provider)
+    index.activeId = provider.id
+    await this.writeIndex(index)
+  }
+
   private async readIndex(): Promise<ProvidersIndex> {
     await ensurePersistentStorageUpgraded()
     return readRecoverableJsonFile({
@@ -125,6 +204,8 @@ export class ProviderService {
   // --- CRUD ---
 
   async listProviders(): Promise<{ providers: SavedProvider[]; activeId: string | null }> {
+    // Auto-import TUI provider so desktop follows the TUI's provider choice
+    await this.autoImportTuiProvider()
     const index = await this.readIndex()
     return { providers: index.providers, activeId: index.activeId }
   }

src/server/ws/handler.ts

@@ -9,6 +9,8 @@
 import type { ServerWebSocket } from 'bun'
 import type { ClientMessage, ServerMessage } from './events.js'
 import * as os from 'node:os'
+import * as fs from 'node:fs'
+import * as path from 'node:path'
 import {
   ConversationStartupError,
   conversationService,
@@ -1743,7 +1745,36 @@ async function getRuntimeSettings(sessionId?: string): Promise<RuntimeSettings>
 }
 
 async function getDefaultRuntimeSettings(): Promise<RuntimeSettings> {
-  // Check if a custom provider is active
+  // First check if CLI has an authProvider configured in ~/.claude.json
+  // (opencode, nvidia, openrouter, local, etc.) - these take precedence
+  // over cc-haha providers since they are managed by the CLI's /login command
+  const cliConfig = await readCliGlobalConfig()
+  if (cliConfig?.authProvider && cliConfig.authProvider !== 'anthropic' && cliConfig.authProvider !== 'openai') {
+    const userSettings = await settingsService.getUserSettings()
+    const baseModel =
+      typeof userSettings.model === 'string' && userSettings.model.trim()
+        ? userSettings.model
+        : undefined
+    const modelContext =
+      typeof userSettings.modelContext === 'string' && userSettings.modelContext.trim()
+        ? userSettings.modelContext
+        : undefined
+    const effort =
+      typeof userSettings.effort === 'string' && userSettings.effort.trim()
+        ? userSettings.effort
+        : undefined
+    const thinking = resolveDesktopThinkingMode(userSettings)
+
+    return {
+      permissionMode: await settingsService.getPermissionMode().catch(() => undefined),
+      model: baseModel ? (modelContext ? `${baseModel}:${modelContext}` : baseModel) : undefined,
+      effort,
+      thinking,
+      providerId: undefined, // CLI manages auth via ~/.claude.json - pass undefined so shouldMarkManagedOAuth checks cli config
+    }
+  }
+
+  // Check if a custom cc-haha provider is active
   const { providers, activeId } = await providerService.listProviders()
   let resolvedActiveId = activeId
   if (activeId && !isKnownRuntimeProviderId(activeId, providers)) {
@@ -1803,6 +1834,30 @@ function resolveDesktopThinkingMode(
   return settings.alwaysThinkingEnabled === false ? 'disabled' : undefined
 }
 
+/**
+ * Read CLI's ~/.claude.json directly to check authProvider.
+ * Bypasses getGlobalConfig cache since this runs in the server process
+ * and needs to reflect changes made by CLI's /login command.
+ */
+function readCliGlobalConfig(): {
+  authProvider?: 'anthropic' | 'openai' | 'openrouter' | 'local' | 'opencode' | 'nvidia'
+  openCodeApiKey?: string
+  openCodeModelName?: string
+  nvidiaApiKey?: string
+  openRouterApiKey?: string
+  localBaseUrl?: string
+  localModelName?: string
+} | null {
+  const configDir = process.env.CLAUDE_CONFIG_DIR || path.join(os.homedir(), '.claude')
+  const configPath = path.join(configDir, '.claude.json')
+  try {
+    const raw = fs.readFileSync(configPath, 'utf-8')
+    return JSON.parse(raw)
+  } catch {
+    return null
+  }
+}
+
 async function buildSessionStartupDiagnosticMessage(
   sessionId: string,
   cause: string,