UI polish, do not send disabled models

Author: kah-seng

internal/api/chat/list_supported_models_v2.go

@@ -220,62 +220,37 @@ func (s *ChatServerV2) ListSupportedModels(
 	}
 
 	var models []*chatv2.SupportedModel
-	for _, config := range allModels {
-		// Check if user has set API key for this particular model
-		hasOwnAPIKey := false
-		for _, model := range settings.CustomModels {
-			if model.Slug == config.slugOpenRouter {
-				// User has API key for this model, use slugOpenAI instead of slugOpenRouter if applicable
-				// slug := config.slugOpenRouter
-				// if strings.TrimSpace(config.slugOpenAI) != "" {
-				// 	slug = config.slugOpenAI
-				// }
-
-				models = append(models, &chatv2.SupportedModel{
-					Name:         model.Name,
-					Slug:         model.Slug,
-					TotalContext: int64(model.ContextWindow),
-					MaxOutput:    int64(model.MaxOutput),
-					InputPrice:   int64(model.InputPrice),
-					OutputPrice:  int64(model.OutputPrice),
-					IsCustom:     true,
-				})
-				hasOwnAPIKey = true
-				continue
-			}
-		}
-
-		if hasOwnAPIKey {
-			continue
-		}
 
-		// Choose the appropriate slug based on whether user has their own API key.
-		//
-		// Some models are only available via OpenRouter; for those, slugOpenAI may be empty.
-		// In that case, keep using the OpenRouter slug to avoid returning an empty model slug.
-		// slug := config.slugOpenRouter
-		// if hasOwnAPIKey && strings.TrimSpace(config.slugOpenAI) != "" {
-		// 	slug = config.slugOpenAI
-		// }
+	for _, model := range settings.CustomModels {
+		models = append(models, &chatv2.SupportedModel{
+			Name:         model.Name,
+			Slug:         model.Slug,
+			TotalContext: int64(model.ContextWindow),
+			MaxOutput:    int64(model.MaxOutput),
+			InputPrice:   int64(model.InputPrice),
+			OutputPrice:  int64(model.OutputPrice),
+			IsCustom:     true,
+		})
+	}
 
+	for _, config := range allModels {
 		model := &chatv2.SupportedModel{
 			Name:         config.name,
 			Slug:         config.slugOpenRouter,
 			TotalContext: config.totalContext,
 			MaxOutput:    config.maxOutput,
 			InputPrice:   config.inputPrice,
 			OutputPrice:  config.outputPrice,
-			IsCustom:     false,
 		}
 
 		// If model requires own key but user hasn't provided one, mark as disabled
 		if config.requireOwnKey {
-			model.Disabled = true
-			model.DisabledReason = stringPtr("Requires your own OpenAI API key. Configure it in Settings.")
+			continue
 		}
 
 		models = append(models, model)
 	}
+
 	return &chatv2.ListSupportedModelsResponse{
 		Models: models,
 	}, nil

internal/services/toolkit/client/completion_v2.go

@@ -65,13 +65,8 @@ func (a *AIClientV2) ChatCompletionStreamV2(ctx context.Context, callbackStream
 		streamHandler.SendFinalization()
 	}()
 
-	if llmProvider.IsCustomModel {
-		// e.g., Strip "google/" from "google/gemini-2.5-flash"
-		modelSlug = modelSlug[strings.Index(modelSlug, "/")+1:]
-	}
-
 	oaiClient := a.GetOpenAIClient(llmProvider)
-	params := getDefaultParamsV2(modelSlug, a.toolCallHandler.Registry)
+	params := getDefaultParamsV2(modelSlug, a.toolCallHandler.Registry, llmProvider.IsCustomModel)
 
 	for {
 		params.Messages = openaiChatHistory

internal/services/toolkit/client/utils_v2.go

@@ -53,7 +53,7 @@ func appendAssistantTextResponseV2(openaiChatHistory *OpenAIChatHistory, inappCh
 	})
 }
 
