feat(models): friendlier add-model form — OpenRouter/LM Studio, direct key, test & load

- Providers: add openrouter (https://openrouter.ai/api/v1) and lmstudio
  (http://localhost:1234/v1), both OpenAI-compatible. Selecting a provider now
  auto-fills its verified base URL, cost tier and default capabilities.
- API key is typed directly in the form and stored securely as a secret under the
  provider's env name — no manual env var to manage.
- New POST /admin/api/provider/models validates the key and lists the provider's
  models; a "Test & load models" button fills a searchable dropdown. The model
  field now sits below the key (some providers list models from the key).
- Fuller capability set: tools, vision, audio, reasoning, json, caching.

Cargo.lock

@@ -285,7 +285,7 @@ checksum = "1d07550c9036bf2ae0c684c4297d503f838287c83c53686d05370d0e139ae570"
 
 [[package]]
 name = "cortiq-gateway"
-version = "0.2.8"
+version = "0.2.10"
 dependencies = [
  "anyhow",
  "arc-swap",

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "cortiq-gateway"
-version = "0.2.8"
+version = "0.2.10"
 edition = "2021"
 rust-version = "1.75"
 license = "Apache-2.0"

src/admin/mod.rs

@@ -178,6 +178,8 @@ pub fn api_routes(admin_token: String) -> Router<SharedState> {
         .route("/admin/api/cmf", get(cmf_status))
         .route("/admin/api/cmf/install", post(cmf_install))
         .route("/admin/api/cmf/port", get(cmf_port_check))
+        .route("/admin/api/cmf/files", get(cmf_files))
+        .route("/admin/api/provider/models", post(provider_models))
         .route("/admin/api/requests", get(get_requests))
         .route("/admin/api/test", post(run_test))
         .route("/admin/api/test/stream", post(run_test_stream))
@@ -390,18 +392,105 @@ async fn router_probe(State(state): State<SharedState>) -> ApiResult {
     ok(json!({ "ok": true, "status": "ok", "latency_ms": latency_ms, "usage": usage }))
 }
 
+#[derive(Deserialize)]
+struct ProviderModelsBody {
+    provider: String,
+    base_url: String,
+    /// Key typed into the form (takes priority)…
+    #[serde(default)]
+    api_key: Option<String>,
+    /// …or the name of a stored secret to reuse if no key was typed.
+    #[serde(default)]
+    api_key_env: Option<String>,
+}
+
+/// Concise error line from a provider's JSON error body.
+fn provider_err(body: &str, status: u16) -> String {
+    if let Ok(v) = serde_json::from_str::<Value>(body) {
+        if let Some(m) = v["error"]["message"]
+            .as_str()
+            .or_else(|| v["error"].as_str())
+            .or_else(|| v["message"].as_str())
+        {
+            return format!("{status}: {m}");
+        }
+    }
+    format!("HTTP {status}")
+}
+
+/// Validate a provider API key and list its models by calling the provider's
+/// `/models` endpoint — powers the "Test key & load models" button. The key is
+/// used transiently (from the form) or resolved from a stored secret; it is not
+/// persisted here.
+async fn provider_models(
+    State(state): State<SharedState>,
+    Json(b): Json<ProviderModelsBody>,
+) -> ApiResult {
+    let base = b.base_url.trim_end_matches('/').to_string();
+    if base.is_empty() {
+        return Err(ApiError::bad("base URL is required"));
+    }
+    let key = b.api_key.filter(|k| !k.trim().is_empty()).or_else(|| {
+        b.api_key_env
+            .as_deref()
+            .and_then(|e| state.secrets.resolve(e))
+    });
+    let key = key.as_deref();
+
+    let client = reqwest::Client::builder()
+        .timeout(std::time::Duration::from_secs(15))
+        .build()
+        .map_err(|e| ApiError::bad(e.to_string()))?;
+
+    // Anthropic uses x-api-key + anthropic-version and /v1/models; every other
+    // (OpenAI-compatible) provider uses a Bearer token and /models.
+    let resp = if b.provider == "anthropic" {
+        let mut r = client
+            .get(format!("{base}/v1/models"))
+            .header("anthropic-version", "2023-06-01");
+        if let Some(k) = key {
+            r = r.header("x-api-key", k);
+        }
+        r.send().await
+    } else {
+        let mut r = client.get(format!("{base}/models"));
+        if let Some(k) = key {
+            r = r.header("authorization", format!("Bearer {k}"));
+        }
+        r.send().await
+    };
+    let resp = resp.map_err(|e| ApiError::bad(format!("request failed: {e}")))?;
+    let status = resp.status().as_u16();
+    let body = resp.text().await.unwrap_or_default();
+    if !(200..300).contains(&status) {
+        return ok(json!({ "ok": false, "status": status, "error": provider_err(&body, status) }));
+    }
+    // OpenAI + Anthropic both return { "data": [ { "id": ... } ] }.
+    let v: Value = serde_json::from_str(&body).unwrap_or(json!({}));
+    let mut models: Vec<String> = v["data"]
+        .as_array()
+        .map(|arr| {
+            arr.iter()
+                .filter_map(|m| m["id"].as_str().map(|s| s.to_string()))
+                .collect()
+        })
+        .unwrap_or_default();
+    models.sort();
+    ok(json!({ "ok": true, "count": models.len(), "models": models }))
+}
+
 async fn meta() -> ApiResult {
     ok(json!({
         "version": env!("CARGO_PKG_VERSION"),
-        "providers": ["openai", "anthropic", "ollama", "http"],
-        "provider_impl": { "openai": true, "ollama": true, "http": true, "anthropic": true },
-        "cost_tiers": ["cheap", "mid", "expensive"],
+        "providers": ["openai", "anthropic", "openrouter", "lmstudio", "ollama", "http"],
+        "provider_impl": { "openai": true, "anthropic": true, "openrouter": true, "lmstudio": true, "ollama": true, "http": true },
+        "cost_tiers": ["cheap", "mid", "expensive", "local"],
         "kinds": ["chat", "embedding"],
         "profiles": ["cost-saver", "balanced", "quality-first"],
         "text_strategies": ["last_user", "last_user_plus_system", "concat_all"],
         "policy_modes": ["fixed_table", "cost_aware"],
         "tiers": ["low", "medium", "high"],
-        "caps": ["tools", "vision"],
+        "caps": ["tools", "vision", "audio", "reasoning", "json", "caching"],
         "protocols_impl": {
             "openai_chat": true, "openai_completions": true, "openai_embeddings": true,
             "openai_models": true, "anthropic_messages": true, "mcp": true, "native_passthrough": true
@@ -843,6 +932,36 @@ async fn cmf_install(State(state): State<SharedState>) -> ApiResult {
     ok(json!({ "started": true }))
 }
 
+/// List the `.cmf` model files available under `models_dir` so the UI can offer
+/// them as a dropdown instead of a hand-typed path. Includes tensor-dir `.cmf`.
+async fn cmf_files(State(state): State<SharedState>) -> ApiResult {
+    let dir = state.live().cfg.cmf.models_dir.clone();
+    let mut entries: Vec<(String, String, Option<u64>, bool)> = Vec::new();
+    if let Ok(rd) = std::fs::read_dir(&dir) {
+        for e in rd.flatten() {
+            let name = e.file_name().to_string_lossy().to_string();
+            if !name.ends_with(".cmf") {
+                continue;
+            }
+            let p = e.path();
+            let is_dir = p.is_dir();
+            let size = if is_dir {
+                None
+            } else {
+                std::fs::metadata(&p).ok().map(|m| m.len())
+            };
+            let path = format!("{}/{}", dir.trim_end_matches('/'), name);
+            entries.push((name, path, size, is_dir));
+        }
+    }
+    entries.sort_by(|a, b| a.0.cmp(&b.0));
+    let files: Vec<Value> = entries
+        .into_iter()
+        .map(|(name, path, size, is_dir)| json!({ "name": name, "path": path, "size": size, "is_dir": is_dir }))
+        .collect();
+    ok(json!({ "dir": dir, "files": files }))
+}
+
 #[derive(Deserialize)]
 struct PortQuery {
     port: u16,

src/registry.rs

@@ -21,7 +21,10 @@ impl Registry {
                 .as_ref()
                 .and_then(|name| secrets.resolve(name));
             let provider: Arc<dyn Provider> = match m.provider.as_str() {
-                "openai" | "ollama" | "http" => Arc::new(OpenAiProvider::new(m, api_key)?),
+                // openrouter + lmstudio are OpenAI-compatible (Bearer + /chat/completions)
+                "openai" | "ollama" | "http" | "openrouter" | "lmstudio" => {
+                    Arc::new(OpenAiProvider::new(m, api_key)?)
+                }
                 "anthropic" => Arc::new(AnthropicProvider::new(m, api_key)?),
                 other => anyhow::bail!("unknown provider '{}' for model '{}'", other, m.id),
             };

web/js/api.js

@@ -99,6 +99,8 @@ export const api = {
   cmfStatus: () => j("GET", "/cmf"),
   cmfInstall: () => j("POST", "/cmf/install"),
   cmfPortCheck: (port) => j("GET", "/cmf/port?port=" + encodeURIComponent(port)),
+  cmfFiles: () => j("GET", "/cmf/files"),
+  providerModels: (b) => j("POST", "/provider/models", b),
 
   // CMF model factory (HuggingFace → local .cmf)
   hfSearch: (q, limit = 24) =>

web/js/i18n/en.js

@@ -129,6 +129,17 @@ export default {
   "models.form.secretMissing": "not set",
   "models.form.secretPlaceholder": "set or replace key (write-only)",
   "models.deleteConfirm": "Delete model \"{id}\"?",
+  "models.form.apiKey": "API Key",
+  "models.form.apiKeyPlaceholder": "paste your API key",
+  "models.form.apiKeyNotNeeded": "not required (local server)",
+  "models.form.apiKeyHint": "Stored securely on the gateway; it is not shown again.",
+  "models.form.keyStored": "A key is saved — leave blank to keep it, or paste a new one.",
+  "models.form.keyFromEnv": "Using a key from an environment variable.",
+  "models.form.testKey": "Test & load models",
+  "models.form.testing": "checking…",
+  "models.form.foundModels": "{n} models loaded",
+  "models.form.modelPlaceholder": "type to search…",
+  "models.form.modelHint": "Click “Test & load models” to pull the list from your key, then pick one.",
   "models.managed": "managed",
   "models.managedHint": "Provided by the managed CMF server (Settings → Local models). Configure it there.",
 
@@ -244,9 +255,10 @@ export default {
   "settings.cmf.threads": "Worker threads",
   "settings.cmf.gpu": "Use GPU (Metal / wgpu)",
   "settings.cmf.speedNote": "Threads parallelise the decode matvecs (~3x faster; 0 = runtime default). GPU offload mainly helps prefill of long prompts — decode is memory-bandwidth-bound, so on Apple Silicon it is roughly neutral.",
+  "settings.cmf.pick": "select a model",
   "settings.cmf.models": "Local models",
   "settings.cmf.modelsHelp": "Each row is one model the gateway runs (its own cortiq serve on its own port) and registers in the pool. Add as many as you have .cmf files and free ports.",
-  "settings.cmf.rowHint": "id · path to .cmf · port · threads · GPU. Changes apply on restart; deleting a row stops that server.",
+  "settings.cmf.rowHint": "id · .cmf file · port · threads · GPU. Changes apply on restart; deleting a row stops that server.",
   "settings.cmf.addServer": "+ Add local model",
   "settings.cmf.checkPort": "Check port",
   "settings.cmf.portFree": "port is free",

web/js/i18n/ru.js

@@ -128,6 +128,17 @@ export default {
   "models.form.secretMissing": "не задан",
   "models.form.secretPlaceholder": "задать или заменить ключ (только запись)",
   "models.deleteConfirm": "Удалить модель \"{id}\"?",
+  "models.form.apiKey": "API-ключ",
+  "models.form.apiKeyPlaceholder": "вставьте API-ключ",
+  "models.form.apiKeyNotNeeded": "не нужен (локальный сервер)",
+  "models.form.apiKeyHint": "Хранится безопасно на шлюзе; больше не показывается.",
+  "models.form.keyStored": "Ключ сохранён — оставьте пустым, чтобы не менять, или вставьте новый.",
+  "models.form.keyFromEnv": "Используется ключ из переменной окружения.",
+  "models.form.testKey": "Проверить и загрузить модели",
+  "models.form.testing": "проверка…",
+  "models.form.foundModels": "загружено моделей: {n}",
+  "models.form.modelPlaceholder": "введите для поиска…",
+  "models.form.modelHint": "Нажмите «Проверить и загрузить модели», чтобы подтянуть список по ключу, затем выберите.",
   "models.managed": "управляемая",
   "models.managedHint": "Предоставляется CMF-сервером (Настройки → Локальные модели). Настраивается там.",
 
@@ -243,9 +254,10 @@ export default {
   "settings.cmf.threads": "Рабочие потоки",
   "settings.cmf.gpu": "Использовать GPU (Metal / wgpu)",
   "settings.cmf.speedNote": "Потоки распараллеливают декод-матвеки (~×3; 0 = по умолчанию рантайма). GPU-оффлоад помогает в основном на prefill длинных промптов — декод упирается в пропускную способность памяти, поэтому на Apple Silicon почти нейтрален.",
+  "settings.cmf.pick": "выберите модель",
   "settings.cmf.models": "Локальные модели",
   "settings.cmf.modelsHelp": "Каждая строка — отдельная модель: шлюз поднимает свой cortiq serve на своём порту и регистрирует её в пуле. Добавляйте столько, сколько есть .cmf-файлов и свободных портов.",
-  "settings.cmf.rowHint": "id · путь к .cmf · порт · потоки · GPU. Изменения применяются после перезапуска; удаление строки останавливает сервер.",
+  "settings.cmf.rowHint": "id · файл .cmf · порт · потоки · GPU. Изменения применяются после перезапуска; удаление строки останавливает сервер.",
   "settings.cmf.addServer": "+ Добавить модель",
   "settings.cmf.checkPort": "Проверить порт",
   "settings.cmf.portFree": "порт свободен",

web/js/views/models.js

@@ -16,52 +16,124 @@ function keyBadge(src) {
   return h("span", { class: "badge " + (map[src] ?? "") }, src);
 }
 
+// Verified per-provider defaults (base URL, key env, whether a key is needed).
+const PROVIDER_DEFAULTS = {
+  openai:     { base: "https://api.openai.com/v1",    keyEnv: "OPENAI_API_KEY",     needsKey: true,  tier: "mid",       caps: ["tools", "vision"] },
+  anthropic:  { base: "https://api.anthropic.com",    keyEnv: "ANTHROPIC_API_KEY",  needsKey: true,  tier: "expensive", caps: ["tools", "vision"] },
+  openrouter: { base: "https://openrouter.ai/api/v1", keyEnv: "OPENROUTER_API_KEY", needsKey: true,  tier: "mid",       caps: ["tools", "vision"] },
+  lmstudio:   { base: "http://localhost:1234/v1",     keyEnv: "",                   needsKey: false, tier: "local",     caps: ["tools", "vision"] },
+  ollama:     { base: "http://localhost:11434/v1",    keyEnv: "",                   needsKey: false, tier: "local",     caps: ["tools"] },
+  http:       { base: "",                              keyEnv: "",                   needsKey: false, tier: "cheap",     caps: ["tools"] },
+};
+
 function modelForm(meta, existing) {
-  const m = existing || { provider: "openai", kind: "chat", cost_tier: "cheap", caps: [], price_in: 0, price_out: 0 };
-  const idIn = h("input", { value: m.id || "", placeholder: "local-qwen", disabled: existing ? true : null });
+  const m = existing || { provider: "openai", kind: "chat", cost_tier: "mid", caps: ["tools"], price_in: 0, price_out: 0 };
+  const idIn = h("input", { value: m.id || "", placeholder: "my-model", disabled: existing ? true : null });
   const providerSel = h("select", {}, ...(meta.providers || ["openai"]).map((p) => opt(p, p, p === m.provider)));
-  const baseUrlIn = h("input", { value: m.base_url || "", placeholder: "http://localhost:8000/v1" });
-  const modelIn = h("input", { value: m.model || "", placeholder: "qwen2.5-7b-instruct" });
+  const baseUrlIn = h("input", { value: m.base_url || "", placeholder: "https://api.openai.com/v1" });
+
+  // API key — typed directly, stored securely as a secret under a provider env name.
+  const keyIn = h("input", { type: "password", placeholder: t("models.form.apiKeyPlaceholder"), autocomplete: "new-password" });
+  const testBtn = h("button", { class: "btn small", type: "button" }, t("models.form.testKey"));
+  const keyStatus = h("span", { class: "small", style: "margin-left:8px" });
+
+  // Model — below the key (some providers list models from the key); searchable datalist.
+  const dlId = "model-opts-" + (m.id || "new");
+  const dl = h("datalist", { id: dlId });
+  if (m.model) dl.appendChild(h("option", { value: m.model }));
+  const modelIn = h("input", { value: m.model || "", placeholder: t("models.form.modelPlaceholder"), list: dlId, autocomplete: "off" });
+
   const kindSel = h("select", {}, ...(meta.kinds || ["chat"]).map((k) => opt(k, k, k === m.kind)));
   const tierSel = h("select", {}, ...(meta.cost_tiers || ["cheap"]).map((c) => opt(c, c, c === m.cost_tier)));
   const priceInIn = h("input", { type: "number", step: "0.01", value: m.price_in ?? 0 });
   const priceOutIn = h("input", { type: "number", step: "0.01", value: m.price_out ?? 0 });
-  const keyEnvIn = h("input", { value: m.api_key_env || "", placeholder: "OPENAI_API_KEY" });
-  const secretIn = h("input", { type: "password", placeholder: t("models.form.secretPlaceholder") });
   const capInputs = (meta.caps || ["tools", "vision"]).map((c) => {
     const cb = h("input", { type: "checkbox", checked: (m.caps || []).includes(c) ? true : null });
     return { c, cb };
   });
 
+  const envFor = () =>
+    (existing && existing.api_key_env) ||
+    (PROVIDER_DEFAULTS[providerSel.value] || {}).keyEnv ||
+    providerSel.value.toUpperCase().replace(/[^A-Z0-9]/g, "_") + "_API_KEY";
+
+  // Fill in a provider's verified defaults when it is selected.
+  function applyDefaults() {
+    const d = PROVIDER_DEFAULTS[providerSel.value];
+    if (!d) return;
+    baseUrlIn.value = d.base;
+    tierSel.value = d.tier;
+    capInputs.forEach(({ c, cb }) => { cb.checked = d.caps.includes(c); });
+    keyIn.placeholder = d.needsKey ? t("models.form.apiKeyPlaceholder") : t("models.form.apiKeyNotNeeded");
+    mount(keyStatus, "");
+  }
+  providerSel.addEventListener("change", applyDefaults);
+  if (!existing) applyDefaults();
+
+  async function testKey() {
+    if (!baseUrlIn.value.trim()) { mount(keyStatus, h("span", { style: "color:var(--bad)" }, t("models.form.baseUrl") + "?")); return; }
+    testBtn.disabled = true;
+    mount(keyStatus, t("models.form.testing"));
+    try {
+      const r = await api.providerModels({
+        provider: providerSel.value,
+        base_url: baseUrlIn.value.trim(),
+        api_key: keyIn.value.trim() || null,
+        api_key_env: envFor(),
+      });
+      if (r.ok) {
+        dl.replaceChildren(...(r.models || []).map((mm) => h("option", { value: mm })));
+        mount(keyStatus, h("span", { style: "color:var(--good)" }, "✓ " + t("models.form.foundModels", { n: r.count })));
+        modelIn.focus();
+      } else {
+        mount(keyStatus, h("span", { style: "color:var(--bad)" }, "✗ " + (r.error || t("common.error"))));
+      }
+    } catch (e) {
+      mount(keyStatus, h("span", { style: "color:var(--bad)" }, "✗ " + String(e.message || e)));
+    }
+    testBtn.disabled = false;
+  }
+  testBtn.addEventListener("click", testKey);
+
+  const keyHint =
+    existing && existing.key_source === "store" ? t("models.form.keyStored")
+    : existing && existing.key_source === "env" ? t("models.form.keyFromEnv")
+    : t("models.form.apiKeyHint");
+
   const node = h(
     "div",
     {},
     h("div", { class: "row" }, field(t("models.form.id"), idIn, existing ? null : t("models.form.idHint")), field(t("models.form.provider"), providerSel)),
     field(t("models.form.baseUrl"), baseUrlIn),
-    field(t("models.form.model"), modelIn),
+    field(t("models.form.apiKey"), h("div", { class: "flex wrap", style: "gap:8px;align-items:center" }, keyIn, testBtn, keyStatus), keyHint),
+    field(t("models.form.model"), modelIn, t("models.form.modelHint")),
+    dl,
     h("div", { class: "row" }, field(t("models.form.kind"), kindSel), field(t("models.form.costTier"), tierSel)),
     h("div", { class: "row" }, field(t("models.form.priceIn"), priceInIn), field(t("models.form.priceOut"), priceOutIn)),
-    field(t("models.form.caps"), h("div", { class: "flex wrap" }, ...capInputs.map(({ c, cb }) => h("label", { class: "check" }, cb, c)))),
-    field(t("models.form.apiKeyEnv"), keyEnvIn, t("models.form.apiKeyEnvHint")),
-    field(t("models.form.secret"), secretIn)
+    field(t("models.form.caps"), h("div", { class: "flex wrap" }, ...capInputs.map(({ c, cb }) => h("label", { class: "check" }, cb, c))))
   );
 
-  const getValue = () => ({
-    model: {
-      id: existing ? m.id : idIn.value.trim(),
-      provider: providerSel.value,
-      base_url: baseUrlIn.value.trim(),
-      model: modelIn.value.trim(),
-      kind: kindSel.value,
-      cost_tier: tierSel.value,
-      price_in: parseFloat(priceInIn.value) || 0,
-      price_out: parseFloat(priceOutIn.value) || 0,
-      api_key_env: keyEnvIn.value.trim() || null,
-      caps: capInputs.filter(({ cb }) => cb.checked).map(({ c }) => c),
-    },
-    secret: secretIn.value,
-    keyEnv: keyEnvIn.value.trim(),
-  });
+  const getValue = () => {
+    const typedKey = keyIn.value.trim();
+    const hasKey = !!typedKey || !!(existing && existing.api_key_env);
+    const keyEnv = envFor();
+    return {
+      model: {
+        id: existing ? m.id : idIn.value.trim(),
+        provider: providerSel.value,
+        base_url: baseUrlIn.value.trim(),
+        model: modelIn.value.trim(),
+        kind: kindSel.value,
+        cost_tier: tierSel.value,
+        price_in: parseFloat(priceInIn.value) || 0,
+        price_out: parseFloat(priceOutIn.value) || 0,
+        api_key_env: hasKey ? keyEnv : null,
+        caps: capInputs.filter(({ cb }) => cb.checked).map(({ c }) => c),
+      },
+      secret: typedKey,
+      keyEnv,
+    };
+  };
 
   return { node, getValue };
 }
@@ -74,8 +146,7 @@ async function openModal(meta, existing, reload) {
       toast(t("models.form.id") + "?", "bad");
       return false;
     }
-    // strip null api_key_env so serde keeps it optional
-    if (!model.api_key_env) delete model.api_key_env;
+    if (!model.api_key_env) delete model.api_key_env; // keep serde field optional
     try {
       if (existing) await api.updateModel(existing.id, model);
       else await api.createModel(model);

web/js/views/settings.js

@@ -214,6 +214,9 @@ export async function renderSettings() {
     ? [{ id: s.cmf.model_id || "cmf-local", model: s.cmf.local_model, port: s.cmf.local_port ?? 8081, threads: s.cmf.threads ?? 8, gpu: !!s.cmf.gpu }]
     : [];
   const initServers = (s.cmf?.servers && s.cmf.servers.length) ? s.cmf.servers : legacyServers;
+  // available .cmf files under models_dir → offer as a dropdown, not a typed path
+  const cmfFiles = ((await api.cmfFiles().catch(() => ({ files: [] }))).files) || [];
+  const fileLabel = (f) => f.name + (f.size ? ` (${(f.size / 1073741824).toFixed(f.size >= 1073741824 ? 1 : 2)} GB)` : f.is_dir ? " (dir)" : "");
   function autoId(path) {
     const base = (path || "").split("/").pop().replace(/\.cmf$/i, "");
     return base ? "cmf-" + base.replace(/[^a-zA-Z0-9_-]/g, "-") : "";
@@ -221,14 +224,20 @@ export async function renderSettings() {
   function makeServerRow(sv) {
     sv = sv || { id: "", model: "", port: 8090, threads: 8, gpu: false };
     const idIn = h("input", { value: sv.id || "", placeholder: "cmf-id", style: "width:130px" });
-    const modelIn = h("input", { value: sv.model || "", placeholder: "models/model.cmf", style: "flex:2;min-width:150px" });
+    // pick from existing .cmf files rather than typing a path
+    const modelSel = h("select", { style: "flex:2;min-width:150px" });
+    const seen = new Set();
+    modelSel.appendChild(h("option", { value: "" }, "— " + t("settings.cmf.pick") + " —"));
+    cmfFiles.forEach((f) => { modelSel.appendChild(h("option", { value: f.path }, fileLabel(f))); seen.add(f.path); });
+    if (sv.model && !seen.has(sv.model)) modelSel.appendChild(h("option", { value: sv.model }, sv.model));
+    modelSel.value = sv.model || "";
     const portIn = h("input", { type: "number", value: sv.port ?? 8090, style: "width:82px" });
     const threadsIn = h("input", { type: "number", min: 0, value: sv.threads ?? 8, style: "width:60px", title: t("settings.cmf.threadsHelp") });
     const gpuIn = h("input", { type: "checkbox", checked: sv.gpu ? true : null, title: t("settings.cmf.gpuHelp") });
     const checkBtn = h("button", { class: "btn small", type: "button" }, t("settings.cmf.checkPort"));
     const removeBtn = h("button", { class: "btn small danger", type: "button", title: t("common.delete") }, "✕");
     const st = h("span", { class: "small" });
-    modelIn.addEventListener("input", () => { if (!idIn.value || idIn._auto) { idIn.value = autoId(modelIn.value); idIn._auto = true; } });
+    modelSel.addEventListener("change", () => { if (!idIn.value || idIn._auto) { idIn.value = autoId(modelSel.value); idIn._auto = true; } });
     idIn.addEventListener("input", () => { idIn._auto = false; });
     checkBtn.addEventListener("click", async () => {
       const p = parseInt(portIn.value, 10); if (!p) return;
@@ -245,8 +254,8 @@ export async function renderSettings() {
       checkBtn.disabled = false;
     });
     const row = h("div", { class: "flex wrap", style: "gap:6px;align-items:center;margin:6px 0" },
-      idIn, modelIn, portIn, checkBtn, threadsIn, h("label", { class: "flex", style: "gap:4px" }, gpuIn, "GPU"), removeBtn, st);
-    const entry = { node: row, read: () => ({ id: idIn.value.trim() || autoId(modelIn.value), model: modelIn.value.trim(), port: parseInt(portIn.value) || 8090, threads: parseInt(threadsIn.value) || 0, gpu: gpuIn.checked }) };
+      idIn, modelSel, portIn, checkBtn, threadsIn, h("label", { class: "flex", style: "gap:4px" }, gpuIn, "GPU"), removeBtn, st);
+    const entry = { node: row, read: () => ({ id: idIn.value.trim() || autoId(modelSel.value), model: modelSel.value.trim(), port: parseInt(portIn.value) || 8090, threads: parseInt(threadsIn.value) || 0, gpu: gpuIn.checked }) };
     removeBtn.addEventListener("click", () => { const i = serverRows.indexOf(entry); if (i >= 0) serverRows.splice(i, 1); row.remove(); });
     serverRows.push(entry);
     serversWrap.appendChild(row);