From 9f702e230d5ee335d1083323fc7b016f099764f5 Mon Sep 17 00:00:00 2001
From: m4 <m4@m4deMac-mini.local>
Date: Tue, 21 Jul 2026 19:02:17 +0800
Subject: [PATCH] feat: adapter-spec-driven Registry Editor replaces legacy
 provider editors

- New RegistryEditor renders providers, models, runtime parameters and
  capabilities from the backend's AdapterParameterSpec contract, with
  ModelAvailability badges, write-once credential staging, provider tests
  showing effective_request_options, revision CAS on save, and 422 detail
  paths surfaced verbatim (design doc sections 9, 11.8)
- ConfigDialog now hosts the Registry Editor (admin-only; non-admins see a
  notice from the 403 path)
- AccountDialog shows the session role and embeds an admin user-management
  section (list/create/promote/demote/password reset/delete, last-admin
  guard enforced server-side)
- Deleted legacy ProviderProfiles/BuiltinProviders/RegistryBuiltinProviders
  editors, providerProfiles/legacyLlmConfig libs, the admin-token proxy and
  the /api/provider-profiles, /api/provider-actions, /api/default-model and
  /api/config BFF routes (design doc section 10 legacy removals)

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/app/api/config/route.ts                   |   34 -
 src/app/api/default-model/route.ts            |   12 -
 src/app/api/provider-actions/route.ts         |   12 -
 src/app/api/provider-profiles/route.ts        |   20 -
 src/app/components/AccountDialog.tsx          |   32 +-
 src/app/components/BuiltinProvidersEditor.tsx | 1263 -------------
 src/app/components/ConfigDialog.tsx           |   21 +-
 src/app/components/ModelProvidersEditor.tsx   |    5 -
 src/app/components/ProviderProfilesEditor.tsx | 1576 -----------------
 .../RegistryBuiltinProvidersEditor.tsx        | 1222 -------------
 src/app/components/RegistryEditor.tsx         | 1142 ++++++++++++
 src/app/components/UserManagementSection.tsx  |  239 +++
 src/lib/legacyLlmConfig.ts                    |  227 ---
 src/lib/providerProfiles.ts                   |  371 ----
 src/lib/registryDraft.ts                      |  156 ++
 src/lib/server/evoscientistAdminProxy.ts      |  175 --
 16 files changed, 1566 insertions(+), 4941 deletions(-)
 delete mode 100644 src/app/api/config/route.ts
 delete mode 100644 src/app/api/default-model/route.ts
 delete mode 100644 src/app/api/provider-actions/route.ts
 delete mode 100644 src/app/api/provider-profiles/route.ts
 delete mode 100644 src/app/components/BuiltinProvidersEditor.tsx
 delete mode 100644 src/app/components/ModelProvidersEditor.tsx
 delete mode 100644 src/app/components/ProviderProfilesEditor.tsx
 delete mode 100644 src/app/components/RegistryBuiltinProvidersEditor.tsx
 create mode 100644 src/app/components/RegistryEditor.tsx
 create mode 100644 src/app/components/UserManagementSection.tsx
 delete mode 100644 src/lib/legacyLlmConfig.ts
 delete mode 100644 src/lib/providerProfiles.ts
 create mode 100644 src/lib/registryDraft.ts
 delete mode 100644 src/lib/server/evoscientistAdminProxy.ts

diff --git a/src/app/api/config/route.ts b/src/app/api/config/route.ts
deleted file mode 100644
index 80e61b2..0000000
--- a/src/app/api/config/route.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-import { isAuthenticationEnabled } from "@/lib/auth";
-import { proxyEvoScientistAdminRequest } from "@/lib/server/evoscientistAdminProxy";
-
-export const runtime = "nodejs";
-
-async function proxy(request: NextRequest) {
-  if (!isAuthenticationEnabled()) {
-    return NextResponse.json(
-      {
-        error:
-          "Authentication required. Enable WebUI authentication to manage config.yaml.",
-      },
-      { status: 403 }
-    );
-  }
-  return proxyEvoScientistAdminRequest(request, {
-    upstreamPath: "/api/config",
-    requestLabel: "Built-in model configuration",
-    maxBodyBytes: 512_000,
-  });
-}
-
-export async function GET(request: NextRequest) {
-  return proxy(request);
-}
-
-export async function PATCH(request: NextRequest) {
-  return proxy(request);
-}
-
-export async function POST(request: NextRequest) {
-  return proxy(request);
-}
diff --git a/src/app/api/default-model/route.ts b/src/app/api/default-model/route.ts
deleted file mode 100644
index e5b4356..0000000
--- a/src/app/api/default-model/route.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { NextRequest } from "next/server";
-import { proxyEvoScientistAdminRequest } from "@/lib/server/evoscientistAdminProxy";
-
-export const runtime = "nodejs";
-
-export async function PUT(request: NextRequest) {
-  return proxyEvoScientistAdminRequest(request, {
-    upstreamPath: "/api/default-model",
-    requestLabel: "Default model configuration",
-    maxBodyBytes: 8_192,
-  });
-}
diff --git a/src/app/api/provider-actions/route.ts b/src/app/api/provider-actions/route.ts
deleted file mode 100644
index 2ff5221..0000000
--- a/src/app/api/provider-actions/route.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { NextRequest } from "next/server";
-import { proxyEvoScientistAdminRequest } from "@/lib/server/evoscientistAdminProxy";
-
-export const runtime = "nodejs";
-
-export async function POST(request: NextRequest) {
-  return proxyEvoScientistAdminRequest(request, {
-    upstreamPath: "/api/provider-actions",
-    requestLabel: "Provider action",
-    maxBodyBytes: 32_768,
-  });
-}
diff --git a/src/app/api/provider-profiles/route.ts b/src/app/api/provider-profiles/route.ts
deleted file mode 100644
index 87e1619..0000000
--- a/src/app/api/provider-profiles/route.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { NextRequest } from "next/server";
-import { proxyEvoScientistAdminRequest } from "@/lib/server/evoscientistAdminProxy";
-
-export const runtime = "nodejs";
-
-async function proxy(request: NextRequest) {
-  return proxyEvoScientistAdminRequest(request, {
-    upstreamPath: "/api/provider-profiles",
-    requestLabel: "Provider configuration",
-    maxBodyBytes: 512_000,
-  });
-}
-
-export async function GET(request: NextRequest) {
-  return proxy(request);
-}
-
-export async function PUT(request: NextRequest) {
-  return proxy(request);
-}
diff --git a/src/app/components/AccountDialog.tsx b/src/app/components/AccountDialog.tsx
index 7013fa3..f4ec090 100644
--- a/src/app/components/AccountDialog.tsx
+++ b/src/app/components/AccountDialog.tsx
@@ -10,6 +10,7 @@ import {
   DialogTitle,
 } from "@/components/ui/dialog";
 import { Button } from "@/components/ui/button";