-func getDefaultParamsV2(modelSlug string, toolRegistry *registry.ToolRegistryV2) openaiv3.ChatCompletionNewParams {
+func getDefaultParamsV2(modelSlug string, toolRegistry *registry.ToolRegistryV2, isCustomModel bool) openaiv3.ChatCompletionNewParams {
 	var reasoningModels = []string{
 		"gpt-5",
 		"gpt-5-mini",
@@ -67,8 +67,8 @@ func getDefaultParamsV2(modelSlug string, toolRegistry *registry.ToolRegistryV2)
 		"codex-mini-latest",
 	}
 
-	// Gemini does not support Store param
-	if strings.HasPrefix(strings.ToLower(modelSlug), "gemini") {
+	// Other model providers generally do not support the Store param
+	if isCustomModel {
 		return openaiv3.ChatCompletionNewParams{
 			Model:               modelSlug,
 			Temperature:         openaiv3.Float(0.7),

webapp/_webapp/src/views/settings/sections/api-key-settings.tsx

@@ -117,25 +117,29 @@ const CustomModelSection = ({ isNew, onChange, model: customModel }: CustomModel
   const [outputPrice, setOutputPrice] = useState<number>(customModel?.outputPrice || 0);
   const [modelName, setModelName] = useState(customModel?.name || "");
 
-  const baseInputClassName = "bg-transparent p-1 focus:outline-none mt-[4px]";
-  const modelNameInputClassName = `${baseInputClassName} text-sm text-default-900 font-medium flex-1 truncate`;
-  const labelClassName = `${baseInputClassName} text-xs text-default-900 w-auto`;
-  const detailInputClassName = `${baseInputClassName} flex-1 noselect focus:outline-none 
-    rnd-cancel px-2 py-1 border !border-gray-200 dark:!border-default-200 rounded-md 
-    text-xs text-default-700 dark:text-default-300 placeholder:text-default-400 disabled:opacity-70 disabled:cursor-not-allowed`;
+  const baseClassName = "bg-transparent p-1 focus:outline-none disabled:opacity-70 disabled:cursor-not-allowed";
+  const modelNameInputClassName = `${baseClassName} text-sm text-default-900 font-medium flex-1 truncate rnd-cancel px-2 py-1 border !border-gray-200 dark:!border-default-200 rounded-md mr-1`;
+  const labelClassName = `${baseClassName} text-xs text-default-900 w-auto`;
+  const detailInputClassName = `${baseClassName} flex-1 noselect focus:outline-none rnd-cancel px-2 py-1 border !border-gray-200 dark:!border-default-200 rounded-md 
+    text-xs text-default-700 placeholder:text-default-400`;
 
   const handleOnChange = (isDelete: boolean) => {
-    if (modelName.length < 1 || slug.length < 1 || baseUrl.length < 1 || apiKey.length < 1) {
+    if (
+      modelName.trim().length < 1 ||
+      slug.trim().length < 1 ||
+      baseUrl.trim().length < 1 ||
+      apiKey.trim().length < 1
+    ) {
       return;
     }
 
     onChange(
       {
         id: id,
-        name: modelName,
-        baseUrl: baseUrl,
-        slug: slug,
-        apiKey: apiKey,
+        name: modelName.trim(),
+        baseUrl: baseUrl.trim(),
+        slug: slug.trim(),
+        apiKey: apiKey.trim(),
         contextWindow: contextWindow,
         maxOutput: maxOutput,
         inputPrice: inputPrice,
@@ -165,7 +169,7 @@ const CustomModelSection = ({ isNew, onChange, model: customModel }: CustomModel
           placeholder="My Model"
           type="text"
           disabled={!isEditing}
-          onChange={(e) => setModelName(e.target.value.trim())}
+          onChange={(e) => setModelName(e.target.value)}
         ></input>
 
         {isNew ? (
@@ -198,39 +202,39 @@ const CustomModelSection = ({ isNew, onChange, model: customModel }: CustomModel
         )}
       </div>
 
-      <div className="flex flex-row">
+      <div className="flex flex-row mt-[4px]">
         <label className={labelClassName}>Slug</label>
         <input
           className={detailInputClassName}
           value={slug}
-          placeholder="e.g., google/gemini-2.5-flash"
+          placeholder="e.g., gemini-2.5-flash"
           type="text"
           disabled={!isEditing}
-          onChange={(e) => setSlug(e.target.value.trim())}
+          onChange={(e) => setSlug(e.target.value)}
         />
       </div>
 
-      <div className="flex flex-row">
+      <div className="flex flex-row mt-[4px]">
         <label className={labelClassName}>Base URL</label>
         <input
           className={detailInputClassName}
           value={baseUrl}
           placeholder="An OpenAI-compatible endpoint"
           type="text"
           disabled={!isEditing}
-          onChange={(e) => setBaseUrl(e.target.value.trim())}
+          onChange={(e) => setBaseUrl(e.target.value)}
         />
       </div>
 
-      <div className="flex flex-row">
+      <div className="flex flex-row mt-[4px]">
         <label className={labelClassName}>API Key</label>
         <input
           className={detailInputClassName}
           value={apiKey}
           placeholder="Your API Key"
           type={!isEditing && !isNew ? "password" : "text"}
           disabled={!isEditing}
-          onChange={(e) => setApiKey(e.target.value.trim())}
+          onChange={(e) => setApiKey(e.target.value)}
         />
       </div>