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>
This commit is contained in:
xintaofei
195
src/components/settings/add-model-provider-dialog.tsx
Normal file
195
src/components/settings/add-model-provider-dialog.tsx
Normal file
@@ -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>
|
||||
)
|
||||
}
|
||||
204
src/components/settings/edit-model-provider-dialog.tsx
Normal file
204
src/components/settings/edit-model-provider-dialog.tsx
Normal file
@@ -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>
|
||||
)
|
||||
}
|
||||
216
src/components/settings/model-provider-settings.tsx
Normal file
216
src/components/settings/model-provider-settings.tsx
Normal file
@@ -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>
|
||||
)
|
||||
}
|
||||
@@ -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",
|
||||
|
||||
Reference in New Issue
Block a user