feat(settings): add model provider management with full CRUD support

Add a new settings page for managing API model providers (name, API URL,
API key, applicable agent types). Includes database migration, SeaORM
entity, backend CRUD commands/handlers, frontend settings UI with agent
type filter, add/edit/delete dialogs, and i18n support for all 10 locales.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/app/settings/model-providers/page.tsx

@@ -0,0 +1,5 @@
+import { ModelProviderSettings } from "@/components/settings/model-provider-settings"
+
+export default function SettingsModelProvidersPage() {
+  return <ModelProviderSettings />
+}

src/components/settings/add-model-provider-dialog.tsx

@@ -0,0 +1,195 @@
+"use client"
+
+import { useCallback, useState } from "react"
+import { Loader2 } from "lucide-react"
+import { useTranslations } from "next-intl"
+import { toast } from "sonner"
+
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog"
+import { createModelProvider } from "@/lib/api"
+import { ALL_AGENT_TYPES, AGENT_LABELS, type AgentType } from "@/lib/types"
+
+interface AddModelProviderDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onProviderAdded: () => void
+}
+
+export function AddModelProviderDialog({
+  open,
+  onOpenChange,
+  onProviderAdded,
+}: AddModelProviderDialogProps) {
+  const t = useTranslations("ModelProviderSettings")
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  const [name, setName] = useState("")
+  const [apiUrl, setApiUrl] = useState("")
+  const [apiKey, setApiKey] = useState("")
+  const [selectedTypes, setSelectedTypes] = useState<AgentType[]>([])
+
+  const resetForm = useCallback(() => {
+    setName("")
+    setApiUrl("")
+    setApiKey("")
+    setSelectedTypes([])
+    setError(null)
+  }, [])
+
+  const handleOpenChange = useCallback(
+    (nextOpen: boolean) => {
+      if (!nextOpen) resetForm()
+      onOpenChange(nextOpen)
+    },
+    [onOpenChange, resetForm]
+  )
+
+  const toggleAgentType = useCallback((at: AgentType) => {
+    setSelectedTypes((prev) =>
+      prev.includes(at) ? prev.filter((t) => t !== at) : [...prev, at]
+    )
+  }, [])
+
+  const handleSubmit = useCallback(async () => {
+    if (!name.trim()) {
+      setError(t("nameRequired"))
+      return
+    }
+    if (!apiUrl.trim()) {
+      setError(t("apiUrlRequired"))
+      return
+    }
+    if (!apiKey.trim()) {
+      setError(t("apiKeyRequired"))
+      return
+    }
+    if (selectedTypes.length === 0) {
+      setError(t("agentTypesRequired"))
+      return
+    }
+
+    setLoading(true)
+    setError(null)
+    try {
+      await createModelProvider({
+        name: name.trim(),
+        apiUrl: apiUrl.trim(),
+        apiKey: apiKey.trim(),
+        agentTypes: selectedTypes,
+      })
+      toast.success(t("createSuccess"))
+      handleOpenChange(false)
+      onProviderAdded()
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err)
+      setError(msg)
+    } finally {
+      setLoading(false)
+    }
+  }, [
+    name,
+    apiUrl,
+    apiKey,
+    selectedTypes,
+    handleOpenChange,
+    onProviderAdded,
+    t,
+  ])
+
+  return (
+    <Dialog open={open} onOpenChange={handleOpenChange}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>{t("addProvider")}</DialogTitle>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div className="space-y-1.5">
+            <label htmlFor="add-mp-name" className="text-xs font-medium">
+              {t("providerName")}
+            </label>
+            <Input
+              id="add-mp-name"
+              value={name}
+              onChange={(e) => setName(e.target.value)}
+              placeholder={t("providerNamePlaceholder")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label htmlFor="add-mp-url" className="text-xs font-medium">
+              {t("apiUrl")}
+            </label>
+            <Input
+              id="add-mp-url"
+              value={apiUrl}
+              onChange={(e) => setApiUrl(e.target.value)}
+              placeholder={t("apiUrlPlaceholder")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label htmlFor="add-mp-key" className="text-xs font-medium">
+              {t("apiKey")}
+            </label>
+            <Input
+              id="add-mp-key"
+              type="password"
+              value={apiKey}
+              onChange={(e) => setApiKey(e.target.value)}
+              placeholder={t("apiKeyPlaceholder")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label className="text-xs font-medium">{t("agentTypes")}</label>
+            <div className="flex flex-wrap gap-1.5">
+              {ALL_AGENT_TYPES.map((at) => (
+                <Button
+                  key={at}
+                  type="button"
+                  size="sm"
+                  variant={selectedTypes.includes(at) ? "default" : "outline"}
+                  className="h-7 text-xs"
+                  aria-pressed={selectedTypes.includes(at)}
+                  onClick={() => toggleAgentType(at)}
+                >
+                  {AGENT_LABELS[at]}
+                </Button>
+              ))}
+            </div>
+          </div>
+
+          {error && (
+            <div className="rounded-md border border-red-500/30 bg-red-500/5 px-3 py-2 text-xs text-red-400">
+              {error}
+            </div>
+          )}
+        </div>
+
+        <DialogFooter>
+          <Button
+            variant="outline"
+            onClick={() => handleOpenChange(false)}
+            disabled={loading}
+          >
+            {t("cancel")}
+          </Button>
+          <Button onClick={handleSubmit} disabled={loading}>
+            {loading && <Loader2 className="h-3.5 w-3.5 animate-spin mr-1" />}
+            {t("create")}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}

src/components/settings/edit-model-provider-dialog.tsx

@@ -0,0 +1,204 @@
+"use client"
+
+import { useCallback, useEffect, useState } from "react"
+import { Loader2 } from "lucide-react"
+import { useTranslations } from "next-intl"
+import { toast } from "sonner"
+
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog"
+import { updateModelProvider } from "@/lib/api"
+import {
+  ALL_AGENT_TYPES,
+  AGENT_LABELS,
+  type AgentType,
+  type ModelProviderInfo,
+} from "@/lib/types"
+
+interface EditModelProviderDialogProps {
+  provider: ModelProviderInfo | null
+  onOpenChange: (open: boolean) => void
+  onProviderUpdated: () => void
+}
+
+export function EditModelProviderDialog({
+  provider,
+  onOpenChange,
+  onProviderUpdated,
+}: EditModelProviderDialogProps) {
+  const t = useTranslations("ModelProviderSettings")
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  const [name, setName] = useState("")
+  const [apiUrl, setApiUrl] = useState("")
+  const [apiKey, setApiKey] = useState("")
+  const [selectedTypes, setSelectedTypes] = useState<AgentType[]>([])
+
+  useEffect(() => {
+    if (provider) {
+      setName(provider.name)
+      setApiUrl(provider.api_url)
+      setApiKey("")
+      setSelectedTypes([...provider.agent_types])
+      setError(null)
+    }
+  }, [provider])
+
+  const handleOpenChange = useCallback(
+    (nextOpen: boolean) => {
+      if (!nextOpen) setError(null)
+      onOpenChange(nextOpen)
+    },
+    [onOpenChange]
+  )
+
+  const toggleAgentType = useCallback((at: AgentType) => {
+    setSelectedTypes((prev) =>
+      prev.includes(at) ? prev.filter((t) => t !== at) : [...prev, at]
+    )
+  }, [])
+
+  const handleSubmit = useCallback(async () => {
+    if (!provider) return
+    if (!name.trim()) {
+      setError(t("nameRequired"))
+      return
+    }
+    if (!apiUrl.trim()) {
+      setError(t("apiUrlRequired"))
+      return
+    }
+    if (selectedTypes.length === 0) {
+      setError(t("agentTypesRequired"))
+      return
+    }
+
+    setLoading(true)
+    setError(null)
+    try {
+      await updateModelProvider({
+        id: provider.id,
+        name: name.trim() !== provider.name ? name.trim() : undefined,
+        apiUrl: apiUrl.trim() !== provider.api_url ? apiUrl.trim() : undefined,
+        apiKey: apiKey.trim() || undefined,
+        agentTypes:
+          JSON.stringify(selectedTypes) !== JSON.stringify(provider.agent_types)
+            ? selectedTypes
+            : undefined,
+      })
+      toast.success(t("editSuccess"))
+      handleOpenChange(false)
+      onProviderUpdated()
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err)
+      setError(msg)
+    } finally {
+      setLoading(false)
+    }
+  }, [
+    provider,
+    name,
+    apiUrl,
+    apiKey,
+    selectedTypes,
+    handleOpenChange,
+    onProviderUpdated,
+    t,
+  ])
+
+  return (
+    <Dialog open={!!provider} onOpenChange={handleOpenChange}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>{t("editProvider")}</DialogTitle>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div className="space-y-1.5">
+            <label htmlFor="edit-mp-name" className="text-xs font-medium">
+              {t("providerName")}
+            </label>
+            <Input
+              id="edit-mp-name"
+              value={name}
+              onChange={(e) => setName(e.target.value)}
+              placeholder={t("providerNamePlaceholder")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label htmlFor="edit-mp-url" className="text-xs font-medium">
+              {t("apiUrl")}
+            </label>
+            <Input
+              id="edit-mp-url"
+              value={apiUrl}
+              onChange={(e) => setApiUrl(e.target.value)}
+              placeholder={t("apiUrlPlaceholder")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label htmlFor="edit-mp-key" className="text-xs font-medium">
+              {t("apiKey")}
+            </label>
+            <Input
+              id="edit-mp-key"
+              type="password"
+              value={apiKey}
+              onChange={(e) => setApiKey(e.target.value)}
+              placeholder={t("apiKeyKeepCurrent")}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <label className="text-xs font-medium">{t("agentTypes")}</label>
+            <div className="flex flex-wrap gap-1.5">
+              {ALL_AGENT_TYPES.map((at) => (
+                <Button
+                  key={at}
+                  type="button"
+                  size="sm"
+                  variant={selectedTypes.includes(at) ? "default" : "outline"}
+                  className="h-7 text-xs"
+                  aria-pressed={selectedTypes.includes(at)}
+                  onClick={() => toggleAgentType(at)}
+                >
+                  {AGENT_LABELS[at]}
+                </Button>
+              ))}
+            </div>
+          </div>
+
+          {error && (
+            <div className="rounded-md border border-red-500/30 bg-red-500/5 px-3 py-2 text-xs text-red-400">
+              {error}
+            </div>
+          )}
+        </div>
+
+        <DialogFooter>
+          <Button
+            variant="outline"
+            onClick={() => handleOpenChange(false)}
+            disabled={loading}
+          >
+            {t("cancel")}
+          </Button>
+          <Button onClick={handleSubmit} disabled={loading}>
+            {loading && <Loader2 className="h-3.5 w-3.5 animate-spin mr-1" />}
+            {t("save")}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}

src/components/settings/model-provider-settings.tsx

@@ -0,0 +1,216 @@
+"use client"
+
+import { useCallback, useEffect, useMemo, useState } from "react"
+import { Loader2, Pencil, Plus, Server, Trash2 } from "lucide-react"
+import { useTranslations } from "next-intl"
+import { toast } from "sonner"
+
+import { Button } from "@/components/ui/button"
+import { Badge } from "@/components/ui/badge"
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog"
+import { listModelProviders, deleteModelProvider } from "@/lib/api"
+import {
+  ALL_AGENT_TYPES,
+  AGENT_LABELS,
+  type AgentType,
+  type ModelProviderInfo,
+} from "@/lib/types"
+import { AddModelProviderDialog } from "./add-model-provider-dialog"
+import { EditModelProviderDialog } from "./edit-model-provider-dialog"
+
+export function ModelProviderSettings() {
+  const t = useTranslations("ModelProviderSettings")
+  const [providers, setProviders] = useState<ModelProviderInfo[]>([])
+  const [loading, setLoading] = useState(true)
+  const [filter, setFilter] = useState<AgentType | null>(null)
+  const [addDialogOpen, setAddDialogOpen] = useState(false)
+  const [editTarget, setEditTarget] = useState<ModelProviderInfo | null>(null)
+  const [deleteTarget, setDeleteTarget] = useState<ModelProviderInfo | null>(
+    null
+  )
+
+  const loadProviders = useCallback(async () => {
+    try {
+      const rows = await listModelProviders()
+      setProviders(rows)
+    } catch {
+      toast.error(t("loadFailed"))
+    } finally {
+      setLoading(false)
+    }
+  }, [t])
+
+  useEffect(() => {
+    loadProviders().catch(console.error)
+  }, [loadProviders])
+
+  const filteredProviders = useMemo(() => {
+    if (!filter) return providers
+    return providers.filter((p) => p.agent_types.includes(filter))
+  }, [providers, filter])
+
+  const handleDelete = useCallback(async () => {
+    if (!deleteTarget) return
+    try {
+      await deleteModelProvider(deleteTarget.id)
+      toast.success(t("deleteSuccess"))
+      setDeleteTarget(null)
+      await loadProviders()
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err)
+      toast.error(msg)
+    }
+  }, [deleteTarget, loadProviders, t])
+
+  return (
+    <div className="h-full overflow-auto">
+      <section className="space-y-3">
+        <div>
+          <h1 className="text-sm font-semibold">{t("sectionTitle")}</h1>
+          <p className="text-sm text-muted-foreground">
+            {t("sectionDescription")}
+          </p>
+        </div>
+      </section>
+
+      <section className="mt-4 space-y-2">
+        <div className="flex items-center justify-between gap-2">
+          <Select
+            value={filter ?? "__all__"}
+            onValueChange={(v) =>
+              setFilter(v === "__all__" ? null : (v as AgentType))
+            }
+          >
+            <SelectTrigger className="h-8 w-40 text-xs">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="__all__">{t("filterAll")}</SelectItem>
+              {ALL_AGENT_TYPES.map((at) => (
+                <SelectItem key={at} value={at}>
+                  {AGENT_LABELS[at]}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <Button
+            size="sm"
+            className="h-8 text-xs"
+            onClick={() => setAddDialogOpen(true)}
+          >
+            <Plus className="h-3.5 w-3.5 mr-1" />
+            {t("addProvider")}
+          </Button>
+        </div>
+
+        {loading ? (
+          <div className="flex items-center justify-center py-8">
+            <Loader2 className="h-5 w-5 animate-spin text-muted-foreground" />
+          </div>
+        ) : filteredProviders.length === 0 ? (
+          <div className="flex flex-col items-center justify-center py-8 text-muted-foreground">
+            <Server className="h-8 w-8 mb-2 opacity-40" />
+            <span className="text-xs">{t("noProviders")}</span>
+          </div>
+        ) : (
+          <div className="space-y-2">
+            {filteredProviders.map((p) => (
+              <div
+                key={p.id}
+                className="flex items-center justify-between gap-3 rounded-md border px-3 py-2.5"
+              >
+                <div className="min-w-0 flex-1 space-y-1">
+                  <div className="flex items-center gap-1.5 flex-wrap">
+                    <span className="text-sm font-medium">{p.name}</span>
+                    {p.agent_types.map((at) => (
+                      <Badge
+                        key={at}
+                        variant="secondary"
+                        className="text-[10px] px-1.5 py-0"
+                      >
+                        {AGENT_LABELS[at as AgentType] ?? at}
+                      </Badge>
+                    ))}
+                  </div>
+                  <div className="truncate text-xs text-muted-foreground font-mono">
+                    {p.api_url}
+                  </div>
+                </div>
+                <div className="flex shrink-0 gap-1">
+                  <Button
+                    size="icon"
+                    variant="ghost"
+                    className="h-7 w-7"
+                    onClick={() => setEditTarget(p)}
+                  >
+                    <Pencil className="h-3.5 w-3.5" />
+                  </Button>
+                  <Button
+                    size="icon"
+                    variant="ghost"
+                    className="h-7 w-7 text-destructive"
+                    onClick={() => setDeleteTarget(p)}
+                  >
+                    <Trash2 className="h-3.5 w-3.5" />
+                  </Button>
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+      </section>
+
+      <AddModelProviderDialog
+        open={addDialogOpen}
+        onOpenChange={setAddDialogOpen}
+        onProviderAdded={loadProviders}
+      />
+
+      <EditModelProviderDialog
+        provider={editTarget}
+        onOpenChange={(open) => {
+          if (!open) setEditTarget(null)
+        }}
+        onProviderUpdated={loadProviders}
+      />
+
+      <AlertDialog
+        open={!!deleteTarget}
+        onOpenChange={(open) => {
+          if (!open) setDeleteTarget(null)
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>{t("deleteConfirmTitle")}</AlertDialogTitle>
+            <AlertDialogDescription>
+              {t("deleteConfirmMessage", { name: deleteTarget?.name ?? "" })}
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
+            <AlertDialogAction onClick={handleDelete}>
+              {t("delete")}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </div>
+  )
+}

src/components/settings/settings-shell.tsx

@@ -15,6 +15,7 @@ import {
   BotMessageSquare,
   Palette,
   PlugZap,
+  Server,
   Settings,
 } from "lucide-react"
 import { useTranslations } from "next-intl"
@@ -31,6 +32,7 @@ interface SettingsNavItem {
   labelKey:
     | "appearance"
     | "agents"
+    | "model_providers"
     | "mcp"
     | "skills"
     | "shortcuts"
@@ -52,6 +54,11 @@ const SETTINGS_NAV_ITEMS: SettingsNavItem[] = [
     labelKey: "agents",
     icon: Bot,
   },
+  {
+    href: "/settings/model-providers",
+    labelKey: "model_providers",
+    icon: Server,
+  },
   {
     href: "/settings/mcp",
     labelKey: "mcp",

src/i18n/messages/ar.json

@@ -93,7 +93,8 @@
       "version_control": "التحكم بالإصدارات",
       "system": "النظام",
       "chat_channels": "قنوات المحادثة",
-      "web_service": "خدمة الويب"
+      "web_service": "خدمة الويب",
+      "model_providers": "مزودو النماذج"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "البرتغالية",
       "ar": "العربية"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "مزودو النماذج",
+    "sectionDescription": "إدارة بيانات اعتماد مزودي API للوكلاء.",
+    "filterAll": "الكل",
+    "providerListTitle": "المزودون المُعدّون",
+    "addProvider": "إضافة مزود",
+    "editProvider": "تعديل المزود",
+    "noProviders": "لم يتم تكوين أي مزود نماذج بعد.",
+    "providerName": "الاسم",
+    "providerNamePlaceholder": "مثال: OpenAI، Anthropic",
+    "apiUrl": "عنوان API",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "مفتاح API",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "اتركه فارغاً للإبقاء على الحالي",
+    "agentTypes": "أنواع الوكلاء",
+    "agentTypesRequired": "يجب اختيار نوع وكيل واحد على الأقل.",
+    "nameRequired": "اسم المزود مطلوب.",
+    "apiUrlRequired": "عنوان API مطلوب.",
+    "apiKeyRequired": "مفتاح API مطلوب.",
+    "loadFailed": "فشل تحميل المزودين.",
+    "saveFailed": "فشل حفظ التغييرات.",
+    "createSuccess": "تم إنشاء المزود.",
+    "editSuccess": "تم تحديث المزود.",
+    "deleteSuccess": "تم حذف المزود.",
+    "deleteConfirmTitle": "حذف المزود",
+    "deleteConfirmMessage": "سيتم حذف المزود \"{name}\" نهائياً. هل أنت متأكد؟",
+    "cancel": "إلغاء",
+    "delete": "حذف",
+    "create": "إنشاء",
+    "save": "حفظ"
   }
 }

src/i18n/messages/de.json

@@ -93,7 +93,8 @@
       "version_control": "Versionskontrolle",
       "system": "Systemeinstellungen",
       "chat_channels": "Chat-Kanäle",
-      "web_service": "Webdienst"
+      "web_service": "Webdienst",
+      "model_providers": "Modellanbieter"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "Portugiesisch",
       "ar": "Arabisch"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "Modellanbieter",
+    "sectionDescription": "API-Anbieter-Zugangsdaten für Agenten verwalten.",
+    "filterAll": "Alle",
+    "providerListTitle": "Konfigurierte Anbieter",
+    "addProvider": "Anbieter hinzufügen",
+    "editProvider": "Anbieter bearbeiten",
+    "noProviders": "Noch keine Modellanbieter konfiguriert.",
+    "providerName": "Name",
+    "providerNamePlaceholder": "z.B. OpenAI, Anthropic",
+    "apiUrl": "API-URL",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "API-Schlüssel",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "Leer lassen, um aktuellen Wert beizubehalten",
+    "agentTypes": "Agententypen",
+    "agentTypesRequired": "Mindestens ein Agententyp ist erforderlich.",
+    "nameRequired": "Anbietername ist erforderlich.",
+    "apiUrlRequired": "API-URL ist erforderlich.",
+    "apiKeyRequired": "API-Schlüssel ist erforderlich.",
+    "loadFailed": "Anbieter konnten nicht geladen werden.",
+    "saveFailed": "Änderungen konnten nicht gespeichert werden.",
+    "createSuccess": "Anbieter erstellt.",
+    "editSuccess": "Anbieter aktualisiert.",
+    "deleteSuccess": "Anbieter gelöscht.",
+    "deleteConfirmTitle": "Anbieter löschen",
+    "deleteConfirmMessage": "Der Anbieter \"{name}\" wird dauerhaft gelöscht. Sind Sie sicher?",
+    "cancel": "Abbrechen",
+    "delete": "Löschen",
+    "create": "Erstellen",
+    "save": "Speichern"
   }
 }

src/i18n/messages/en.json

@@ -93,7 +93,8 @@
       "version_control": "Version Control",
       "system": "System",
       "chat_channels": "Chat Channels",
-      "web_service": "Web Service"
+      "web_service": "Web Service",
+      "model_providers": "Model Providers"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "Portuguese",
       "ar": "Arabic"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "Model Providers",
+    "sectionDescription": "Manage API provider credentials for agents.",
+    "filterAll": "All",
+    "providerListTitle": "Configured Providers",
+    "addProvider": "Add Provider",
+    "editProvider": "Edit Provider",
+    "noProviders": "No model providers configured yet.",
+    "providerName": "Name",
+    "providerNamePlaceholder": "e.g. OpenAI, Anthropic",
+    "apiUrl": "API URL",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "API Key",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "Leave blank to keep current",
+    "agentTypes": "Agent Types",
+    "agentTypesRequired": "At least one agent type is required.",
+    "nameRequired": "Provider name is required.",
+    "apiUrlRequired": "API URL is required.",
+    "apiKeyRequired": "API Key is required.",
+    "loadFailed": "Failed to load providers.",
+    "saveFailed": "Failed to save changes.",
+    "createSuccess": "Provider created.",
+    "editSuccess": "Provider updated.",
+    "deleteSuccess": "Provider deleted.",
+    "deleteConfirmTitle": "Delete Provider",
+    "deleteConfirmMessage": "This will permanently delete the provider \"{name}\". Are you sure?",
+    "cancel": "Cancel",
+    "delete": "Delete",
+    "create": "Create",
+    "save": "Save"
   }
 }

src/i18n/messages/es.json

@@ -93,7 +93,8 @@
       "version_control": "Control de versiones",
       "system": "Sistema",
       "chat_channels": "Canales de chat",
-      "web_service": "Servicio Web"
+      "web_service": "Servicio Web",
+      "model_providers": "Proveedores de Modelos"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "Portugués",
       "ar": "Árabe"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "Proveedores de Modelos",
+    "sectionDescription": "Gestionar las credenciales de proveedores API para agentes.",
+    "filterAll": "Todos",
+    "providerListTitle": "Proveedores Configurados",
+    "addProvider": "Agregar Proveedor",
+    "editProvider": "Editar Proveedor",
+    "noProviders": "Aún no se han configurado proveedores de modelos.",
+    "providerName": "Nombre",
+    "providerNamePlaceholder": "Ej. OpenAI, Anthropic",
+    "apiUrl": "URL de API",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "Clave API",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "Dejar vacío para mantener actual",
+    "agentTypes": "Tipos de Agente",
+    "agentTypesRequired": "Se requiere al menos un tipo de agente.",
+    "nameRequired": "El nombre del proveedor es obligatorio.",
+    "apiUrlRequired": "La URL de API es obligatoria.",
+    "apiKeyRequired": "La clave API es obligatoria.",
+    "loadFailed": "Error al cargar proveedores.",
+    "saveFailed": "Error al guardar cambios.",
+    "createSuccess": "Proveedor creado.",
+    "editSuccess": "Proveedor actualizado.",
+    "deleteSuccess": "Proveedor eliminado.",
+    "deleteConfirmTitle": "Eliminar Proveedor",
+    "deleteConfirmMessage": "Esto eliminará permanentemente el proveedor \"{name}\". ¿Está seguro?",
+    "cancel": "Cancelar",
+    "delete": "Eliminar",
+    "create": "Crear",
+    "save": "Guardar"
   }
 }

src/i18n/messages/fr.json

@@ -93,7 +93,8 @@
       "version_control": "Contrôle de version",
       "system": "Système",
       "chat_channels": "Canaux de chat",
-      "web_service": "Service Web"
+      "web_service": "Service Web",
+      "model_providers": "Fournisseurs de Modèles"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "Portugais",
       "ar": "Arabe"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "Fournisseurs de Modèles",
+    "sectionDescription": "Gérer les identifiants des fournisseurs d'API pour les agents.",
+    "filterAll": "Tous",
+    "providerListTitle": "Fournisseurs Configurés",
+    "addProvider": "Ajouter un Fournisseur",
+    "editProvider": "Modifier le Fournisseur",
+    "noProviders": "Aucun fournisseur de modèle configuré.",
+    "providerName": "Nom",
+    "providerNamePlaceholder": "Ex. OpenAI, Anthropic",
+    "apiUrl": "URL de l'API",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "Clé API",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "Laisser vide pour conserver l'actuelle",
+    "agentTypes": "Types d'Agent",
+    "agentTypesRequired": "Au moins un type d'agent est requis.",
+    "nameRequired": "Le nom du fournisseur est requis.",
+    "apiUrlRequired": "L'URL de l'API est requise.",
+    "apiKeyRequired": "La clé API est requise.",
+    "loadFailed": "Échec du chargement des fournisseurs.",
+    "saveFailed": "Échec de la sauvegarde.",
+    "createSuccess": "Fournisseur créé.",
+    "editSuccess": "Fournisseur mis à jour.",
+    "deleteSuccess": "Fournisseur supprimé.",
+    "deleteConfirmTitle": "Supprimer le Fournisseur",
+    "deleteConfirmMessage": "Le fournisseur \"{name}\" sera définitivement supprimé. Êtes-vous sûr ?",
+    "cancel": "Annuler",
+    "delete": "Supprimer",
+    "create": "Créer",
+    "save": "Enregistrer"
   }
 }

src/i18n/messages/ja.json

@@ -93,7 +93,8 @@
       "version_control": "バージョン管理",
       "system": "システム",
       "chat_channels": "チャットチャンネル",
-      "web_service": "Webサービス"
+      "web_service": "Webサービス",
+      "model_providers": "モデルプロバイダー"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "ポルトガル語",
       "ar": "アラビア語"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "モデルプロバイダー",
+    "sectionDescription": "エージェントのAPIプロバイダー認証情報を管理します。",
+    "filterAll": "すべて",
+    "providerListTitle": "設定済みプロバイダー",
+    "addProvider": "プロバイダーを追加",
+    "editProvider": "プロバイダーを編集",
+    "noProviders": "モデルプロバイダーはまだ設定されていません。",
+    "providerName": "名前",
+    "providerNamePlaceholder": "例: OpenAI、Anthropic",
+    "apiUrl": "API URL",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "APIキー",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "空欄のまま現在の値を維持",
+    "agentTypes": "エージェントタイプ",
+    "agentTypesRequired": "少なくとも1つのエージェントタイプを選択してください。",
+    "nameRequired": "プロバイダー名は必須です。",
+    "apiUrlRequired": "API URLは必須です。",
+    "apiKeyRequired": "APIキーは必須です。",
+    "loadFailed": "プロバイダーの読み込みに失敗しました。",
+    "saveFailed": "変更の保存に失敗しました。",
+    "createSuccess": "プロバイダーを作成しました。",
+    "editSuccess": "プロバイダーを更新しました。",
+    "deleteSuccess": "プロバイダーを削除しました。",
+    "deleteConfirmTitle": "プロバイダーを削除",
+    "deleteConfirmMessage": "プロバイダー「{name}」を完全に削除しますか？",
+    "cancel": "キャンセル",
+    "delete": "削除",
+    "create": "作成",
+    "save": "保存"
   }
 }

src/i18n/messages/ko.json

@@ -93,7 +93,8 @@
       "version_control": "버전 관리",
       "system": "시스템",
       "chat_channels": "채팅 채널",
-      "web_service": "웹 서비스"
+      "web_service": "웹 서비스",
+      "model_providers": "모델 제공업체"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "포르투갈어",
       "ar": "아랍어"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "모델 제공업체",
+    "sectionDescription": "에이전트의 API 제공업체 자격 증명을 관리합니다.",
+    "filterAll": "전체",
+    "providerListTitle": "구성된 제공업체",
+    "addProvider": "제공업체 추가",
+    "editProvider": "제공업체 편집",
+    "noProviders": "아직 구성된 모델 제공업체가 없습니다.",
+    "providerName": "이름",
+    "providerNamePlaceholder": "예: OpenAI, Anthropic",
+    "apiUrl": "API URL",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "API 키",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "현재 값을 유지하려면 비워두세요",
+    "agentTypes": "에이전트 유형",
+    "agentTypesRequired": "최소 하나의 에이전트 유형을 선택하세요.",
+    "nameRequired": "제공업체 이름은 필수입니다.",
+    "apiUrlRequired": "API URL은 필수입니다.",
+    "apiKeyRequired": "API 키는 필수입니다.",
+    "loadFailed": "제공업체를 불러오지 못했습니다.",
+    "saveFailed": "변경 사항을 저장하지 못했습니다.",
+    "createSuccess": "제공업체가 생성되었습니다.",
+    "editSuccess": "제공업체가 업데이트되었습니다.",
+    "deleteSuccess": "제공업체가 삭제되었습니다.",
+    "deleteConfirmTitle": "제공업체 삭제",
+    "deleteConfirmMessage": "제공업체 \"{name}\"을(를) 영구적으로 삭제하시겠습니까?",
+    "cancel": "취소",
+    "delete": "삭제",
+    "create": "생성",
+    "save": "저장"
   }
 }

src/i18n/messages/pt.json

@@ -93,7 +93,8 @@
       "version_control": "Controle de versão",
       "system": "Sistema",
       "chat_channels": "Canais de chat",
-      "web_service": "Serviço Web"
+      "web_service": "Serviço Web",
+      "model_providers": "Provedores de Modelos"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "Português",
       "ar": "Árabe"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "Provedores de Modelos",
+    "sectionDescription": "Gerenciar credenciais de provedores de API para agentes.",
+    "filterAll": "Todos",
+    "providerListTitle": "Provedores Configurados",
+    "addProvider": "Adicionar Provedor",
+    "editProvider": "Editar Provedor",
+    "noProviders": "Nenhum provedor de modelo configurado.",
+    "providerName": "Nome",
+    "providerNamePlaceholder": "Ex. OpenAI, Anthropic",
+    "apiUrl": "URL da API",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "Chave da API",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "Deixe em branco para manter atual",
+    "agentTypes": "Tipos de Agente",
+    "agentTypesRequired": "Pelo menos um tipo de agente é necessário.",
+    "nameRequired": "O nome do provedor é obrigatório.",
+    "apiUrlRequired": "A URL da API é obrigatória.",
+    "apiKeyRequired": "A chave da API é obrigatória.",
+    "loadFailed": "Falha ao carregar provedores.",
+    "saveFailed": "Falha ao salvar alterações.",
+    "createSuccess": "Provedor criado.",
+    "editSuccess": "Provedor atualizado.",
+    "deleteSuccess": "Provedor excluído.",
+    "deleteConfirmTitle": "Excluir Provedor",
+    "deleteConfirmMessage": "O provedor \"{name}\" será excluído permanentemente. Tem certeza?",
+    "cancel": "Cancelar",
+    "delete": "Excluir",
+    "create": "Criar",
+    "save": "Salvar"
   }
 }