+import { UserManagementSection } from "@/app/components/UserManagementSection";
 
 interface AccountDialogProps {
   open: boolean;
@@ -17,13 +18,16 @@ interface AccountDialogProps {
 }
 
 export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
-  const [username, setUsername] = useState<string | null>(null);
+  const [account, setAccount] = useState<{
+    username: string;
+    role: "admin" | "user";
+  } | null>(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
     if (!open) {
-      setUsername(null);
+      setAccount(null);
       setLoading(false);
       setError(null);
       return;
@@ -36,6 +40,7 @@ export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
       .then(async (response) => {
         const body = (await response.json().catch(() => null)) as {
           username?: unknown;
+          role?: unknown;
           error?: unknown;
         } | null;
         if (!response.ok || typeof body?.username !== "string") {
@@ -45,10 +50,13 @@ export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
               : "Account information is unavailable."
           );
         }
-        return body.username;
+        return {
+          username: body.username,
+          role: body.role === "user" ? ("user" as const) : ("admin" as const),
+        };
       })
       .then((value) => {
-        if (!cancelled) setUsername(value);
+        if (!cancelled) setAccount(value);
       })
       .catch((reason: unknown) => {
         if (!cancelled) {
@@ -73,7 +81,7 @@ export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
       open={open}
       onOpenChange={onOpenChange}
     >
-      <DialogContent className="sm:max-w-md">
+      <DialogContent className="sm:max-w-lg">
         <DialogHeader>
           <DialogTitle>User information</DialogTitle>
           <DialogDescription>
@@ -85,7 +93,7 @@ export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
           className="rounded-md border border-border px-4 py-3"
         >
           <p className="text-xs font-medium text-muted-foreground">Username</p>
-          {loading || (!error && username === null) ? (
+          {loading || (!error && account === null) ? (
             <p className="mt-1 text-sm text-muted-foreground">
               Loading account...
             </p>
@@ -96,12 +104,18 @@ export function AccountDialog({ open, onOpenChange }: AccountDialogProps) {
             >
               {error}
             </p>
-          ) : (
+          ) : account ? (
             <p className="mt-1 break-words text-sm font-medium text-foreground">
-              {username}
+              {account.username}
+              <span className="ml-2 rounded bg-accent px-1.5 py-0.5 text-xs font-normal text-muted-foreground">
+                {account.role}
+              </span>
             </p>
-          )}
+          ) : null}
         </section>
+        {account?.role === "admin" && (
+          <UserManagementSection self={account.username} />
+        )}
         <DialogFooter>
           <Button
             type="button"
diff --git a/src/app/components/BuiltinProvidersEditor.tsx b/src/app/components/BuiltinProvidersEditor.tsx
deleted file mode 100644
index 14ee6b4..0000000
--- a/src/app/components/BuiltinProvidersEditor.tsx
+++ /dev/null
@@ -1,1263 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useState } from "react";
-import {
-  Bot,
-  CheckCircle2,
-  CircleAlert,
-  Eye,
-  EyeOff,
-  FlaskConical,
-  Loader2,
-  Plus,
-  RefreshCw,
-  RotateCcw,
-  Save,
-  Server,
-  Trash2,
-} from "lucide-react";
-import { toast } from "sonner";
-import { invalidateAvailableModels } from "@/app/hooks/useAvailableModels";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
-import { Textarea } from "@/components/ui/textarea";
-import {
-  BuiltinModelConfig,
-  BuiltinProviderDraft,
-  discoverBuiltinProviderModels,
-  fetchLegacyLlmConfig,
-  LegacyLlmConfigResponse,
-  LegacyLlmSecretField,
-  LegacyLlmValueField,
-  LegacyLlmValues,
-  saveLegacyLlmConfig,
-  testBuiltinProviderModel,
-} from "@/lib/legacyLlmConfig";
-import { cn } from "@/lib/utils";
-
-interface BuiltinProviderDefinition {
-  id: string;
-  label: string;
-  apiKeyField?: LegacyLlmSecretField;
-  baseUrlField?: LegacyLlmValueField;
-  authModeField?: LegacyLlmValueField;
-  baseUrlPlaceholder?: string;
-}
-
-interface ModelTestState {
-  status: "success" | "error";
-  message: string;
-}
-
-interface AddModelDraft {
-  providerId: string;
-  id: string;
-  name: string;
-  model_id: string;
-}
-
-type ProviderConfigField = LegacyLlmValueField | LegacyLlmSecretField;
-
-const BUILTIN_PROVIDERS: BuiltinProviderDefinition[] = [
-  {
-    id: "anthropic",
-    label: "Anthropic",
-    apiKeyField: "anthropic_api_key",
-    baseUrlField: "anthropic_base_url",
-    authModeField: "anthropic_auth_mode",
-    baseUrlPlaceholder: "https://api.anthropic.com",
-  },
-  {
-    id: "openai",
-    label: "OpenAI",
-    apiKeyField: "openai_api_key",
-    authModeField: "openai_auth_mode",
-  },
-  {
-    id: "google-genai",
-    label: "Google GenAI",
-    apiKeyField: "google_api_key",
-  },
-  { id: "nvidia", label: "NVIDIA", apiKeyField: "nvidia_api_key" },
-  {
-    id: "minimax",
-    label: "MiniMax",
-    apiKeyField: "minimax_api_key",
-    baseUrlField: "minimax_base_url",
-    baseUrlPlaceholder: "https://api.minimaxi.com/anthropic",
-  },
-  {
-    id: "siliconflow",
-    label: "SiliconFlow",
-    apiKeyField: "siliconflow_api_key",
-  },
-  {
-    id: "openrouter",
-    label: "OpenRouter",
-    apiKeyField: "openrouter_api_key",
-  },
-  {
-    id: "deepseek",
-    label: "DeepSeek",
-    apiKeyField: "deepseek_api_key",
-  },
-  { id: "zhipu", label: "Zhipu", apiKeyField: "zhipu_api_key" },
-  {
-    id: "zhipu-code",
-    label: "Zhipu Code",
-    apiKeyField: "zhipu_api_key",
-  },
-  {
-    id: "volcengine",
-    label: "Volcengine",
-    apiKeyField: "volcengine_api_key",
-  },
-  {
-    id: "dashscope",
-    label: "DashScope",
-    apiKeyField: "dashscope_api_key",
-  },
-  {
-    id: "dashscope-code",
-    label: "DashScope Code",
-    apiKeyField: "dashscope_api_key",
-  },
-  {
-    id: "moonshot",
-    label: "Moonshot",
-    apiKeyField: "moonshot_api_key",
-  },
-  {
-    id: "kimi-coding",
-    label: "Kimi Coding",
-    apiKeyField: "kimi_api_key",
-  },
-  {
-    id: "custom-openai",
-    label: "Custom OpenAI",
-    apiKeyField: "custom_openai_api_key",
-    baseUrlField: "custom_openai_base_url",
-    baseUrlPlaceholder: "https://api.example.com/v1",
-  },
-  {
-    id: "custom-anthropic",
-    label: "Custom Anthropic",
-    apiKeyField: "custom_anthropic_api_key",
-    baseUrlField: "custom_anthropic_base_url",
-    baseUrlPlaceholder: "https://api.example.com",
-  },
-  {
-    id: "ollama",
-    label: "Ollama",
-    baseUrlField: "ollama_base_url",
-    baseUrlPlaceholder: "http://127.0.0.1:11434",
-  },
-];
-
-function providerFields(
-  provider: BuiltinProviderDefinition
-): ProviderConfigField[] {
-  const result: ProviderConfigField[] = [];
-  if (provider.apiKeyField) result.push(provider.apiKeyField);
-  if (provider.baseUrlField) result.push(provider.baseUrlField);
-  if (provider.authModeField) result.push(provider.authModeField);
-  return result;
-}
-
-function uniqueProviderOptions(current: string): BuiltinProviderDefinition[] {
-  if (
-    !current ||
-    BUILTIN_PROVIDERS.some((provider) => provider.id === current)
-  ) {
-    return BUILTIN_PROVIDERS;
-  }
-  return [{ id: current, label: current }, ...BUILTIN_PROVIDERS];
-}
-
-function normalizeModelAlias(value: string): string {
-  return value
-    .toLowerCase()
-    .replace(/[^a-z0-9._-]+/g, "-")
-    .replace(/^[^a-z0-9]+/, "")
-    .replace(/-+$/g, "")
-    .slice(0, 64);
-}
-
-function nextModelAlias(base: string, used: Iterable<string>): string {
-  const existing = new Set(used);
-  if (!existing.has(base)) return base;
-  let suffix = 2;
-  while (existing.has(`${base}-${suffix}`)) suffix += 1;
-  return `${base}-${suffix}`;
-}
-
-function discoveredModelAlias(
-  modelId: string,
-  usedAliases: Set<string>
-): string {
-  const segments = modelId.split("/").filter(Boolean);
-  const base =
-    normalizeModelAlias(segments.at(-1) || modelId) || "configured-model";
-  const alias = nextModelAlias(base, usedAliases);
-  usedAliases.add(alias);
-  return alias;
-}
-
-function modelTestKey(model: BuiltinModelConfig): string {
-  return `${model.provider}:${model.id}:${model.model_id}`;
-}
-
-export function BuiltinProvidersEditor() {
-  const [config, setConfig] = useState<LegacyLlmConfigResponse | null>(null);
-  const [values, setValues] = useState<LegacyLlmValues | null>(null);
-  const [selectedProviderId, setSelectedProviderId] = useState("");
-  const [modelCatalog, setModelCatalog] = useState<BuiltinModelConfig[] | null>(
-    null
-  );
-  const [secretDrafts, setSecretDrafts] = useState<
-    Partial<Record<LegacyLlmSecretField, string>>
-  >({});
-  const [clearSecrets, setClearSecrets] = useState<Set<LegacyLlmSecretField>>(
-    () => new Set()
-  );
-  const [visibleSecret, setVisibleSecret] =
-    useState<LegacyLlmSecretField | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState(false);
-  const [discoveringProviderId, setDiscoveringProviderId] = useState<
-    string | null
-  >(null);
-  const [testingModelKey, setTestingModelKey] = useState<string | null>(null);
-  const [modelTests, setModelTests] = useState<Record<string, ModelTestState>>(
-    {}
-  );
-  const [addModelDraft, setAddModelDraft] = useState<AddModelDraft | null>(
-    null
-  );
-  const [error, setError] = useState<string | null>(null);
-
-  const applyResponse = (response: LegacyLlmConfigResponse) => {
-    setConfig(response);
-    setValues(response.values);
-    setModelCatalog(response.model_catalog);
-    setSecretDrafts({});
-    setClearSecrets(new Set());
-    setVisibleSecret(null);
-    setError(response.model_catalog_error);
-    setSelectedProviderId((current) =>
-      current && BUILTIN_PROVIDERS.some((provider) => provider.id === current)
-        ? current
-        : BUILTIN_PROVIDERS.some(
-            (provider) => provider.id === response.values.provider
-          )
-        ? response.values.provider
-        : "anthropic"
-    );
-  };
-
-  const loadConfig = async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      applyResponse(await fetchLegacyLlmConfig());
-    } catch (reason) {
-      setError(
-        reason instanceof Error
-          ? reason.message
-          : "Could not load built-in model configuration."
-      );
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  useEffect(() => {
-    void loadConfig();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  const selectedProvider =
-    BUILTIN_PROVIDERS.find((provider) => provider.id === selectedProviderId) ??
-    BUILTIN_PROVIDERS[0];
-  const selectedModels = (modelCatalog ?? []).filter(
-    (model) => model.provider === selectedProvider.id
-  );
-
-  const hasChanges = useMemo(() => {
-    if (!config || !values) return false;
-    return (
-      JSON.stringify(values) !== JSON.stringify(config.values) ||
-      JSON.stringify(modelCatalog) !== JSON.stringify(config.model_catalog) ||
-      Object.values(secretDrafts).some((value) => Boolean(value?.trim())) ||
-      clearSecrets.size > 0
-    );
-  }, [clearSecrets, config, modelCatalog, secretDrafts, values]);
-
-  const updateValue = (field: LegacyLlmValueField, value: string) => {
-    setValues((current) =>
-      current ? { ...current, [field]: value } : current
-    );
-  };
-
-  const updateSecret = (field: LegacyLlmSecretField, value: string) => {
-    setSecretDrafts((current) => ({ ...current, [field]: value }));
-    setClearSecrets((current) => {
-      if (!current.has(field)) return current;
-      const next = new Set(current);
-      next.delete(field);
-      return next;
-    });
-  };
-
-  const toggleClearSecret = (field: LegacyLlmSecretField) => {
-    setSecretDrafts((current) => ({ ...current, [field]: "" }));
-    setVisibleSecret((current) => (current === field ? null : current));
-    setClearSecrets((current) => {
-      const next = new Set(current);
-      if (next.has(field)) next.delete(field);
-      else next.add(field);
-      return next;
-    });
-  };
-
-  const providerActionDraft = (
-    provider: BuiltinProviderDefinition
-  ): BuiltinProviderDraft => {
-    const draft: BuiltinProviderDraft = { id: provider.id };
-    if (
-      provider.baseUrlField &&
-      !config?.env_overrides[provider.baseUrlField]
-    ) {
-      draft.base_url = values?.[provider.baseUrlField] ?? "";
-    }
-    if (provider.apiKeyField && !config?.env_overrides[provider.apiKeyField]) {
-      const secret = secretDrafts[provider.apiKeyField];
-      if (secret?.trim()) draft.api_key = secret;
-      if (clearSecrets.has(provider.apiKeyField)) draft.clear_api_key = true;
-    }
-    return draft;
-  };
-
-  const addModels = (
-    providerId: string,
-    discovered: Array<{ model_id: string; name: string }>
-  ) => {
-    const current = modelCatalog ?? [];
-    const providerModels = current.filter(
-      (model) => model.provider === providerId
-    );
-    const existingModelIds = new Set(
-      providerModels.map((model) => model.model_id.trim()).filter(Boolean)
-    );
-    const usedAliases = new Set(providerModels.map((model) => model.id));
-    const additions: BuiltinModelConfig[] = discovered
-      .filter((model) => {
-        if (existingModelIds.has(model.model_id)) return false;
-        existingModelIds.add(model.model_id);
-        return true;
-      })
-      .map((model) => ({
-        provider: providerId,
-        id: discoveredModelAlias(model.model_id, usedAliases),
-        name: model.name || model.model_id,
-        model_id: model.model_id,
-        enabled: true,
-      }));
-    setModelCatalog([...current, ...additions]);
-    return additions.length;
-  };
-
-  const enableConfiguredOnlyMode = () => {
-    if (!values || !config) return;
-    const candidate = config.builtin_model_candidates.find(
-      (model) =>
-        model.provider === values.provider &&
-        (model.id === values.model || model.model_id === values.model)
-    );
-    const defaultProviderIsBuiltIn = BUILTIN_PROVIDERS.some(
-      (provider) => provider.id === values.provider
-    );
-    setModelCatalog(
-      candidate
-        ? [{ ...candidate, enabled: true }]
-        : defaultProviderIsBuiltIn
-        ? [
-            {
-              provider: values.provider,
-              id: normalizeModelAlias(values.model) || "default-model",
-              name: values.model,
-              model_id: values.model,
-              enabled: true,
-            },
-          ]
-        : []
-    );
-  };
-
-  const handleDiscoverModels = async () => {
-    setDiscoveringProviderId(selectedProvider.id);
-    setError(null);
-    try {
-      const discovered = await discoverBuiltinProviderModels(
-        providerActionDraft(selectedProvider)
-      );
-      const additions = addModels(selectedProvider.id, discovered);
-      if (discovered.length === 0) {
-        toast.info("The provider returned no usable chat models.");
-      } else if (additions === 0) {
-        toast.info(
-          discovered.length + " models found; all are already configured."
-        );
-      } else {
-        toast.success(
-          discovered.length +
-            " models found; " +
-            additions +
-            " added to the catalog."
-        );
-      }
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not retrieve models from the provider.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setDiscoveringProviderId(null);
-    }
-  };
-
-  const addKnownModels = () => {
-    if (!config) return;
-    const candidates = config.builtin_model_candidates.filter(
-      (model) => model.provider === selectedProvider.id
-    );
-    const additions = addModels(selectedProvider.id, candidates);
-    if (additions > 0) {
-      toast.success(additions + " known models added to the catalog.");
-    } else {
-      toast.info("All known models are already configured.");
-    }
-  };
-
-  const updateModel = (
-    model: BuiltinModelConfig,
-    update: (model: BuiltinModelConfig) => BuiltinModelConfig
-  ) => {
-    setModelCatalog((current) =>
-      (current ?? []).map((candidate) =>
-        candidate.provider === model.provider && candidate.id === model.id
-          ? update(candidate)
-          : candidate
-      )
-    );
-  };
-
-  const removeModel = (model: BuiltinModelConfig) => {
-    setModelCatalog((current) =>
-      (current ?? []).filter(
-        (candidate) =>
-          candidate.provider !== model.provider || candidate.id !== model.id
-      )
-    );
-  };
-
-  const openAddModel = () => {
-    const id = nextModelAlias(
-      "model",
-      selectedModels.map((model) => model.id)
-    );
-    setAddModelDraft({
-      providerId: selectedProvider.id,
-      id,
-      name: "New model",
-      model_id: "",
-    });
-  };
-
-  const confirmAddModel = () => {
-    if (!addModelDraft) return;
-    const id = normalizeModelAlias(addModelDraft.id);
-    const name = addModelDraft.name.trim();
-    const modelId = addModelDraft.model_id.trim();
-    if (!id || !name || !modelId) {
-      toast.error("Alias, display name, and upstream model ID are required.");
-      return;
-    }
-    if (
-      (modelCatalog ?? []).some(
-        (model) =>
-          model.provider === addModelDraft.providerId && model.id === id
-      )
-    ) {
-      toast.error('Model alias "' + id + '" is already in use.');
-      return;
-    }
-    setModelCatalog((current) => [
-      ...(current ?? []),
-      {
-        provider: addModelDraft.providerId,
-        id,
-        name,
-        model_id: modelId,
-        enabled: true,
-      },
-    ]);
-    setAddModelDraft(null);
-  };
-
-  const handleTestModel = async (model: BuiltinModelConfig) => {
-    const key = modelTestKey(model);
-    setTestingModelKey(key);
-    setError(null);
-    setModelTests((current) => {
-      const next = { ...current };
-      delete next[key];
-      return next;
-    });
-    try {
-      const result = await testBuiltinProviderModel(
-        providerActionDraft(selectedProvider),
-        model
-      );
-      const response = result.response.trim();
-      const message =
-        "Connected in " +
-        result.latency_ms +
-        " ms" +
-        (response ? ": " + response : "");
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "success", message },
-      }));
-      toast.success(message);
-    } catch (reason) {
-      const message =
-        reason instanceof Error ? reason.message : "Model test failed.";
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "error", message },
-      }));
-      toast.error(message);
-    } finally {
-      setTestingModelKey(null);
-    }
-  };
-
-  const handleSave = async () => {
-    if (!config || !values) return;
-    if (modelCatalog !== null) {
-      const defaultProviderIsBuiltIn = BUILTIN_PROVIDERS.some(
-        (provider) => provider.id === values.provider
-      );
-      const defaultEnabled = modelCatalog.some(
-        (model) =>
-          model.enabled &&
-          model.provider === values.provider &&
-          model.id === values.model
-      );
-      if (defaultProviderIsBuiltIn && !defaultEnabled) {
-        const message =
-          'Enable the default model "' +
-          values.model +
-          '" for provider "' +
-          values.provider +
-          '" before saving.';
-        setError(message);
-        toast.error(message);
-        return;
-      }
-    }
-    setSaving(true);
-    setError(null);
-    try {
-      const secrets = Object.fromEntries(
-        Object.entries(secretDrafts).filter(([, value]) => value?.trim())
-      ) as Partial<Record<LegacyLlmSecretField, string>>;
-      const response = await saveLegacyLlmConfig({
-        revision: config.revision,
-        values,
-        secrets,
-        clear_secrets: [...clearSecrets],
-        model_catalog: modelCatalog,
-      });
-      applyResponse(response);
-      invalidateAvailableModels();
-      toast.success("Built-in model configuration saved.");
-      if (response.restart_required) {
-        toast.info("Restart EvoScientist to apply connection changes.");
-      }
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not save built-in model configuration.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setSaving(false);
-    }
-  };
-
-  if (loading) {
-    return (
-      <div className="flex min-h-80 items-center justify-center text-sm text-muted-foreground">
-        <Loader2 className="mr-2 size-4 animate-spin" />
-        Loading built-in providers...
-      </div>
-    );
-  }
-
-  if (!config || !values) {
-    return (
-      <div className="space-y-3">
-        <div
-          role="alert"
-          className="rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive"
-        >
-          {error || "Built-in model configuration is unavailable."}
-        </div>
-        <Button
-          type="button"
-          variant="outline"
-          size="sm"
-          onClick={loadConfig}
-        >
-          <RefreshCw className="size-4" />
-          Reload
-        </Button>
-      </div>
-    );
-  }
-
-  const apiKeyField = selectedProvider.apiKeyField;
-  const apiKeyStatus = apiKeyField ? config.secrets[apiKeyField] : null;
-  const selectedEnvOverrides = providerFields(selectedProvider)
-    .map(
-      (field) =>
-        config.env_overrides[field as keyof typeof config.env_overrides]
-    )
-    .filter((name): name is string => Boolean(name));
-  const providerConfigured = Boolean(
-    (apiKeyField && apiKeyStatus?.configured) ||
-      (selectedProvider.baseUrlField &&
-        values[selectedProvider.baseUrlField]) ||
-      (selectedProvider.authModeField &&
-        values[selectedProvider.authModeField] === "oauth")
-  );
-
-  return (
-    <div className="space-y-3">
-      {error && (
-        <div
-          role="alert"
-          className="rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive"
-        >
-          {error}
-        </div>
-      )}
-
-      <div className="grid min-h-[28rem] overflow-hidden rounded-md border border-border md:grid-cols-[15rem_minmax(0,1fr)]">
-        <aside className="border-b border-border bg-muted/20 md:border-b-0 md:border-r">
-          <div className="border-b border-border px-3 py-3">
-            <span className="text-sm font-medium">Built-in providers</span>
-          </div>
-          <div className="max-h-44 overflow-y-auto p-1.5 md:max-h-[29rem]">
-            {BUILTIN_PROVIDERS.map((provider) => {
-              const fields = providerFields(provider);
-              const hasEnvironmentOverride = fields.some(
-                (field) => field in config.env_overrides
-              );
-              const secretConfigured = provider.apiKeyField
-                ? config.secrets[provider.apiKeyField].configured
-                : false;
-              const fileConfigured = Boolean(
-                secretConfigured ||
-                  (provider.baseUrlField && values[provider.baseUrlField]) ||
-                  (provider.authModeField &&
-                    values[provider.authModeField] === "oauth")
-              );
-              return (
-                <button
-                  type="button"
-                  key={provider.id}
-                  onClick={() => {
-                    setSelectedProviderId(provider.id);
-                    setVisibleSecret(null);
-                  }}
-                  className={cn(
-                    "flex w-full items-center gap-2 rounded px-2.5 py-2 text-left transition-colors hover:bg-accent",
-                    selectedProviderId === provider.id && "bg-accent"
-                  )}
-                >
-                  <Server className="size-4 shrink-0 text-muted-foreground" />
-                  <span className="min-w-0 flex-1">
-                    <span className="block truncate text-sm font-medium">
-                      {provider.label}
-                    </span>
-                    <span className="block truncate font-mono text-[11px] text-muted-foreground">
-                      {provider.id}
-                    </span>
-                  </span>
-                  {hasEnvironmentOverride ? (
-                    <span className="text-[10px] font-medium text-amber-700 dark:text-amber-400">
-                      ENV
-                    </span>
-                  ) : fileConfigured ? (
-                    <CheckCircle2 className="size-3.5 text-emerald-600 dark:text-emerald-400" />
-                  ) : null}
-                </button>
-              );
-            })}
-          </div>
-        </aside>
-
-        <div className="min-w-0 overflow-y-auto p-4 md:max-h-[31rem]">
-          <div className="space-y-5">
-            <section>
-              <div className="mb-3">
-                <h3 className="text-sm font-semibold">Default routing</h3>
-              </div>
-              <div className="grid gap-3 sm:grid-cols-2">
-                <div className="grid gap-1.5">
-                  <Label>Default provider</Label>
-                  <Select
-                    value={values.provider}
-                    onValueChange={(value) => updateValue("provider", value)}
-                  >
-                    <SelectTrigger className="h-9 bg-background">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      {uniqueProviderOptions(values.provider).map(
-                        (provider) => (
-                          <SelectItem
-                            key={provider.id}
-                            value={provider.id}
-                          >
-                            {provider.label}
-                          </SelectItem>
-                        )
-                      )}
-                    </SelectContent>
-                  </Select>
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="legacy-default-model">Default model</Label>
-                  <Input
-                    id="legacy-default-model"
-                    className="font-mono"
-                    value={values.model}
-                    onChange={(event) =>
-                      updateValue("model", event.target.value)
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="legacy-aux-provider">
-                    Auxiliary provider
-                  </Label>
-                  <Input
-                    id="legacy-aux-provider"
-                    className="font-mono"
-                    placeholder="Use default provider"
-                    value={values.auxiliary_provider}
-                    onChange={(event) =>
-                      updateValue("auxiliary_provider", event.target.value)
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="legacy-aux-model">Auxiliary model</Label>
-                  <Input
-                    id="legacy-aux-model"
-                    className="font-mono"
-                    placeholder="Use default model"
-                    value={values.auxiliary_model}
-                    onChange={(event) =>
-                      updateValue("auxiliary_model", event.target.value)
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5 sm:col-span-2">
-                  <Label htmlFor="legacy-model-fallbacks">
-                    Model fallbacks
-                  </Label>
-                  <Textarea
-                    id="legacy-model-fallbacks"
-                    className="min-h-16 resize-y font-mono"
-                    placeholder="model:provider,model:provider"
-                    value={values.model_fallbacks}
-                    onChange={(event) =>
-                      updateValue("model_fallbacks", event.target.value)
-                    }
-                  />
-                </div>
-              </div>
-            </section>
-
-            <section className="border-t border-border pt-4">
-              <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
-                <div>
-                  <h3 className="text-sm font-semibold">
-                    {selectedProvider.label}
-                  </h3>
-                  <p className="font-mono text-xs text-muted-foreground">
-                    {selectedProvider.id}
-                  </p>
-                </div>
-                <div className="flex flex-wrap items-center gap-2 text-xs">
-                  {selectedEnvOverrides.length > 0 && (
-                    <span className="rounded border border-amber-500/40 bg-amber-500/10 px-2 py-1 text-amber-800 dark:text-amber-300">
-                      ENV: {selectedEnvOverrides.join(", ")}
-                    </span>
-                  )}
-                  {providerConfigured && (
-                    <span className="flex items-center gap-1 text-emerald-700 dark:text-emerald-400">
-                      <CheckCircle2 className="size-3.5" />
-                      Configured
-                    </span>
-                  )}
-                </div>
-              </div>
-
-              <div className="grid gap-3 sm:grid-cols-2">
-                {selectedProvider.authModeField && (
-                  <div className="grid gap-1.5">
-                    <Label>Authentication</Label>
-                    <Select
-                      value={values[selectedProvider.authModeField]}
-                      onValueChange={(value) =>
-                        updateValue(selectedProvider.authModeField!, value)
-                      }
-                    >
-                      <SelectTrigger className="h-9 bg-background">
-                        <SelectValue />
-                      </SelectTrigger>
-                      <SelectContent className="bg-background text-foreground">
-                        <SelectItem value="api_key">API key</SelectItem>
-                        <SelectItem value="oauth">OAuth</SelectItem>
-                      </SelectContent>
-                    </Select>
-                  </div>
-                )}
-
-                {selectedProvider.baseUrlField && (
-                  <div
-                    className={cn(
-                      "grid gap-1.5",
-                      !selectedProvider.authModeField && "sm:col-span-2"
-                    )}
-                  >
-                    <Label htmlFor="legacy-provider-base-url">Base URL</Label>
-                    <Input
-                      id="legacy-provider-base-url"
-                      type="url"
-                      inputMode="url"
-                      placeholder={selectedProvider.baseUrlPlaceholder}
-                      value={values[selectedProvider.baseUrlField]}
-                      onChange={(event) =>
-                        updateValue(
-                          selectedProvider.baseUrlField!,
-                          event.target.value
-                        )
-                      }
-                    />
-                  </div>
-                )}
-
-                {apiKeyField && (
-                  <div className="grid gap-1.5 sm:col-span-2">
-                    <Label htmlFor="legacy-provider-api-key">API key</Label>
-                    <div className="flex gap-2">
-                      <Input
-                        id="legacy-provider-api-key"
-                        type={
-                          visibleSecret === apiKeyField ? "text" : "password"
-                        }
-                        autoComplete="new-password"
-                        placeholder={
-                          clearSecrets.has(apiKeyField)
-                            ? "Will be cleared on save"
-                            : apiKeyStatus?.configured
-                            ? `Configured${
-                                apiKeyStatus.hint
-                                  ? ` (${apiKeyStatus.hint})`
-                                  : ""
-                              }; leave empty to keep it`
-                            : config.env_overrides[apiKeyField]
-                            ? `Managed by ${config.env_overrides[apiKeyField]}`
-                            : "Enter API key"
-                        }
-                        value={secretDrafts[apiKeyField] ?? ""}
-                        onChange={(event) =>
-                          updateSecret(apiKeyField, event.target.value)
-                        }
-                      />
-                      <Button
-                        type="button"
-                        variant="outline"
-                        size="icon"
-                        disabled={!secretDrafts[apiKeyField]}
-                        onClick={() =>
-                          setVisibleSecret((current) =>
-                            current === apiKeyField ? null : apiKeyField
-                          )
-                        }
-                        aria-label={
-                          visibleSecret === apiKeyField
-                            ? "Hide API key"
-                            : "Show API key"
-                        }
-                        title={
-                          visibleSecret === apiKeyField
-                            ? "Hide API key"
-                            : "Show API key"
-                        }
-                      >
-                        {visibleSecret === apiKeyField ? (
-                          <EyeOff className="size-4" />
-                        ) : (
-                          <Eye className="size-4" />
-                        )}
-                      </Button>
-                      {(apiKeyStatus?.configured ||
-                        clearSecrets.has(apiKeyField)) && (
-                        <Button
-                          type="button"
-                          variant="outline"
-                          size="icon"
-                          onClick={() => toggleClearSecret(apiKeyField)}
-                          aria-label={
-                            clearSecrets.has(apiKeyField)
-                              ? "Keep saved API key"
-                              : "Clear saved API key"
-                          }
-                          title={
-                            clearSecrets.has(apiKeyField)
-                              ? "Keep saved API key"
-                              : "Clear saved API key"
-                          }
-                        >
-                          {clearSecrets.has(apiKeyField) ? (
-                            <RotateCcw className="size-4" />
-                          ) : (
-                            <Trash2 className="size-4" />
-                          )}
-                        </Button>
-                      )}
-                    </div>
-                    {clearSecrets.has(apiKeyField) && (
-                      <p className="flex items-center gap-1 text-xs text-destructive">
-                        <CircleAlert className="size-3.5" />
-                        API key will be cleared when saved.
-                      </p>
-                    )}
-                  </div>
-                )}
-
-                {!apiKeyField && !selectedProvider.baseUrlField && (
-                  <div className="flex min-h-24 items-center justify-center text-sm text-muted-foreground sm:col-span-2">
-                    No file-backed connection fields.
-                  </div>
-                )}
-              </div>
-            </section>
-
-            <section className="border-t border-border pt-4">
-              <div className="mb-3 flex flex-wrap items-center justify-between gap-3">
-                <div>
-                  <h3 className="text-sm font-semibold">Models</h3>
-                  <p className="text-xs text-muted-foreground">
-                    Enabled aliases appear in the conversation model picker.
-                  </p>
-                </div>
-                <div className="flex flex-wrap items-center gap-2">
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    disabled={discoveringProviderId === selectedProvider.id}
-                    onClick={handleDiscoverModels}
-                  >
-                    {discoveringProviderId === selectedProvider.id ? (
-                      <Loader2 className="size-4 animate-spin" />
-                    ) : (
-                      <RefreshCw className="size-4" />
-                    )}
-                    Fetch
-                  </Button>
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    onClick={addKnownModels}
-                  >
-                    <Plus className="size-4" />
-                    Known
-                  </Button>
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    onClick={openAddModel}
-                  >
-                    <Plus className="size-4" />
-                    Add
-                  </Button>
-                </div>
-              </div>
-
-              {modelCatalog === null ? (
-                <div className="rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-3">
-                  <div className="flex flex-wrap items-center justify-between gap-3">
-                    <div className="min-w-0">
-                      <p className="text-sm font-medium">
-                        Legacy model registry
-                      </p>
-                      <p className="text-xs text-muted-foreground">
-                        All built-in models remain visible until a configured
-                        model catalog is saved.
-                      </p>
-                    </div>
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      onClick={enableConfiguredOnlyMode}
-                    >
-                      <CheckCircle2 className="size-4" />
-                      Configure selected only
-                    </Button>
-                  </div>
-                </div>
-              ) : (
-                <div className="overflow-hidden rounded-md border border-border bg-background">
-                  {selectedModels.length === 0 ? (
-                    <div className="py-7 text-center text-xs text-muted-foreground">
-                      No models configured for this provider.
-                    </div>
-                  ) : (
-                    <div className="max-h-64 overflow-y-auto p-2">
-                      <div className="grid gap-1.5 sm:grid-cols-2">
-                        {selectedModels.map((model) => {
-                          const key = modelTestKey(model);
-                          const testState = modelTests[key];
-                          return (
-                            <div
-                              key={key}
-                              className={cn(
-                                "group flex h-11 min-w-0 items-center gap-2 rounded bg-muted/60 px-2",
-                                !model.enabled && "opacity-50"
-                              )}
-                              title={
-                                "Alias: " +
-                                model.id +
-                                "\nUpstream: " +
-                                model.model_id
-                              }
-                            >
-                              <Bot className="size-3.5 shrink-0 text-muted-foreground" />
-                              <span className="min-w-0 flex-1">
-                                <span className="block truncate text-xs font-medium">
-                                  {model.name}
-                                </span>
-                                <span className="block truncate font-mono text-[10px] text-muted-foreground">
-                                  {model.id}
-                                </span>
-                              </span>
-                              <label
-                                className="flex size-7 shrink-0 items-center justify-center"
-                                title={model.enabled ? "Disable" : "Enable"}
-                              >
-                                <input
-                                  type="checkbox"
-                                  checked={model.enabled}
-                                  onChange={(event) =>
-                                    updateModel(model, (current) => ({
-                                      ...current,
-                                      enabled: event.target.checked,
-                                    }))
-                                  }
-                                  className="size-3.5 accent-[var(--brand)]"
-                                  aria-label={"Enable " + model.name}
-                                />
-                              </label>
-                              <Button
-                                type="button"
-                                variant="ghost"
-                                size="icon"
-                                className={cn(
-                                  "size-7 shrink-0",
-                                  testState?.status === "success" &&
-                                    "text-emerald-600 dark:text-emerald-400",
-                                  testState?.status === "error" &&
-                                    "text-destructive"
-                                )}
-                                disabled={testingModelKey === key}
-                                onClick={() => handleTestModel(model)}
-                                aria-label={"Test " + model.name}
-                                title={testState?.message || "Test model"}
-                              >
-                                {testingModelKey === key ? (
-                                  <Loader2 className="size-3.5 animate-spin" />
-                                ) : testState?.status === "success" ? (
-                                  <CheckCircle2 className="size-3.5" />
-                                ) : testState?.status === "error" ? (
-                                  <CircleAlert className="size-3.5" />
-                                ) : (
-                                  <FlaskConical className="size-3.5" />
-                                )}
-                              </Button>
-                              <Button
-                                type="button"
-                                variant="ghost"
-                                size="icon"
-                                className="size-7 shrink-0 text-muted-foreground hover:text-destructive"
-                                onClick={() => removeModel(model)}
-                                aria-label={"Delete " + model.name}
-                                title="Delete model"
-                              >
-                                <Trash2 className="size-3.5" />
-                              </Button>
-                            </div>
-                          );
-                        })}
-                      </div>
-                    </div>
-                  )}
-                </div>
-              )}
-            </section>
-          </div>
-        </div>
-      </div>
-
-      <div className="flex flex-wrap justify-end gap-2">
-        <Button
-          type="button"
-          variant="outline"
-          onClick={loadConfig}
-          disabled={saving}
-        >
-          <RefreshCw className="size-4" />
-          Reload
-        </Button>
-        <Button
-          type="button"
-          onClick={handleSave}
-          disabled={saving || !hasChanges}
-        >
-          {saving ? (
-            <Loader2 className="size-4 animate-spin" />
-          ) : (
-            <Save className="size-4" />
-          )}
-          Save config.yaml
-        </Button>
-      </div>
-
-      <Dialog
-        open={Boolean(addModelDraft)}
-        onOpenChange={(open) => {
-          if (!open) setAddModelDraft(null);
-        }}
-      >
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
-            <DialogTitle>Add built-in model</DialogTitle>
-            <DialogDescription>
-              Configure the alias used by conversations and the upstream model
-              ID sent to the provider.
-            </DialogDescription>
-          </DialogHeader>
-          {addModelDraft && (
-            <div className="grid gap-3 py-2">
-              <div className="grid gap-1.5">
-                <Label htmlFor="builtin-model-alias">Alias</Label>
-                <Input
-                  id="builtin-model-alias"
-                  className="font-mono"
-                  value={addModelDraft.id}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? {
-                            ...current,
-                            id: normalizeModelAlias(event.target.value),
-                          }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="builtin-model-name">Display name</Label>
-                <Input
-                  id="builtin-model-name"
-                  value={addModelDraft.name}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, name: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="builtin-model-upstream">
-                  Upstream model ID
-                </Label>
-                <Input
-                  id="builtin-model-upstream"
-                  className="font-mono"
-                  value={addModelDraft.model_id}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, model_id: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-            </div>
-          )}
-          <DialogFooter>
-            <Button
-              type="button"
-              variant="outline"
-              onClick={() => setAddModelDraft(null)}
-            >
-              Cancel
-            </Button>
-            <Button
-              type="button"
-              onClick={confirmAddModel}
-            >
-              Add model
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </div>
-  );
-}
diff --git a/src/app/components/ConfigDialog.tsx b/src/app/components/ConfigDialog.tsx
index 0df4744..6177aa8 100644
--- a/src/app/components/ConfigDialog.tsx
+++ b/src/app/components/ConfigDialog.tsx
@@ -10,7 +10,7 @@ import {
 import { Button } from "@/components/ui/button";
 import { Label } from "@/components/ui/label";
 import { useCollapseAgentActions } from "@/lib/uiSettings";
-import { ModelProvidersEditor } from "@/app/components/ModelProvidersEditor";
+import { RegistryEditor } from "@/app/components/RegistryEditor";
 
 interface ConfigDialogProps {
   open: boolean;
@@ -22,10 +22,6 @@ export function ConfigDialog({ open, onOpenChange }: ConfigDialogProps) {
   const { value: collapseAgentActions, setValue: setCollapseAgentActions } =
     useCollapseAgentActions();
 
-  const handleSave = () => {
-    onOpenChange(false);
-  };
-
   return (
     <Dialog
       open={open}
@@ -33,12 +29,13 @@ export function ConfigDialog({ open, onOpenChange }: ConfigDialogProps) {
     >
       <DialogContent className="sm:max-w-5xl">
         <DialogHeader>
-          <DialogTitle>Model configuration</DialogTitle>
+          <DialogTitle>Model registry</DialogTitle>
           <DialogDescription>
-            Manage custom model providers available to EvoScientist.
+            Manage providers, models, credentials and defaults. Admin only;
+            every save is validated by the backend.
           </DialogDescription>
         </DialogHeader>
-        <ModelProvidersEditor />
+        {open && <RegistryEditor />}
         <div className="flex items-start gap-2">
           <input
             id="collapseAgentActions"
@@ -56,13 +53,7 @@ export function ConfigDialog({ open, onOpenChange }: ConfigDialogProps) {
           </Label>
         </div>
         <DialogFooter>
-          <Button
-            variant="outline"
-            onClick={() => onOpenChange(false)}
-          >
-            Cancel
-          </Button>
-          <Button onClick={handleSave}>Save</Button>
+          <Button onClick={() => onOpenChange(false)}>Close</Button>
         </DialogFooter>
       </DialogContent>
     </Dialog>
diff --git a/src/app/components/ModelProvidersEditor.tsx b/src/app/components/ModelProvidersEditor.tsx
deleted file mode 100644
index fa5c494..0000000
--- a/src/app/components/ModelProvidersEditor.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { ProviderProfilesEditor } from "@/app/components/ProviderProfilesEditor";
-
-export function ModelProvidersEditor() {
-  return <ProviderProfilesEditor />;
-}
diff --git a/src/app/components/ProviderProfilesEditor.tsx b/src/app/components/ProviderProfilesEditor.tsx
deleted file mode 100644
index fb6b8c9..0000000
--- a/src/app/components/ProviderProfilesEditor.tsx
+++ /dev/null
@@ -1,1576 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useRef, useState } from "react";
-import {
-  Bot,
-  CheckCircle2,
-  ChevronDown,
-  ChevronUp,
-  CircleAlert,
-  Eye,
-  EyeOff,
-  FlaskConical,
-  KeyRound,
-  Loader2,
-  Plus,
-  RefreshCw,
-  Save,
-  Server,
-  SlidersHorizontal,
-  Trash2,
-  X,
-} from "lucide-react";
-import { toast } from "sonner";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
-import { invalidateAvailableModels } from "@/app/hooks/useAvailableModels";
-import {
-  BUILT_IN_PROVIDER_IDS,
-  DEFAULT_MODEL_RUNTIME,
-  DEFAULT_PROVIDER_RUNTIME,
-  discoverProviderModels,
-  fetchProviderProfiles,
-  PROVIDER_ADAPTERS,
-  ProviderAdapter,
-  ProviderModelConfig,
-  ProviderProfileConfig,
-  saveProviderProfiles,
-  testProviderModel,
-} from "@/lib/providerProfiles";
-import { cn } from "@/lib/utils";
-
-interface ModelTestState {
-  status: "success" | "error";
-  message: string;
-}
-
-interface AddModelDraft {
-  providerId: string;
-  id: string;
-  name: string;
-  model_id: string;
-}
-
-interface RuntimeEditorTarget {
-  providerId: string;
-  modelId: string;
-}
-
-function nextId(base: string, used: Iterable<string>): string {
-  const existing = new Set(used);
-  if (!existing.has(base)) return base;
-  let suffix = 2;
-  while (existing.has(`${base}-${suffix}`)) suffix += 1;
-  return `${base}-${suffix}`;
-}
-
-function normalizeId(value: string): string {
-  return value
-    .toLowerCase()
-    .replace(/[^a-z0-9._-]+/g, "-")
-    .replace(/^[^a-z0-9]+/, "")
-    .replace(/-+$/g, "")
-    .slice(0, 64);
-}
-
-function normalizeProviderId(value: string): string {
-  return value
-    .toLowerCase()
-    .replace(/[^a-z0-9._-]+/g, "")
-    .replace(/^[^a-z0-9]+/, "")
-    .slice(0, 64);
-}
-
-function discoveredModelAlias(
-  modelId: string,
-  usedAliases: Set<string>
-): string {
-  const segments = modelId.split("/").filter(Boolean);
-  const base = normalizeId(segments.at(-1) || modelId) || "model";
-  const alias = nextId(base, usedAliases);
-  usedAliases.add(alias);
-  return alias;
-}
-
-function modelTestKey(providerId: string, model: ProviderModelConfig): string {
-  return `${providerId}:${model.id}:${model.model_id}`;
-}
-
-function optionalNumber(value: string): number | null {
-  const normalized = value.trim();
-  if (!normalized) return null;
-  const parsed = Number(normalized);
-  return Number.isFinite(parsed) ? parsed : null;
-}
-
-function optionalPositiveInteger(value: string): number | null {
-  const parsed = optionalNumber(value);
-  return parsed !== null && Number.isInteger(parsed) && parsed > 0
-    ? parsed
-    : null;
-}
-
-export function ProviderProfilesEditor() {
-  const [providers, setProviders] = useState<ProviderProfileConfig[]>([]);
-  const [selectedId, setSelectedId] = useState<string | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState(false);
-  const [discoveringProviderId, setDiscoveringProviderId] = useState<
-    string | null
-  >(null);
-  const [testingProviderId, setTestingProviderId] = useState<string | null>(
-    null
-  );
-  const [testingModelKey, setTestingModelKey] = useState<string | null>(null);
-  const [modelTests, setModelTests] = useState<Record<string, ModelTestState>>(
-    {}
-  );
-  const [modelsExpanded, setModelsExpanded] = useState(true);
-  const [showApiKey, setShowApiKey] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [addModelDraft, setAddModelDraft] = useState<AddModelDraft | null>(
-    null
-  );
-  const [runtimeEditorTarget, setRuntimeEditorTarget] =
-    useState<RuntimeEditorTarget | null>(null);
-  const [reservedProviderIds, setReservedProviderIds] = useState(
-    () => new Set<string>(BUILT_IN_PROVIDER_IDS)
-  );
-  const persistedIds = useRef(new Set<string>());
-
-  useEffect(() => {
-    let cancelled = false;
-    setLoading(true);
-    setError(null);
-    fetchProviderProfiles()
-      .then((response) => {
-        if (cancelled) return;
-        setProviders(response.providers);
-        setReservedProviderIds(new Set(response.reserved_provider_ids));
-        persistedIds.current = new Set(
-          response.providers.map((provider) => provider.id)
-        );
-        setSelectedId((current) =>
-          response.providers.some((provider) => provider.id === current)
-            ? current
-            : response.providers[0]?.id ?? null
-        );
-      })
-      .catch((reason: unknown) => {
-        if (!cancelled) {
-          setError(
-            reason instanceof Error
-              ? reason.message
-              : "Could not load provider profiles."
-          );
-        }
-      })
-      .finally(() => {
-        if (!cancelled) setLoading(false);
-      });
-    return () => {
-      cancelled = true;
-    };
-  }, []);
-
-  const selected = useMemo(
-    () => providers.find((provider) => provider.id === selectedId) ?? null,
-    [providers, selectedId]
-  );
-
-  const runtimeEditorModel = useMemo(() => {
-    if (!runtimeEditorTarget) return null;
-    const provider = providers.find(
-      (candidate) => candidate.id === runtimeEditorTarget.providerId
-    );
-    const model = provider?.models.find(
-      (candidate) => candidate.id === runtimeEditorTarget.modelId
-    );
-    return provider && model ? { provider, model } : null;
-  }, [providers, runtimeEditorTarget]);
-
-  useEffect(() => {
-    setModelsExpanded(true);
-    setShowApiKey(false);
-  }, [selectedId]);
-
-  const providerIdError = (provider: ProviderProfileConfig): string | null => {
-    if (!reservedProviderIds.has(provider.id)) return null;
-    const suggestion = nextId(
-      `${provider.id}-custom`,
-      providers
-        .filter((candidate) => candidate.id !== provider.id)
-        .map((candidate) => candidate.id)
-    );
-    return `Provider ID "${provider.id}" is built in. Use "${suggestion}" or another unique ID.`;
-  };
-
-  const reportProviderIdError = (provider: ProviderProfileConfig): boolean => {
-    const message = providerIdError(provider);
-    if (!message) return false;
-    setSelectedId(provider.id);
-    setError(message);
-    toast.error(message);
-    return true;
-  };
-
-  const renameProviderId = (previousId: string, nextProviderId: string) => {
-    setProviders((current) =>
-      current.map((provider) =>
-        provider.id === previousId
-          ? { ...provider, id: nextProviderId }
-          : provider
-      )
-    );
-    setSelectedId(nextProviderId);
-  };
-
-  const selectedProviderIdError = selected ? providerIdError(selected) : null;
-
-  const updateProvider = (
-    providerId: string,
-    update: (provider: ProviderProfileConfig) => ProviderProfileConfig
-  ) => {
-    setProviders((current) =>
-      current.map((provider) =>
-        provider.id === providerId ? update(provider) : provider
-      )
-    );
-  };
-
-  const addProvider = () => {
-    const id = nextId(
-      "provider",
-      providers.map((provider) => provider.id)
-    );
-    setProviders((current) => [
-      ...current,
-      {
-        id,
-        name: "New provider",
-        adapter: "openai-compatible",
-        base_url: "",
-        enabled: true,
-        api_key_configured: false,
-        api_key_hint: null,
-        runtime: {
-          ...DEFAULT_PROVIDER_RUNTIME,
-        },
-        models: [],
-      },
-    ]);
-    setSelectedId(id);
-    setError(null);
-  };
-
-  const removeProvider = (provider: ProviderProfileConfig) => {
-    if (
-      !window.confirm(
-        `Delete ${provider.name} and its ${
-          provider.models.length
-        } configured model${provider.models.length === 1 ? "" : "s"}?`
-      )
-    ) {
-      return;
-    }
-    setProviders((current) =>
-      current.filter((item) => item.id !== provider.id)
-    );
-    setSelectedId((current) => {
-      if (current !== provider.id) return current;
-      return providers.find((item) => item.id !== provider.id)?.id ?? null;
-    });
-  };
-
-  const openAddModel = (provider: ProviderProfileConfig) => {
-    const id = nextId(
-      "model",
-      provider.models.map((model) => model.id)
-    );
-    setAddModelDraft({
-      providerId: provider.id,
-      id,
-      name: "New model",
-      model_id: "",
-    });
-  };
-
-  const confirmAddModel = () => {
-    if (!addModelDraft) return;
-    const provider = providers.find(
-      (candidate) => candidate.id === addModelDraft.providerId
-    );
-    if (!provider) {
-      setAddModelDraft(null);
-      return;
-    }
-
-    const id = normalizeId(addModelDraft.id);
-    const name = addModelDraft.name.trim();
-    const modelId = addModelDraft.model_id.trim();
-    if (!id || !name || !modelId) {
-      toast.error("Alias, display name, and upstream model ID are required.");
-      return;
-    }
-    if (provider.models.some((model) => model.id === id)) {
-      toast.error(`Model alias "${id}" is already in use.`);
-      return;
-    }
-
-    updateProvider(provider.id, (current) => ({
-      ...current,
-      models: [
-        ...current.models,
-        {
-          id,
-          name,
-          model_id: modelId,
-          enabled: true,
-          runtime: {
-            ...DEFAULT_MODEL_RUNTIME,
-            capabilities: { ...DEFAULT_MODEL_RUNTIME.capabilities },
-          },
-        },
-      ],
-    }));
-    setAddModelDraft(null);
-  };
-
-  const updateModel = (
-    providerId: string,
-    modelId: string,
-    update: (model: ProviderModelConfig) => ProviderModelConfig
-  ) => {
-    updateProvider(providerId, (provider) => ({
-      ...provider,
-      models: provider.models.map((model) =>
-        model.id === modelId ? update(model) : model
-      ),
-    }));
-  };
-
-  const removeModel = (providerId: string, modelId: string) => {
-    updateProvider(providerId, (provider) => ({
-      ...provider,
-      models: provider.models.filter((model) => model.id !== modelId),
-    }));
-  };
-
-  const handleDiscoverModels = async (provider: ProviderProfileConfig) => {
-    if (reportProviderIdError(provider)) return;
-    setDiscoveringProviderId(provider.id);
-    setError(null);
-    try {
-      const discovered = await discoverProviderModels(provider);
-      const existingModelIds = new Set(
-        provider.models.map((model) => model.model_id.trim()).filter(Boolean)
-      );
-      const usedAliases = new Set(provider.models.map((model) => model.id));
-      const additions = discovered
-        .filter((model) => {
-          if (existingModelIds.has(model.model_id)) return false;
-          existingModelIds.add(model.model_id);
-          return true;
-        })
-        .map((model) => ({
-          id: discoveredModelAlias(model.model_id, usedAliases),
-          name: model.name || model.model_id,
-          model_id: model.model_id,
-          enabled: true,
-          runtime: {
-            ...DEFAULT_MODEL_RUNTIME,
-            capabilities: { ...DEFAULT_MODEL_RUNTIME.capabilities },
-          },
-        }));
-      updateProvider(provider.id, (current) => {
-        return { ...current, models: [...current.models, ...additions] };
-      });
-      if (discovered.length === 0) {
-        toast.info("The provider returned no usable chat models.");
-      } else if (additions.length === 0) {
-        toast.info(
-          `${discovered.length} models found; all are already listed.`
-        );
-      } else {
-        toast.success(
-          `${discovered.length} models found; ${additions.length} added to the list.`
-        );
-      }
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not retrieve models from the provider.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setDiscoveringProviderId(null);
-    }
-  };
-
-  const handleTestProvider = async (provider: ProviderProfileConfig) => {
-    if (reportProviderIdError(provider)) return;
-    setTestingProviderId(provider.id);
-    setError(null);
-    try {
-      const discovered = await discoverProviderModels(provider);
-      toast.success(
-        `Provider connection succeeded; ${discovered.length} model${
-          discovered.length === 1 ? "" : "s"
-        } available.`
-      );
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Provider connection test failed.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setTestingProviderId(null);
-    }
-  };
-
-  const handleTestModel = async (
-    provider: ProviderProfileConfig,
-    model: ProviderModelConfig
-  ) => {
-    if (reportProviderIdError(provider)) return;
-    const key = modelTestKey(provider.id, model);
-    if (!model.model_id.trim()) {
-      const message = "Enter an upstream model ID before testing.";
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "error", message },
-      }));
-      toast.error(message);
-      return;
-    }
-    setTestingModelKey(key);
-    setError(null);
-    setModelTests((current) => {
-      const next = { ...current };
-      delete next[key];
-      return next;
-    });
-    try {
-      const result = await testProviderModel(provider, model);
-      const response = result.response.trim();
-      const message = `Connected in ${result.latency_ms} ms${
-        response ? `: ${response}` : ""
-      }`;
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "success", message },
-      }));
-      toast.success(`Model ${model.name} is reachable.`);
-    } catch (reason) {
-      const message =
-        reason instanceof Error ? reason.message : "Model test failed.";
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "error", message },
-      }));
-      toast.error(message);
-    } finally {
-      setTestingModelKey(null);
-    }
-  };
-
-  const handleSave = async () => {
-    const invalidProvider = providers.find((provider) =>
-      reservedProviderIds.has(provider.id)
-    );
-    if (invalidProvider && reportProviderIdError(invalidProvider)) return;
-    const incompleteModel = providers
-      .flatMap((provider) =>
-        provider.models.map((model) => ({ provider, model }))
-      )
-      .find(
-        ({ model }) =>
-          model.enabled && model.runtime.limits_status !== "confirmed"
-      );
-    if (incompleteModel) {
-      const message = `Confirm runtime limits for ${incompleteModel.model.name} before enabling it.`;
-      setError(message);
-      toast.error(message);
-      return;
-    }
-    setSaving(true);
-    setError(null);
-    try {
-      const response = await saveProviderProfiles(providers);
-      const draftsById = new Map(
-        providers.map((provider) => [provider.id, provider])
-      );
-      const savedProviders = response.providers.map((provider) => {
-        const draft = draftsById.get(provider.id);
-        return draft?.api_key
-          ? { ...provider, api_key: draft.api_key }
-          : provider;
-      });
-      setProviders(savedProviders);
-      setReservedProviderIds(new Set(response.reserved_provider_ids));
-      persistedIds.current = new Set(
-        response.providers.map((provider) => provider.id)
-      );
-      setSelectedId((current) =>
-        response.providers.some((provider) => provider.id === current)
-          ? current
-          : response.providers[0]?.id ?? null
-      );
-      invalidateAvailableModels();
-      toast.success("Model providers saved.");
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not save provider profiles.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setSaving(false);
-    }
-  };
-
-  if (loading) {
-    return (
-      <div className="flex min-h-80 items-center justify-center text-sm text-muted-foreground">
-        <Loader2 className="mr-2 size-4 animate-spin" />
-        Loading providers...
-      </div>
-    );
-  }
-
-  return (
-    <div className="space-y-3">
-      {error && (
-        <div
-          role="alert"
-          className="rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive"
-        >
-          {error}
-        </div>
-      )}
-
-      <div className="grid min-h-[28rem] overflow-hidden rounded-md border border-border md:grid-cols-[14rem_minmax(0,1fr)]">
-        <aside className="border-b border-border bg-muted/20 md:border-b-0 md:border-r">
-          <div className="flex items-center justify-between border-b border-border px-3 py-2">
-            <span className="text-sm font-medium">Providers</span>
-            <Button
-              type="button"
-              variant="ghost"
-              size="icon"
-              className="size-8"
-              onClick={addProvider}
-              aria-label="Add provider"
-              title="Add provider"
-            >
-              <Plus className="size-4" />
-            </Button>
-          </div>
-          <div className="max-h-44 overflow-y-auto p-1.5 md:max-h-[26rem]">
-            {providers.length === 0 && (
-              <button
-                type="button"
-                onClick={addProvider}
-                className="w-full px-3 py-6 text-center text-xs text-muted-foreground hover:text-foreground"
-              >
-                Add the first provider
-              </button>
-            )}
-            {providers.map((provider) => (
-              <button
-                type="button"
-                key={provider.id}
-                onClick={() => setSelectedId(provider.id)}
-                className={cn(
-                  "flex w-full items-center gap-2 rounded px-2.5 py-2 text-left transition-colors hover:bg-accent",
-                  selectedId === provider.id && "bg-accent"
-                )}
-              >
-                <Server className="size-4 shrink-0 text-muted-foreground" />
-                <span className="min-w-0 flex-1">
-                  <span className="block truncate text-sm font-medium">
-                    {provider.name}
-                  </span>
-                  <span className="block truncate font-mono text-[11px] text-muted-foreground">
-                    {provider.id} · {provider.models.length} model
-                    {provider.models.length === 1 ? "" : "s"}
-                  </span>
-                </span>
-                {!provider.enabled && (
-                  <span className="text-[10px] text-muted-foreground">Off</span>
-                )}
-              </button>
-            ))}
-          </div>
-        </aside>
-
-        <div className="min-w-0 overflow-y-auto p-4 md:max-h-[31rem]">
-          {!selected ? (
-            <div className="flex min-h-72 items-center justify-center text-sm text-muted-foreground">
-              Select or add a provider.
-            </div>
-          ) : (
-            <div className="space-y-5">
-              <div className="flex flex-col items-stretch gap-3 sm:flex-row sm:items-center sm:justify-between">
-                <div>
-                  <h3 className="text-sm font-semibold">Provider connection</h3>
-                  <p className="text-xs text-muted-foreground">
-                    Models below share this endpoint and credential.
-                  </p>
-                </div>
-                <div className="flex flex-wrap items-center gap-2 sm:justify-end">
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    disabled={testingProviderId === selected.id}
-                    onClick={() => handleTestProvider(selected)}
-                  >
-                    {testingProviderId === selected.id ? (
-                      <Loader2 className="size-4 animate-spin" />
-                    ) : (
-                      <FlaskConical className="size-4" />
-                    )}
-                    Test connection
-                  </Button>
-                  <label className="flex items-center gap-1.5 text-xs text-muted-foreground">
-                    <input
-                      type="checkbox"
-                      checked={selected.enabled}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          enabled: event.target.checked,
-                        }))
-                      }
-                      className="size-4 accent-[var(--brand)]"
-                    />
-                    Enabled
-                  </label>
-                  <Button
-                    type="button"
-                    variant="ghost"
-                    size="icon"
-                    className="size-8 text-destructive hover:text-destructive"
-                    onClick={() => removeProvider(selected)}
-                    aria-label={`Delete ${selected.name}`}
-                    title="Delete provider"
-                  >
-                    <Trash2 className="size-4" />
-                  </Button>
-                </div>
-              </div>
-
-              <div className="grid gap-3 sm:grid-cols-2">
-                <div className="grid gap-1.5">
-                  <Label htmlFor="provider-name">Display name</Label>
-                  <Input
-                    id="provider-name"
-                    value={selected.name}
-                    onChange={(event) =>
-                      updateProvider(selected.id, (provider) => ({
-                        ...provider,
-                        name: event.target.value,
-                      }))
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label
-                    htmlFor="provider-id"
-                    className="flex flex-wrap items-baseline gap-x-1 leading-snug"
-                  >
-                    <span>Provider ID</span>
-                    <span className="text-[11px] font-normal text-muted-foreground">
-                      (a-z or 0-9; use only a-z, 0-9, ., _, -; max 64)
-                    </span>
-                  </Label>
-                  <Input
-                    id="provider-id"
-                    value={selected.id}
-                    disabled={persistedIds.current.has(selected.id)}
-                    className="font-mono"
-                    aria-invalid={Boolean(selectedProviderIdError)}
-                    aria-describedby={
-                      selectedProviderIdError ? "provider-id-error" : undefined
-                    }
-                    onChange={(event) => {
-                      const id = normalizeProviderId(event.target.value);
-                      if (!id || providers.some((item) => item.id === id))
-                        return;
-                      renameProviderId(selected.id, id);
-                    }}
-                    onBlur={() => {
-                      if (!reservedProviderIds.has(selected.id)) return;
-                      const suggestion = nextId(
-                        `${selected.id}-custom`,
-                        providers
-                          .filter((provider) => provider.id !== selected.id)
-                          .map((provider) => provider.id)
-                      );
-                      renameProviderId(selected.id, suggestion);
-                      setError(null);
-                      toast.info(
-                        `Provider ID changed to "${suggestion}" because "${selected.id}" is built in.`
-                      );
-                    }}
-                  />
-                  {selectedProviderIdError && (
-                    <p
-                      id="provider-id-error"
-                      className="text-xs text-destructive"
-                    >
-                      {selectedProviderIdError}
-                    </p>
-                  )}
-                </div>
-                <div className="grid gap-1.5">
-                  <Label>Adapter</Label>
-                  <Select
-                    value={selected.adapter}
-                    onValueChange={(value) =>
-                      updateProvider(selected.id, (provider) => ({
-                        ...provider,
-                        adapter: value as ProviderAdapter,
-                      }))
-                    }
-                  >
-                    <SelectTrigger className="h-9 border-2 border-input bg-background shadow-xs">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      {PROVIDER_ADAPTERS.map((adapter) => (
-                        <SelectItem
-                          key={adapter.value}
-                          value={adapter.value}
-                        >
-                          {adapter.label}
-                        </SelectItem>
-                      ))}
-                    </SelectContent>
-                  </Select>
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="provider-base-url">Base URL</Label>
-                  <Input
-                    id="provider-base-url"
-                    type="url"
-                    inputMode="url"
-                    placeholder={
-                      selected.adapter === "ollama"
-                        ? "http://127.0.0.1:11434"
-                        : selected.adapter === "grok"
-                        ? "https://api.x.ai/v1"
-                        : selected.adapter === "antigravity"
-                        ? "http://127.0.0.1:8317/v1"
-                        : "https://api.example.com/v1"
-                    }
-                    value={selected.base_url}
-                    onChange={(event) =>
-                      updateProvider(selected.id, (provider) => ({
-                        ...provider,
-                        base_url: event.target.value,
-                      }))
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5 sm:col-span-2">
-                  <Label htmlFor="provider-api-key">API key</Label>
-                  <div className="flex gap-2">
-                    <Input
-                      id="provider-api-key"
-                      type={showApiKey ? "text" : "password"}
-                      autoComplete="new-password"
-                      placeholder={
-                        selected.api_key_configured
-                          ? `Configured${
-                              selected.api_key_hint
-                                ? ` (${selected.api_key_hint})`
-                                : ""
-                            }; leave empty to keep it`
-                          : selected.adapter === "ollama"
-                          ? "Optional"
-                          : "Enter API key"
-                      }
-                      value={selected.api_key ?? ""}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          api_key: event.target.value,
-                          clear_api_key: false,
-                        }))
-                      }
-                    />
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="icon"
-                      disabled={!selected.api_key}
-                      onClick={() => setShowApiKey((current) => !current)}
-                      aria-label={showApiKey ? "Hide API key" : "Show API key"}
-                      aria-pressed={showApiKey}
-                      title={
-                        selected.api_key
-                          ? showApiKey
-                            ? "Hide API key"
-                            : "Show API key"
-                          : "Enter an API key to reveal it"
-                      }
-                    >
-                      {showApiKey ? (
-                        <EyeOff className="size-4" />
-                      ) : (
-                        <Eye className="size-4" />
-                      )}
-                    </Button>
-                    {selected.api_key_configured && (
-                      <Button
-                        type="button"
-                        variant="outline"
-                        size="icon"
-                        onClick={() => {
-                          setShowApiKey(false);
-                          updateProvider(selected.id, (provider) => ({
-                            ...provider,
-                            api_key: "",
-                            api_key_configured: false,
-                            api_key_hint: null,
-                            clear_api_key: true,
-                          }));
-                        }}
-                        aria-label="Clear saved API key"
-                        title="Clear saved API key"
-                      >
-                        <KeyRound className="size-4" />
-                      </Button>
-                    )}
-                  </div>
-                </div>
-              </div>
-
-              <div className="border-t border-border pt-4">
-                <div className="mb-3">
-                  <h3 className="text-sm font-semibold">Runtime defaults</h3>
-                  <p className="text-xs text-muted-foreground">
-                    Applied to models that do not set their own sampling value.
-                  </p>
-                </div>
-                <div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="provider-timeout">Timeout (seconds)</Label>
-                    <Input
-                      id="provider-timeout"
-                      type="number"
-                      min={10}
-                      max={600}
-                      value={selected.runtime.timeout_seconds}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          runtime: {
-                            ...provider.runtime,
-                            timeout_seconds:
-                              optionalPositiveInteger(event.target.value) ?? 10,
-                          },
-                        }))
-                      }
-                    />
-                  </div>
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="provider-retries">Retries</Label>
-                    <Input
-                      id="provider-retries"
-                      type="number"
-                      min={0}
-                      max={5}
-                      value={selected.runtime.max_retries}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          runtime: {
-                            ...provider.runtime,
-                            max_retries: Math.max(
-                              0,
-                              optionalPositiveInteger(event.target.value) ?? 0
-                            ),
-                          },
-                        }))
-                      }
-                    />
-                  </div>
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="provider-temperature">Temperature</Label>
-                    <Input
-                      id="provider-temperature"
-                      type="number"
-                      min={0}
-                      max={2}
-                      step="0.1"
-                      placeholder="Model default"
-                      value={selected.runtime.default_temperature ?? ""}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          runtime: {
-                            ...provider.runtime,
-                            default_temperature: optionalNumber(
-                              event.target.value
-                            ),
-                          },
-                        }))
-                      }
-                    />
-                  </div>
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="provider-top-p">Top P</Label>
-                    <Input
-                      id="provider-top-p"
-                      type="number"
-                      min={0.000001}
-                      max={1}
-                      step="0.05"
-                      placeholder="Model default"
-                      value={selected.runtime.default_top_p ?? ""}
-                      onChange={(event) =>
-                        updateProvider(selected.id, (provider) => ({
-                          ...provider,
-                          runtime: {
-                            ...provider.runtime,
-                            default_top_p: optionalNumber(event.target.value),
-                          },
-                        }))
-                      }
-                    />
-                  </div>
-                </div>
-              </div>
-
-              <div className="border-t border-border pt-4">
-                <div className="mb-3 flex flex-wrap items-center justify-between gap-3">
-                  <div>
-                    <h3 className="text-sm font-semibold">Models</h3>
-                    <p className="text-xs text-muted-foreground">
-                      Alias is the stable name stored on a research thread.
-                    </p>
-                  </div>
-                  <div className="flex flex-wrap items-center gap-2">
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      disabled={discoveringProviderId === selected.id}
-                      onClick={() => handleDiscoverModels(selected)}
-                    >
-                      {discoveringProviderId === selected.id ? (
-                        <Loader2 className="size-4 animate-spin" />
-                      ) : (
-                        <RefreshCw className="size-4" />
-                      )}
-                      Fetch models
-                    </Button>
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      onClick={() => openAddModel(selected)}
-                    >
-                      <Plus className="size-4" />
-                      Add model
-                    </Button>
-                  </div>
-                </div>
-
-                <div className="overflow-hidden rounded-md border border-border bg-background">
-                  {modelsExpanded && (
-                    <div className="max-h-[23rem] overflow-y-auto p-2">
-                      {selected.models.length === 0 ? (
-                        <div className="py-7 text-center text-xs text-muted-foreground">
-                          No models configured for this provider.
-                        </div>
-                      ) : (
-                        <div className="grid gap-1.5 sm:grid-cols-2">
-                          {selected.models.map((model) => {
-                            const testKey = modelTestKey(selected.id, model);
-                            const testState = modelTests[testKey];
-                            return (
-                              <div
-                                key={`${selected.id}-model-${model.id}`}
-                                className={cn(
-                                  "group flex h-9 min-w-0 items-center gap-2 rounded bg-muted/60 px-2",
-                                  !model.enabled && "opacity-50"
-                                )}
-                                title={`Upstream: ${model.model_id}\nAlias: ${model.id}`}
-                              >
-                                <Bot className="size-3.5 shrink-0 text-muted-foreground" />
-                                <span className="min-w-0 flex-1 truncate text-xs">
-                                  {model.name}
-                                </span>
-                                <div className="flex shrink-0 items-center gap-0.5">
-                                  <label
-                                    className="flex size-7 items-center justify-center"
-                                    title={model.enabled ? "Disable" : "Enable"}
-                                  >
-                                    <input
-                                      type="checkbox"
-                                      checked={model.enabled}
-                                      onChange={(event) =>
-                                        updateModel(
-                                          selected.id,
-                                          model.id,
-                                          (current) => ({
-                                            ...current,
-                                            enabled: event.target.checked,
-                                          })
-                                        )
-                                      }
-                                      className="size-3.5 accent-[var(--brand)]"
-                                      aria-label={`Enable ${model.name}`}
-                                    />
-                                  </label>
-                                  <Button
-                                    type="button"
-                                    variant="ghost"
-                                    size="icon"
-                                    className={cn(
-                                      "size-7",
-                                      model.runtime.limits_status !==
-                                        "confirmed" &&
-                                        "text-amber-600 dark:text-amber-400"
-                                    )}
-                                    onClick={() =>
-                                      setRuntimeEditorTarget({
-                                        providerId: selected.id,
-                                        modelId: model.id,
-                                      })
-                                    }
-                                    aria-label={`Configure ${model.name}`}
-                                    title={
-                                      model.runtime.limits_status ===
-                                      "confirmed"
-                                        ? "Runtime settings"
-                                        : "Runtime limits need confirmation"
-                                    }
-                                  >
-                                    <SlidersHorizontal className="size-3.5" />
-                                  </Button>
-                                  <Button
-                                    type="button"
-                                    variant="ghost"
-                                    size="icon"
-                                    className={cn(
-                                      "size-7",
-                                      testState?.status === "success" &&
-                                        "text-emerald-600 dark:text-emerald-400",
-                                      testState?.status === "error" &&
-                                        "text-destructive"
-                                    )}
-                                    disabled={testingModelKey === testKey}
-                                    onClick={() =>
-                                      handleTestModel(selected, model)
-                                    }
-                                    aria-label={`Test ${model.name}`}
-                                    title={testState?.message || "Test model"}
-                                  >
-                                    {testingModelKey === testKey ? (
-                                      <Loader2 className="size-3.5 animate-spin" />
-                                    ) : testState?.status === "success" ? (
-                                      <CheckCircle2 className="size-3.5" />
-                                    ) : testState?.status === "error" ? (
-                                      <CircleAlert className="size-3.5" />
-                                    ) : (
-                                      <FlaskConical className="size-3.5" />
-                                    )}
-                                  </Button>
-                                  <Button
-                                    type="button"
-                                    variant="ghost"
-                                    size="icon"
-                                    className="size-7 text-muted-foreground hover:text-destructive"
-                                    onClick={() =>
-                                      removeModel(selected.id, model.id)
-                                    }
-                                    aria-label={`Delete ${model.name}`}
-                                    title="Delete model"
-                                  >
-                                    <X className="size-3.5" />
-                                  </Button>
-                                </div>
-                              </div>
-                            );
-                          })}
-                        </div>
-                      )}
-                    </div>
-                  )}
-                  <button
-                    type="button"
-                    className="flex h-10 w-full items-center justify-between border-t border-border px-3 text-xs text-muted-foreground transition-colors hover:bg-muted/40 hover:text-foreground"
-                    onClick={() => setModelsExpanded((current) => !current)}
-                    aria-expanded={modelsExpanded}
-                    title={modelsExpanded ? "Collapse models" : "Expand models"}
-                  >
-                    <span>
-                      {selected.models.length} model
-                      {selected.models.length === 1 ? "" : "s"}
-                    </span>
-                    {modelsExpanded ? (
-                      <ChevronUp className="size-4" />
-                    ) : (
-                      <ChevronDown className="size-4" />
-                    )}
-                  </button>
-                </div>
-              </div>
-            </div>
-          )}
-        </div>
-      </div>
-
-      <div className="flex justify-end">
-        <Button
-          type="button"
-          onClick={handleSave}
-          disabled={saving}
-        >
-          {saving ? (
-            <Loader2 className="size-4 animate-spin" />
-          ) : (
-            <Save className="size-4" />
-          )}
-          Save providers
-        </Button>
-      </div>
-
-      <Dialog
-        open={Boolean(addModelDraft)}
-        onOpenChange={(open) => {
-          if (!open) setAddModelDraft(null);
-        }}
-      >
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
-            <DialogTitle>Add model</DialogTitle>
-            <DialogDescription>
-              Add a model that was not returned by provider discovery.
-            </DialogDescription>
-          </DialogHeader>
-
-          {addModelDraft && (
-            <div className="grid gap-4">
-              <div className="grid gap-1.5">
-                <Label htmlFor="new-model-upstream-id">Upstream model ID</Label>
-                <Input
-                  id="new-model-upstream-id"
-                  value={addModelDraft.model_id}
-                  className="font-mono"
-                  placeholder="vendor/model-name"
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, model_id: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="new-model-name">Display name</Label>
-                <Input
-                  id="new-model-name"
-                  value={addModelDraft.name}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, name: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="new-model-alias">Alias</Label>
-                <Input
-                  id="new-model-alias"
-                  value={addModelDraft.id}
-                  className="font-mono"
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, id: normalizeId(event.target.value) }
-                        : current
-                    )
-                  }
-                />
-              </div>
-            </div>
-          )}
-
-          <DialogFooter>
-            <Button
-              type="button"
-              variant="outline"
-              onClick={() => setAddModelDraft(null)}
-            >
-              Cancel
-            </Button>
-            <Button
-              type="button"
-              onClick={confirmAddModel}
-              disabled={
-                !addModelDraft?.id.trim() ||
-                !addModelDraft.name.trim() ||
-                !addModelDraft.model_id.trim()
-              }
-            >
-              <Plus className="size-4" />
-              Add model
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-
-      <Dialog
-        open={Boolean(runtimeEditorTarget)}
-        onOpenChange={(open) => {
-          if (!open) setRuntimeEditorTarget(null);
-        }}
-      >
-        <DialogContent className="max-h-[calc(100vh-2rem)] overflow-y-auto sm:max-w-2xl">
-          <DialogHeader>
-            <DialogTitle>Model runtime</DialogTitle>
-            <DialogDescription>
-              {runtimeEditorModel
-                ? `${runtimeEditorModel.provider.name} / ${runtimeEditorModel.model.name}`
-                : "Model runtime settings"}
-            </DialogDescription>
-          </DialogHeader>
-
-          {runtimeEditorModel && (
-            <div className="grid gap-4">
-              <div className="grid gap-3 sm:grid-cols-2">
-                <div className="grid gap-1.5">
-                  <Label>Limit type</Label>
-                  <Select
-                    value={
-                      runtimeEditorModel.model.runtime.limit_mode ?? "combined"
-                    }
-                    onValueChange={(value) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            limit_mode: value as "combined" | "input_only",
-                          },
-                        })
-                      )
-                    }
-                  >
-                    <SelectTrigger className="h-9 border-2 border-input bg-background shadow-xs">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      <SelectItem value="combined">
-                        Input + output window
-                      </SelectItem>
-                      <SelectItem value="input_only">Input window</SelectItem>
-                    </SelectContent>
-                  </Select>
-                </div>
-                <div className="grid gap-1.5">
-                  <Label>Limit source</Label>
-                  <Select
-                    value={runtimeEditorModel.model.runtime.limits_source}
-                    onValueChange={(value) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            limits_source: value as
-                              | "catalog"
-                              | "provider"
-                              | "user",
-                          },
-                        })
-                      )
-                    }
-                  >
-                    <SelectTrigger className="h-9 border-2 border-input bg-background shadow-xs">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      <SelectItem value="user">Manual</SelectItem>
-                      <SelectItem value="provider">
-                        Provider documentation
-                      </SelectItem>
-                      <SelectItem value="catalog">Verified catalog</SelectItem>
-                    </SelectContent>
-                  </Select>
-                </div>
-                {runtimeEditorModel.model.runtime.limit_mode ===
-                "input_only" ? (
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="model-max-input">
-                      Maximum input tokens
-                    </Label>
-                    <Input
-                      id="model-max-input"
-                      type="number"
-                      min={1024}
-                      value={
-                        runtimeEditorModel.model.runtime.max_input_tokens ?? ""
-                      }
-                      onChange={(event) =>
-                        updateModel(
-                          runtimeEditorModel.provider.id,
-                          runtimeEditorModel.model.id,
-                          (current) => ({
-                            ...current,
-                            runtime: {
-                              ...current.runtime,
-                              max_input_tokens: optionalPositiveInteger(
-                                event.target.value
-                              ),
-                            },
-                          })
-                        )
-                      }
-                    />
-                  </div>
-                ) : (
-                  <div className="grid gap-1.5">
-                    <Label htmlFor="model-context-window">
-                      Context window tokens
-                    </Label>
-                    <Input
-                      id="model-context-window"
-                      type="number"
-                      min={1024}
-                      value={
-                        runtimeEditorModel.model.runtime
-                          .context_window_tokens ?? ""
-                      }
-                      onChange={(event) =>
-                        updateModel(
-                          runtimeEditorModel.provider.id,
-                          runtimeEditorModel.model.id,
-                          (current) => ({
-                            ...current,
-                            runtime: {
-                              ...current.runtime,
-                              context_window_tokens: optionalPositiveInteger(
-                                event.target.value
-                              ),
-                            },
-                          })
-                        )
-                      }
-                    />
-                  </div>
-                )}
-                <div className="grid gap-1.5">
-                  <Label htmlFor="model-max-output">
-                    Maximum output tokens
-                  </Label>
-                  <Input
-                    id="model-max-output"
-                    type="number"
-                    min={1}
-                    value={runtimeEditorModel.model.runtime.max_output_tokens}
-                    onChange={(event) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            max_output_tokens:
-                              optionalPositiveInteger(event.target.value) ?? 1,
-                          },
-                        })
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="model-min-input">
-                    Minimum usable input tokens
-                  </Label>
-                  <Input
-                    id="model-min-input"
-                    type="number"
-                    min={1024}
-                    value={
-                      runtimeEditorModel.model.runtime
-                        .min_effective_input_tokens
-                    }
-                    onChange={(event) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            min_effective_input_tokens:
-                              optionalPositiveInteger(event.target.value) ??
-                              1024,
-                          },
-                        })
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="model-temperature">
-                    Temperature override
-                  </Label>
-                  <Input
-                    id="model-temperature"
-                    type="number"
-                    min={0}
-                    max={2}
-                    step="0.1"
-                    placeholder="Provider default"
-                    value={runtimeEditorModel.model.runtime.temperature ?? ""}
-                    onChange={(event) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            temperature: optionalNumber(event.target.value),
-                          },
-                        })
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="model-top-p">Top P override</Label>
-                  <Input
-                    id="model-top-p"
-                    type="number"
-                    min={0.000001}
-                    max={1}
-                    step="0.05"
-                    placeholder="Provider default"
-                    value={runtimeEditorModel.model.runtime.top_p ?? ""}
-                    onChange={(event) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            top_p: optionalNumber(event.target.value),
-                          },
-                        })
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label>Reasoning effort</Label>
-                  <Select
-                    value={runtimeEditorModel.model.runtime.reasoning_effort}
-                    onValueChange={(value) =>
-                      updateModel(
-                        runtimeEditorModel.provider.id,
-                        runtimeEditorModel.model.id,
-                        (current) => ({
-                          ...current,
-                          runtime: {
-                            ...current.runtime,
-                            reasoning_effort: value as
-                              | "auto"
-                              | "low"
-                              | "medium"
-                              | "high",
-                          },
-                        })
-                      )
-                    }
-                  >
-                    <SelectTrigger className="h-9 border-2 border-input bg-background shadow-xs">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      <SelectItem value="auto">Auto</SelectItem>
-                      <SelectItem value="low">Low</SelectItem>
-                      <SelectItem value="medium">Medium</SelectItem>
-                      <SelectItem value="high">High</SelectItem>
-                    </SelectContent>
-                  </Select>
-                </div>
-              </div>
-              <label className="flex items-center gap-2 text-sm">
-                <input
-                  type="checkbox"
-                  checked={
-                    runtimeEditorModel.model.runtime.limits_status ===
-                    "confirmed"
-                  }
-                  onChange={(event) =>
-                    updateModel(
-                      runtimeEditorModel.provider.id,
-                      runtimeEditorModel.model.id,
-                      (current) => ({
-                        ...current,
-                        runtime: {
-                          ...current.runtime,
-                          limits_status: event.target.checked
-                            ? "confirmed"
-                            : "needs_confirmation",
-                        },
-                      })
-                    )
-                  }
-                  className="size-4 accent-[var(--brand)]"
-                />
-                I have confirmed these model limits.
-              </label>
-            </div>
-          )}
-
-          <DialogFooter>
-            <Button
-              type="button"
-              onClick={() => setRuntimeEditorTarget(null)}
-            >
-              Done
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </div>
-  );
-}
diff --git a/src/app/components/RegistryBuiltinProvidersEditor.tsx b/src/app/components/RegistryBuiltinProvidersEditor.tsx
deleted file mode 100644
index 170b72c..0000000
--- a/src/app/components/RegistryBuiltinProvidersEditor.tsx
+++ /dev/null
@@ -1,1222 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useState } from "react";
-import {
-  Bot,
-  CheckCircle2,
-  CircleAlert,
-  Eye,
-  EyeOff,
-  FlaskConical,
-  KeyRound,
-  Loader2,
-  Plus,
-  RefreshCw,
-  Save,
-  Server,
-  Trash2,
-} from "lucide-react";
-import { toast } from "sonner";
-import { invalidateAvailableModels } from "@/app/hooks/useAvailableModels";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
-import { Textarea } from "@/components/ui/textarea";
-import {
-  BuiltinProviderConfig,
-  BuiltinProviderDraft,
-  BuiltinProviderModelConfig,
-  discoverBuiltinProviderModels,
-  fetchLegacyLlmConfig,
-  LegacyLlmConfigResponse,
-  LegacyLlmValues,
-  saveLegacyLlmConfig,
-  testBuiltinProviderModel,
-} from "@/lib/legacyLlmConfig";
-import { cn } from "@/lib/utils";
-
-interface ProviderDefinition {
-  id: string;
-  label: string;
-  apiKeyField?: string;
-  baseUrlField?: string;
-  authModeField?: string;
-  baseUrlPlaceholder?: string;
-}
-
-interface AddModelDraft {
-  providerId: string;
-  id: string;
-  name: string;
-  model_id: string;
-}
-
-interface ModelTestState {
-  status: "success" | "error";
-  message: string;
-}
-
-const PROVIDERS: ProviderDefinition[] = [
-  {
-    id: "anthropic",
-    label: "Anthropic",
-    apiKeyField: "anthropic_api_key",
-    baseUrlField: "anthropic_base_url",
-    authModeField: "anthropic_auth_mode",
-    baseUrlPlaceholder: "https://api.anthropic.com",
-  },
-  {
-    id: "openai",
-    label: "OpenAI",
-    apiKeyField: "openai_api_key",
-    authModeField: "openai_auth_mode",
-    baseUrlPlaceholder: "https://api.openai.com/v1",
-  },
-  {
-    id: "google-genai",
-    label: "Google GenAI",
-    apiKeyField: "google_api_key",
-  },
-  { id: "nvidia", label: "NVIDIA", apiKeyField: "nvidia_api_key" },
-  {
-    id: "minimax",
-    label: "MiniMax",
-    apiKeyField: "minimax_api_key",
-    baseUrlField: "minimax_base_url",
-  },
-  {
-    id: "siliconflow",
-    label: "SiliconFlow",
-    apiKeyField: "siliconflow_api_key",
-  },
-  {
-    id: "openrouter",
-    label: "OpenRouter",
-    apiKeyField: "openrouter_api_key",
-  },
-  {
-    id: "deepseek",
-    label: "DeepSeek",
-    apiKeyField: "deepseek_api_key",
-  },
-  { id: "zhipu", label: "Zhipu", apiKeyField: "zhipu_api_key" },
-  {
-    id: "zhipu-code",
-    label: "Zhipu Code",
-    apiKeyField: "zhipu_api_key",
-  },
-  {
-    id: "volcengine",
-    label: "Volcengine",
-    apiKeyField: "volcengine_api_key",
-  },
-  {
-    id: "dashscope",
-    label: "DashScope",
-    apiKeyField: "dashscope_api_key",
-  },
-  {
-    id: "dashscope-code",
-    label: "DashScope Code",
-    apiKeyField: "dashscope_api_key",
-  },
-  {
-    id: "moonshot",
-    label: "Moonshot",
-    apiKeyField: "moonshot_api_key",
-  },
-  {
-    id: "kimi-coding",
-    label: "Kimi Coding",
-    apiKeyField: "kimi_api_key",
-  },
-  {
-    id: "custom-openai",
-    label: "Custom OpenAI",
-    apiKeyField: "custom_openai_api_key",
-    baseUrlField: "custom_openai_base_url",
-  },
-  {
-    id: "custom-anthropic",
-    label: "Custom Anthropic",
-    apiKeyField: "custom_anthropic_api_key",
-    baseUrlField: "custom_anthropic_base_url",
-  },
-  {
-    id: "ollama",
-    label: "Ollama",
-    baseUrlField: "ollama_base_url",
-    baseUrlPlaceholder: "http://127.0.0.1:11434",
-  },
-];
-
-function normalizeAlias(value: string): string {
-  return value
-    .toLowerCase()
-    .replace(/[^a-z0-9._-]+/g, "-")
-    .replace(/^[^a-z0-9]+/, "")
-    .replace(/-+$/g, "")
-    .slice(0, 64);
-}
-
-function nextAlias(base: string, used: Iterable<string>): string {
-  const ids = new Set(used);
-  if (!ids.has(base)) return base;
-  let suffix = 2;
-  while (ids.has(base + "-" + suffix)) suffix += 1;
-  return base + "-" + suffix;
-}
-
-function aliasForModel(modelId: string, usedAliases: Set<string>): string {
-  const parts = modelId.split("/").filter(Boolean);
-  const base = normalizeAlias(parts.at(-1) || modelId) || "model";
-  const alias = nextAlias(base, usedAliases);
-  usedAliases.add(alias);
-  return alias;
-}
-
-function modelKey(providerId: string, model: BuiltinProviderModelConfig) {
-  return providerId + ":" + model.id + ":" + model.model_id;
-}
-
-function providerLabel(providerId: string): string {
-  return (
-    PROVIDERS.find((provider) => provider.id === providerId)?.label ||
-    providerId
-  );
-}
-
-export function RegistryBuiltinProvidersEditor() {
-  const [config, setConfig] = useState<LegacyLlmConfigResponse | null>(null);
-  const [values, setValues] = useState<LegacyLlmValues | null>(null);
-  const [profiles, setProfiles] = useState<BuiltinProviderConfig[]>([]);
-  const [selectedId, setSelectedId] = useState("");
-  const [apiKeyDrafts, setApiKeyDrafts] = useState<Record<string, string>>({});
-  const [clearApiKeys, setClearApiKeys] = useState<Set<string>>(
-    () => new Set()
-  );
-  const [visibleApiKey, setVisibleApiKey] = useState<string | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState(false);
-  const [discoveringId, setDiscoveringId] = useState<string | null>(null);
-  const [testingKey, setTestingKey] = useState<string | null>(null);
-  const [modelTests, setModelTests] = useState<Record<string, ModelTestState>>(
-    {}
-  );
-  const [addModelDraft, setAddModelDraft] = useState<AddModelDraft | null>(
-    null
-  );
-  const [error, setError] = useState<string | null>(null);
-
-  const applyResponse = (response: LegacyLlmConfigResponse) => {
-    setConfig(response);
-    setValues(response.values);
-    setProfiles(response.builtin_providers);
-    setApiKeyDrafts({});
-    setClearApiKeys(new Set());
-    setVisibleApiKey(null);
-    setError(response.model_catalog_error);
-    setSelectedId((current) =>
-      response.builtin_providers.some((provider) => provider.id === current)
-        ? current
-        : response.builtin_providers.some(
-            (provider) => provider.id === response.values.provider
-          )
-        ? response.values.provider
-        : response.builtin_providers[0]?.id || ""
-    );
-  };
-
-  const loadConfig = async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      applyResponse(await fetchLegacyLlmConfig());
-    } catch (reason) {
-      setError(
-        reason instanceof Error
-          ? reason.message
-          : "Could not load model providers."
-      );
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  useEffect(() => {
-    void loadConfig();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  const selected =
-    profiles.find((profile) => profile.id === selectedId) ||
-    profiles[0] ||
-    null;
-  const definition = selected
-    ? PROVIDERS.find((provider) => provider.id === selected.id)
-    : null;
-
-  const updateProfile = (
-    providerId: string,
-    update: (profile: BuiltinProviderConfig) => BuiltinProviderConfig
-  ) => {
-    setProfiles((current) =>
-      current.map((profile) =>
-        profile.id === providerId
-          ? { ...update(profile), managed: true }
-          : profile
-      )
-    );
-  };
-
-  const hasChanges = useMemo(() => {
-    if (!config || !values) return false;
-    return (
-      JSON.stringify(values) !== JSON.stringify(config.values) ||
-      JSON.stringify(profiles) !== JSON.stringify(config.builtin_providers) ||
-      Object.values(apiKeyDrafts).some((value) => Boolean(value.trim())) ||
-      clearApiKeys.size > 0
-    );
-  }, [apiKeyDrafts, clearApiKeys, config, profiles, values]);
-
-  const actionDraft = (
-    profile: BuiltinProviderConfig
-  ): BuiltinProviderDraft => {
-    const draft: BuiltinProviderDraft = {
-      id: profile.id,
-      base_url: profile.base_url,
-    };
-    const apiKey = apiKeyDrafts[profile.id];
-    if (apiKey?.trim()) draft.api_key = apiKey;
-    if (clearApiKeys.has(profile.id)) draft.clear_api_key = true;
-    return draft;
-  };
-
-  const addModels = (
-    providerId: string,
-    incoming: Array<{ model_id: string; name: string }>
-  ): number => {
-    const profile = profiles.find((candidate) => candidate.id === providerId);
-    if (!profile) return 0;
-    const upstreamIds = new Set(profile.models.map((model) => model.model_id));
-    const aliases = new Set(profile.models.map((model) => model.id));
-    const additions = incoming
-      .filter((model) => {
-        if (upstreamIds.has(model.model_id)) return false;
-        upstreamIds.add(model.model_id);
-        return true;
-      })
-      .map((model) => ({
-        id: aliasForModel(model.model_id, aliases),
-        name: model.name || model.model_id,
-        model_id: model.model_id,
-        enabled: true,
-      }));
-    updateProfile(providerId, (current) => ({
-      ...current,
-      models: [...current.models, ...additions],
-    }));
-    return additions.length;
-  };
-
-  const manageSelected = () => {
-    if (!selected || !values || !config) return;
-    const defaultCandidate = config.builtin_model_candidates.find(
-      (model) =>
-        model.provider === selected.id &&
-        (model.id === values.model || model.model_id === values.model)
-    );
-    updateProfile(selected.id, (profile) => ({
-      ...profile,
-      models:
-        profile.models.length > 0
-          ? profile.models
-          : defaultCandidate && values.provider === selected.id
-          ? [
-              {
-                id: defaultCandidate.id,
-                name: defaultCandidate.name,
-                model_id: defaultCandidate.model_id,
-                enabled: true,
-              },
-            ]
-          : profile.models,
-    }));
-  };
-
-  const discoverModels = async () => {
-    if (!selected) return;
-    setDiscoveringId(selected.id);
-    setError(null);
-    try {
-      const discovered = await discoverBuiltinProviderModels(actionDraft(selected));
-      const added = addModels(selected.id, discovered);
-      if (discovered.length === 0) {
-        toast.info("The provider returned no usable chat models.");
-      } else if (added === 0) {
-        toast.info("All discovered models are already configured.");
-      } else {
-        toast.success(added + " models added.");
-      }
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not retrieve models from the provider.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setDiscoveringId(null);
-    }
-  };
-
-  const addKnownModels = () => {
-    if (!selected || !config) return;
-    const candidates = config.builtin_model_candidates
-      .filter((model) => model.provider === selected.id)
-      .map((model) => ({ model_id: model.model_id, name: model.name }));
-    const added = addModels(selected.id, candidates);
-    if (added > 0) toast.success(added + " known models added.");
-    else toast.info("All known models are already configured.");
-  };
-
-  const openAddModel = () => {
-    if (!selected) return;
-    setAddModelDraft({
-      providerId: selected.id,
-      id: nextAlias(
-        "model",
-        selected.models.map((model) => model.id)
-      ),
-      name: "New model",
-      model_id: "",
-    });
-  };
-
-  const confirmAddModel = () => {
-    if (!addModelDraft) return;
-    const profile = profiles.find(
-      (candidate) => candidate.id === addModelDraft.providerId
-    );
-    if (!profile) return;
-    const id = normalizeAlias(addModelDraft.id);
-    const name = addModelDraft.name.trim();
-    const upstream = addModelDraft.model_id.trim();
-    if (!id || !name || !upstream) {
-      toast.error("Alias, display name, and upstream model ID are required.");
-      return;
-    }
-    if (profile.models.some((model) => model.id === id)) {
-      toast.error('Model alias "' + id + '" is already in use.');
-      return;
-    }
-    updateProfile(profile.id, (current) => ({
-      ...current,
-      models: [
-        ...current.models,
-        { id, name, model_id: upstream, enabled: true },
-      ],
-    }));
-    setAddModelDraft(null);
-  };
-
-  const testModel = async (model: BuiltinProviderModelConfig) => {
-    if (!selected) return;
-    const key = modelKey(selected.id, model);
-    setTestingKey(key);
-    setModelTests((current) => {
-      const next = { ...current };
-      delete next[key];
-      return next;
-    });
-    try {
-      const result = await testBuiltinProviderModel(actionDraft(selected), model);
-      const response = result.response.trim();
-      const message =
-        "Connected in " +
-        result.latency_ms +
-        " ms" +
-        (response ? ": " + response : "");
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "success", message },
-      }));
-      toast.success(message);
-    } catch (reason) {
-      const message =
-        reason instanceof Error ? reason.message : "Model test failed.";
-      setModelTests((current) => ({
-        ...current,
-        [key]: { status: "error", message },
-      }));
-      toast.error(message);
-    } finally {
-      setTestingKey(null);
-    }
-  };
-
-  const save = async () => {
-    if (!config || !values) return;
-    const defaultIsBuiltin = profiles.some(
-      (profile) => profile.id === values.provider
-    );
-    const defaultEnabled = profiles.some(
-      (profile) =>
-        profile.id === values.provider &&
-        profile.enabled &&
-        profile.models.some(
-          (model) => model.id === values.model && model.enabled
-        )
-    );
-    if (defaultIsBuiltin && !defaultEnabled) {
-      const message =
-        'Enable the default model "' +
-        values.model +
-        '" for provider "' +
-        values.provider +
-        '" before saving.';
-      setError(message);
-      toast.error(message);
-      return;
-    }
-
-    setSaving(true);
-    setError(null);
-    try {
-      const managedProfiles = profiles
-        .filter((profile) => profile.managed)
-        .map((profile) => ({
-          ...profile,
-          api_key: apiKeyDrafts[profile.id] || "",
-          clear_api_key: clearApiKeys.has(profile.id),
-        }));
-      const response = await saveLegacyLlmConfig({
-        revision: config.revision,
-        values,
-        secrets: {},
-        clear_secrets: [],
-        builtin_providers: managedProfiles,
-      });
-      applyResponse(response);
-      invalidateAvailableModels();
-      toast.success("Model provider registry saved.");
-      if (response.restart_required) {
-        toast.info(
-          "Restart EvoScientist to apply authentication mode changes."
-        );
-      }
-    } catch (reason) {
-      const message =
-        reason instanceof Error
-          ? reason.message
-          : "Could not save model provider registry.";
-      setError(message);
-      toast.error(message);
-    } finally {
-      setSaving(false);
-    }
-  };
-
-  if (loading) {
-    return (
-      <div className="flex min-h-80 items-center justify-center text-sm text-muted-foreground">
-        <Loader2 className="mr-2 size-4 animate-spin" />
-        Loading model providers...
-      </div>
-    );
-  }
-
-  if (!config || !values || !selected || !definition) {
-    return (
-      <div className="space-y-3">
-        <div
-          role="alert"
-          className="rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive"
-        >
-          {error || "Model provider configuration is unavailable."}
-        </div>
-        <Button
-          type="button"
-          variant="outline"
-          size="sm"
-          onClick={loadConfig}
-        >
-          <RefreshCw className="size-4" />
-          Reload
-        </Button>
-      </div>
-    );
-  }
-
-  const envNames = [
-    definition.apiKeyField
-      ? config.env_overrides[
-          definition.apiKeyField as keyof typeof config.env_overrides
-        ]
-      : undefined,
-    definition.baseUrlField
-      ? config.env_overrides[
-          definition.baseUrlField as keyof typeof config.env_overrides
-        ]
-      : undefined,
-    definition.authModeField
-      ? config.env_overrides[
-          definition.authModeField as keyof typeof config.env_overrides
-        ]
-      : undefined,
-  ].filter((name): name is string => Boolean(name));
-  const apiKeyDraft = apiKeyDrafts[selected.id] || "";
-  const apiKeyCleared = clearApiKeys.has(selected.id);
-
-  return (
-    <div className="space-y-3">
-      {error && (
-        <div
-          role="alert"
-          className="rounded-md border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive"
-        >
-          {error}
-        </div>
-      )}
-
-      <div className="grid min-h-[30rem] overflow-hidden rounded-md border border-border md:grid-cols-[15rem_minmax(0,1fr)]">
-        <aside className="border-b border-border bg-muted/20 md:border-b-0 md:border-r">
-          <div className="border-b border-border px-3 py-3">
-            <span className="text-sm font-medium">Built-in providers</span>
-          </div>
-          <div className="max-h-44 overflow-y-auto p-1.5 md:max-h-[34rem]">
-            {profiles.map((profile) => (
-              <button
-                key={profile.id}
-                type="button"
-                onClick={() => {
-                  setSelectedId(profile.id);
-                  setVisibleApiKey(null);
-                }}
-                className={cn(
-                  "flex w-full items-center gap-2 rounded px-2.5 py-2 text-left transition-colors hover:bg-accent",
-                  selected.id === profile.id && "bg-accent"
-                )}
-              >
-                <Server className="size-4 shrink-0 text-muted-foreground" />
-                <span className="min-w-0 flex-1">
-                  <span className="block truncate text-sm font-medium">
-                    {providerLabel(profile.id)}
-                  </span>
-                  <span className="block truncate font-mono text-[11px] text-muted-foreground">
-                    {profile.id}
-                  </span>
-                </span>
-                {envNames.length > 0 && selected.id === profile.id ? (
-                  <span className="text-[10px] font-medium text-amber-700 dark:text-amber-400">
-                    ENV
-                  </span>
-                ) : profile.managed ? (
-                  <CheckCircle2 className="size-3.5 text-emerald-600 dark:text-emerald-400" />
-                ) : null}
-              </button>
-            ))}
-          </div>
-        </aside>
-
-        <div className="min-w-0 overflow-y-auto p-4 md:max-h-[36rem]">
-          <div className="space-y-5">
-            <section>
-              <h3 className="mb-3 text-sm font-semibold">Default routing</h3>
-              <div className="grid gap-3 sm:grid-cols-2">
-                <div className="grid gap-1.5">
-                  <Label>Default provider</Label>
-                  <Select
-                    value={values.provider}
-                    onValueChange={(provider) =>
-                      setValues((current) =>
-                        current ? { ...current, provider } : current
-                      )
-                    }
-                  >
-                    <SelectTrigger className="h-9 bg-background">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent className="bg-background text-foreground">
-                      {profiles.map((profile) => (
-                        <SelectItem
-                          key={profile.id}
-                          value={profile.id}
-                        >
-                          {providerLabel(profile.id)}
-                        </SelectItem>
-                      ))}
-                      {!profiles.some(
-                        (profile) => profile.id === values.provider
-                      ) && (
-                        <SelectItem value={values.provider}>
-                          {values.provider}
-                        </SelectItem>
-                      )}
-                    </SelectContent>
-                  </Select>
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="registry-default-model">Default model</Label>
-                  <Input
-                    id="registry-default-model"
-                    className="font-mono"
-                    value={values.model}
-                    onChange={(event) =>
-                      setValues((current) =>
-                        current
-                          ? { ...current, model: event.target.value }
-                          : current
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="registry-aux-provider">
-                    Auxiliary provider
-                  </Label>
-                  <Input
-                    id="registry-aux-provider"
-                    className="font-mono"
-                    value={values.auxiliary_provider}
-                    placeholder="Use default provider"
-                    onChange={(event) =>
-                      setValues((current) =>
-                        current
-                          ? {
-                              ...current,
-                              auxiliary_provider: event.target.value,
-                            }
-                          : current
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5">
-                  <Label htmlFor="registry-aux-model">Auxiliary model</Label>
-                  <Input
-                    id="registry-aux-model"
-                    className="font-mono"
-                    value={values.auxiliary_model}
-                    placeholder="Use default model"
-                    onChange={(event) =>
-                      setValues((current) =>
-                        current
-                          ? { ...current, auxiliary_model: event.target.value }
-                          : current
-                      )
-                    }
-                  />
-                </div>
-                <div className="grid gap-1.5 sm:col-span-2">
-                  <Label htmlFor="registry-fallbacks">Model fallbacks</Label>
-                  <Textarea
-                    id="registry-fallbacks"
-                    className="min-h-16 resize-y font-mono"
-                    value={values.model_fallbacks}
-                    placeholder="model:provider,model:provider"
-                    onChange={(event) =>
-                      setValues((current) =>
-                        current
-                          ? { ...current, model_fallbacks: event.target.value }
-                          : current
-                      )
-                    }
-                  />
-                </div>
-              </div>
-            </section>
-
-            <section className="border-t border-border pt-4">
-              <div className="mb-3 flex flex-wrap items-center justify-between gap-3">
-                <div>
-                  <div className="flex flex-wrap items-center gap-2">
-                    <h3 className="text-sm font-semibold">
-                      {providerLabel(selected.id)}
-                    </h3>
-                    <span
-                      className={cn(
-                        "rounded border px-1.5 py-0.5 text-[10px] font-medium",
-                        selected.managed
-                          ? "border-emerald-500/40 text-emerald-700 dark:text-emerald-400"
-                          : "border-amber-500/40 text-amber-700 dark:text-amber-400"
-                      )}
-                    >
-                      {selected.managed ? "Registry" : "Legacy"}
-                    </span>
-                  </div>
-                  <p className="font-mono text-xs text-muted-foreground">
-                    {selected.id} / {selected.adapter}
-                  </p>
-                </div>
-                <div className="flex items-center gap-2">
-                  {envNames.length > 0 && (
-                    <span className="rounded border border-amber-500/40 bg-amber-500/10 px-2 py-1 text-xs text-amber-800 dark:text-amber-300">
-                      ENV: {envNames.join(", ")}
-                    </span>
-                  )}
-                  {!selected.managed && (
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      onClick={manageSelected}
-                    >
-                      Manage
-                    </Button>
-                  )}
-                </div>
-              </div>
-
-              <div className="grid gap-3 sm:grid-cols-2">
-                <div className="grid gap-1.5">
-                  <Label>Adapter</Label>
-                  <Input
-                    value={selected.adapter}
-                    disabled
-                    className="font-mono"
-                  />
-                </div>
-                <label className="flex min-h-9 items-center gap-2 self-end text-sm">
-                  <input
-                    type="checkbox"
-                    checked={selected.enabled}
-                    onChange={(event) =>
-                      updateProfile(selected.id, (profile) => ({
-                        ...profile,
-                        enabled: event.target.checked,
-                      }))
-                    }
-                    className="size-4 accent-[var(--brand)]"
-                  />
-                  Provider enabled
-                </label>
-                {definition.authModeField && (
-                  <div className="grid gap-1.5">
-                    <Label>Authentication</Label>
-                    <Select
-                      value={selected.auth_mode}
-                      onValueChange={(authMode) =>
-                        updateProfile(selected.id, (profile) => ({
-                          ...profile,
-                          auth_mode: authMode as "api_key" | "oauth",
-                        }))
-                      }
-                    >
-                      <SelectTrigger className="h-9 bg-background">
-                        <SelectValue />
-                      </SelectTrigger>
-                      <SelectContent className="bg-background text-foreground">
-                        <SelectItem value="api_key">API key</SelectItem>
-                        <SelectItem value="oauth">OAuth</SelectItem>
-                      </SelectContent>
-                    </Select>
-                  </div>
-                )}
-                <div
-                  className={cn(
-                    "grid gap-1.5",
-                    !definition.authModeField && "sm:col-span-2"
-                  )}
-                >
-                  <Label htmlFor="registry-base-url">Base URL</Label>
-                  <Input
-                    id="registry-base-url"
-                    type="url"
-                    inputMode="url"
-                    value={selected.base_url}
-                    placeholder={definition.baseUrlPlaceholder}
-                    onChange={(event) =>
-                      updateProfile(selected.id, (profile) => ({
-                        ...profile,
-                        base_url: event.target.value,
-                      }))
-                    }
-                  />
-                </div>
-                {definition.apiKeyField && (
-                  <div className="grid gap-1.5 sm:col-span-2">
-                    <Label htmlFor="registry-api-key">API key</Label>
-                    <div className="flex gap-2">
-                      <Input
-                        id="registry-api-key"
-                        type={
-                          visibleApiKey === selected.id ? "text" : "password"
-                        }
-                        autoComplete="new-password"
-                        value={apiKeyDraft}
-                        placeholder={
-                          apiKeyCleared
-                            ? "Will be cleared on save"
-                            : selected.api_key_configured
-                            ? "Configured" +
-                              (selected.api_key_hint
-                                ? " (" + selected.api_key_hint + ")"
-                                : "") +
-                              "; leave empty to keep it"
-                            : "Enter API key"
-                        }
-                        onChange={(event) => {
-                          const value = event.target.value;
-                          setApiKeyDrafts((current) => ({
-                            ...current,
-                            [selected.id]: value,
-                          }));
-                          setClearApiKeys((current) => {
-                            const next = new Set(current);
-                            next.delete(selected.id);
-                            return next;
-                          });
-                          updateProfile(selected.id, (profile) => profile);
-                        }}
-                      />
-                      <Button
-                        type="button"
-                        variant="outline"
-                        size="icon"
-                        disabled={!apiKeyDraft}
-                        onClick={() =>
-                          setVisibleApiKey((current) =>
-                            current === selected.id ? null : selected.id
-                          )
-                        }
-                        aria-label={
-                          visibleApiKey === selected.id
-                            ? "Hide API key"
-                            : "Show API key"
-                        }
-                        title={
-                          visibleApiKey === selected.id
-                            ? "Hide API key"
-                            : "Show API key"
-                        }
-                      >
-                        {visibleApiKey === selected.id ? (
-                          <EyeOff className="size-4" />
-                        ) : (
-                          <Eye className="size-4" />
-                        )}
-                      </Button>
-                      {(selected.api_key_configured || apiKeyCleared) && (
-                        <Button
-                          type="button"
-                          variant="outline"
-                          size="icon"
-                          onClick={() => {
-                            setApiKeyDrafts((current) => ({
-                              ...current,
-                              [selected.id]: "",
-                            }));
-                            setClearApiKeys((current) => {
-                              const next = new Set(current);
-                              if (next.has(selected.id))
-                                next.delete(selected.id);
-                              else next.add(selected.id);
-                              return next;
-                            });
-                            updateProfile(selected.id, (profile) => profile);
-                          }}
-                          aria-label={
-                            apiKeyCleared
-                              ? "Keep saved API key"
-                              : "Clear saved API key"
-                          }
-                          title={
-                            apiKeyCleared
-                              ? "Keep saved API key"
-                              : "Clear saved API key"
-                          }
-                        >
-                          {apiKeyCleared ? (
-                            <KeyRound className="size-4" />
-                          ) : (
-                            <Trash2 className="size-4" />
-                          )}
-                        </Button>
-                      )}
-                    </div>
-                  </div>
-                )}
-              </div>
-            </section>
-
-            <section className="border-t border-border pt-4">
-              <div className="mb-3 flex flex-wrap items-center justify-between gap-3">
-                <div>
-                  <h3 className="text-sm font-semibold">Models</h3>
-                  <p className="text-xs text-muted-foreground">
-                    Enabled models appear in the conversation picker.
-                  </p>
-                </div>
-                <div className="flex flex-wrap gap-2">
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    disabled={discoveringId === selected.id}
-                    onClick={discoverModels}
-                  >
-                    {discoveringId === selected.id ? (
-                      <Loader2 className="size-4 animate-spin" />
-                    ) : (
-                      <RefreshCw className="size-4" />
-                    )}
-                    Fetch
-                  </Button>
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    onClick={addKnownModels}
-                  >
-                    <Plus className="size-4" />
-                    Known
-                  </Button>
-                  <Button
-                    type="button"
-                    variant="outline"
-                    size="sm"
-                    onClick={openAddModel}
-                  >
-                    <Plus className="size-4" />
-                    Add
-                  </Button>
-                </div>
-              </div>
-
-              <div className="overflow-hidden rounded-md border border-border bg-background">
-                {selected.models.length === 0 ? (
-                  <div className="py-7 text-center text-xs text-muted-foreground">
-                    No models configured for this provider.
-                  </div>
-                ) : (
-                  <div className="max-h-64 overflow-y-auto p-2">
-                    <div className="grid gap-1.5 sm:grid-cols-2">
-                      {selected.models.map((model) => {
-                        const key = modelKey(selected.id, model);
-                        const testState = modelTests[key];
-                        return (
-                          <div
-                            key={key}
-                            className={cn(
-                              "flex h-11 min-w-0 items-center gap-2 rounded bg-muted/60 px-2",
-                              !model.enabled && "opacity-50"
-                            )}
-                            title={
-                              "Alias: " +
-                              model.id +
-                              "\nUpstream: " +
-                              model.model_id
-                            }
-                          >
-                            <Bot className="size-3.5 shrink-0 text-muted-foreground" />
-                            <span className="min-w-0 flex-1">
-                              <span className="block truncate text-xs font-medium">
-                                {model.name}
-                              </span>
-                              <span className="block truncate font-mono text-[10px] text-muted-foreground">
-                                {model.id}
-                              </span>
-                            </span>
-                            <label
-                              className="flex size-7 shrink-0 items-center justify-center"
-                              title={model.enabled ? "Disable" : "Enable"}
-                            >
-                              <input
-                                type="checkbox"
-                                checked={model.enabled}
-                                onChange={(event) =>
-                                  updateProfile(selected.id, (profile) => ({
-                                    ...profile,
-                                    models: profile.models.map((candidate) =>
-                                      candidate.id === model.id
-                                        ? {
-                                            ...candidate,
-                                            enabled: event.target.checked,
-                                          }
-                                        : candidate
-                                    ),
-                                  }))
-                                }
-                                className="size-3.5 accent-[var(--brand)]"
-                                aria-label={"Enable " + model.name}
-                              />
-                            </label>
-                            <Button
-                              type="button"
-                              variant="ghost"
-                              size="icon"
-                              className={cn(
-                                "size-7 shrink-0",
-                                testState?.status === "success" &&
-                                  "text-emerald-600 dark:text-emerald-400",
-                                testState?.status === "error" &&
-                                  "text-destructive"
-                              )}
-                              disabled={testingKey === key}
-                              onClick={() => testModel(model)}
-                              aria-label={"Test " + model.name}
-                              title={testState?.message || "Test model"}
-                            >
-                              {testingKey === key ? (
-                                <Loader2 className="size-3.5 animate-spin" />
-                              ) : testState?.status === "success" ? (
-                                <CheckCircle2 className="size-3.5" />
-                              ) : testState?.status === "error" ? (
-                                <CircleAlert className="size-3.5" />
-                              ) : (
-                                <FlaskConical className="size-3.5" />
-                              )}
-                            </Button>
-                            <Button
-                              type="button"
-                              variant="ghost"
-                              size="icon"
-                              className="size-7 shrink-0 text-muted-foreground hover:text-destructive"
-                              onClick={() =>
-                                updateProfile(selected.id, (profile) => ({
-                                  ...profile,
-                                  models: profile.models.filter(
-                                    (candidate) => candidate.id !== model.id
-                                  ),
-                                }))
-                              }
-                              aria-label={"Delete " + model.name}
-                              title="Delete model"
-                            >
-                              <Trash2 className="size-3.5" />
-                            </Button>
-                          </div>
-                        );
-                      })}
-                    </div>
-                  </div>
-                )}
-              </div>
-            </section>
-          </div>
-        </div>
-      </div>
-
-      <div className="flex flex-wrap justify-end gap-2">
-        <Button
-          type="button"
-          variant="outline"
-          onClick={loadConfig}
-          disabled={saving}
-        >
-          <RefreshCw className="size-4" />
-          Reload
-        </Button>
-        <Button
-          type="button"
-          onClick={save}
-          disabled={saving || !hasChanges}
-        >
-          {saving ? (
-            <Loader2 className="size-4 animate-spin" />
-          ) : (
-            <Save className="size-4" />
-          )}
-          Save providers.yaml
-        </Button>
-      </div>
-
-      <Dialog
-        open={Boolean(addModelDraft)}
-        onOpenChange={(open) => {
-          if (!open) setAddModelDraft(null);
-        }}
-      >
-        <DialogContent className="sm:max-w-md">
-          <DialogHeader>
-            <DialogTitle>Add model</DialogTitle>
-            <DialogDescription>
-              Configure the conversation alias and upstream model ID.
-            </DialogDescription>
-          </DialogHeader>
-          {addModelDraft && (
-            <div className="grid gap-3 py-2">
-              <div className="grid gap-1.5">
-                <Label htmlFor="registry-model-alias">Alias</Label>
-                <Input
-                  id="registry-model-alias"
-                  className="font-mono"
-                  value={addModelDraft.id}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, id: normalizeAlias(event.target.value) }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="registry-model-name">Display name</Label>
-                <Input
-                  id="registry-model-name"
-                  value={addModelDraft.name}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, name: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="registry-model-upstream">
-                  Upstream model ID
-                </Label>
-                <Input
-                  id="registry-model-upstream"
-                  className="font-mono"
-                  value={addModelDraft.model_id}
-                  onChange={(event) =>
-                    setAddModelDraft((current) =>
-                      current
-                        ? { ...current, model_id: event.target.value }
-                        : current
-                    )
-                  }
-                />
-              </div>
-            </div>
-          )}
-          <DialogFooter>
-            <Button
-              type="button"
-              variant="outline"
-              onClick={() => setAddModelDraft(null)}
-            >
-              Cancel
-            </Button>
-            <Button
-              type="button"
-              onClick={confirmAddModel}
-            >
-              Add model
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </div>
-  );
-}
diff --git a/src/app/components/RegistryEditor.tsx b/src/app/components/RegistryEditor.tsx
new file mode 100644
index 0000000..8eecfde
--- /dev/null
+++ b/src/app/components/RegistryEditor.tsx
@@ -0,0 +1,1142 @@
+"use client";
+
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { invalidateAvailableModels } from "@/app/hooks/useAvailableModels";
+import type {
+  AdapterParameterSpec,
+  CredentialWrite,
+  GetModelRegistryResponse,
+  ModelConfig,
+  ModelRef,
+  ParameterRule,
+  ProviderConfig,
+  ProviderTestResponse,
+  PutModelRegistryRequest,
+  RegistryV4,
+} from "@/lib/modelRegistry";
+import {
+  adapterSpecFor,
+  availabilityFor,
+  credentialStatusFor,
+  enabledModelRefs,
+  ID_PATTERN,
+  modelRefKey,
+  newModelDraft,
+  newProviderDraft,
+  registryDirty,
+  supportedAuthModes,
+} from "@/lib/registryDraft";
+
+type TestOutcome =
+  | { ok: true; result: ProviderTestResponse }
+  | { ok: false; message: string; code: string | null };
+
+interface ApiErrorBody {
+  code?: unknown;
+  message?: unknown;
+  details?: unknown;
+}
+
+async function readApiError(response: Response): Promise<{
+  message: string;
+  code: string | null;
+  details: Array<{ path?: string; code?: string }>;
+}> {
+  const body = (await response.json().catch(() => null)) as ApiErrorBody | null;
+  return {
+    message:
+      typeof body?.message === "string"
+        ? body.message
+        : `Request failed (${response.status}).`,
+    code: typeof body?.code === "string" ? body.code : null,
+    details: Array.isArray(body?.details)
+      ? (body.details as Array<{ path?: string; code?: string }>)
+      : [],
+  };
+}
+
+const inputClass =
+  "w-full rounded-md border border-border bg-background px-2 py-1 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-60";
+
+function Field({
+  label,
+  hint,
+  children,
+}: {
+  label: string;
+  hint?: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <label className="block space-y-0.5">
+      <span className="text-xs font-medium text-muted-foreground">{label}</span>
+      {children}
+      {hint && <span className="block text-[11px] text-muted-foreground">{hint}</span>}
+    </label>
+  );
+}
+
+function NumberField({
+  label,
+  value,
+  onChange,
+  rule,
+  nullable = false,
+  disabled = false,
+}: {
+  label: string;
+  value: number | null;
+  onChange: (next: number | null) => void;
+  rule?: ParameterRule | null;
+  nullable?: boolean;
+  disabled?: boolean;
+}) {
+  const hint = rule
+    ? [
+        rule.minimum != null ? `min ${rule.minimum}` : null,
+        rule.maximum != null ? `max ${rule.maximum}` : null,
+      ]
+        .filter(Boolean)
+        .join(" · ") || undefined
+    : undefined;
+  return (
+    <Field label={label} hint={hint}>
+      <input
+        type="number"
+        className={inputClass}
+        value={value ?? ""}
+        min={rule?.minimum ?? undefined}
+        max={rule?.maximum ?? undefined}
+        step={rule?.value_type === "integer" ? 1 : "any"}
+        disabled={disabled || rule?.supported === false}
+        placeholder={nullable ? "inherit" : undefined}
+        onChange={(event) => {
+          const raw = event.target.value;
+          if (raw === "" && nullable) {
+            onChange(null);
+            return;
+          }
+          const parsed = Number(raw);
+          if (Number.isNaN(parsed)) return;
+          onChange(rule?.value_type === "integer" ? Math.trunc(parsed) : parsed);
+        }}
+      />
+    </Field>
+  );
+}
+
+function AvailabilityBadge({
+  data,
+  ref_,
+}: {
+  data: GetModelRegistryResponse;
+  ref_: ModelRef;
+}) {
+  const status = availabilityFor(data, ref_);
+  if (!status) {
+    return (
+      <span className="rounded bg-accent px-1.5 py-0.5 text-[11px] text-muted-foreground">
+        new
+      </span>
+    );
+  }
+  const tone =
+    status.state === "enabled" || status.state === "verified"
+      ? "text-emerald-600"
+      : status.state === "verification_failed"
+      ? "text-destructive"
+      : "text-[var(--color-warning)]";
+  return (
+    <span
+      className={`rounded bg-accent px-1.5 py-0.5 text-[11px] ${tone}`}
+      title={status.reason_code ?? undefined}
+    >
+      {status.state}
+    </span>
+  );
+}
+
+function ModelEditor({
+  data,
+  spec,
+  provider,
+  model,
+  testing,
+  outcome,
+  dirty,
+  onChange,
+  onRemove,
+  onTest,
+}: {
+  data: GetModelRegistryResponse;
+  spec: AdapterParameterSpec | null;
+  provider: ProviderConfig;
+  model: ModelConfig;
+  testing: boolean;
+  outcome: TestOutcome | undefined;
+  dirty: boolean;
+  onChange: (next: ModelConfig) => void;
+  onRemove: () => void;
+  onTest: () => void;
+}) {
+  const ref: ModelRef = { provider_id: provider.id, model_key: model.key };
+  const rule = (name: string) => spec?.parameters[name] ?? null;
+  const runtime = model.runtime;
+  const setRuntime = (patch: Partial<ModelConfig["runtime"]>) =>
+    onChange({ ...model, runtime: { ...runtime, ...patch } });
+  const capability = (key: "tools" | "vision" | "structured_output") => {
+    const protocolAllows = spec?.protocol_capabilities[key] !== false;
+    return (
+      <label className="flex items-center gap-1 text-xs">
+        <input
+          type="checkbox"
+          checked={runtime.declared_capabilities[key]}
+          disabled={!protocolAllows}
+          onChange={(event) =>
+            setRuntime({
+              declared_capabilities: {
+                ...runtime.declared_capabilities,
+                [key]: event.target.checked,
+              },
+            })
+          }
+        />
+        {key.replace("_", " ")}
+      </label>
+    );
+  };
+
+  return (
+    <div className="space-y-2 rounded-md border border-border p-3">
+      <div className="flex flex-wrap items-center gap-2">
+        <span className="font-mono text-sm font-medium">{model.key}</span>
+        <AvailabilityBadge data={data} ref_={ref} />
+        <span className="flex-1" />
+        <label className="flex items-center gap-1 text-xs">
+          <input
+            type="checkbox"
+            checked={model.enabled}
+            onChange={(event) =>
+              onChange({ ...model, enabled: event.target.checked })
+            }
+          />
+          enabled
+        </label>
+        <Button
+          type="button"
+          variant="outline"
+          size="sm"
+          disabled={testing || dirty}
+          title={
+            dirty
+              ? "Save the registry before testing (tests only run against saved models)."
+              : undefined
+          }
+          onClick={onTest}
+        >
+          {testing ? "Testing…" : "Test"}
+        </Button>
+        <Button type="button" variant="outline" size="sm" onClick={onRemove}>
+          Remove
+        </Button>
+      </div>
+      <div className="grid grid-cols-2 gap-2 sm:grid-cols-3">
+        <Field label="Model key">
+          <input
+            type="text"
+            className={inputClass}
+            value={model.key}
+            pattern="[a-z0-9][a-z0-9._-]*"
+            onChange={(event) =>
+              onChange({ ...model, key: event.target.value })
+            }
+          />
+        </Field>
+        <Field label="Display name">
+          <input
+            type="text"
+            className={inputClass}
+            value={model.name}
+            onChange={(event) =>
+              onChange({ ...model, name: event.target.value })
+            }
+          />
+        </Field>
+        <Field label="Upstream model id">
+          <input
+            type="text"
+            className={inputClass}
+            value={model.upstream_model_id}
+            onChange={(event) =>
+              onChange({ ...model, upstream_model_id: event.target.value })
+            }
+          />
+        </Field>
+      </div>
+      <div className="grid grid-cols-2 gap-2 sm:grid-cols-4">
+        <Field label="Limit mode">
+          <select
+            className={inputClass}
+            value={runtime.limit_mode}
+            onChange={(event) =>
+              setRuntime({
+                limit_mode: event.target.value === "input_only" ? "input_only" : "combined",
+              })
+            }
+          >
+            <option value="combined">combined</option>
+            <option value="input_only">input_only</option>
+          </select>
+        </Field>
+        <NumberField
+          label="Context window"
+          value={runtime.context_window_tokens}
+          nullable
+          onChange={(value) => setRuntime({ context_window_tokens: value })}
+        />
+        <NumberField
+          label="Max input tokens"
+          value={runtime.max_input_tokens}
+          nullable
+          onChange={(value) => setRuntime({ max_input_tokens: value })}
+        />
+        <NumberField
+          label="Max output tokens"
+          value={runtime.max_output_tokens}
+          rule={rule("max_output_tokens")}
+          onChange={(value) =>
+            setRuntime({ max_output_tokens: value ?? runtime.max_output_tokens })
+          }
+        />
+        <NumberField
+          label="Min effective input"
+          value={runtime.min_effective_input_tokens}
+          onChange={(value) =>
+            setRuntime({ min_effective_input_tokens: value ?? 0 })
+          }
+        />
+        <NumberField
+          label="System reserve"
+          value={runtime.fixed_system_reserve_tokens}
+          onChange={(value) =>
+            setRuntime({ fixed_system_reserve_tokens: value ?? 0 })
+          }
+        />
+        <NumberField
+          label="Tools reserve"
+          value={runtime.fixed_tools_reserve_tokens}
+          onChange={(value) =>
+            setRuntime({ fixed_tools_reserve_tokens: value ?? 0 })
+          }
+        />
+        <NumberField
+          label="Attachments reserve"
+          value={runtime.fixed_attachments_reserve_tokens}
+          onChange={(value) =>
+            setRuntime({ fixed_attachments_reserve_tokens: value ?? 0 })
+          }
+        />
+        <Field label="Limits status">
+          <select
+            className={inputClass}
+            value={runtime.limits_status}
+            onChange={(event) =>
+              setRuntime({
+                limits_status:
+                  event.target.value === "confirmed"
+                    ? "confirmed"
+                    : "needs_confirmation",
+              })
+            }
+          >
+            <option value="needs_confirmation">needs confirmation</option>
+            <option value="confirmed">confirmed</option>
+          </select>
+        </Field>
+        <Field label="Limits source">
+          <select
+            className={inputClass}
+            value={runtime.limits_source}
+            onChange={(event) =>
+              setRuntime({
+                limits_source:
+                  event.target.value === "provider" ||
+                  event.target.value === "tested_contract"
+                    ? event.target.value
+                    : "user",
+              })
+            }
+          >
+            <option value="user">user</option>
+            <option value="provider">provider</option>
+            <option value="tested_contract">tested contract</option>
+          </select>
+        </Field>
+        <NumberField
+          label={rule("temperature")?.supported === false ? "Temperature (unsupported)" : "Temperature"}
+          value={runtime.temperature}
+          nullable
+          rule={rule("temperature")}
+          onChange={(value) => setRuntime({ temperature: value })}
+        />
+        <NumberField
+          label="Top p"
+          value={runtime.top_p}
+          nullable
+          rule={rule("top_p")}
+          onChange={(value) => setRuntime({ top_p: value })}
+        />
+        <Field
+          label={
+            rule("reasoning_effort")?.supported === false
+              ? "Reasoning effort (unsupported)"
+              : "Reasoning effort"
+          }
+        >
+          <select
+            className={inputClass}
+            value={runtime.reasoning_effort}
+            disabled={rule("reasoning_effort")?.supported === false}
+            onChange={(event) =>
+              setRuntime({
+                reasoning_effort: event.target
+                  .value as ModelConfig["runtime"]["reasoning_effort"],
+              })
+            }
+          >
+            {(rule("reasoning_effort")?.enum_values ?? [
+              "auto",
+              "low",
+              "medium",
+              "high",
+            ]).map((value) => (
+              <option key={value} value={value}>
+                {value}
+              </option>
+            ))}
+          </select>
+        </Field>
+      </div>
+      <div className="flex items-center gap-4">
+        <span className="text-xs font-medium text-muted-foreground">
+          Capabilities
+        </span>
+        {capability("tools")}
+        {capability("vision")}
+        {capability("structured_output")}
+      </div>
+      {outcome && (
+        <div
+          className={`rounded-md border px-3 py-2 text-xs ${
+            outcome.ok
+              ? "border-emerald-600/30 bg-emerald-600/5"
+              : "border-destructive/30 bg-destructive/5"
+          }`}
+        >
+          {outcome.ok ? (
+            <>
+              <p>
+                Test passed in {outcome.result.latency_ms} ms — adapter spec
+                revision {outcome.result.adapter_spec_revision}, state{" "}
+                {outcome.result.model_status.state}.
+              </p>
+              <pre className="mt-1 overflow-x-auto font-mono text-[11px]">
+                {JSON.stringify(outcome.result.effective_request_options, null, 2)}
+              </pre>
+            </>
+          ) : (
+            <p role="alert">
+              Test failed{outcome.code ? ` (${outcome.code})` : ""}:{" "}
+              {outcome.message}
+            </p>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function ProviderEditor({
+  data,
+  provider,
+  index,
+  dirty,
+  testing,
+  testOutcomes,
+  onChange,
+  onRemove,
+  onTestModel,
+  onCredentialStage,
+  stagedCredential,
+}: {
+  data: GetModelRegistryResponse;
+  provider: ProviderConfig;
+  index: number;
+  dirty: boolean;
+  testing: Record<string, boolean>;
+  testOutcomes: Record<string, TestOutcome>;
+  onChange: (next: ProviderConfig) => void;
+  onRemove: () => void;
+  onTestModel: (ref: ModelRef) => void;
+  onCredentialStage: (credentialId: string, secret: string) => void;
+  stagedCredential: string | undefined;
+}) {
+  const spec = adapterSpecFor(data.adapter_specs, provider.adapter);
+  const authModes = supportedAuthModes(spec);
+  const credentialStatus = credentialStatusFor(data, provider.auth.credential_id);
+  const setRuntime = (patch: Partial<ProviderConfig["runtime"]>) =>
+    onChange({ ...provider, runtime: { ...provider.runtime, ...patch } });
+
+  return (
+    <div className="space-y-3 rounded-lg border border-border p-4">
+      <div className="flex flex-wrap items-center gap-2">
+        <span className="font-mono text-sm font-semibold">{provider.id}</span>
+        <span className="rounded bg-accent px-1.5 py-0.5 text-[11px] text-muted-foreground">
+          {provider.adapter}
+        </span>
+        <span className="flex-1" />
+        <label className="flex items-center gap-1 text-xs">
+          <input
+            type="checkbox"
+            checked={provider.enabled}
+            onChange={(event) =>
+              onChange({ ...provider, enabled: event.target.checked })
+            }
+          />
+          enabled
+        </label>
+        <Button type="button" variant="outline" size="sm" onClick={onRemove}>
+          Remove provider
+        </Button>
+      </div>
+      <div className="grid grid-cols-2 gap-2 sm:grid-cols-3">
+        <Field label="Provider id">
+          <input
+            type="text"
+            className={inputClass}
+            value={provider.id}
+            pattern="[a-z0-9][a-z0-9._-]*"
+            onChange={(event) => onChange({ ...provider, id: event.target.value })}
+          />
+        </Field>
+        <Field label="Display name">
+          <input
+            type="text"
+            className={inputClass}
+            value={provider.name}
+            onChange={(event) => onChange({ ...provider, name: event.target.value })}
+          />
+        </Field>
+        <Field label="Adapter">
+          <select
+            className={inputClass}
+            value={provider.adapter}
+            onChange={(event) => {
+              const adapter = event.target.value;
+              const nextSpec = adapterSpecFor(data.adapter_specs, adapter);
+              const modes = supportedAuthModes(nextSpec);
+              onChange({
+                ...provider,
+                adapter,
+                auth: modes.includes(provider.auth.mode)
+                  ? provider.auth
+                  : {
+                      mode: modes[0] ?? "none",
+                      credential_id:
+                        (modes[0] ?? "none") === "none"
+                          ? null
+                          : provider.auth.credential_id ??
+                            `${provider.id}-credential`,
+                    },
+              });
+            }}
+          >
+            {Array.from(
+              new Set(data.adapter_specs.map((spec) => spec.adapter_id))
+            ).map((adapter) => (
+              <option key={adapter} value={adapter}>
+                {adapter}
+              </option>
+            ))}
+          </select>
+        </Field>
+      </div>
+      <Field
+        label="Base URL"
+        hint="Any public HTTPS endpoint, or one of the configured development endpoints."
+      >
+        <input
+          type="text"
+          className={inputClass}
+          value={provider.base_url}
+          placeholder="https://api.example.com/v1"
+          list={`dev-endpoints-${index}`}
+          onChange={(event) =>
+            onChange({ ...provider, base_url: event.target.value })
+          }
+        />
+        <datalist id={`dev-endpoints-${index}`}>
+          {data.endpoint_policy.development_endpoints.map((endpoint) => (
+            <option key={endpoint.id} value={endpoint.url}>
+              {endpoint.label}
+            </option>
+          ))}
+        </datalist>
+      </Field>
+      <div className="grid grid-cols-2 gap-2 sm:grid-cols-3">
+        <Field label="Auth mode">
+          <select
+            className={inputClass}
+            value={provider.auth.mode}
+            onChange={(event) => {
+              const mode = event.target.value as ProviderConfig["auth"]["mode"];
+              onChange({
+                ...provider,
+                auth: {
+                  mode,
+                  credential_id:
+                    mode === "none"
+                      ? null
+                      : provider.auth.credential_id ??
+                        `${provider.id}-credential`,
+                },
+              });
+            }}
+          >
+            {authModes.map((mode) => (
+              <option key={mode} value={mode}>
+                {mode}
+              </option>
+            ))}
+            {!authModes.includes("none") && <option value="none">none</option>}
+          </select>
+        </Field>
+        {provider.auth.mode !== "none" && (
+          <>
+            <Field
+              label="Credential id"
+              hint={
+                credentialStatus?.configured
+                  ? `configured${credentialStatus.hint ? ` (${credentialStatus.hint})` : ""}`
+                  : "not configured"
+              }
+            >
+              <input
+                type="text"
+                className={inputClass}
+                value={provider.auth.credential_id ?? ""}
+                onChange={(event) =>
+                  onChange({
+                    ...provider,
+                    auth: { ...provider.auth, credential_id: event.target.value || null },
+                  })
+                }
+              />
+            </Field>
+            <Field
+              label="Secret (write-once)"
+              hint={
+                stagedCredential
+                  ? "staged — saved with the registry"
+                  : "leave blank to keep the current secret"
+              }
+            >
+              <input
+                type="password"
+                className={inputClass}
+                value={stagedCredential ?? ""}
+                autoComplete="new-password"
+                onChange={(event) =>
+                  provider.auth.credential_id &&
+                  onCredentialStage(provider.auth.credential_id, event.target.value)
+                }
+              />
+            </Field>
+          </>
+        )}
+      </div>
+      <div className="grid grid-cols-2 gap-2 sm:grid-cols-5">
+        <NumberField
+          label="Timeout (s)"
+          value={provider.runtime.timeout_seconds}
+          rule={spec?.parameters["timeout_seconds"] ?? null}
+          onChange={(value) => setRuntime({ timeout_seconds: value ?? 120 })}
+        />
+        <NumberField
+          label="Max retries"
+          value={provider.runtime.max_retries}
+          rule={spec?.parameters["max_retries"] ?? null}
+          onChange={(value) => setRuntime({ max_retries: value ?? 0 })}
+        />
+        <NumberField
+          label="Default temperature"
+          value={provider.runtime.default_temperature}
+          nullable
+          rule={spec?.parameters["temperature"] ?? null}
+          onChange={(value) => setRuntime({ default_temperature: value })}
+        />
+        <NumberField
+          label="Default top p"
+          value={provider.runtime.default_top_p}
+          nullable
+          rule={spec?.parameters["top_p"] ?? null}
+          onChange={(value) => setRuntime({ default_top_p: value })}
+        />
+        <Field label="Default reasoning effort">
+          <select
+            className={inputClass}
+            value={provider.runtime.default_reasoning_effort}
+            disabled={spec?.parameters["reasoning_effort"]?.supported === false}
+            onChange={(event) =>
+              setRuntime({
+                default_reasoning_effort: event.target
+                  .value as ProviderConfig["runtime"]["default_reasoning_effort"],
+              })
+            }
+          >
+            {["auto", "low", "medium", "high"].map((value) => (
+              <option key={value} value={value}>
+                {value}
+              </option>
+            ))}
+          </select>
+        </Field>
+      </div>
+      <div className="space-y-2">
+        <div className="flex items-center justify-between">
+          <p className="text-xs font-medium text-muted-foreground">Models</p>
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            onClick={() => {
+              let index2 = provider.models.length + 1;
+              let key = `model-${index2}`;
+              const keys = new Set(provider.models.map((model) => model.key));
+              while (keys.has(key)) {
+                index2 += 1;
+                key = `model-${index2}`;
+              }
+              onChange({
+                ...provider,
+                models: [...provider.models, newModelDraft(key)],
+              });
+            }}
+          >
+            Add model
+          </Button>
+        </div>
+        {provider.models.length === 0 && (
+          <p className="text-xs text-muted-foreground">No models yet.</p>
+        )}
+        {provider.models.map((model, modelIndex) => {
+          const ref: ModelRef = { provider_id: provider.id, model_key: model.key };
+          const key = modelRefKey(ref);
+          return (
+            <ModelEditor
+              key={`${modelIndex}-${model.key}`}
+              data={data}
+              spec={spec}
+              provider={provider}
+              model={model}
+              testing={testing[key] === true}
+              outcome={testOutcomes[key]}
+              dirty={dirty}
+              onChange={(next) =>
+                onChange({
+                  ...provider,
+                  models: provider.models.map((current, i) =>
+                    i === modelIndex ? next : current
+                  ),
+                })
+              }
+              onRemove={() =>
+                onChange({
+                  ...provider,
+                  models: provider.models.filter((_, i) => i !== modelIndex),
+                })
+              }
+              onTest={() => onTestModel(ref)}
+            />
+          );
+        })}
+      </div>
+    </div>
+  );
+}
+
+/** Adapter-spec-driven Registry Editor (design doc sections 9 and 11.8).
+ * The backend remains the only validation authority; the editor renders
+ * controls from `adapter_specs` and surfaces 422 detail paths verbatim. */
+export function RegistryEditor() {
+  const [data, setData] = useState<GetModelRegistryResponse | null>(null);
+  const [draft, setDraft] = useState<RegistryV4 | null>(null);
+  const [credentialWrites, setCredentialWrites] = useState<Map<string, string>>(
+    new Map()
+  );
+  const [loadError, setLoadError] = useState<string | null>(null);
+  const [forbidden, setForbidden] = useState(false);
+  const [saveIssues, setSaveIssues] = useState<{
+    message: string;
+    code: string | null;
+    details: Array<{ path?: string; code?: string }>;
+  } | null>(null);
+  const [saving, setSaving] = useState(false);
+  const [testing, setTesting] = useState<Record<string, boolean>>({});
+  const [testOutcomes, setTestOutcomes] = useState<Record<string, TestOutcome>>(
+    {}
+  );
+
+  const load = useCallback(async () => {
+    setLoadError(null);
+    try {
+      const response = await fetch("/api/model-registry", { cache: "no-store" });
+      if (response.status === 403) {
+        setForbidden(true);
+        setData(null);
+        setDraft(null);
+        return;
+      }
+      if (!response.ok) {
+        const error = await readApiError(response);
+        throw new Error(error.message);
+      }
+      const body = (await response.json()) as GetModelRegistryResponse;
+      setForbidden(false);
+      setData(body);
+      setDraft(structuredClone(body.registry));
+      setCredentialWrites(new Map());
+      setSaveIssues(null);
+    } catch (reason) {
+      setLoadError(
+        reason instanceof Error ? reason.message : "Failed to load the registry."
+      );
+    }
+  }, []);
+
+  useEffect(() => {
+    void load();
+  }, [load]);
+
+  const dirty = useMemo(
+    () =>
+      data && draft
+        ? registryDirty(draft, data.registry, credentialWrites)
+        : false,
+    [data, draft, credentialWrites]
+  );
+
+  const save = useCallback(async () => {
+    if (!data || !draft) return;
+    setSaving(true);
+    setSaveIssues(null);
+    try {
+      const writes: CredentialWrite[] = [];
+      for (const [credentialId, secret] of credentialWrites) {
+        if (secret) {
+          writes.push({
+            credential_id: credentialId,
+            operation: "replace",
+            secret_value: secret,
+          });
+        }
+      }
+      const payload: PutModelRegistryRequest = {
+        expected_revision: data.revision,
+        registry: draft,
+        ...(writes.length > 0 ? { credential_writes: writes } : {}),
+      };
+      const response = await fetch("/api/model-registry", {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(payload),
+      });
+      if (!response.ok) {
+        const error = await readApiError(response);
+        if (response.status === 409) {
+          toast.error("Registry changed elsewhere — reloaded the latest state.");
+          await load();
+          return;
+        }
+        setSaveIssues(error);
+        toast.error(error.message);
+        return;
+      }
+      const body = (await response.json()) as GetModelRegistryResponse;
+      setData(body);
+      setDraft(structuredClone(body.registry));
+      setCredentialWrites(new Map());
+      setTestOutcomes({});
+      invalidateAvailableModels();
+      toast.success(`Registry saved (revision ${body.revision}).`);
+    } catch (reason) {
+      toast.error(
+        reason instanceof Error ? reason.message : "Failed to save the registry."
+      );
+    } finally {
+      setSaving(false);
+    }
+  }, [credentialWrites, data, draft, load]);
+
+  const testModel = useCallback(
+    async (ref: ModelRef) => {
+      if (!data) return;
+      const key = modelRefKey(ref);
+      setTesting((current) => ({ ...current, [key]: true }));
+      try {
+        const response = await fetch("/api/model-registry/test", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            expected_registry_revision: data.revision,
+            model_ref: ref,
+          }),
+        });
+        if (!response.ok) {
+          const error = await readApiError(response);
+          setTestOutcomes((current) => ({
+            ...current,
+            [key]: { ok: false, message: error.message, code: error.code },
+          }));
+          if (response.status === 409) {
+            await load();
+          }
+          return;
+        }
+        const result = (await response.json()) as ProviderTestResponse;
+        if (result.ok) {
+          setTestOutcomes((current) => ({
+            ...current,
+            [key]: { ok: true, result },
+          }));
+          toast.success(`${key} passed the provider test.`);
+          invalidateAvailableModels();
+        } else {
+          setTestOutcomes((current) => ({
+            ...current,
+            [key]: {
+              ok: false,
+              message: "The provider rejected the test request.",
+              code: null,
+            },
+          }));
+          toast.error(`${key} failed the provider test.`);
+        }
+      } catch (reason) {
+        setTestOutcomes((current) => ({
+          ...current,
+          [key]: {
+            ok: false,
+            message:
+              reason instanceof Error ? reason.message : "Provider test failed.",
+            code: null,
+          },
+        }));
+      } finally {
+        setTesting((current) => ({ ...current, [key]: false }));
+      }
+    },
+    [data, load]
+  );
+
+  if (forbidden) {
+    return (
+      <p className="rounded-md border border-border px-4 py-3 text-sm text-muted-foreground">
+        Model configuration requires an admin account.
+      </p>
+    );
+  }
+  if (loadError) {
+    return (
+      <div className="space-y-2 rounded-md border border-destructive/30 bg-destructive/5 px-4 py-3 text-sm">
+        <p role="alert">{loadError}</p>
+        <Button type="button" variant="outline" size="sm" onClick={() => void load()}>
+          Retry
+        </Button>
+      </div>
+    );
+  }
+  if (!data || !draft) {
+    return <p className="text-sm text-muted-foreground">Loading registry…</p>;
+  }
+
+  const defaultOptions = enabledModelRefs(draft);
+  const refFromKey = (key: string): ModelRef | null => {
+    if (!key) return null;
+    const [provider_id, model_key] = key.split("/");
+    if (!provider_id || !model_key) return null;
+    return { provider_id, model_key };
+  };
+
+  return (
+    <div className="space-y-4">
+      <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
+        <span className="rounded bg-accent px-1.5 py-0.5">
+          state: {draft.state}
+        </span>
+        <span className="rounded bg-accent px-1.5 py-0.5">
+          revision: {data.revision}
+        </span>
+        {dirty && (
+          <span className="rounded bg-[var(--color-warning)]/10 px-1.5 py-0.5 text-[var(--color-warning)]">
+            unsaved changes
+          </span>
+        )}
+      </div>
+
+      <div className="grid grid-cols-1 gap-2 rounded-lg border border-border p-4 sm:grid-cols-2">
+        <Field label="Default primary model">
+          <select
+            className={inputClass}
+            value={
+              draft.defaults.primary ? modelRefKey(draft.defaults.primary) : ""
+            }
+            onChange={(event) =>
+              setDraft({
+                ...draft,
+                defaults: {
+                  ...draft.defaults,
+                  primary: refFromKey(event.target.value),
+                },
+              })
+            }
+          >
+            <option value="">— none —</option>
+            {defaultOptions.map((option) => (
+              <option key={modelRefKey(option.ref)} value={modelRefKey(option.ref)}>
+                {option.label}
+              </option>
+            ))}
+          </select>
+        </Field>
+        <Field label="Default auxiliary model">
+          <select
+            className={inputClass}
+            value={
+              draft.defaults.auxiliary ? modelRefKey(draft.defaults.auxiliary) : ""
+            }
+            onChange={(event) =>
+              setDraft({
+                ...draft,
+                defaults: {
+                  ...draft.defaults,
+                  auxiliary: refFromKey(event.target.value),
+                },
+              })
+            }
+          >
+            <option value="">— none (uses primary) —</option>
+            {defaultOptions.map((option) => (
+              <option key={modelRefKey(option.ref)} value={modelRefKey(option.ref)}>
+                {option.label}
+              </option>
+            ))}
+          </select>
+        </Field>
+      </div>
+
+      {draft.providers.map((provider, index) => (
+        <ProviderEditor
+          key={`${index}-${provider.id}`}
+          data={data}
+          provider={provider}
+          index={index}
+          dirty={dirty}
+          testing={testing}
+          testOutcomes={testOutcomes}
+          stagedCredential={
+            provider.auth.credential_id
+              ? credentialWrites.get(provider.auth.credential_id)
+              : undefined
+          }
+          onCredentialStage={(credentialId, secret) =>
+            setCredentialWrites((current) => {
+              const next = new Map(current);
+              if (secret) next.set(credentialId, secret);
+              else next.delete(credentialId);
+              return next;
+            })
+          }
+          onChange={(next) =>
+            setDraft({
+              ...draft,
+              providers: draft.providers.map((current, i) =>
+                i === index ? next : current
+              ),
+            })
+          }
+          onRemove={() =>
+            setDraft({
+              ...draft,
+              providers: draft.providers.filter((_, i) => i !== index),
+            })
+          }
+          onTestModel={(ref) => void testModel(ref)}
+        />
+      ))}
+
+      <Button
+        type="button"
+        variant="outline"
+        onClick={() =>
+          setDraft({
+            ...draft,
+            providers: [
+              ...draft.providers,
+              newProviderDraft(
+                data.adapter_specs,
+                new Set(draft.providers.map((provider) => provider.id))
+              ),
+            ],
+          })
+        }
+      >
+        Add provider
+      </Button>
+
+      {saveIssues && saveIssues.details.length > 0 && (
+        <div className="rounded-md border border-destructive/30 bg-destructive/5 px-4 py-3 text-xs">
+          <p className="font-medium">{saveIssues.message}</p>
+          <ul className="mt-1 list-inside list-disc">
+            {saveIssues.details.map((detail, index) => (
+              <li key={index}>
+                <span className="font-mono">{detail.path ?? "(request)"}</span>
+                {detail.code ? ` — ${detail.code}` : ""}
+              </li>
+            ))}
+          </ul>
+        </div>
+      )}
+
+      <div className="flex items-center gap-2 border-t border-border pt-3">
+        <Button
+          type="button"
+          onClick={() => void save()}
+          disabled={saving || !dirty}
+        >
+          {saving ? "Saving…" : "Save registry"}
+        </Button>
+        <Button
+          type="button"
+          variant="outline"
+          disabled={saving || !dirty}
+          onClick={() => {
+            setDraft(structuredClone(data.registry));
+            setCredentialWrites(new Map());
+            setSaveIssues(null);
+          }}
+        >
+          Discard changes
+        </Button>
+      </div>
+      <p className="text-[11px] text-muted-foreground">
+        IDs use lowercase letters, digits, dot, underscore and dash
+        (e.g. <span className="font-mono">zhipu-glm/glm-5.2</span>):{" "}
+        {ID_PATTERN.source}. Enabling a model requires confirmed limits and a
+        passing provider test at the current configuration.
+      </p>
+    </div>
+  );
+}
diff --git a/src/app/components/UserManagementSection.tsx b/src/app/components/UserManagementSection.tsx
new file mode 100644
index 0000000..bfcfd5e
--- /dev/null
+++ b/src/app/components/UserManagementSection.tsx
@@ -0,0 +1,239 @@
+"use client";
+
+import { useCallback, useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+import { toast } from "sonner";
+
+interface ManagedUser {
+  username: string;
+  role: "admin" | "user";
+  createdAt: string;
+  updatedAt: string;
+}
+
+async function readError(response: Response, fallback: string): Promise<Error> {
+  const body = (await response.json().catch(() => null)) as {
+    message?: unknown;
+    error?: unknown;
+  } | null;
+  const message =
+    typeof body?.message === "string"
+      ? body.message
+      : typeof body?.error === "string"
+      ? body.error
+      : fallback;
+  return new Error(message);
+}
+
+/** Admin-only user management (design doc 7.2): list, create, change role,
+ * reset password, delete. The backend enforces the last-admin guard. */
+export function UserManagementSection({ self }: { self: string }) {
+  const [users, setUsers] = useState<ManagedUser[] | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  const [newUsername, setNewUsername] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [newRole, setNewRole] = useState<"admin" | "user">("user");
+  const [busy, setBusy] = useState(false);
+
+  const refresh = useCallback(async () => {
+    try {
+      const response = await fetch("/api/auth/users", { cache: "no-store" });
+      if (!response.ok) throw await readError(response, "Failed to load users.");
+      const body = (await response.json()) as { users?: ManagedUser[] };
+      setUsers(Array.isArray(body.users) ? body.users : []);
+      setError(null);
+    } catch (reason) {
+      setError(reason instanceof Error ? reason.message : "Failed to load users.");
+    }
+  }, []);
+
+  useEffect(() => {
+    void refresh();
+  }, [refresh]);
+
+  const run = useCallback(
+    async (action: () => Promise<Response>, success: string) => {
+      setBusy(true);
+      try {
+        const response = await action();
+        if (!response.ok) throw await readError(response, "Request failed.");
+        toast.success(success);
+        await refresh();
+      } catch (reason) {
+        toast.error(reason instanceof Error ? reason.message : "Request failed.");
+      } finally {
+        setBusy(false);
+      }
+    },
+    [refresh]
+  );
+
+  const createUser = () =>
+    run(
+      () =>
+        fetch("/api/auth/users", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            username: newUsername.trim(),
+            password: newPassword,
+            role: newRole,
+          }),
+        }),
+      `User ${newUsername.trim()} created.`
+    ).then(() => {
+      setNewUsername("");
+      setNewPassword("");
+      setNewRole("user");
+    });
+
+  const toggleRole = (user: ManagedUser) =>
+    run(
+      () =>
+        fetch(`/api/auth/users/${encodeURIComponent(user.username)}`, {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            role: user.role === "admin" ? "user" : "admin",
+          }),
+        }),
+      `Role updated for ${user.username}.`
+    );
+
+  const resetPassword = (user: ManagedUser) => {
+    const password = window.prompt(
+      `New password for ${user.username} (8-256 characters):`
+    );
+    if (!password) return;
+    return run(
+      () =>
+        fetch(`/api/auth/users/${encodeURIComponent(user.username)}`, {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ password }),
+        }),
+      `Password updated for ${user.username}.`
+    );
+  };
+
+  const removeUser = (user: ManagedUser) => {
+    if (!window.confirm(`Delete user ${user.username}?`)) return;
+    return run(
+      () =>
+        fetch(`/api/auth/users/${encodeURIComponent(user.username)}`, {
+          method: "DELETE",
+        }),
+      `User ${user.username} deleted.`
+    );
+  };
+
+  return (
+    <section
+      aria-label="User management"
+      className="rounded-md border border-border px-4 py-3"
+    >
+      <p className="text-xs font-medium text-muted-foreground">
+        User management (admin)
+      </p>
+      {error && (
+        <p role="alert" className="mt-2 text-sm text-destructive">
+          {error}
+        </p>
+      )}
+      <ul className="mt-2 space-y-2">
+        {(users ?? []).map((user) => (
+          <li
+            key={user.username}
+            className="flex items-center justify-between gap-2 text-sm"
+          >
+            <span className="min-w-0 truncate font-medium">
+              {user.username}
+              {user.username === self && (
+                <span className="ml-1 text-xs text-muted-foreground">(you)</span>
+              )}
+              <span className="ml-2 rounded bg-accent px-1.5 py-0.5 text-xs font-normal text-muted-foreground">
+                {user.role}
+              </span>
+            </span>
+            <span className="flex shrink-0 gap-1">
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                disabled={busy}
+                onClick={() => void toggleRole(user)}
+              >
+                {user.role === "admin" ? "Demote" : "Promote"}
+              </Button>
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                disabled={busy}
+                onClick={() => void resetPassword(user)}
+              >
+                Password
+              </Button>
+              {user.username !== self && (
+                <Button
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  disabled={busy}
+                  onClick={() => void removeUser(user)}
+                >
+                  Delete
+                </Button>
+              )}
+            </span>
+          </li>
+        ))}
+        {users && users.length === 0 && (
+          <li className="text-sm text-muted-foreground">No users yet.</li>
+        )}
+        {users === null && !error && (
+          <li className="text-sm text-muted-foreground">Loading users…</li>
+        )}
+      </ul>
+      <div className="mt-3 space-y-2 border-t border-border pt-3">
+        <p className="text-xs font-medium text-muted-foreground">Add user</p>
+        <div className="flex flex-wrap items-center gap-2">
+          <input
+            type="text"
+            value={newUsername}
+            onChange={(event) => setNewUsername(event.target.value)}
+            placeholder="Username"
+            autoComplete="off"
+            className="w-36 rounded-md border border-border bg-background px-2 py-1 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          />
+          <input
+            type="password"
+            value={newPassword}
+            onChange={(event) => setNewPassword(event.target.value)}
+            placeholder="Password (8+ chars)"
+            autoComplete="new-password"
+            className="w-40 rounded-md border border-border bg-background px-2 py-1 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          />
+          <select
+            value={newRole}
+            onChange={(event) =>
+              setNewRole(event.target.value === "admin" ? "admin" : "user")
+            }
+            className="rounded-md border border-border bg-background px-2 py-1 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+          >
+            <option value="user">user</option>
+            <option value="admin">admin</option>
+          </select>
+          <Button
+            type="button"
+            size="sm"
+            disabled={busy || !newUsername.trim() || newPassword.length < 8}
+            onClick={() => void createUser()}
+          >
+            Create
+          </Button>
+        </div>
+      </div>
+    </section>
+  );
+}
diff --git a/src/lib/legacyLlmConfig.ts b/src/lib/legacyLlmConfig.ts
deleted file mode 100644
index bf0acc4..0000000
--- a/src/lib/legacyLlmConfig.ts
+++ /dev/null
@@ -1,227 +0,0 @@
-export const LEGACY_LLM_VALUE_FIELDS = [
-  "provider",
-  "model",
-  "model_fallbacks",
-  "auxiliary_provider",
-  "auxiliary_model",
-  "anthropic_base_url",
-  "anthropic_auth_mode",
-  "openai_auth_mode",
-  "minimax_base_url",
-  "custom_openai_base_url",
-  "custom_anthropic_base_url",
-  "ollama_base_url",
-] as const;
-
-export const LEGACY_LLM_SECRET_FIELDS = [
-  "anthropic_api_key",
-  "openai_api_key",
-  "nvidia_api_key",
-  "google_api_key",
-  "minimax_api_key",
-  "siliconflow_api_key",
-  "openrouter_api_key",
-  "deepseek_api_key",
-  "zhipu_api_key",
-  "volcengine_api_key",
-  "dashscope_api_key",
-  "moonshot_api_key",
-  "kimi_api_key",
-  "custom_openai_api_key",
-  "custom_anthropic_api_key",
-] as const;
-
-export type LegacyLlmValueField = (typeof LEGACY_LLM_VALUE_FIELDS)[number];
-export type LegacyLlmSecretField = (typeof LEGACY_LLM_SECRET_FIELDS)[number];
-
-export type LegacyLlmValues = Record<LegacyLlmValueField, string>;
-
-export interface BuiltinModelConfig {
-  provider: string;
-  id: string;
-  name: string;
-  model_id: string;
-  enabled: boolean;
-}
-
-export interface BuiltinProviderModelConfig {
-  id: string;
-  name: string;
-  model_id: string;
-  enabled: boolean;
-}
-
-export interface BuiltinProviderConfig {
-  id: string;
-  name: string;
-  adapter: string;
-  base_url: string;
-  auth_mode: "api_key" | "oauth";
-  enabled: boolean;
-  managed: boolean;
-  api_key_configured: boolean;
-  api_key_hint: string | null;
-  api_key?: string;
-  clear_api_key?: boolean;
-  models: BuiltinProviderModelConfig[];
-}
-
-export interface DiscoveredBuiltinModel {
-  model_id: string;
-  name: string;
-}
-
-export interface BuiltinModelTestResponse {
-  ok: true;
-  latency_ms: number;
-  response: string;
-}
-
-export interface LegacySecretStatus {
-  configured: boolean;
-  hint: string | null;
-}
-
-export interface LegacyLlmConfigResponse {
-  revision: string;
-  values: LegacyLlmValues;
-  secrets: Record<LegacyLlmSecretField, LegacySecretStatus>;
-  env_overrides: Partial<
-    Record<LegacyLlmValueField | LegacyLlmSecretField, string>
-  >;
-  model_catalog: BuiltinModelConfig[] | null;
-  model_catalog_error: string | null;
-  builtin_providers: BuiltinProviderConfig[];
-  builtin_model_candidates: BuiltinModelConfig[];
-  changed_fields: string[];
-  restart_required: boolean;
-}
-
-export interface LegacyLlmConfigUpdate {
-  revision: string;
-  values: LegacyLlmValues;
-  secrets: Partial<Record<LegacyLlmSecretField, string>>;
-  clear_secrets: LegacyLlmSecretField[];
-  model_catalog?: BuiltinModelConfig[] | null;
-  builtin_providers?: BuiltinProviderConfig[];
-}
-
-export interface BuiltinProviderDraft {
-  id: string;
-  base_url?: string;
-  api_key?: string;
-  clear_api_key?: boolean;
-}
-
-function endpoint(): string {
-  return "/api/config";
-}
-
-async function parseResponse(
-  response: Response
-): Promise<LegacyLlmConfigResponse> {
-  const body = (await response.json().catch(() => ({}))) as {
-    error?: unknown;
-  } & Partial<LegacyLlmConfigResponse>;
-  if (!response.ok) {
-    throw new Error(
-      typeof body.error === "string"
-        ? body.error
-        : `Built-in model configuration request failed (HTTP ${response.status}).`
-    );
-  }
-  if (
-    typeof body.revision !== "string" ||
-    !body.values ||
-    !body.secrets ||
-    !body.env_overrides ||
-    !(body.model_catalog === null || Array.isArray(body.model_catalog)) ||
-    !Array.isArray(body.builtin_providers) ||
-    !Array.isArray(body.builtin_model_candidates)
-  ) {
-    throw new Error("Built-in model configuration response is invalid.");
-  }
-  return body as LegacyLlmConfigResponse;
-}
-
-export async function fetchLegacyLlmConfig(): Promise<LegacyLlmConfigResponse> {
-  return parseResponse(
-    await fetch(endpoint(), {
-      cache: "no-store",
-      credentials: "same-origin",
-    })
-  );
-}
-
-export async function saveLegacyLlmConfig(
-  update: LegacyLlmConfigUpdate
-): Promise<LegacyLlmConfigResponse> {
-  return parseResponse(
-    await fetch(endpoint(), {
-      method: "PATCH",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify(update),
-    })
-  );
-}
-
-async function parseActionResponse<T>(response: Response): Promise<T> {
-  const body = (await response.json().catch(() => ({}))) as {
-    error?: unknown;
-  } & T;
-  if (!response.ok) {
-    throw new Error(
-      typeof body.error === "string"
-        ? body.error
-        : `Built-in provider action failed (HTTP ${response.status}).`
-    );
-  }
-  return body;
-}
-
-export async function discoverBuiltinProviderModels(
-  provider: BuiltinProviderDraft
-): Promise<DiscoveredBuiltinModel[]> {
-  const response = await parseActionResponse<{ models?: unknown }>(
-    await fetch(endpoint(), {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify({ action: "list_models", provider }),
-    })
-  );
-  if (!Array.isArray(response.models)) {
-    throw new Error("Provider returned an invalid model list.");
-  }
-  return response.models.filter((model): model is DiscoveredBuiltinModel =>
-    Boolean(
-      model &&
-        typeof model === "object" &&
-        typeof (model as DiscoveredBuiltinModel).model_id === "string" &&
-        typeof (model as DiscoveredBuiltinModel).name === "string"
-    )
-  );
-}
-
-export async function testBuiltinProviderModel(
-  provider: BuiltinProviderDraft,
-  model: BuiltinProviderModelConfig
-): Promise<BuiltinModelTestResponse> {
-  const response = await parseActionResponse<Partial<BuiltinModelTestResponse>>(
-    await fetch(endpoint(), {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify({ action: "test_model", provider, model }),
-    })
-  );
-  if (
-    response.ok !== true ||
-    typeof response.latency_ms !== "number" ||
-    typeof response.response !== "string"
-  ) {
-    throw new Error("Provider returned an invalid model test response.");
-  }
-  return response as BuiltinModelTestResponse;
-}
diff --git a/src/lib/providerProfiles.ts b/src/lib/providerProfiles.ts
deleted file mode 100644
index 234d8de..0000000
--- a/src/lib/providerProfiles.ts
+++ /dev/null
@@ -1,371 +0,0 @@
-export const PROVIDER_ADAPTERS = [
-  { value: "openai", label: "OpenAI" },
-  { value: "anthropic", label: "Anthropic" },
-  { value: "google-genai", label: "Google GenAI" },
-  { value: "grok", label: "Grok / xAI" },
-  { value: "openrouter", label: "OpenRouter" },
-  { value: "nvidia", label: "NVIDIA" },
-  {
-    value: "antigravity",
-    label: "Antigravity proxy (OpenAI compatible)",
-  },
-  { value: "openai-compatible", label: "OpenAI compatible" },
-  { value: "anthropic-compatible", label: "Anthropic compatible" },
-  { value: "ollama", label: "Ollama" },
-] as const;
-
-// Fallback for WebUIs connected to a backend that predates the capability
-// field. Current backends return the authoritative list with every profile
-// response.
-export const BUILT_IN_PROVIDER_IDS = [
-  "anthropic",
-  "openai",
-  "google-genai",
-  "minimax",
-  "nvidia",
-  "siliconflow",
-  "openrouter",
-  "zhipu",
-  "zhipu-code",
-  "volcengine",
-  "dashscope",
-  "dashscope-code",
-  "deepseek",
-  "moonshot",
-  "kimi-coding",
-  "custom-openai",
-  "custom-anthropic",
-  "ollama",
-] as const;
-
-export type ProviderAdapter = (typeof PROVIDER_ADAPTERS)[number]["value"];
-
-export interface ProviderRuntimeConfig {
-  timeout_seconds: number;
-  max_retries: number;
-  default_temperature: number | null;
-  default_top_p: number | null;
-  default_reasoning_effort: "auto" | "low" | "medium" | "high";
-}
-
-export interface ModelRuntimeConfig {
-  limit_mode: "combined" | "input_only" | null;
-  context_window_tokens: number | null;
-  max_input_tokens: number | null;
-  max_output_tokens: number;
-  min_effective_input_tokens: number;
-  limits_status: "confirmed" | "needs_confirmation";
-  limits_source: "catalog" | "provider" | "user";
-  temperature: number | null;
-  top_p: number | null;
-  reasoning_effort: "auto" | "low" | "medium" | "high";
-  capabilities: {
-    tools: boolean | "auto";
-    vision: boolean | "auto";
-    structured_output: boolean | "auto";
-  };
-}
-
-export const DEFAULT_PROVIDER_RUNTIME: ProviderRuntimeConfig = {
-  timeout_seconds: 120,
-  max_retries: 2,
-  default_temperature: null,
-  default_top_p: null,
-  default_reasoning_effort: "auto",
-};
-
-export const DEFAULT_MODEL_RUNTIME: ModelRuntimeConfig = {
-  limit_mode: null,
-  context_window_tokens: null,
-  max_input_tokens: null,
-  max_output_tokens: 4096,
-  min_effective_input_tokens: 4096,
-  limits_status: "needs_confirmation",
-  limits_source: "user",
-  temperature: null,
-  top_p: null,
-  reasoning_effort: "auto",
-  capabilities: {
-    tools: "auto",
-    vision: "auto",
-    structured_output: "auto",
-  },
-};
-
-export interface ProviderModelConfig {
-  id: string;
-  name: string;
-  model_id: string;
-  enabled: boolean;
-  runtime: ModelRuntimeConfig;
-}
-
-export interface ProviderProfileConfig {
-  id: string;
-  name: string;
-  adapter: ProviderAdapter;
-  base_url: string;
-  enabled: boolean;
-  api_key_configured: boolean;
-  api_key_hint: string | null;
-  runtime: ProviderRuntimeConfig;
-  api_key?: string;
-  clear_api_key?: boolean;
-  models: ProviderModelConfig[];
-}
-
-export interface ProviderProfilesResponse {
-  version: number;
-  revision: string;
-  reserved_provider_ids: string[];
-  providers: ProviderProfileConfig[];
-}
-
-export interface DiscoveredProviderModel {
-  model_id: string;
-  name: string;
-}
-
-export interface ProviderModelTestResponse {
-  ok: true;
-  latency_ms: number;
-  response: string;
-}
-
-async function parseResponse(
-  response: Response
-): Promise<ProviderProfilesResponse> {
-  const body = (await response.json().catch(() => ({}))) as {
-    error?: unknown;
-  } & Partial<ProviderProfilesResponse>;
-  if (!response.ok) {
-    throw new Error(
-      typeof body.error === "string"
-        ? body.error
-        : `Provider configuration request failed (HTTP ${response.status}).`
-    );
-  }
-  if (!Array.isArray(body.providers)) {
-    throw new Error("Provider configuration response is invalid.");
-  }
-  const reservedProviderIds = Array.isArray(body.reserved_provider_ids)
-    ? body.reserved_provider_ids.filter(
-        (providerId): providerId is string => typeof providerId === "string"
-      )
-    : [...BUILT_IN_PROVIDER_IDS];
-  return {
-    ...body,
-    providers: body.providers.map(normalizeProviderProfile),
-    reserved_provider_ids: reservedProviderIds,
-  } as ProviderProfilesResponse;
-}
-
-function endpoint(): string {
-  return "/api/provider-profiles";
-}
-
-function actionEndpoint(): string {
-  return "/api/provider-actions";
-}
-
-function providerDraft(provider: ProviderProfileConfig) {
-  return {
-    id: provider.id,
-    name: provider.name,
-    adapter: provider.adapter,
-    base_url: provider.base_url,
-    enabled: provider.enabled,
-    api_key: provider.api_key ?? "",
-    clear_api_key: provider.clear_api_key ?? false,
-    runtime: provider.runtime,
-    models: [],
-  };
-}
-
-function normalizeProviderRuntime(value: unknown): ProviderRuntimeConfig {
-  if (!value || typeof value !== "object")
-    return { ...DEFAULT_PROVIDER_RUNTIME };
-  const raw = value as Partial<ProviderRuntimeConfig>;
-  return {
-    timeout_seconds:
-      typeof raw.timeout_seconds === "number"
-        ? raw.timeout_seconds
-        : DEFAULT_PROVIDER_RUNTIME.timeout_seconds,
-    max_retries:
-      typeof raw.max_retries === "number"
-        ? raw.max_retries
-        : DEFAULT_PROVIDER_RUNTIME.max_retries,
-    default_temperature:
-      typeof raw.default_temperature === "number"
-        ? raw.default_temperature
-        : null,
-    default_top_p:
-      typeof raw.default_top_p === "number" ? raw.default_top_p : null,
-    default_reasoning_effort:
-      raw.default_reasoning_effort === "low" ||
-      raw.default_reasoning_effort === "medium" ||
-      raw.default_reasoning_effort === "high"
-        ? raw.default_reasoning_effort
-        : "auto",
-  };
-}
-
-function normalizeModelRuntime(value: unknown): ModelRuntimeConfig {
-  if (!value || typeof value !== "object") return { ...DEFAULT_MODEL_RUNTIME };
-  const raw = value as Partial<ModelRuntimeConfig>;
-  const capabilities = raw.capabilities;
-  const capabilityValue = (key: keyof ModelRuntimeConfig["capabilities"]) => {
-    const candidate = capabilities?.[key];
-    return candidate === true || candidate === false ? candidate : "auto";
-  };
-  return {
-    limit_mode:
-      raw.limit_mode === "combined" || raw.limit_mode === "input_only"
-        ? raw.limit_mode
-        : null,
-    context_window_tokens:
-      typeof raw.context_window_tokens === "number"
-        ? raw.context_window_tokens
-        : null,
-    max_input_tokens:
-      typeof raw.max_input_tokens === "number" ? raw.max_input_tokens : null,
-    max_output_tokens:
-      typeof raw.max_output_tokens === "number"
-        ? raw.max_output_tokens
-        : DEFAULT_MODEL_RUNTIME.max_output_tokens,
-    min_effective_input_tokens:
-      typeof raw.min_effective_input_tokens === "number"
-        ? raw.min_effective_input_tokens
-        : DEFAULT_MODEL_RUNTIME.min_effective_input_tokens,
-    limits_status:
-      raw.limits_status === "confirmed" ? "confirmed" : "needs_confirmation",
-    limits_source:
-      raw.limits_source === "catalog" || raw.limits_source === "provider"
-        ? raw.limits_source
-        : "user",
-    temperature: typeof raw.temperature === "number" ? raw.temperature : null,
-    top_p: typeof raw.top_p === "number" ? raw.top_p : null,
-    reasoning_effort:
-      raw.reasoning_effort === "low" ||
-      raw.reasoning_effort === "medium" ||
-      raw.reasoning_effort === "high"
-        ? raw.reasoning_effort
-        : "auto",
-    capabilities: {
-      tools: capabilityValue("tools"),
-      vision: capabilityValue("vision"),
-      structured_output: capabilityValue("structured_output"),
-    },
-  };
-}
-
-function normalizeProviderProfile(
-  value: ProviderProfileConfig
-): ProviderProfileConfig {
-  return {
-    ...value,
-    runtime: normalizeProviderRuntime(value.runtime),
-    models: value.models.map((model) => ({
-      ...model,
-      runtime: normalizeModelRuntime(model.runtime),
-    })),
-  };
-}
-
-async function parseActionResponse<T>(response: Response): Promise<T> {
-  const body = (await response.json().catch(() => ({}))) as {
-    error?: unknown;
-  } & T;
-  if (!response.ok) {
-    if (response.status === 404 && typeof body.error !== "string") {
-      throw new Error(
-        "Provider actions are unavailable on the current EvoScientist backend. Restart or upgrade the backend, then try again."
-      );
-    }
-    throw new Error(
-      typeof body.error === "string"
-        ? body.error
-        : `Provider action failed (HTTP ${response.status}).`
-    );
-  }
-  return body;
-}
-
-export async function fetchProviderProfiles(): Promise<ProviderProfilesResponse> {
-  return parseResponse(
-    await fetch(endpoint(), {
-      cache: "no-store",
-      credentials: "same-origin",
-    })
-  );
-}
-
-export async function saveProviderProfiles(
-  providers: ProviderProfileConfig[]
-): Promise<ProviderProfilesResponse> {
-  return parseResponse(
-    await fetch(endpoint(), {
-      method: "PUT",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify({ providers }),
-    })
-  );
-}
-
-export async function discoverProviderModels(
-  provider: ProviderProfileConfig
-): Promise<DiscoveredProviderModel[]> {
-  const response = await parseActionResponse<{
-    models?: unknown;
-  }>(
-    await fetch(actionEndpoint(), {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify({
-        action: "list_models",
-        provider: providerDraft(provider),
-      }),
-    })
-  );
-  if (!Array.isArray(response.models)) {
-    throw new Error("Provider returned an invalid model list.");
-  }
-  return response.models.filter((model): model is DiscoveredProviderModel =>
-    Boolean(
-      model &&
-        typeof model === "object" &&
-        typeof (model as DiscoveredProviderModel).model_id === "string" &&
-        typeof (model as DiscoveredProviderModel).name === "string"
-    )
-  );
-}
-
-export async function testProviderModel(
-  provider: ProviderProfileConfig,
-  model: ProviderModelConfig
-): Promise<ProviderModelTestResponse> {
-  const response = await parseActionResponse<
-    Partial<ProviderModelTestResponse>
-  >(
-    await fetch(actionEndpoint(), {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      credentials: "same-origin",
-      body: JSON.stringify({
-        action: "test_model",
-        provider: providerDraft(provider),
-        model,
-      }),
-    })
-  );
-  if (
-    response.ok !== true ||
-    typeof response.latency_ms !== "number" ||
-    typeof response.response !== "string"
-  ) {
-    throw new Error("Provider returned an invalid model test response.");
-  }
-  return response as ProviderModelTestResponse;
-}
diff --git a/src/lib/registryDraft.ts b/src/lib/registryDraft.ts
new file mode 100644
index 0000000..604aa12
--- /dev/null
+++ b/src/lib/registryDraft.ts
@@ -0,0 +1,156 @@
+import type {
+  AdapterParameterSpec,
+  AuthMode,
+  GetModelRegistryResponse,
+  ModelAvailability,
+  ModelConfig,
+  ModelRef,
+  ProviderConfig,
+  RegistryV4,
+} from "@/lib/modelRegistry";
+
+export const ID_PATTERN = /^[a-z0-9][a-z0-9._-]{0,63}$/;
+
+export function adapterSpecFor(
+  specs: AdapterParameterSpec[],
+  adapterId: string
+): AdapterParameterSpec | null {
+  // Model-specific contracts (model_selector !== "*") win over the generic
+  // contract, mirroring the backend resolver.
+  return (
+    specs.find(
+      (spec) => spec.adapter_id === adapterId && spec.model_selector !== "*"
+    ) ??
+    specs.find(
+      (spec) => spec.adapter_id === adapterId && spec.model_selector === "*"
+    ) ??
+    null
+  );
+}
+
+export function supportedAuthModes(spec: AdapterParameterSpec | null): AuthMode[] {
+  if (!spec) return ["none"];
+  const modes = (Object.keys(spec.auth_specs) as AuthMode[]).filter(
+    (mode) => spec.auth_specs[mode]
+  );
+  return modes.length > 0 ? modes : ["none"];
+}
+
+export function modelRefKey(ref: ModelRef): string {
+  return `${ref.provider_id}/${ref.model_key}`;
+}
+
+export function availabilityFor(
+  data: GetModelRegistryResponse,
+  ref: ModelRef
+): ModelAvailability | null {
+  return (
+    data.model_status.find(
+      (status) =>
+        status.model_ref.provider_id === ref.provider_id &&
+        status.model_ref.model_key === ref.model_key
+    ) ?? null
+  );
+}
+
+export function credentialStatusFor(
+  data: GetModelRegistryResponse,
+  credentialId: string | null
+) {
+  if (!credentialId) return null;
+  return (
+    data.credential_status.find(
+      (status) => status.credential_id === credentialId
+    ) ?? null
+  );
+}
+
+export function enabledModelRefs(registry: RegistryV4): Array<{
+  ref: ModelRef;
+  label: string;
+}> {
+  const out: Array<{ ref: ModelRef; label: string }> = [];
+  for (const provider of registry.providers) {
+    if (!provider.enabled) continue;
+    for (const model of provider.models) {
+      if (!model.enabled) continue;
+      const ref = { provider_id: provider.id, model_key: model.key };
+      out.push({ ref, label: `${model.name} (${modelRefKey(ref)})` });
+    }
+  }
+  return out;
+}
+
+export function newProviderDraft(
+  specs: AdapterParameterSpec[],
+  existingIds: Set<string>
+): ProviderConfig {
+  let index = existingIds.size + 1;
+  let id = `provider-${index}`;
+  while (existingIds.has(id)) {
+    index += 1;
+    id = `provider-${index}`;
+  }
+  const adapter = specs[0]?.adapter_id ?? "openai-compatible";
+  const spec = adapterSpecFor(specs, adapter);
+  const authMode = supportedAuthModes(spec)[0] ?? "none";
+  return {
+    id,
+    name: id,
+    adapter,
+    base_url: "",
+    auth: {
+      mode: authMode,
+      credential_id: authMode === "none" ? null : `${id}-credential`,
+    },
+    enabled: true,
+    runtime: {
+      timeout_seconds: 120,
+      max_retries: 2,
+      default_temperature: null,
+      default_top_p: null,
+      default_reasoning_effort: "auto",
+    },
+    models: [],
+  };
+}
+
+export function newModelDraft(key: string): ModelConfig {
+  return {
+    key,
+    name: key,
+    upstream_model_id: key,
+    enabled: false,
+    runtime: {
+      limit_mode: "combined",
+      context_window_tokens: 128000,
+      max_input_tokens: null,
+      max_output_tokens: 8192,
+      min_effective_input_tokens: 8192,
+      fixed_system_reserve_tokens: 2048,
+      fixed_tools_reserve_tokens: 4096,
+      fixed_attachments_reserve_tokens: 8192,
+      limits_status: "needs_confirmation",
+      limits_source: "user",
+      temperature: null,
+      top_p: null,
+      reasoning_effort: "auto",
+      declared_capabilities: {
+        tools: true,
+        vision: false,
+        structured_output: true,
+      },
+    },
+  };
+}
+
+export function registryDirty(
+  draft: RegistryV4,
+  saved: RegistryV4,
+  credentialWrites: ReadonlyMap<string, string>
+): boolean {
+  return (
+    credentialWrites.size > 0 ||
+    JSON.stringify(draft) !== JSON.stringify(saved)
+  );
+}
diff --git a/src/lib/server/evoscientistAdminProxy.ts b/src/lib/server/evoscientistAdminProxy.ts
deleted file mode 100644
index d150358..0000000
--- a/src/lib/server/evoscientistAdminProxy.ts
+++ /dev/null
@@ -1,175 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-import { randomBytes } from "node:crypto";
-import {
-  chmodSync,
-  closeSync,
-  mkdirSync,
-  openSync,
-  readFileSync,
-  writeFileSync,
-} from "node:fs";
-import { homedir } from "node:os";
-import { dirname, join } from "node:path";
-import { isAuthenticationEnabled } from "@/lib/auth";
-import { getActiveDeployment } from "@/lib/server/activeDeployment";
-import { isCrossOrigin } from "@/lib/server/workspace";
-
-interface AdminProxyOptions {
-  upstreamPath: string;
-  requestLabel: string;
-  maxBodyBytes: number;
-}
-
-let cachedLocalToken: { path: string; token: string } | null = null;
-
-function isLoopback(hostname: string): boolean {
-  const normalized = hostname.trim().toLowerCase();
-  return (
-    normalized === "localhost" ||
-    normalized === "::1" ||
-    normalized === "127.0.0.1" ||
-    normalized.startsWith("127.")
-  );
-}
-
-function fail(error: unknown, requestLabel: string, status = 400) {
-  return NextResponse.json(
-    {
-      error:
-        typeof error === "string"
-          ? error
-          : error instanceof Error
-          ? error.message
-          : `${requestLabel} request failed.`,
-    },
-    { status }
-  );
-}
-
-async function resolveBackendUrl(): Promise<string> {
-  return (await getActiveDeployment()).langgraphApiUrl.replace(/\/$/, "");
-}
-
-function localAdminTokenPath(): string {
-  const configRoot = process.env.XDG_CONFIG_HOME?.trim();
-  return configRoot
-    ? join(configRoot, "evoscientist", "provider-admin-token")
-    : join(homedir(), ".config", "evoscientist", "provider-admin-token");
-}
-
-function readTokenFile(path: string): string {
-  try {
-    return readFileSync(path, "utf8").trim();
-  } catch {
-    return "";
-  }
-}
-
-function resolveAdminToken(): string {
-  const explicit = process.env.EVOSCIENTIST_PROVIDER_ADMIN_TOKEN?.trim();
-  if (explicit) return explicit;
-
-  const path = localAdminTokenPath();
-  if (cachedLocalToken?.path === path) return cachedLocalToken.token;
-
-  let token = readTokenFile(path);
-  if (!token) {
-    token = randomBytes(32).toString("base64url");
-    try {
-      const configDirectory = dirname(path);
-      mkdirSync(configDirectory, { recursive: true, mode: 0o700 });
-      try {
-        chmodSync(configDirectory, 0o700);
-      } catch {
-        // Best effort on filesystems without POSIX permission support.
-      }
-      const descriptor = openSync(path, "wx", 0o600);
-      try {
-        writeFileSync(descriptor, `${token}\n`, "utf8");
-      } finally {
-        closeSync(descriptor);
-      }
-    } catch {
-      const existing = readTokenFile(path);
-      if (!existing) return "";
-      token = existing;
-    }
-  }
-
-  try {
-    chmodSync(path, 0o600);
-  } catch {
-    // Best effort on filesystems without POSIX permission support.
-  }
-  cachedLocalToken = { path, token };
-  return token;
-}
-
-/** Return the local backend-admin token for server-side BFF calls only. */
-export function getEvoScientistAdminToken(): string {
-  return resolveAdminToken();
-}
-
-export async function proxyEvoScientistAdminRequest(
-  request: NextRequest,
-  options: AdminProxyOptions
-) {
-  try {
-    if (isCrossOrigin(request)) {
-      return fail(
-        "Cross-origin model configuration is not allowed.",
-        options.requestLabel,
-        403
-      );
-    }
-    if (!isAuthenticationEnabled() && !isLoopback(request.nextUrl.hostname)) {
-      return fail(
-        "Model configuration on a non-local WebUI requires authentication.",
-        options.requestLabel,
-        403
-      );
-    }
-    const token = resolveAdminToken();
-    if (!token) {
-      return fail(
-        "Model configuration is not enabled for this WebUI server.",
-        options.requestLabel,
-        503
-      );
-    }
-
-    const headers: Record<string, string> = {
-      "X-EvoScientist-Admin-Token": token,
-    };
-    let body: string | undefined;
-    if (request.method !== "GET" && request.method !== "HEAD") {
-      headers["Content-Type"] = "application/json";
-      body = await request.text();
-      if (body.length > options.maxBodyBytes) {
-        return fail(
-          `${options.requestLabel} is too large.`,
-          options.requestLabel,
-          413
-        );
-      }
-    }
-
-    const backendUrl = await resolveBackendUrl();
-    const upstream = await fetch(`${backendUrl}${options.upstreamPath}`, {
-      method: request.method,
-      headers,
-      body,
-      cache: "no-store",
-    });
-    const responseBody = await upstream.text();
-    return new NextResponse(responseBody, {
-      status: upstream.status,
-      headers: {
-        "content-type":
-          upstream.headers.get("content-type") ?? "application/json",
-      },
-    });
-  } catch (error) {
-    return fail(error, options.requestLabel);
-  }
-}