feat(provider): mainly support moonshot / siliconflow on setup (#43)

electron/gateway/manager.ts

@@ -16,8 +16,8 @@ import {
   isOpenClawPresent 
 } from '../utils/paths';
 import { getSetting } from '../utils/store';
-import { getApiKey } from '../utils/secure-storage';
+import { getApiKey, getDefaultProvider, getProvider } from '../utils/secure-storage';
-import { getProviderEnvVar } from '../utils/openclaw-auth';
+import { getProviderEnvVar, getKeyableProviderTypes } from '../utils/provider-registry';
 import { GatewayEventType, JsonRpcNotification, isNotification, isResponse } from './protocol';
 import { logger } from '../utils/logger';
 import { getUvMirrorEnv } from '../utils/uv-env';
@@ -521,10 +521,30 @@ export class GatewayManager extends EventEmitter {
       ? `${binPath}${path.delimiter}${process.env.PATH || ''}`
       : process.env.PATH || '';
     
-    // Load provider API keys from secure storage to pass as environment variables
+    // Load provider API keys from storage to pass as environment variables
     const providerEnv: Record<string, string> = {};
-    const providerTypes = ['anthropic', 'openai', 'google', 'openrouter'];
+    const providerTypes = getKeyableProviderTypes();
     let loadedProviderKeyCount = 0;
+
+    // Prefer the selected default provider key when provider IDs are instance-based.
+    try {
+      const defaultProviderId = await getDefaultProvider();
+      if (defaultProviderId) {
+        const defaultProvider = await getProvider(defaultProviderId);
+        const defaultProviderType = defaultProvider?.type;
+        const defaultProviderKey = await getApiKey(defaultProviderId);
+        if (defaultProviderType && defaultProviderKey) {
+          const envVar = getProviderEnvVar(defaultProviderType);
+          if (envVar) {
+            providerEnv[envVar] = defaultProviderKey;
+            loadedProviderKeyCount++;
+          }
+        }
+      }
+    } catch (err) {
+      logger.warn('Failed to load default provider key for environment injection:', err);
+    }
+
     for (const providerType of providerTypes) {
       try {
         const key = await getApiKey(providerType);

electron/main/ipc-handlers.ts

@@ -13,18 +13,21 @@ import {
   hasApiKey,
   saveProvider,
   getProvider,
-
   deleteProvider,
   setDefaultProvider,
   getDefaultProvider,
   getAllProvidersWithKeyInfo,
-  isEncryptionAvailable,
   type ProviderConfig,
 } from '../utils/secure-storage';
 import { getOpenClawStatus, getOpenClawDir, getOpenClawConfigDir, getOpenClawSkillsDir } from '../utils/paths';
 import { getOpenClawCliCommand, installOpenClawCliMac } from '../utils/openclaw-cli';
 import { getSetting } from '../utils/store';
-import { saveProviderKeyToOpenClaw, setOpenClawDefaultModel } from '../utils/openclaw-auth';
+import {
+  saveProviderKeyToOpenClaw,
+  removeProviderKeyFromOpenClaw,
+  setOpenClawDefaultModel,
+  setOpenClawDefaultModelWithOverride,
+} from '../utils/openclaw-auth';
 import { logger } from '../utils/logger';
 import {
   saveChannelConfig,
@@ -686,11 +689,6 @@ function registerWhatsAppHandlers(mainWindow: BrowserWindow): void {
  * Provider-related IPC handlers
  */
 function registerProviderHandlers(): void {
-  // Check if encryption is available
-  ipcMain.handle('provider:encryptionAvailable', () => {
-    return isEncryptionAvailable();
-  });
-
   // Get all providers with key info
   ipcMain.handle('provider:list', async () => {
     return await getAllProvidersWithKeyInfo();
@@ -719,13 +717,6 @@ function registerProviderHandlers(): void {
         }
       }
 
-      // Set the default model in OpenClaw config based on provider type
-      try {
-        setOpenClawDefaultModel(config.type);
-      } catch (err) {
-        console.warn('Failed to set OpenClaw default model:', err);
-      }
-
       return { success: true };
     } catch (error) {
       return { success: false, error: String(error) };
@@ -735,7 +726,18 @@ function registerProviderHandlers(): void {
   // Delete a provider
   ipcMain.handle('provider:delete', async (_, providerId: string) => {
     try {
+      const existing = await getProvider(providerId);
       await deleteProvider(providerId);
+
+      // Best-effort cleanup in OpenClaw auth profiles
+      if (existing?.type) {
+        try {
+          removeProviderKeyFromOpenClaw(existing.type);
+        } catch (err) {
+          console.warn('Failed to remove key from OpenClaw auth-profiles:', err);
+        }
+      }
+
       return { success: true };
     } catch (error) {
       return { success: false, error: String(error) };
@@ -763,10 +765,78 @@ function registerProviderHandlers(): void {
     }
   });
 
+  // Atomically update provider config and API key
+  ipcMain.handle(
+    'provider:updateWithKey',
+    async (
+      _,
+      providerId: string,
+      updates: Partial<ProviderConfig>,
+      apiKey?: string
+    ) => {
+      const existing = await getProvider(providerId);
+      if (!existing) {
+        return { success: false, error: 'Provider not found' };
+      }
+
+      const previousKey = await getApiKey(providerId);
+      const previousProviderType = existing.type;
+
+      try {
+        const nextConfig: ProviderConfig = {
+          ...existing,
+          ...updates,
+          updatedAt: new Date().toISOString(),
+        };
+
+        await saveProvider(nextConfig);
+
+        if (apiKey !== undefined) {
+          const trimmedKey = apiKey.trim();
+          if (trimmedKey) {
+            await storeApiKey(providerId, trimmedKey);
+            saveProviderKeyToOpenClaw(nextConfig.type, trimmedKey);
+          } else {
+            await deleteApiKey(providerId);
+            removeProviderKeyFromOpenClaw(nextConfig.type);
+          }
+        }
+
+        return { success: true };
+      } catch (error) {
+        // Best-effort rollback to keep config/key consistent.
+        try {
+          await saveProvider(existing);
+          if (previousKey) {
+            await storeApiKey(providerId, previousKey);
+            saveProviderKeyToOpenClaw(previousProviderType, previousKey);
+          } else {
+            await deleteApiKey(providerId);
+            removeProviderKeyFromOpenClaw(previousProviderType);
+          }
+        } catch (rollbackError) {
+          console.warn('Failed to rollback provider updateWithKey:', rollbackError);
+        }
+
+        return { success: false, error: String(error) };
+      }
+    }
+  );
+
   // Delete API key for a provider
   ipcMain.handle('provider:deleteApiKey', async (_, providerId: string) => {
     try {
       await deleteApiKey(providerId);
+
+      // Keep OpenClaw auth-profiles.json in sync with local key storage
+      const provider = await getProvider(providerId);
+      const providerType = provider?.type || providerId;
+      try {
+        removeProviderKeyFromOpenClaw(providerType);
+      } catch (err) {
+        console.warn('Failed to remove key from OpenClaw auth-profiles:', err);
+      }
+
       return { success: true };
     } catch (error) {
       return { success: false, error: String(error) };
@@ -783,10 +853,42 @@ function registerProviderHandlers(): void {
     return await getApiKey(providerId);
   });
 
-  // Set default provider
+  // Set default provider and update OpenClaw default model
   ipcMain.handle('provider:setDefault', async (_, providerId: string) => {
     try {
       await setDefaultProvider(providerId);
+
+      // Update OpenClaw config to use this provider's default model
+      const provider = await getProvider(providerId);
+      if (provider) {
+        try {
+          // If the provider has a user-specified model (e.g. siliconflow),
+          // build the full model string: "providerType/modelId"
+          const modelOverride = provider.model
+            ? `${provider.type}/${provider.model}`
+            : undefined;
+
+          if (provider.type === 'custom' || provider.type === 'ollama') {
+            // For runtime-configured providers, use user-entered base URL/api.
+            setOpenClawDefaultModelWithOverride(provider.type, modelOverride, {
+              baseUrl: provider.baseUrl,
+              api: 'openai-completions',
+            });
+          } else {
+            setOpenClawDefaultModel(provider.type, modelOverride);
+          }
+
+          // Keep auth-profiles in sync with the default provider instance.
+          // This is especially important when multiple custom providers exist.
+          const providerKey = await getApiKey(providerId);
+          if (providerKey) {
+            saveProviderKeyToOpenClaw(provider.type, providerKey);
+          }
+        } catch (err) {
+          console.warn('Failed to set OpenClaw default model:', err);
+        }
+      }
+
       return { success: true };
     } catch (error) {
       return { success: false, error: String(error) };
@@ -809,7 +911,7 @@ function registerProviderHandlers(): void {
       // This allows validation during setup when provider hasn't been saved yet
       const providerType = provider?.type || providerId;
 
-      console.log(`Validating API key for provider type: ${providerType}`);
+      console.log(`[clawx-validate] validating provider type: ${providerType}`);
       return await validateApiKeyWithProvider(providerType, apiKey);
     } catch (error) {
       console.error('Validation error:', error);
@@ -819,8 +921,8 @@ function registerProviderHandlers(): void {
 }
 
 /**
- * Validate API key by making a real chat completion API call to the provider
+ * Validate API key using lightweight model-listing endpoints (zero token cost).
- * This sends a minimal "hi" message to verify the key works
+ * Falls back to accepting the key for unknown/custom provider types.
  */
 async function validateApiKeyWithProvider(
   providerType: string,
@@ -841,11 +943,16 @@ async function validateApiKeyWithProvider(
         return await validateGoogleKey(trimmedKey);
       case 'openrouter':
         return await validateOpenRouterKey(trimmedKey);
+      case 'moonshot':
+        return await validateMoonshotKey(trimmedKey);
+      case 'siliconflow':
+        return await validateSiliconFlowKey(trimmedKey);
       case 'ollama':
         // Ollama doesn't require API key validation
         return { valid: true };
       default:
         // For custom providers, just check the key is not empty
+        console.log(`[clawx-validate] ${providerType} uses local non-empty validation only`);
         return { valid: true };
     }
   } catch (error) {
@@ -854,265 +961,169 @@ async function validateApiKeyWithProvider(
   }
 }
 
-/**
+function logValidationStatus(provider: string, status: number): void {
- * Parse error message from API response
+  console.log(`[clawx-validate] ${provider} HTTP ${status}`);
- */
+}
-function parseApiError(data: unknown): string {
-  if (!data || typeof data !== 'object') return 'Unknown error';
 
-  // Anthropic format: { error: { message: "..." } }
+function maskSecret(secret: string): string {
-  // OpenAI format: { error: { message: "..." } }
+  if (!secret) return '';
-  // Google format: { error: { message: "..." } }
+  if (secret.length <= 8) return `${secret.slice(0, 2)}***`;
-  const obj = data as { error?: { message?: string; type?: string }; message?: string };
+  return `${secret.slice(0, 4)}***${secret.slice(-4)}`;
+}
 
-  if (obj.error?.message) return obj.error.message;
+function sanitizeValidationUrl(rawUrl: string): string {
-  if (obj.message) return obj.message;
+  try {
+    const url = new URL(rawUrl);
+    const key = url.searchParams.get('key');
+    if (key) url.searchParams.set('key', maskSecret(key));
+    return url.toString();
+  } catch {
+    return rawUrl;
+  }
+}
 
-  return 'Unknown error';
+function sanitizeHeaders(headers: Record<string, string>): Record<string, string> {
+  const next = { ...headers };
+  if (next.Authorization?.startsWith('Bearer ')) {
+    const token = next.Authorization.slice('Bearer '.length);
+    next.Authorization = `Bearer ${maskSecret(token)}`;
+  }
+  if (next['x-api-key']) {
+    next['x-api-key'] = maskSecret(next['x-api-key']);
+  }
+  return next;
+}
+
+function logValidationRequest(
+  provider: string,
+  method: string,
+  url: string,
+  headers: Record<string, string>
+): void {
+  console.log(
+    `[clawx-validate] ${provider} request ${method} ${sanitizeValidationUrl(url)} headers=${JSON.stringify(sanitizeHeaders(headers))}`
+  );
 }
 
 /**
- * Validate Anthropic API key by making a minimal chat completion request
+ * Helper: classify an HTTP response as valid / invalid / error.
+ * 200 / 429 → valid (key works, possibly rate-limited).
+ * 401 / 403 → invalid.
+ * Everything else → return the API error message.
+ */
+function classifyAuthResponse(
+  status: number,
+  data: unknown
+): { valid: boolean; error?: string } {
+  if (status >= 200 && status < 300) return { valid: true };
+  if (status === 429) return { valid: true }; // rate-limited but key is valid
+  if (status === 401 || status === 403) return { valid: false, error: 'Invalid API key' };
+
+  // Try to extract an error message
+  const obj = data as { error?: { message?: string }; message?: string } | null;
+  const msg = obj?.error?.message || obj?.message || `API error: ${status}`;
+  return { valid: false, error: msg };
+}
+
+/**
+ * Validate Anthropic API key via GET /v1/models (zero cost)
  */
 async function validateAnthropicKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
   try {
-    const response = await fetch('https://api.anthropic.com/v1/messages', {
+    const url = 'https://api.anthropic.com/v1/models?limit=1';
-      method: 'POST',
+    const headers = {
-      headers: {
-        'Content-Type': 'application/json',
       'x-api-key': apiKey,
       'anthropic-version': '2023-06-01',
-      },
+    };
-      body: JSON.stringify({
+    logValidationRequest('anthropic', 'GET', url, headers);
-        model: 'claude-3-haiku-20240307',
+    const response = await fetch(url, { headers });
-        max_tokens: 1,
+    logValidationStatus('anthropic', response.status);
-        messages: [{ role: 'user', content: 'hi' }],
-      }),
-    });
-
     const data = await response.json().catch(() => ({}));
-
+    return classifyAuthResponse(response.status, data);
-    if (response.ok) {
-      return { valid: true };
-    }
-
-    // Authentication error
-    if (response.status === 401) {
-      return { valid: false, error: 'Invalid API key' };
-    }
-
-    // Permission error (invalid key format, etc.)
-    if (response.status === 403) {
-      return { valid: false, error: parseApiError(data) };
-    }
-
-    // Rate limit or overloaded - key is valid but service is busy
-    if (response.status === 429 || response.status === 529) {
-      return { valid: true };
-    }
-
-    // Model not found or bad request but auth passed - key is valid
-    if (response.status === 400 || response.status === 404) {
-      const errorType = (data as { error?: { type?: string } })?.error?.type;
-      if (errorType === 'authentication_error' || errorType === 'invalid_api_key') {
-        return { valid: false, error: 'Invalid API key' };
-      }
-      // Other errors like invalid_request_error mean the key is valid
-      return { valid: true };
-    }
-
-    return { valid: false, error: parseApiError(data) || `API error: ${response.status}` };
   } catch (error) {
     return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
   }
 }
 
 /**
- * Validate OpenAI API key by making a minimal chat completion request
+ * Validate OpenAI API key via GET /v1/models (zero cost)
  */
 async function validateOpenAIKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
   try {
-    const response = await fetch('https://api.openai.com/v1/chat/completions', {
+    const url = 'https://api.openai.com/v1/models?limit=1';
-      method: 'POST',
+    const headers = { Authorization: `Bearer ${apiKey}` };
-      headers: {
+    logValidationRequest('openai', 'GET', url, headers);
-        'Content-Type': 'application/json',
+    const response = await fetch(url, { headers });
-        'Authorization': `Bearer ${apiKey}`,
+    logValidationStatus('openai', response.status);
-      },
-      body: JSON.stringify({
-        model: 'gpt-4o-mini',
-        max_tokens: 1,
-        messages: [{ role: 'user', content: 'hi' }],
-      }),
-    });
-
     const data = await response.json().catch(() => ({}));
-
+    return classifyAuthResponse(response.status, data);
-    if (response.ok) {
-      return { valid: true };
-    }
-
-    // Authentication error
-    if (response.status === 401) {
-      return { valid: false, error: 'Invalid API key' };
-    }
-
-    // Rate limit - key is valid
-    if (response.status === 429) {
-      return { valid: true };
-    }
-
-    // Model not found or bad request but auth passed - key is valid
-    if (response.status === 400 || response.status === 404) {
-      const errorCode = (data as { error?: { code?: string } })?.error?.code;
-      if (errorCode === 'invalid_api_key') {
-        return { valid: false, error: 'Invalid API key' };
-      }
-      return { valid: true };
-    }
-
-    return { valid: false, error: parseApiError(data) || `API error: ${response.status}` };
   } catch (error) {
     return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
   }
 }
 
 /**
- * Validate Google (Gemini) API key by making a minimal generate content request
+ * Validate Google (Gemini) API key via GET /v1beta/models (zero cost)
  */
 async function validateGoogleKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
   try {
-    const response = await fetch(
+    const url = `https://generativelanguage.googleapis.com/v1beta/models?pageSize=1&key=${apiKey}`;
-      `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent?key=${apiKey}`,
+    logValidationRequest('google', 'GET', url, {});
-      {
+    const response = await fetch(url);
-        method: 'POST',
+    logValidationStatus('google', response.status);
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-          contents: [{ parts: [{ text: 'hi' }] }],
-          generationConfig: { maxOutputTokens: 1 },
-        }),
-      }
-    );
-
     const data = await response.json().catch(() => ({}));
-
+    return classifyAuthResponse(response.status, data);
-    if (response.ok) {
-      return { valid: true };
-    }
-
-    // Authentication error
-    if (response.status === 400 || response.status === 401 || response.status === 403) {
-      const errorStatus = (data as { error?: { status?: string } })?.error?.status;
-      if (errorStatus === 'UNAUTHENTICATED' || errorStatus === 'PERMISSION_DENIED') {
-        return { valid: false, error: 'Invalid API key' };
-      }
-      // Check if it's actually an auth error
-      const errorMessage = parseApiError(data).toLowerCase();
-      if (errorMessage.includes('api key') || errorMessage.includes('invalid') || errorMessage.includes('unauthorized')) {
-        return { valid: false, error: parseApiError(data) };
-      }
-      // Other errors mean key is valid
-      return { valid: true };
-    }
-
-    // Rate limit - key is valid
-    if (response.status === 429) {
-      return { valid: true };
-    }
-
-    return { valid: false, error: parseApiError(data) || `API error: ${response.status}` };
   } catch (error) {
     return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
   }
 }
 
 /**
- * Validate OpenRouter API key by making a minimal chat completion request
+ * Validate OpenRouter API key via GET /api/v1/models (zero cost)
  */
 async function validateOpenRouterKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
   try {
-    // Use a popular free model for validation
+    const url = 'https://openrouter.ai/api/v1/models';
-    const response = await fetch('https://openrouter.ai/api/v1/chat/completions', {
+    const headers = { Authorization: `Bearer ${apiKey}` };
-      method: 'POST',
+    logValidationRequest('openrouter', 'GET', url, headers);
-      headers: {
+    const response = await fetch(url, { headers });
-        'Content-Type': 'application/json',
+    logValidationStatus('openrouter', response.status);
-        'Authorization': `Bearer ${apiKey}`,
-        'HTTP-Referer': 'https://clawx.app',
-        'X-Title': 'ClawX',
-      },
-      body: JSON.stringify({
-        model: 'meta-llama/llama-3.2-3b-instruct:free',
-        max_tokens: 1,
-        messages: [{ role: 'user', content: 'hi' }],
-      }),
-    });
-
     const data = await response.json().catch(() => ({}));
-    console.log('OpenRouter validation response:', response.status, JSON.stringify(data));
+    return classifyAuthResponse(response.status, data);
-
+  } catch (error) {
-    // Helper to check if error message indicates auth failure
+    return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
-    const isAuthError = (d: unknown): boolean => {
-      const errorObj = (d as { error?: { message?: string; code?: number | string; type?: string } })?.error;
-      if (!errorObj) return false;
-
-      const message = (errorObj.message || '').toLowerCase();
-      const code = errorObj.code;
-      const type = (errorObj.type || '').toLowerCase();
-
-      // Check for explicit auth-related errors
-      if (code === 401 || code === '401' || code === 403 || code === '403') return true;
-      if (type.includes('auth') || type.includes('invalid')) return true;
-      if (message.includes('invalid api key') || message.includes('invalid key') ||
-        message.includes('unauthorized') || message.includes('authentication') ||
-        message.includes('invalid credentials') || message.includes('api key is not valid')) {
-        return true;
   }
-      return false;
-    };
-
-    if (response.ok) {
-      return { valid: true };
 }
 
-    // Always check for auth errors in the response body first
+/**
-    if (isAuthError(data)) {
+ * Validate Moonshot API key via GET /v1/models (zero cost)
-      // Return user-friendly message instead of raw API errors like "User not found."
+ */
-      return { valid: false, error: 'Invalid API key' };
+async function validateMoonshotKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
+  try {
+    const url = 'https://api.moonshot.cn/v1/models';
+    const headers = { Authorization: `Bearer ${apiKey}` };
+    logValidationRequest('moonshot', 'GET', url, headers);
+    const response = await fetch(url, { headers });
+    logValidationStatus('moonshot', response.status);
+    const data = await response.json().catch(() => ({}));
+    return classifyAuthResponse(response.status, data);
+  } catch (error) {
+    return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
+  }
 }
 
-    // Authentication error status codes - always return user-friendly message
+/**
-    if (response.status === 401 || response.status === 403) {
+ * Validate SiliconFlow API key via GET /v1/models (zero cost)
-      return { valid: false, error: 'Invalid API key' };
+ */
-    }
+async function validateSiliconFlowKey(apiKey: string): Promise<{ valid: boolean; error?: string }> {
-
+  try {
-    // Rate limit - key is valid
+    const url = 'https://api.siliconflow.com/v1/models';
-    if (response.status === 429) {
+    const headers = { Authorization: `Bearer ${apiKey}` };
-      return { valid: true };
+    logValidationRequest('siliconflow', 'GET', url, headers);
-    }
+    const response = await fetch(url, { headers });
-
+    logValidationStatus('siliconflow', response.status);
-    // Payment required or insufficient credits - key format is valid
+    const data = await response.json().catch(() => ({}));
-    if (response.status === 402) {
+    return classifyAuthResponse(response.status, data);
-      return { valid: true };
-    }
-
-    // For 400/404, we must be very careful - only consider valid if clearly not an auth issue
-    if (response.status === 400 || response.status === 404) {
-      // If we got here without detecting auth error, it might be a model issue
-      // But be conservative - require explicit success indication
-      const errorObj = (data as { error?: { message?: string; code?: number } })?.error;
-      const message = (errorObj?.message || '').toLowerCase();
-
-      // Only consider valid if the error is clearly about the model, not the key
-      if (message.includes('model') && !message.includes('key') && !message.includes('auth')) {
-        return { valid: true };
-      }
-
-      // Default to invalid for ambiguous 400/404 errors
-      return { valid: false, error: parseApiError(data) || 'Invalid API key or request' };
-    }
-
-    return { valid: false, error: parseApiError(data) || `API error: ${response.status}` };
   } catch (error) {
     return { valid: false, error: `Connection error: ${error instanceof Error ? error.message : String(error)}` };
   }

electron/preload/index.ts

@@ -64,12 +64,12 @@ const electronAPI = {
         'env:setApiKey',
         'env:deleteApiKey',
         // Provider
-        'provider:encryptionAvailable',
         'provider:list',
         'provider:get',
         'provider:save',
         'provider:delete',
         'provider:setApiKey',
+        'provider:updateWithKey',
         'provider:deleteApiKey',
         'provider:hasApiKey',
         'provider:getApiKey',

electron/utils/openclaw-auth.ts

@@ -6,6 +6,11 @@
 import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
 import { join } from 'path';
 import { homedir } from 'os';
+import {
+  getProviderEnvVar,
+  getProviderDefaultModel,
+  getProviderConfig,
+} from './provider-registry';
 
 const AUTH_STORE_VERSION = 1;
 const AUTH_PROFILE_FILENAME = 'auth-profiles.json';
@@ -29,21 +34,6 @@ interface AuthProfilesStore {
   lastGood?: Record<string, string>;
 }
 
-/**
- * Provider type to environment variable name mapping
- */
-const PROVIDER_ENV_VARS: Record<string, string> = {
-  anthropic: 'ANTHROPIC_API_KEY',
-  openai: 'OPENAI_API_KEY',
-  google: 'GEMINI_API_KEY',
-  openrouter: 'OPENROUTER_API_KEY',
-  groq: 'GROQ_API_KEY',
-  deepgram: 'DEEPGRAM_API_KEY',
-  cerebras: 'CEREBRAS_API_KEY',
-  xai: 'XAI_API_KEY',
-  mistral: 'MISTRAL_API_KEY',
-};
-
 /**
  * Get the path to the auth-profiles.json for a given agent
  */
@@ -139,10 +129,30 @@ export function saveProviderKeyToOpenClaw(
 }
 
 /**
- * Get the environment variable name for a provider type
+ * Remove a provider API key from OpenClaw auth-profiles.json
  */
-export function getProviderEnvVar(provider: string): string | undefined {
+export function removeProviderKeyFromOpenClaw(
-  return PROVIDER_ENV_VARS[provider];
+  provider: string,
+  agentId = 'main'
+): void {
+  const store = readAuthProfiles(agentId);
+  const profileId = `${provider}:default`;
+
+  delete store.profiles[profileId];
+
+  if (store.order?.[provider]) {
+    store.order[provider] = store.order[provider].filter((id) => id !== profileId);
+    if (store.order[provider].length === 0) {
+      delete store.order[provider];
+    }
+  }
+
+  if (store.lastGood?.[provider] === profileId) {
+    delete store.lastGood[provider];
+  }
+
+  writeAuthProfiles(store, agentId);
+  console.log(`Removed API key for provider "${provider}" from OpenClaw auth-profiles (agent: ${agentId})`);
 }
 
 /**
@@ -153,7 +163,7 @@ export function buildProviderEnvVars(providers: Array<{ type: string; apiKey: st
   const env: Record<string, string> = {};
   
   for (const { type, apiKey } of providers) {
-    const envVar = PROVIDER_ENV_VARS[type];
+    const envVar = getProviderEnvVar(type);
     if (envVar && apiKey) {
       env[envVar] = apiKey;
     }
@@ -162,46 +172,15 @@ export function buildProviderEnvVars(providers: Array<{ type: string; apiKey: st
   return env;
 }
 
-/**
- * Provider type to default model mapping
- * Used to set the gateway's default model when the user selects a provider
- */
-const PROVIDER_DEFAULT_MODELS: Record<string, string> = {
-  anthropic: 'anthropic/claude-opus-4-6',
-  openai: 'openai/gpt-5.2',
-  google: 'google/gemini-3-pro-preview',
-  openrouter: 'openrouter/anthropic/claude-opus-4.6',
-};
-
-/**
- * Provider configurations needed for model resolution.
- * OpenClaw resolves models by checking cfg.models.providers[provider].
- * Without this, any model for the provider returns "Unknown model".
- */
-const PROVIDER_CONFIGS: Record<string, { baseUrl: string; api: string; apiKeyEnv: string }> = {
-  openrouter: {
-    baseUrl: 'https://openrouter.ai/api/v1',
-    api: 'openai-completions',
-    apiKeyEnv: 'OPENROUTER_API_KEY',
-  },
-  openai: {
-    baseUrl: 'https://api.openai.com/v1',
-    api: 'openai-responses',
-    apiKeyEnv: 'OPENAI_API_KEY',
-  },
-  google: {
-    baseUrl: 'https://generativelanguage.googleapis.com/v1beta',
-    api: 'google',
-    apiKeyEnv: 'GEMINI_API_KEY',
-  },
-  // anthropic is built-in to OpenClaw's model registry, no provider config needed
-};
-
 /**
  * Update the OpenClaw config to use the given provider and model
  * Writes to ~/.openclaw/openclaw.json
+ *
+ * @param provider - Provider type (e.g. 'anthropic', 'siliconflow')
+ * @param modelOverride - Optional model string to use instead of the registry default.
+ *   For siliconflow this is the user-supplied model ID prefixed with "siliconflow/".
  */
-export function setOpenClawDefaultModel(provider: string): void {
+export function setOpenClawDefaultModel(provider: string, modelOverride?: string): void {
   const configPath = join(homedir(), '.openclaw', 'openclaw.json');
   
   let config: Record<string, unknown> = {};
@@ -214,12 +193,16 @@ export function setOpenClawDefaultModel(provider: string): void {
     console.warn('Failed to read openclaw.json, creating fresh config:', err);
   }
   
-  const model = PROVIDER_DEFAULT_MODELS[provider];
+  const model = modelOverride || getProviderDefaultModel(provider);
   if (!model) {
     console.warn(`No default model mapping for provider "${provider}"`);
     return;
   }
 
+  const modelId = model.startsWith(`${provider}/`)
+    ? model.slice(provider.length + 1)
+    : model;
+  
   // Set the default model for the agents
   // model must be an object: { primary: "provider/model", fallbacks?: [] }
   const agents = (config.agents || {}) as Record<string, unknown>;
@@ -228,24 +211,44 @@ export function setOpenClawDefaultModel(provider: string): void {
   agents.defaults = defaults;
   config.agents = agents;
   
-  // Configure models.providers for providers that need explicit registration
+  // Configure models.providers for providers that need explicit registration.
-  // Without this, OpenClaw returns "Unknown model" because it can't resolve
+  // For built-in providers this comes from registry; for custom/ollama-like
-  // the provider's baseUrl and API type
+  // providers callers can supply runtime overrides.
-  const providerCfg = PROVIDER_CONFIGS[provider];
+  const providerCfg = getProviderConfig(provider);
   if (providerCfg) {
     const models = (config.models || {}) as Record<string, unknown>;
     const providers = (models.providers || {}) as Record<string, unknown>;
 
-    // Only set if not already configured
+    const existingProvider =
-    if (!providers[provider]) {
+      providers[provider] && typeof providers[provider] === 'object'
+        ? (providers[provider] as Record<string, unknown>)
+        : {};
+
+    const existingModels = Array.isArray(existingProvider.models)
+      ? (existingProvider.models as Array<Record<string, unknown>>)
+      : [];
+    const registryModels = (providerCfg.models ?? []).map((m) => ({ ...m })) as Array<Record<string, unknown>>;
+
+    // Merge model entries by id and ensure the selected/default model id exists.
+    const mergedModels = [...registryModels];
+    for (const item of existingModels) {
+      const id = typeof item?.id === 'string' ? item.id : '';
+      if (id && !mergedModels.some((m) => m.id === id)) {
+        mergedModels.push(item);
+      }
+    }
+    if (modelId && !mergedModels.some((m) => m.id === modelId)) {
+      mergedModels.push({ id: modelId, name: modelId });
+    }
+
     providers[provider] = {
+      ...existingProvider,
       baseUrl: providerCfg.baseUrl,
       api: providerCfg.api,
       apiKey: providerCfg.apiKeyEnv,
-        models: [],
+      models: mergedModels,
     };
-      console.log(`Configured models.providers.${provider} with baseUrl=${providerCfg.baseUrl}`);
+    console.log(`Configured models.providers.${provider} with baseUrl=${providerCfg.baseUrl}, model=${modelId}`);
-    }
     
     models.providers = providers;
     config.models = models;
@@ -267,3 +270,98 @@ export function setOpenClawDefaultModel(provider: string): void {
   writeFileSync(configPath, JSON.stringify(config, null, 2), 'utf-8');
   console.log(`Set OpenClaw default model to "${model}" for provider "${provider}"`);
 }
+
+interface RuntimeProviderConfigOverride {
+  baseUrl?: string;
+  api?: string;
+  apiKeyEnv?: string;
+}
+
+/**
+ * Update OpenClaw model + provider config using runtime config values.
+ * Useful for user-configurable providers (custom/ollama-like) where
+ * baseUrl/model are not in the static registry.
+ */
+export function setOpenClawDefaultModelWithOverride(
+  provider: string,
+  modelOverride: string | undefined,
+  override: RuntimeProviderConfigOverride
+): void {
+  const configPath = join(homedir(), '.openclaw', 'openclaw.json');
+
+  let config: Record<string, unknown> = {};
+  try {
+    if (existsSync(configPath)) {
+      config = JSON.parse(readFileSync(configPath, 'utf-8'));
+    }
+  } catch (err) {
+    console.warn('Failed to read openclaw.json, creating fresh config:', err);
+  }
+
+  const model = modelOverride || getProviderDefaultModel(provider);
+  if (!model) {
+    console.warn(`No default model mapping for provider "${provider}"`);
+    return;
+  }
+
+  const modelId = model.startsWith(`${provider}/`)
+    ? model.slice(provider.length + 1)
+    : model;
+
+  const agents = (config.agents || {}) as Record<string, unknown>;
+  const defaults = (agents.defaults || {}) as Record<string, unknown>;
+  defaults.model = { primary: model };
+  agents.defaults = defaults;
+  config.agents = agents;
+
+  if (override.baseUrl && override.api) {
+    const models = (config.models || {}) as Record<string, unknown>;
+    const providers = (models.providers || {}) as Record<string, unknown>;
+
+    const existingProvider =
+      providers[provider] && typeof providers[provider] === 'object'
+        ? (providers[provider] as Record<string, unknown>)
+        : {};
+
+    const existingModels = Array.isArray(existingProvider.models)
+      ? (existingProvider.models as Array<Record<string, unknown>>)
+      : [];
+    const mergedModels = [...existingModels];
+    if (modelId && !mergedModels.some((m) => m.id === modelId)) {
+      mergedModels.push({ id: modelId, name: modelId });
+    }
+
+    const nextProvider: Record<string, unknown> = {
+      ...existingProvider,
+      baseUrl: override.baseUrl,
+      api: override.api,
+      models: mergedModels,
+    };
+    if (override.apiKeyEnv) {
+      nextProvider.apiKey = override.apiKeyEnv;
+    }
+
+    providers[provider] = nextProvider;
+    models.providers = providers;
+    config.models = models;
+  }
+
+  const gateway = (config.gateway || {}) as Record<string, unknown>;
+  if (!gateway.mode) {
+    gateway.mode = 'local';
+  }
+  config.gateway = gateway;
+
+  const dir = join(configPath, '..');
+  if (!existsSync(dir)) {
+    mkdirSync(dir, { recursive: true });
+  }
+
+  writeFileSync(configPath, JSON.stringify(config, null, 2), 'utf-8');
+  console.log(
+    `Set OpenClaw default model to "${model}" for provider "${provider}" (runtime override)`
+  );
+}
+
+// Re-export for backwards compatibility
+export { getProviderEnvVar } from './provider-registry';

electron/utils/provider-registry.ts

@@ -0,0 +1,133 @@
+/**
+ * Provider Registry — single source of truth for backend provider metadata.
+ * Centralizes env var mappings, default models, and OpenClaw provider configs.
+ *
+ * NOTE: When adding a new provider type, also update src/lib/providers.ts
+ */
+
+export const BUILTIN_PROVIDER_TYPES = [
+  'anthropic',
+  'openai',
+  'google',
+  'openrouter',
+  'moonshot',
+  'siliconflow',
+  'ollama',
+] as const;
+export type BuiltinProviderType = (typeof BUILTIN_PROVIDER_TYPES)[number];
+export type ProviderType = BuiltinProviderType | 'custom';
+
+interface ProviderModelEntry extends Record<string, unknown> {
+  id: string;
+  name: string;
+}
+
+
+interface ProviderBackendMeta {
+  envVar?: string;
+  defaultModel?: string;
+  /** OpenClaw models.providers config (omit for built-in providers like anthropic) */
+  providerConfig?: {
+    baseUrl: string;
+    api: string;
+    apiKeyEnv: string;
+    models?: ProviderModelEntry[];
+  };
+}
+
+const REGISTRY: Record<string, ProviderBackendMeta> = {
+  anthropic: {
+    envVar: 'ANTHROPIC_API_KEY',
+    defaultModel: 'anthropic/claude-opus-4-6',
+    // anthropic is built-in to OpenClaw's model registry, no provider config needed
+  },
+  openai: {
+    envVar: 'OPENAI_API_KEY',
+    defaultModel: 'openai/gpt-5.2',
+    providerConfig: {
+      baseUrl: 'https://api.openai.com/v1',
+      api: 'openai-responses',
+      apiKeyEnv: 'OPENAI_API_KEY',
+    },
+  },
+  google: {
+    envVar: 'GEMINI_API_KEY',
+    defaultModel: 'google/gemini-3-pro-preview',
+    providerConfig: {
+      baseUrl: 'https://generativelanguage.googleapis.com/v1beta',
+      api: 'google',
+      apiKeyEnv: 'GEMINI_API_KEY',
+    },
+  },
+  openrouter: {
+    envVar: 'OPENROUTER_API_KEY',
+    defaultModel: 'openrouter/anthropic/claude-opus-4.6',
+    providerConfig: {
+      baseUrl: 'https://openrouter.ai/api/v1',
+      api: 'openai-completions',
+      apiKeyEnv: 'OPENROUTER_API_KEY',
+    },
+  },
+  moonshot: {
+    envVar: 'MOONSHOT_API_KEY',
+    defaultModel: 'moonshot/kimi-k2.5',
+    providerConfig: {
+      baseUrl: 'https://api.moonshot.cn/v1',
+      api: 'openai-completions',
+      apiKeyEnv: 'MOONSHOT_API_KEY',
+      models: [
+        {
+          id: 'kimi-k2.5',
+          name: 'Kimi K2.5',
+          reasoning: false,
+          input: ['text'],
+          cost: { input: 0, output: 0, cacheRead: 0, cacheWrite: 0 },
+          contextWindow: 256000,
+          maxTokens: 8192,
+        },
+      ],
+    },
+  },
+  siliconflow: {
+    envVar: 'SILICONFLOW_API_KEY',
+    defaultModel: 'siliconflow/deepseek-ai/DeepSeek-V3',
+    providerConfig: {
+      baseUrl: 'https://api.siliconflow.com/v1',
+      api: 'openai-completions',
+      apiKeyEnv: 'SILICONFLOW_API_KEY',
+    },
+  },
+  // Additional providers with env var mappings but no default model
+  groq: { envVar: 'GROQ_API_KEY' },
+  deepgram: { envVar: 'DEEPGRAM_API_KEY' },
+  cerebras: { envVar: 'CEREBRAS_API_KEY' },
+  xai: { envVar: 'XAI_API_KEY' },
+  mistral: { envVar: 'MISTRAL_API_KEY' },
+};
+
+/** Get the environment variable name for a provider type */
+export function getProviderEnvVar(type: string): string | undefined {
+  return REGISTRY[type]?.envVar;
+}
+
+/** Get the default model string for a provider type */
+export function getProviderDefaultModel(type: string): string | undefined {
+  return REGISTRY[type]?.defaultModel;
+}
+
+/** Get the OpenClaw provider config (baseUrl, api, apiKeyEnv, models) */
+export function getProviderConfig(
+  type: string
+): { baseUrl: string; api: string; apiKeyEnv: string; models?: ProviderModelEntry[] } | undefined {
+  return REGISTRY[type]?.providerConfig;
+}
+
+/**
+ * All provider types that have env var mappings.
+ * Used by GatewayManager to inject API keys as env vars.
+ */
+export function getKeyableProviderTypes(): string[] {
+  return Object.entries(REGISTRY)
+    .filter(([, meta]) => meta.envVar)
+    .map(([type]) => type);
+}

electron/utils/secure-storage.ts

@@ -1,35 +1,22 @@
 /**
- * Secure Storage Utility
+ * Provider Storage
- * Uses Electron's safeStorage for encrypting sensitive data like API keys
+ * Manages provider configurations and API keys.
+ * Keys are stored in plain text alongside provider configs in a single electron-store.
  */
-import { safeStorage } from 'electron';
 
 // Lazy-load electron-store (ESM module)
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-let store: any = null;
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 let providerStore: any = null;
 
-async function getStore() {
-  if (!store) {
-    const Store = (await import('electron-store')).default;
-    store = new Store({
-      name: 'clawx-secure',
-      defaults: {
-        encryptedKeys: {},
-      },
-    });
-  }
-  return store;
-}
-
 async function getProviderStore() {
   if (!providerStore) {
     const Store = (await import('electron-store')).default;
     providerStore = new Store({
       name: 'clawx-providers',
       defaults: {
-        providers: {},
+        providers: {} as Record<string, ProviderConfig>,
+        apiKeys: {} as Record<string, string>,
+        defaultProvider: null as string | null,
       },
     });
   }
@@ -42,7 +29,7 @@ async function getProviderStore() {
 export interface ProviderConfig {
   id: string;
   name: string;
-  type: 'anthropic' | 'openai' | 'google' | 'openrouter' | 'ollama' | 'custom';
+  type: 'anthropic' | 'openai' | 'google' | 'openrouter' | 'moonshot' | 'siliconflow' | 'ollama' | 'custom';
   baseUrl?: string;
   model?: string;
   enabled: boolean;
@@ -50,35 +37,17 @@ export interface ProviderConfig {
   updatedAt: string;
 }
 
-/**
+// ==================== API Key Storage ====================
- * Check if encryption is available
- */
-export function isEncryptionAvailable(): boolean {
-  return safeStorage.isEncryptionAvailable();
-}
 
 /**
- * Store an API key securely
+ * Store an API key
  */
 export async function storeApiKey(providerId: string, apiKey: string): Promise<boolean> {
   try {
-    const s = await getStore();
+    const s = await getProviderStore();
-    
+    const keys = (s.get('apiKeys') || {}) as Record<string, string>;
-    if (!safeStorage.isEncryptionAvailable()) {
+    keys[providerId] = apiKey;
-      console.warn('Encryption not available, storing key in plain text');
+    s.set('apiKeys', keys);
-      // Fallback to plain storage (not recommended for production)
-      const keys = s.get('encryptedKeys') as Record<string, string>;
-      keys[providerId] = Buffer.from(apiKey).toString('base64');
-      s.set('encryptedKeys', keys);
-      return true;
-    }
-    
-    // Encrypt the API key
-    const encrypted = safeStorage.encryptString(apiKey);
-    const keys = s.get('encryptedKeys') as Record<string, string>;
-    keys[providerId] = encrypted.toString('base64');
-    s.set('encryptedKeys', keys);
-    
     return true;
   } catch (error) {
     console.error('Failed to store API key:', error);
@@ -91,22 +60,9 @@ export async function storeApiKey(providerId: string, apiKey: string): Promise<b
  */
 export async function getApiKey(providerId: string): Promise<string | null> {
   try {
-    const s = await getStore();
+    const s = await getProviderStore();
-    const keys = s.get('encryptedKeys') as Record<string, string>;
+    const keys = (s.get('apiKeys') || {}) as Record<string, string>;
-    const encryptedBase64 = keys[providerId];
+    return keys[providerId] || null;
-    
-    if (!encryptedBase64) {
-      return null;
-    }
-    
-    if (!safeStorage.isEncryptionAvailable()) {
-      // Fallback for plain storage
-      return Buffer.from(encryptedBase64, 'base64').toString('utf-8');
-    }
-    
-    // Decrypt the API key
-    const encrypted = Buffer.from(encryptedBase64, 'base64');
-    return safeStorage.decryptString(encrypted);
   } catch (error) {
     console.error('Failed to retrieve API key:', error);
     return null;
@@ -118,10 +74,10 @@ export async function getApiKey(providerId: string): Promise<string | null> {
  */
 export async function deleteApiKey(providerId: string): Promise<boolean> {
   try {
-    const s = await getStore();
+    const s = await getProviderStore();
-    const keys = s.get('encryptedKeys') as Record<string, string>;
+    const keys = (s.get('apiKeys') || {}) as Record<string, string>;
     delete keys[providerId];
-    s.set('encryptedKeys', keys);
+    s.set('apiKeys', keys);
     return true;
   } catch (error) {
     console.error('Failed to delete API key:', error);
@@ -133,8 +89,8 @@ export async function deleteApiKey(providerId: string): Promise<boolean> {
  * Check if an API key exists for a provider
  */
 export async function hasApiKey(providerId: string): Promise<boolean> {
-  const s = await getStore();
+  const s = await getProviderStore();
-  const keys = s.get('encryptedKeys') as Record<string, string>;
+  const keys = (s.get('apiKeys') || {}) as Record<string, string>;
   return providerId in keys;
 }
 
@@ -142,8 +98,8 @@ export async function hasApiKey(providerId: string): Promise<boolean> {
  * List all provider IDs that have stored keys
  */
 export async function listStoredKeyIds(): Promise<string[]> {
-  const s = await getStore();
+  const s = await getProviderStore();
-  const keys = s.get('encryptedKeys') as Record<string, string>;
+  const keys = (s.get('apiKeys') || {}) as Record<string, string>;
   return Object.keys(keys);
 }
 
@@ -178,11 +134,11 @@ export async function getAllProviders(): Promise<ProviderConfig[]> {
 }
 
 /**
- * Delete a provider configuration
+ * Delete a provider configuration and its API key
  */
 export async function deleteProvider(providerId: string): Promise<boolean> {
   try {
-    // Delete the API key first
+    // Delete the API key
     await deleteApiKey(providerId);
 
     // Delete the provider config
@@ -222,7 +178,9 @@ export async function getDefaultProvider(): Promise<string | undefined> {
 /**
  * Get provider with masked key info (for UI display)
  */
-export async function getProviderWithKeyInfo(providerId: string): Promise<(ProviderConfig & { hasKey: boolean; keyMasked: string | null }) | null> {
+export async function getProviderWithKeyInfo(
+  providerId: string
+): Promise<(ProviderConfig & { hasKey: boolean; keyMasked: string | null }) | null> {
   const provider = await getProvider(providerId);
   if (!provider) return null;
 
@@ -230,7 +188,6 @@ export async function getProviderWithKeyInfo(providerId: string): Promise<(Provi
   let keyMasked: string | null = null;
 
   if (apiKey) {
-    // Show first 4 and last 4 characters
     if (apiKey.length > 12) {
       keyMasked = `${apiKey.substring(0, 4)}${'*'.repeat(apiKey.length - 8)}${apiKey.substring(apiKey.length - 4)}`;
     } else {
@@ -248,7 +205,9 @@ export async function getProviderWithKeyInfo(providerId: string): Promise<(Provi
 /**
  * Get all providers with key info (for UI display)
  */
-export async function getAllProvidersWithKeyInfo(): Promise<Array<ProviderConfig & { hasKey: boolean; keyMasked: string | null }>> {
+export async function getAllProvidersWithKeyInfo(): Promise<
+  Array<ProviderConfig & { hasKey: boolean; keyMasked: string | null }>
+> {
   const providers = await getAllProviders();
   const results: Array<ProviderConfig & { hasKey: boolean; keyMasked: string | null }> = [];
 

src/components/settings/ProvidersSettings.tsx

@@ -22,20 +22,14 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
 import { Badge } from '@/components/ui/badge';
 import { Separator } from '@/components/ui/separator';
 import { Switch } from '@/components/ui/switch';
-import { useProviderStore, type ProviderWithKeyInfo } from '@/stores/providers';
+import { useProviderStore, type ProviderConfig, type ProviderWithKeyInfo } from '@/stores/providers';
+import {
+  PROVIDER_TYPE_INFO,
+  type ProviderType,
+} from '@/lib/providers';
 import { cn } from '@/lib/utils';
 import { toast } from 'sonner';
 
-// Provider type definitions
-const providerTypes = [
-  { id: 'anthropic', name: 'Anthropic', icon: '🤖', placeholder: 'sk-ant-api03-...' },
-  { id: 'openai', name: 'OpenAI', icon: '💚', placeholder: 'sk-proj-...' },
-  { id: 'google', name: 'Google', icon: '🔷', placeholder: 'AIza...' },
-  { id: 'openrouter', name: 'OpenRouter', icon: '🌐', placeholder: 'sk-or-v1-...' },
-  { id: 'ollama', name: 'Ollama', icon: '🦙', placeholder: 'Not required' },
-  { id: 'custom', name: 'Custom', icon: '⚙️', placeholder: 'API key...' },
-];
-
 export function ProvidersSettings() {
   const { 
     providers, 
@@ -45,7 +39,7 @@ export function ProvidersSettings() {
     addProvider,
     updateProvider,
     deleteProvider,
-    setApiKey,
+    updateProviderWithKey,
     setDefaultProvider,
     validateApiKey,
   } = useProviderStore();
@@ -58,14 +52,32 @@ export function ProvidersSettings() {
     fetchProviders();
   }, [fetchProviders]);
   
-  const handleAddProvider = async (type: string, name: string, apiKey: string) => {
+  const handleAddProvider = async (
+    type: ProviderType,
+    name: string,
+    apiKey: string,
+    options?: { baseUrl?: string; model?: string }
+  ) => {
+    // Only custom supports multiple instances.
+    // Built-in providers remain singleton by type.
+    const id = type === 'custom' ? `custom-${crypto.randomUUID()}` : type;
     try {
-      await addProvider({
+      await addProvider(
-        id: `${type}-${Date.now()}`,
+        {
-        type: type as 'anthropic' | 'openai' | 'google' | 'ollama' | 'custom',
+          id,
+          type,
           name,
+          baseUrl: options?.baseUrl,
+          model: options?.model,
           enabled: true,
-      }, apiKey || undefined);
+        },
+        apiKey.trim() || undefined
+      );
+
+      // Auto-set as default if this is the first provider
+      if (providers.length === 0) {
+        await setDefaultProvider(id);
+      }
 
       setShowAddDialog(false);
       toast.success('Provider added successfully');
@@ -140,8 +152,12 @@ export function ProvidersSettings() {
               onDelete={() => handleDeleteProvider(provider.id)}
               onSetDefault={() => handleSetDefault(provider.id)}
               onToggleEnabled={() => handleToggleEnabled(provider)}
-              onUpdateKey={async (key) => {
+              onSaveEdits={async (payload) => {
-                await setApiKey(provider.id, key);
+                await updateProviderWithKey(
+                  provider.id,
+                  payload.updates || {},
+                  payload.newApiKey
+                );
                 setEditingProvider(null);
               }}
               onValidateKey={(key) => validateApiKey(provider.id, key)}
@@ -153,8 +169,10 @@ export function ProvidersSettings() {
       {/* Add Provider Dialog */}
       {showAddDialog && (
         <AddProviderDialog
+          existingTypes={new Set(providers.map((p) => p.type))}
           onClose={() => setShowAddDialog(false)}
           onAdd={handleAddProvider}
+          onValidateKey={(type, key) => validateApiKey(type, key)}
         />
       )}
     </div>
@@ -170,7 +188,7 @@ interface ProviderCardProps {
   onDelete: () => void;
   onSetDefault: () => void;
   onToggleEnabled: () => void;
-  onUpdateKey: (key: string) => Promise<void>;
+  onSaveEdits: (payload: { newApiKey?: string; updates?: Partial<ProviderConfig> }) => Promise<void>;
   onValidateKey: (key: string) => Promise<{ valid: boolean; error?: string }>;
 }
 
@@ -198,37 +216,78 @@ function ProviderCard({
   onDelete,
   onSetDefault,
   onToggleEnabled,
-  onUpdateKey,
+  onSaveEdits,
   onValidateKey,
 }: ProviderCardProps) {
   const [newKey, setNewKey] = useState('');
+  const [baseUrl, setBaseUrl] = useState(provider.baseUrl || '');
+  const [modelId, setModelId] = useState(provider.model || '');
   const [showKey, setShowKey] = useState(false);
   const [validating, setValidating] = useState(false);
   const [saving, setSaving] = useState(false);
   
-  const typeInfo = providerTypes.find((t) => t.id === provider.type);
+  const typeInfo = PROVIDER_TYPE_INFO.find((t) => t.id === provider.type);
+  const canEditConfig = Boolean(typeInfo?.showBaseUrl || typeInfo?.showModelId);
 
-  const handleSaveKey = async () => {
+  useEffect(() => {
-    if (!newKey) return;
+    if (isEditing) {
+      setNewKey('');
+      setShowKey(false);
+      setBaseUrl(provider.baseUrl || '');
+      setModelId(provider.model || '');
+    }
+  }, [isEditing, provider.baseUrl, provider.model]);
   
+  const handleSaveEdits = async () => {
+    setSaving(true);
+    try {
+      const payload: { newApiKey?: string; updates?: Partial<ProviderConfig> } = {};
+
+      if (newKey.trim()) {
         setValidating(true);
         const result = await onValidateKey(newKey);
         setValidating(false);
-    
         if (!result.valid) {
           toast.error(result.error || 'Invalid API key');
+          setSaving(false);
+          return;
+        }
+        payload.newApiKey = newKey.trim();
+      }
+
+      if (canEditConfig) {
+        if (typeInfo?.showModelId && !modelId.trim()) {
+          toast.error('Model ID is required');
+          setSaving(false);
           return;
         }
 
-    setSaving(true);
+        const updates: Partial<ProviderConfig> = {};
-    try {
+        if ((baseUrl.trim() || undefined) !== (provider.baseUrl || undefined)) {
-      await onUpdateKey(newKey);
+          updates.baseUrl = baseUrl.trim() || undefined;
+        }
+        if ((modelId.trim() || undefined) !== (provider.model || undefined)) {
+          updates.model = modelId.trim() || undefined;
+        }
+        if (Object.keys(updates).length > 0) {
+          payload.updates = updates;
+        }
+      }
+
+      if (!payload.newApiKey && !payload.updates) {
+        onCancelEdit();
+        setSaving(false);
+        return;
+      }
+
+      await onSaveEdits(payload);
       setNewKey('');
-      toast.success('API key updated');
+      toast.success('Provider updated');
     } catch (error) {
-      toast.error(`Failed to save key: ${error}`);
+      toast.error(`Failed to save provider: ${error}`);
     } finally {
       setSaving(false);
+      setValidating(false);
     }
   };
   
@@ -258,11 +317,37 @@ function ProviderCard({
         {/* Key row */}
         {isEditing ? (
           <div className="space-y-2">
+            {canEditConfig && (
+              <>
+                {typeInfo?.showBaseUrl && (
+                  <div className="space-y-1">
+                    <Label className="text-xs">Base URL</Label>
+                    <Input
+                      value={baseUrl}
+                      onChange={(e) => setBaseUrl(e.target.value)}
+                      placeholder="https://api.example.com/v1"
+                      className="h-9 text-sm"
+                    />
+                  </div>
+                )}
+                {typeInfo?.showModelId && (
+                  <div className="space-y-1">
+                    <Label className="text-xs">Model ID</Label>
+                    <Input
+                      value={modelId}
+                      onChange={(e) => setModelId(e.target.value)}
+                      placeholder={typeInfo.modelIdPlaceholder || 'provider/model-id'}
+                      className="h-9 text-sm"
+                    />
+                  </div>
+                )}
+              </>
+            )}
             <div className="flex gap-2">
               <div className="relative flex-1">
                 <Input
                   type={showKey ? 'text' : 'password'}
-                  placeholder={typeInfo?.placeholder}
+                  placeholder={typeInfo?.requiresApiKey ? typeInfo?.placeholder : 'Optional: update API key'}
                   value={newKey}
                   onChange={(e) => setNewKey(e.target.value)}
                   className="pr-10 h-9 text-sm"
@@ -278,8 +363,17 @@ function ProviderCard({
               <Button 
                 variant="outline" 
                 size="sm"
-                onClick={handleSaveKey}
+                onClick={handleSaveEdits}
-                disabled={!newKey || validating || saving}
+                disabled={
+                  validating
+                  || saving
+                  || (
+                    !newKey.trim()
+                    && (baseUrl.trim() || undefined) === (provider.baseUrl || undefined)
+                    && (modelId.trim() || undefined) === (provider.model || undefined)
+                  )
+                  || Boolean(typeInfo?.showModelId && !modelId.trim())
+                }
               >
                 {validating || saving ? (
                   <Loader2 className="h-3.5 w-3.5 animate-spin" />
@@ -324,25 +418,75 @@ function ProviderCard({
 }
 
 interface AddProviderDialogProps {
+  existingTypes: Set<string>;
   onClose: () => void;
-  onAdd: (type: string, name: string, apiKey: string) => Promise<void>;
+  onAdd: (
+    type: ProviderType,
+    name: string,
+    apiKey: string,
+    options?: { baseUrl?: string; model?: string }
+  ) => Promise<void>;
+  onValidateKey: (type: string, apiKey: string) => Promise<{ valid: boolean; error?: string }>;
 }
 
-function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
+function AddProviderDialog({ existingTypes, onClose, onAdd, onValidateKey }: AddProviderDialogProps) {
-  const [selectedType, setSelectedType] = useState<string | null>(null);
+  const [selectedType, setSelectedType] = useState<ProviderType | null>(null);
   const [name, setName] = useState('');
   const [apiKey, setApiKey] = useState('');
+  const [baseUrl, setBaseUrl] = useState('');
+  const [modelId, setModelId] = useState('');
   const [showKey, setShowKey] = useState(false);
   const [saving, setSaving] = useState(false);
+  const [validationError, setValidationError] = useState<string | null>(null);
   
-  const typeInfo = providerTypes.find((t) => t.id === selectedType);
+  const typeInfo = PROVIDER_TYPE_INFO.find((t) => t.id === selectedType);
+
+  // Only custom can be added multiple times.
+  const availableTypes = PROVIDER_TYPE_INFO.filter(
+    (t) => t.id === 'custom' || !existingTypes.has(t.id),
+  );
   
   const handleAdd = async () => {
     if (!selectedType) return;
 
     setSaving(true);
+    setValidationError(null);
+
     try {
-      await onAdd(selectedType, name || typeInfo?.name || selectedType, apiKey);
+      // Validate key first if the provider requires one and a key was entered
+      const requiresKey = typeInfo?.requiresApiKey ?? false;
+      if (requiresKey && !apiKey.trim()) {
+        setValidationError('API key is required');
+        setSaving(false);
+        return;
+      }
+      if (requiresKey && apiKey) {
+        const result = await onValidateKey(selectedType, apiKey);
+        if (!result.valid) {
+          setValidationError(result.error || 'Invalid API key');
+          setSaving(false);
+          return;
+        }
+      }
+
+      const requiresModel = typeInfo?.showModelId ?? false;
+      if (requiresModel && !modelId.trim()) {
+        setValidationError('Model ID is required');
+        setSaving(false);
+        return;
+      }
+
+      await onAdd(
+        selectedType,
+        name || typeInfo?.name || selectedType,
+        apiKey.trim(),
+        {
+          baseUrl: baseUrl.trim() || undefined,
+          model: (typeInfo?.defaultModelId || modelId.trim()) || undefined,
+        }
+      );
+    } catch {
+      // error already handled via toast in parent
     } finally {
       setSaving(false);
     }
@@ -360,12 +504,14 @@ function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
         <CardContent className="space-y-4">
           {!selectedType ? (
             <div className="grid grid-cols-2 gap-3">
-              {providerTypes.map((type) => (
+              {availableTypes.map((type) => (
                 <button
                   key={type.id}
                   onClick={() => {
                     setSelectedType(type.id);
                     setName(type.name);
+                    setBaseUrl(type.defaultBaseUrl || '');
+                    setModelId(type.defaultModelId || '');
                   }}
                   className="p-4 rounded-lg border hover:bg-accent transition-colors text-center"
                 >
@@ -381,7 +527,12 @@ function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
                 <div>
                   <p className="font-medium">{typeInfo?.name}</p>
                   <button 
-                    onClick={() => setSelectedType(null)}
+                    onClick={() => {
+                      setSelectedType(null);
+                      setValidationError(null);
+                      setBaseUrl('');
+                      setModelId('');
+                    }}
                     className="text-sm text-muted-foreground hover:text-foreground"
                   >
                     Change provider
@@ -407,7 +558,10 @@ function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
                     type={showKey ? 'text' : 'password'}
                     placeholder={typeInfo?.placeholder}
                     value={apiKey}
-                    onChange={(e) => setApiKey(e.target.value)}
+                    onChange={(e) => {
+                      setApiKey(e.target.value);
+                      setValidationError(null);
+                    }}
                     className="pr-10"
                   />
                   <button
@@ -418,10 +572,40 @@ function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
                     {showKey ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
                   </button>
                 </div>
+                {validationError && (
+                  <p className="text-xs text-destructive">{validationError}</p>
+                )}
                 <p className="text-xs text-muted-foreground">
-                  Your API key will be securely encrypted and stored locally.
+                  Your API key is stored locally on your machine.
                 </p>
               </div>
+
+              {typeInfo?.showBaseUrl && (
+                <div className="space-y-2">
+                  <Label htmlFor="baseUrl">Base URL</Label>
+                  <Input
+                    id="baseUrl"
+                    placeholder="https://api.example.com/v1"
+                    value={baseUrl}
+                    onChange={(e) => setBaseUrl(e.target.value)}
+                  />
+                </div>
+              )}
+
+              {typeInfo?.showModelId && (
+                <div className="space-y-2">
+                  <Label htmlFor="modelId">Model ID</Label>
+                  <Input
+                    id="modelId"
+                    placeholder={typeInfo.modelIdPlaceholder || 'provider/model-id'}
+                    value={modelId}
+                    onChange={(e) => {
+                      setModelId(e.target.value);
+                      setValidationError(null);
+                    }}
+                  />
+                </div>
+              )}
             </div>
           )}
           
@@ -433,7 +617,7 @@ function AddProviderDialog({ onClose, onAdd }: AddProviderDialogProps) {
             </Button>
             <Button 
               onClick={handleAdd} 
-              disabled={!selectedType || saving}
+              disabled={!selectedType || saving || ((typeInfo?.showModelId ?? false) && modelId.trim().length === 0)}
             >
               {saving ? (
                 <Loader2 className="h-4 w-4 animate-spin mr-2" />

src/components/ui/select.tsx

@@ -0,0 +1,30 @@
+/**
+ * Select Component
+ * Styled native select matching shadcn/ui conventions
+ */
+import * as React from 'react';
+import { cn } from '@/lib/utils';
+
+export type SelectProps = React.SelectHTMLAttributes<HTMLSelectElement>;
+
+const Select = React.forwardRef<HTMLSelectElement, SelectProps>(
+  ({ className, children, ...props }, ref) => {
+    return (
+      <select
+        className={cn(
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 appearance-none bg-[length:16px_16px] bg-[right_12px_center] bg-no-repeat',
+          'bg-[url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23888%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m6%209%206%206%206-6%22/%3E%3C/svg%3E")]',
+          'pr-10',
+          className
+        )}
+        ref={ref}
+        {...props}
+      >
+        {children}
+      </select>
+    );
+  }
+);
+Select.displayName = 'Select';
+
+export { Select };

src/lib/providers.ts

@@ -0,0 +1,74 @@
+/**
+ * Provider Types & UI Metadata — single source of truth for the frontend.
+ *
+ * NOTE: When adding a new provider type, also update
+ * electron/utils/provider-registry.ts (env vars, models, configs).
+ */
+
+export const PROVIDER_TYPES = [
+  'anthropic',
+  'openai',
+  'google',
+  'openrouter',
+  'moonshot',
+  'siliconflow',
+  'ollama',
+  'custom',
+] as const;
+export type ProviderType = (typeof PROVIDER_TYPES)[number];
+
+export interface ProviderConfig {
+  id: string;
+  name: string;
+  type: ProviderType;
+  baseUrl?: string;
+  model?: string;
+  enabled: boolean;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface ProviderWithKeyInfo extends ProviderConfig {
+  hasKey: boolean;
+  keyMasked: string | null;
+}
+
+export interface ProviderTypeInfo {
+  id: ProviderType;
+  name: string;
+  icon: string;
+  placeholder: string;
+  /** Model brand name for display (e.g. "Claude", "GPT") */
+  model?: string;
+  requiresApiKey: boolean;
+  /** Pre-filled base URL (for proxy/compatible providers like SiliconFlow) */
+  defaultBaseUrl?: string;
+  /** Whether the user can edit the base URL in setup */
+  showBaseUrl?: boolean;
+  /** Whether to show a Model ID input field (for providers where user picks the model) */
+  showModelId?: boolean;
+  /** Default / example model ID placeholder */
+  modelIdPlaceholder?: string;
+  /** Default model ID to pre-fill */
+  defaultModelId?: string;
+}
+
+/** All supported provider types with UI metadata */
+export const PROVIDER_TYPE_INFO: ProviderTypeInfo[] = [
+  { id: 'anthropic', name: 'Anthropic', icon: '🤖', placeholder: 'sk-ant-api03-...', model: 'Claude', requiresApiKey: true },
+  { id: 'openai', name: 'OpenAI', icon: '💚', placeholder: 'sk-proj-...', model: 'GPT', requiresApiKey: true },
+  { id: 'google', name: 'Google', icon: '🔷', placeholder: 'AIza...', model: 'Gemini', requiresApiKey: true },
+  { id: 'openrouter', name: 'OpenRouter', icon: '🌐', placeholder: 'sk-or-v1-...', model: 'Multi-Model', requiresApiKey: true },
+  { id: 'moonshot', name: 'Moonshot', icon: '🌙', placeholder: 'sk-...', model: 'Kimi', requiresApiKey: true, defaultBaseUrl: 'https://api.moonshot.cn/v1', defaultModelId: 'kimi-k2.5' },
+  { id: 'siliconflow', name: 'SiliconFlow', icon: '🌊', placeholder: 'sk-...', model: 'Multi-Model', requiresApiKey: true, defaultBaseUrl: 'https://api.siliconflow.com/v1', defaultModelId: 'moonshotai/Kimi-K2.5' },
+  { id: 'ollama', name: 'Ollama', icon: '🦙', placeholder: 'Not required', requiresApiKey: false, defaultBaseUrl: 'http://localhost:11434', showBaseUrl: true, showModelId: true, modelIdPlaceholder: 'qwen3:latest' },
+  { id: 'custom', name: 'Custom', icon: '⚙️', placeholder: 'API key...', requiresApiKey: true, showBaseUrl: true, showModelId: true, modelIdPlaceholder: 'your-provider/model-id' },
+];
+
+/** Provider list shown in the Setup wizard */
+export const SETUP_PROVIDERS = PROVIDER_TYPE_INFO;
+
+/** Get type info by provider type id */
+export function getProviderTypeInfo(type: ProviderType): ProviderTypeInfo | undefined {
+  return PROVIDER_TYPE_INFO.find((t) => t.id === type);
+}

src/pages/Setup/index.tsx

@@ -7,6 +7,7 @@ import { useNavigate } from 'react-router-dom';
 import { motion, AnimatePresence } from 'framer-motion';
 import { 
   Check, 
+  ChevronDown,
   ChevronLeft, 
   ChevronRight, 
   Loader2, 
@@ -97,52 +98,45 @@ const defaultSkills: DefaultSkill[] = [
   { id: 'terminal', name: 'Terminal', description: 'Shell command execution' },
 ];
 
-// Provider types
+import { SETUP_PROVIDERS, type ProviderTypeInfo } from '@/lib/providers';
-interface Provider {
-  id: string;
-  name: string;
-  model: string;
-  icon: string;
-  placeholder: string;
-}
 
-const providers: Provider[] = [
+// Use the shared provider registry for setup providers
-  { id: 'anthropic', name: 'Anthropic', model: 'Claude', icon: '🤖', placeholder: 'sk-ant-...' },
+const providers = SETUP_PROVIDERS;
-  { id: 'openai', name: 'OpenAI', model: 'GPT-4', icon: '💚', placeholder: 'sk-...' },
-  { id: 'google', name: 'Google', model: 'Gemini', icon: '🔷', placeholder: 'AI...' },
-  { id: 'openrouter', name: 'OpenRouter', model: 'Multi-Model', icon: '🌐', placeholder: 'sk-or-...' },
-];
 
 // NOTE: Channel types moved to Settings > Channels page
 // NOTE: Skill bundles moved to Settings > Skills page - auto-install essential skills during setup
 
 export function Setup() {
   const navigate = useNavigate();
-  const [currentStep, setCurrentStep] = useState(0);
+  const [currentStep, setCurrentStep] = useState<number>(STEP.WELCOME);
   
   // Setup state
   const [selectedProvider, setSelectedProvider] = useState<string | null>(null);
+  const [providerConfigured, setProviderConfigured] = useState(false);
   const [apiKey, setApiKey] = useState('');
   // Installation state for the Installing step
   const [installedSkills, setInstalledSkills] = useState<string[]>([]);
   // Runtime check status
   const [runtimeChecksPassed, setRuntimeChecksPassed] = useState(false);
   
-  const step = steps[currentStep];
+  const safeStepIndex = Number.isInteger(currentStep)
-  const isFirstStep = currentStep === 0;
+    ? Math.min(Math.max(currentStep, STEP.WELCOME), steps.length - 1)
-  const isLastStep = currentStep === steps.length - 1;
+    : STEP.WELCOME;
+  const step = steps[safeStepIndex] ?? steps[STEP.WELCOME];
+  const isFirstStep = safeStepIndex === STEP.WELCOME;
+  const isLastStep = safeStepIndex === steps.length - 1;
   
   const markSetupComplete = useSettingsStore((state) => state.markSetupComplete);
   
   // Derive canProceed based on current step - computed directly to avoid useEffect
   const canProceed = useMemo(() => {
-    switch (currentStep) {
+    switch (safeStepIndex) {
       case STEP.WELCOME:
         return true;
       case STEP.RUNTIME:
         return runtimeChecksPassed;
       case STEP.PROVIDER:
-        return selectedProvider !== null && apiKey.length > 0;
+        return providerConfigured;
       case STEP.CHANNEL:
         return true; // Always allow proceeding — channel step is optional
       case STEP.INSTALLING:
@@ -152,7 +146,7 @@ export function Setup() {
       default:
         return true;
     }
-  }, [currentStep, selectedProvider, apiKey, runtimeChecksPassed]);
+  }, [safeStepIndex, providerConfigured, runtimeChecksPassed]);
   
   const handleNext = async () => {
     if (isLastStep) {
@@ -193,14 +187,14 @@ export function Setup() {
               <div
                 className={cn(
                   'flex h-8 w-8 items-center justify-center rounded-full border-2 transition-colors',
-                  i < currentStep
+                  i < safeStepIndex
                     ? 'border-primary bg-primary text-primary-foreground'
-                    : i === currentStep
+                    : i === safeStepIndex
                     ? 'border-primary text-primary'
                     : 'border-slate-600 text-slate-600'
                 )}
               >
-                {i < currentStep ? (
+                {i < safeStepIndex ? (
                   <Check className="h-4 w-4" />
                 ) : (
                   <span className="text-sm">{i + 1}</span>
@@ -210,7 +204,7 @@ export function Setup() {
                 <div
                   className={cn(
                     'h-0.5 w-8 transition-colors',
-                    i < currentStep ? 'bg-primary' : 'bg-slate-600'
+                    i < safeStepIndex ? 'bg-primary' : 'bg-slate-600'
                   )}
                 />
               )}
@@ -235,26 +229,27 @@ export function Setup() {
           
           {/* Step-specific content */}
           <div className="rounded-xl bg-white/10 backdrop-blur p-8 mb-8">
-            {currentStep === STEP.WELCOME && <WelcomeContent />}
+                {safeStepIndex === STEP.WELCOME && <WelcomeContent />}
-            {currentStep === STEP.RUNTIME && <RuntimeContent onStatusChange={setRuntimeChecksPassed} />}
+                {safeStepIndex === STEP.RUNTIME && <RuntimeContent onStatusChange={setRuntimeChecksPassed} />}
-            {currentStep === STEP.PROVIDER && (
+                {safeStepIndex === STEP.PROVIDER && (
               <ProviderContent
                 providers={providers}
                 selectedProvider={selectedProvider}
                 onSelectProvider={setSelectedProvider}
                 apiKey={apiKey}
                 onApiKeyChange={setApiKey}
+                onConfiguredChange={setProviderConfigured}
               />
             )}
-            {currentStep === STEP.CHANNEL && <SetupChannelContent />}
+                {safeStepIndex === STEP.CHANNEL && <SetupChannelContent />}
-            {currentStep === STEP.INSTALLING && (
+                {safeStepIndex === STEP.INSTALLING && (
               <InstallingContent
                 skills={defaultSkills}
                 onComplete={handleInstallationComplete}
                 onSkip={() => setCurrentStep((i) => i + 1)}
               />
             )}
-            {currentStep === STEP.COMPLETE && (
+                {safeStepIndex === STEP.COMPLETE && (
               <CompleteContent
                 selectedProvider={selectedProvider}
                 installedSkills={installedSkills}
@@ -263,7 +258,7 @@ export function Setup() {
           </div>
           
           {/* Navigation - hidden during installation step */}
-          {currentStep !== STEP.INSTALLING && (
+          {safeStepIndex !== STEP.INSTALLING && (
             <div className="flex justify-between">
               <div>
                 {!isFirstStep && (
@@ -274,12 +269,12 @@ export function Setup() {
                 )}
               </div>
               <div className="flex gap-2">
-                {currentStep === STEP.CHANNEL && (
+                {safeStepIndex === STEP.CHANNEL && (
                   <Button variant="ghost" onClick={handleNext}>
                     Skip this step
                   </Button>
                 )}
-                {!isLastStep && currentStep !== STEP.RUNTIME && currentStep !== STEP.CHANNEL && (
+                {!isLastStep && safeStepIndex !== STEP.RUNTIME && safeStepIndex !== STEP.CHANNEL && (
                   <Button variant="ghost" onClick={handleSkip}>
                     Skip Setup
                   </Button>
@@ -641,11 +636,12 @@ function RuntimeContent({ onStatusChange }: RuntimeContentProps) {
 }
 
 interface ProviderContentProps {
-  providers: Provider[];
+  providers: ProviderTypeInfo[];
   selectedProvider: string | null;
   onSelectProvider: (id: string | null) => void;
   apiKey: string;
   onApiKeyChange: (key: string) => void;
+  onConfiguredChange: (configured: boolean) => void;
 }
 
 function ProviderContent({ 
@@ -653,24 +649,39 @@ function ProviderContent({
   selectedProvider, 
   onSelectProvider, 
   apiKey, 
-  onApiKeyChange 
+  onApiKeyChange,
+  onConfiguredChange,
 }: ProviderContentProps) {
   const [showKey, setShowKey] = useState(false);
   const [validating, setValidating] = useState(false);
   const [keyValid, setKeyValid] = useState<boolean | null>(null);
+  const [baseUrl, setBaseUrl] = useState('');
+  const [modelId, setModelId] = useState('');
+
+  // On mount, try to restore previously configured provider
   useEffect(() => {
     let cancelled = false;
     (async () => {
       try {
-        const list = await window.electron.ipcRenderer.invoke('provider:list') as Array<{ id: string; hasKey: boolean }>;
+        const list = await window.electron.ipcRenderer.invoke('provider:list') as Array<{ id: string; type: string; hasKey: boolean }>;
         const defaultId = await window.electron.ipcRenderer.invoke('provider:getDefault') as string | null;
-        const preferred = (defaultId && list.find((p) => p.id === defaultId && p.hasKey)) || list.find((p) => p.hasKey);
+        const setupProviderTypes = new Set<string>(providers.map((p) => p.id));
+        const setupCandidates = list.filter((p) => setupProviderTypes.has(p.type));
+        const preferred =
+          (defaultId && setupCandidates.find((p) => p.id === defaultId))
+          || setupCandidates.find((p) => p.hasKey)
+          || setupCandidates[0];
         if (preferred && !cancelled) {
-          onSelectProvider(preferred.id);
+          onSelectProvider(preferred.type);
+          const typeInfo = providers.find((p) => p.id === preferred.type);
+          const requiresKey = typeInfo?.requiresApiKey ?? false;
+          onConfiguredChange(!requiresKey || preferred.hasKey);
           const storedKey = await window.electron.ipcRenderer.invoke('provider:getApiKey', preferred.id) as string | null;
           if (storedKey) {
             onApiKeyChange(storedKey);
           }
+        } else if (!cancelled) {
+          onConfiguredChange(false);
         }
       } catch (error) {
         if (!cancelled) {
@@ -679,16 +690,37 @@ function ProviderContent({
       }
     })();
     return () => { cancelled = true; };
-  }, [onApiKeyChange, onSelectProvider]);
+  }, [onApiKeyChange, onConfiguredChange, onSelectProvider, providers]);
+
+  // When provider changes, load stored key + reset base URL
   useEffect(() => {
     let cancelled = false;
     (async () => {
       if (!selectedProvider) return;
       try {
-        const storedKey = await window.electron.ipcRenderer.invoke('provider:getApiKey', selectedProvider) as string | null;
+        const list = await window.electron.ipcRenderer.invoke('provider:list') as Array<{ id: string; type: string; hasKey: boolean }>;
-        if (!cancelled && storedKey) {
+        const defaultId = await window.electron.ipcRenderer.invoke('provider:getDefault') as string | null;
+        const sameType = list.filter((p) => p.type === selectedProvider);
+        const preferredInstance =
+          (defaultId && sameType.find((p) => p.id === defaultId))
+          || sameType.find((p) => p.hasKey)
+          || sameType[0];
+        const providerIdForLoad = preferredInstance?.id || selectedProvider;
+
+        const savedProvider = await window.electron.ipcRenderer.invoke(
+          'provider:get',
+          providerIdForLoad
+        ) as { baseUrl?: string; model?: string } | null;
+        const storedKey = await window.electron.ipcRenderer.invoke('provider:getApiKey', providerIdForLoad) as string | null;
+        if (!cancelled) {
+          if (storedKey) {
             onApiKeyChange(storedKey);
           }
+
+          const info = providers.find((p) => p.id === selectedProvider);
+          setBaseUrl(savedProvider?.baseUrl || info?.defaultBaseUrl || '');
+          setModelId(savedProvider?.model || info?.defaultModelId || '');
+        }
       } catch (error) {
         if (!cancelled) {
           console.error('Failed to load provider key:', error);
@@ -696,18 +728,22 @@ function ProviderContent({
       }
     })();
     return () => { cancelled = true; };
-  }, [onApiKeyChange, selectedProvider]);
+  }, [onApiKeyChange, selectedProvider, providers]);
   
   const selectedProviderData = providers.find((p) => p.id === selectedProvider);
+  const showBaseUrlField = selectedProviderData?.showBaseUrl ?? false;
+  const showModelIdField = selectedProviderData?.showModelId ?? false;
+  const requiresKey = selectedProviderData?.requiresApiKey ?? false;
   
-  const handleValidateKey = async () => {
+  const handleValidateAndSave = async () => {
-    if (!apiKey || !selectedProvider) return;
+    if (!selectedProvider) return;
     
     setValidating(true);
     setKeyValid(null);
     
     try {
-      // Call real API validation
+      // Validate key if the provider requires one and a key was entered
+      if (requiresKey && apiKey) {
         const result = await window.electron.ipcRenderer.invoke(
           'provider:validateKey',
           selectedProvider,
@@ -716,75 +752,153 @@ function ProviderContent({
         
         setKeyValid(result.valid);
         
-      if (result.valid) {
+        if (!result.valid) {
-        // Save the API key to both ClawX secure storage and OpenClaw auth-profiles
+          toast.error(result.error || 'Invalid API key');
-        try {
+          setValidating(false);
-          await window.electron.ipcRenderer.invoke(
+          return;
+        }
+      } else {
+        setKeyValid(true);
+      }
+
+      const effectiveModelId =
+        selectedProviderData?.defaultModelId ||
+        modelId.trim() ||
+        undefined;
+
+      // Save provider config + API key, then set as default
+      const saveResult = await window.electron.ipcRenderer.invoke(
         'provider:save',
         {
           id: selectedProvider,
           name: selectedProviderData?.name || selectedProvider,
           type: selectedProvider,
+          baseUrl: baseUrl.trim() || undefined,
+          model: effectiveModelId,
           enabled: true,
           createdAt: new Date().toISOString(),
           updatedAt: new Date().toISOString(),
         },
-            apiKey
+        apiKey || undefined
-          );
+      ) as { success: boolean; error?: string };
-        } catch (saveErr) {
+
-          console.warn('Failed to persist API key:', saveErr);
+      if (!saveResult.success) {
+        throw new Error(saveResult.error || 'Failed to save provider config');
       }
-        toast.success('API key validated and saved');
+
-      } else {
+      const defaultResult = await window.electron.ipcRenderer.invoke(
-        toast.error(result.error || 'Invalid API key');
+        'provider:setDefault',
+        selectedProvider
+      ) as { success: boolean; error?: string };
+
+      if (!defaultResult.success) {
+        throw new Error(defaultResult.error || 'Failed to set default provider');
       }
+
+      onConfiguredChange(true);
+      toast.success('Provider configured');
     } catch (error) {
       setKeyValid(false);
-      toast.error('Validation failed: ' + String(error));
+      onConfiguredChange(false);
+      toast.error('Configuration failed: ' + String(error));
     } finally {
       setValidating(false);
     }
   };
 
+  // Can the user submit?
+  const canSubmit =
+    selectedProvider
+    && (requiresKey ? apiKey.length > 0 : true)
+    && (showModelIdField ? modelId.trim().length > 0 : true);
+  
   return (
     <div className="space-y-6">
-      <div>
+      {/* Provider selector — dropdown */}
-        <h2 className="text-xl font-semibold mb-2">Select AI Provider</h2>
+      <div className="space-y-2">
-        <p className="text-slate-300">
+        <Label htmlFor="provider">Model Provider</Label>
-          Choose your preferred AI model provider
+        <div className="relative">
-        </p>
+          <select
-      </div>
+            id="provider"
-      
+            value={selectedProvider || ''}
-      <div className="grid grid-cols-3 gap-4">
+            onChange={(e) => {
-        {providers.map((provider) => (
+              const val = e.target.value || null;
-          <button
+              onSelectProvider(val);
-            key={provider.id}
+              onConfiguredChange(false);
-            onClick={() => {
+              onApiKeyChange('');
-              onSelectProvider(provider.id);
               setKeyValid(null);
             }}
             className={cn(
-              'p-4 rounded-lg bg-white/5 hover:bg-white/10 transition-all text-center',
+              'appearance-none rounded-md border border-white/10 bg-white/5 px-3 py-2 pr-8',
-              selectedProvider === provider.id && 'ring-2 ring-primary bg-white/10'
+              'w-full text-sm text-white cursor-pointer',
+              'focus:outline-none focus:ring-2 focus:ring-ring',
             )}
           >
-            <span className="text-3xl">{provider.icon}</span>
+            <option value="" disabled className="bg-slate-800 text-slate-400">Select a provider...</option>
-            <p className="font-medium mt-2">{provider.name}</p>
+            {providers.map((p) => (
-            <p className="text-sm text-slate-400">{provider.model}</p>
+              <option key={p.id} value={p.id} className="bg-slate-800 text-white">
-          </button>
+                {p.icon}  {p.name}{p.model ? ` — ${p.model}` : ''}
+              </option>
             ))}
+          </select>
+          <ChevronDown className="absolute right-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-slate-400 pointer-events-none" />
+        </div>
       </div>
 
+      {/* Dynamic config fields based on selected provider */}
       {selectedProvider && (
         <motion.div
-          initial={{ opacity: 0, height: 0 }}
+          key={selectedProvider}
-          animate={{ opacity: 1, height: 'auto' }}
+          initial={{ opacity: 0, y: 8 }}
+          animate={{ opacity: 1, y: 0 }}
           className="space-y-4"
         >
+          {/* Base URL field (for siliconflow, ollama, custom) */}
+          {showBaseUrlField && (
+            <div className="space-y-2">
+              <Label htmlFor="baseUrl">Base URL</Label>
+              <Input
+                id="baseUrl"
+                type="text"
+                placeholder="https://api.example.com/v1"
+                value={baseUrl}
+                onChange={(e) => {
+                  setBaseUrl(e.target.value);
+                  onConfiguredChange(false);
+                }}
+                autoComplete="off"
+                className="bg-white/5 border-white/10"
+              />
+            </div>
+          )}
+
+          {/* Model ID field (for siliconflow etc.) */}
+          {showModelIdField && (
+            <div className="space-y-2">
+              <Label htmlFor="modelId">Model ID</Label>
+              <Input
+                id="modelId"
+                type="text"
+                placeholder={selectedProviderData?.modelIdPlaceholder || 'e.g. deepseek-ai/DeepSeek-V3'}
+                value={modelId}
+                onChange={(e) => {
+                  setModelId(e.target.value);
+                  onConfiguredChange(false);
+                }}
+                autoComplete="off"
+                className="bg-white/5 border-white/10"
+              />
+              <p className="text-xs text-slate-500">
+                The model identifier from your provider (e.g. deepseek-ai/DeepSeek-V3)
+              </p>
+            </div>
+          )}
+
+          {/* API Key field (hidden for ollama) */}
+          {requiresKey && (
             <div className="space-y-2">
               <Label htmlFor="apiKey">API Key</Label>
-            <div className="flex gap-2">
+              <div className="relative">
-              <div className="relative flex-1">
                 <Input
                   id="apiKey"
                   type={showKey ? 'text' : 'password'}
@@ -792,6 +906,7 @@ function ProviderContent({
                   value={apiKey}
                   onChange={(e) => {
                     onApiKeyChange(e.target.value);
+                    onConfiguredChange(false);
                     setKeyValid(null);
                   }}
                   autoComplete="off"
@@ -805,27 +920,29 @@ function ProviderContent({
                   {showKey ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
                 </button>
               </div>
+            </div>
+          )}
+
+          {/* Validate & Save */}
           <Button
-                variant="outline" 
+            onClick={handleValidateAndSave}
-                onClick={handleValidateKey}
+            disabled={!canSubmit || validating}
-                disabled={!apiKey || validating}
+            className="w-full"
           >
             {validating ? (
-                  <Loader2 className="h-4 w-4 animate-spin" />
+              <Loader2 className="h-4 w-4 animate-spin mr-2" />
-                ) : (
+            ) : null}
-                  'Validate'
+            {requiresKey ? 'Validate & Save' : 'Save'}
-                )}
           </Button>
-            </div>
+
           {keyValid !== null && (
-              <p className={cn('text-sm', keyValid ? 'text-green-400' : 'text-red-400')}>
+            <p className={cn('text-sm text-center', keyValid ? 'text-green-400' : 'text-red-400')}>
-                {keyValid ? '✓ API key is valid' : '✗ Invalid API key'}
+              {keyValid ? '✓ Provider configured successfully' : '✗ Invalid API key'}
             </p>
           )}
-          </div>
 
-          <p className="text-sm text-slate-400">
+          <p className="text-sm text-slate-400 text-center">
-            Your API key will be securely stored in the system keychain.
+            Your API key is stored locally on your machine.
           </p>
         </motion.div>
       )}

src/stores/chat.ts

@@ -283,6 +283,8 @@ export const useChatStore = create<ChatState>((set, get) => ({
         set({ error: result.error || 'Failed to send message', sending: false });
       } else if (result.result?.runId) {
         set({ activeRunId: result.result.runId });
+      } else {
+        // No runId from gateway; keep sending state and wait for events.
       }
     } catch (err) {
       set({ error: String(err), sending: false });

src/stores/gateway.ts

@@ -5,6 +5,8 @@
 import { create } from 'zustand';
 import type { GatewayStatus } from '../types/gateway';
 
+let gatewayInitPromise: Promise<void> | null = null;
+
 interface GatewayHealth {
   ok: boolean;
   error?: string;
@@ -39,9 +41,14 @@ export const useGatewayStore = create<GatewayState>((set, get) => ({
 
   init: async () => {
     if (get().isInitialized) return;
+    if (gatewayInitPromise) {
+      await gatewayInitPromise;
+      return;
+    }
 
+    gatewayInitPromise = (async () => {
       try {
-      // Get initial status
+        // Get initial status first
         const status = await window.electron.ipcRenderer.invoke('gateway:status') as GatewayStatus;
         set({ status, isInitialized: true });
 
@@ -55,9 +62,31 @@ export const useGatewayStore = create<GatewayState>((set, get) => ({
           set({ lastError: String(error) });
         });
 
-      // Listen for notifications
+        // Some Gateway builds stream chat events via generic "agent" notifications.
+        // Normalize and forward them to the chat store.
         window.electron.ipcRenderer.on('gateway:notification', (notification) => {
-        console.log('Gateway notification:', notification);
+          const payload = notification as { method?: string; params?: Record<string, unknown> } | undefined;
+          if (!payload || payload.method !== 'agent' || !payload.params || typeof payload.params !== 'object') {
+            return;
+          }
+
+          const p = payload.params;
+          const data = (p.data && typeof p.data === 'object') ? (p.data as Record<string, unknown>) : {};
+          const normalizedEvent: Record<string, unknown> = {
+            ...data,
+            runId: p.runId ?? data.runId,
+            sessionKey: p.sessionKey ?? data.sessionKey,
+            stream: p.stream ?? data.stream,
+            seq: p.seq ?? data.seq,
+          };
+
+          import('./chat')
+            .then(({ useChatStore }) => {
+              useChatStore.getState().handleChatEvent(normalizedEvent);
+            })
+            .catch((err) => {
+              console.warn('Failed to forward gateway notification event:', err);
+            });
         });
 
         // Listen for chat events from the gateway and forward to chat store
@@ -79,7 +108,12 @@ export const useGatewayStore = create<GatewayState>((set, get) => ({
       } catch (error) {
         console.error('Failed to initialize Gateway:', error);
         set({ lastError: String(error) });
+      } finally {
+        gatewayInitPromise = null;
       }
+    })();
+
+    await gatewayInitPromise;
   },
 
   start: async () => {

src/stores/providers.ts

@@ -3,28 +3,10 @@
  * Manages AI provider configurations
  */
 import { create } from 'zustand';
+import type { ProviderConfig, ProviderWithKeyInfo } from '@/lib/providers';
 
-/**
+// Re-export types for consumers that imported from here
- * Provider configuration
+export type { ProviderConfig, ProviderWithKeyInfo } from '@/lib/providers';
- */
-export interface ProviderConfig {
-  id: string;
-  name: string;
-  type: 'anthropic' | 'openai' | 'google' | 'openrouter' | 'ollama' | 'custom';
-  baseUrl?: string;
-  model?: string;
-  enabled: boolean;
-  createdAt: string;
-  updatedAt: string;
-}
-
-/**
- * Provider with key info (for display)
- */
-export interface ProviderWithKeyInfo extends ProviderConfig {
-  hasKey: boolean;
-  keyMasked: string | null;
-}
 
 interface ProviderState {
   providers: ProviderWithKeyInfo[];
@@ -38,6 +20,11 @@ interface ProviderState {
   updateProvider: (providerId: string, updates: Partial<ProviderConfig>, apiKey?: string) => Promise<void>;
   deleteProvider: (providerId: string) => Promise<void>;
   setApiKey: (providerId: string, apiKey: string) => Promise<void>;
+  updateProviderWithKey: (
+    providerId: string,
+    updates: Partial<ProviderConfig>,
+    apiKey?: string
+  ) => Promise<void>;
   deleteApiKey: (providerId: string) => Promise<void>;
   setDefaultProvider: (providerId: string) => Promise<void>;
   validateApiKey: (providerId: string, apiKey: string) => Promise<{ valid: boolean; error?: string }>;
@@ -96,8 +83,10 @@ export const useProviderStore = create<ProviderState>((set, get) => ({
         throw new Error('Provider not found');
       }
 
+      const { hasKey: _hasKey, keyMasked: _keyMasked, ...providerConfig } = existing;
+      
       const updatedConfig: ProviderConfig = {
-        ...existing,
+        ...providerConfig,
         ...updates,
         updatedAt: new Date().toISOString(),
       };
@@ -148,6 +137,26 @@ export const useProviderStore = create<ProviderState>((set, get) => ({
     }
   },
 
+  updateProviderWithKey: async (providerId, updates, apiKey) => {
+    try {
+      const result = await window.electron.ipcRenderer.invoke(
+        'provider:updateWithKey',
+        providerId,
+        updates,
+        apiKey
+      ) as { success: boolean; error?: string };
+
+      if (!result.success) {
+        throw new Error(result.error || 'Failed to update provider');
+      }
+
+      await get().fetchProviders();
+    } catch (error) {
+      console.error('Failed to update provider with key:', error);
+      throw error;
+    }
+  },
+  
   deleteApiKey: async (providerId) => {
     try {
       const result = await window.electron.ipcRenderer.invoke('provider:deleteApiKey', providerId) as { success: boolean; error?: string };