src/i18n/messages/zh-CN.json

@@ -93,7 +93,8 @@
       "version_control": "版本控制",
       "system": "系统",
       "chat_channels": "消息渠道",
-      "web_service": "Web 服务"
+      "web_service": "Web 服务",
+      "model_providers": "模型供应商"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "葡萄牙语",
       "ar": "阿拉伯语"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "模型供应商",
+    "sectionDescription": "管理 Agent 的 API 供应商凭据。",
+    "filterAll": "全部",
+    "providerListTitle": "已配置的供应商",
+    "addProvider": "添加供应商",
+    "editProvider": "编辑供应商",
+    "noProviders": "尚未配置模型供应商。",
+    "providerName": "名称",
+    "providerNamePlaceholder": "例如 OpenAI、Anthropic",
+    "apiUrl": "API 地址",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "API 密钥",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "留空则保持不变",
+    "agentTypes": "代理类型",
+    "agentTypesRequired": "至少选择一个代理类型。",
+    "nameRequired": "供应商名称不能为空。",
+    "apiUrlRequired": "API 地址不能为空。",
+    "apiKeyRequired": "API 密钥不能为空。",
+    "loadFailed": "加载供应商失败。",
+    "saveFailed": "保存更改失败。",
+    "createSuccess": "供应商已创建。",
+    "editSuccess": "供应商已更新。",
+    "deleteSuccess": "供应商已删除。",
+    "deleteConfirmTitle": "删除供应商",
+    "deleteConfirmMessage": "确定要永久删除供应商「{name}」吗？",
+    "cancel": "取消",
+    "delete": "删除",
+    "create": "创建",
+    "save": "保存"
   }
 }

src/i18n/messages/zh-TW.json

@@ -93,7 +93,8 @@
       "version_control": "版本控制",
       "system": "系統",
       "chat_channels": "訊息頻道",
-      "web_service": "Web 服務"
+      "web_service": "Web 服務",
+      "model_providers": "模型供應商"
     }
   },
   "AppearanceSettings": {
@@ -1808,5 +1809,37 @@
       "pt": "葡萄牙語",
       "ar": "阿拉伯語"
     }
+  },
+  "ModelProviderSettings": {
+    "sectionTitle": "模型供應商",
+    "sectionDescription": "管理 Agent 的 API 供應商憑據。",
+    "filterAll": "全部",
+    "providerListTitle": "已配置的供應商",
+    "addProvider": "新增供應商",
+    "editProvider": "編輯供應商",
+    "noProviders": "尚未配置模型供應商。",
+    "providerName": "名稱",
+    "providerNamePlaceholder": "例如 OpenAI、Anthropic",
+    "apiUrl": "API 位址",
+    "apiUrlPlaceholder": "https://api.openai.com/v1",
+    "apiKey": "API 金鑰",
+    "apiKeyPlaceholder": "sk-...",
+    "apiKeyKeepCurrent": "留空則保持不變",
+    "agentTypes": "代理類型",
+    "agentTypesRequired": "至少選擇一個代理類型。",
+    "nameRequired": "供應商名稱不能為空。",
+    "apiUrlRequired": "API 位址不能為空。",
+    "apiKeyRequired": "API 金鑰不能為空。",
+    "loadFailed": "載入供應商失敗。",
+    "saveFailed": "儲存變更失敗。",
+    "createSuccess": "供應商已建立。",
+    "editSuccess": "供應商已更新。",
+    "deleteSuccess": "供應商已刪除。",
+    "deleteConfirmTitle": "刪除供應商",
+    "deleteConfirmMessage": "確定要永久刪除供應商「{name}」嗎？",
+    "cancel": "取消",
+    "delete": "刪除",
+    "create": "建立",
+    "save": "儲存"
   }
 }

src/lib/api.ts

@@ -57,6 +57,7 @@ import type {
   ChatChannelInfo,
   ChannelStatusInfo,
   ChatChannelMessageLog,
+  ModelProviderInfo,
 } from "./types"
 
 export async function listConversations(params?: {
@@ -1468,3 +1469,40 @@ export async function weixinCheckQrcode(
 }> {
   return getTransport().call("weixin_check_qrcode", { channelId, qrcode })
 }
+
+// ---------------------------------------------------------------------------
+// Model Providers
+// ---------------------------------------------------------------------------
+
+export async function listModelProviders(): Promise<ModelProviderInfo[]> {
+  return getTransport().call("list_model_providers")
+}
+
+export async function createModelProvider(params: {
+  name: string
+  apiUrl: string
+  apiKey: string
+  agentTypes: string[]
+}): Promise<ModelProviderInfo> {
+  return getTransport().call("create_model_provider", params)
+}
+
+export async function updateModelProvider(params: {
+  id: number
+  name?: string | null
+  apiUrl?: string | null
+  apiKey?: string | null
+  agentTypes?: string[] | null
+}): Promise<ModelProviderInfo> {
+  return getTransport().call("update_model_provider", {
+    id: params.id,
+    name: params.name ?? null,
+    apiUrl: params.apiUrl ?? null,
+    apiKey: params.apiKey ?? null,
+    agentTypes: params.agentTypes ?? null,
+  })
+}
+
+export async function deleteModelProvider(id: number): Promise<void> {
+  return getTransport().call("delete_model_provider", { id })
+}

src/lib/types.ts

@@ -220,6 +220,15 @@ export function compareAgentType(a: AgentType, b: AgentType): number {
   return aIndex - bIndex
 }
 
+export const ALL_AGENT_TYPES: AgentType[] = [
+  "claude_code",
+  "codex",
+  "open_code",
+  "gemini",
+  "open_claw",
+  "cline",
+]
+
 export const AGENT_LABELS: Record<AgentType, string> = {
   claude_code: "Claude Code",
   codex: "Codex",
@@ -888,3 +897,13 @@ export interface ChatChannelMessageLog {
   error_detail: string | null
   created_at: string
 }
+
+export interface ModelProviderInfo {
+  id: number
+  name: string
+  api_url: string
+  api_key_masked: string
+  agent_types: AgentType[]
+  created_at: string
+  updated_at: string
+}