fix: restrict the setting options for user role

This commit is contained in:
2026-07-12 19:14:15 +07:00
parent 268e2ac21f
commit 15a3f5e742
11 changed files with 113 additions and 1105 deletions
+7 -747
View File
@@ -1,7 +1,7 @@
"use client";
import { useState, useEffect, useRef } from "react";
import { Card, Button, Toggle, Input } from "@/shared/components";
import { Card, Button, Input } from "@/shared/components";
import Modal, { ConfirmModal } from "@/shared/components/Modal";
import LanguageSwitcher from "@/shared/components/LanguageSwitcher";
import { useTheme } from "@/shared/hooks/useTheme";
@@ -21,7 +21,7 @@ function getLocaleFromCookie() {
}
export default function ProfilePage() {
const { theme, setTheme, isDark } = useTheme();
const { theme, setTheme } = useTheme();
const user = useUserStore((state) => state.user);
const fetchCurrentUser = useUserStore((state) => state.fetchCurrentUser);
const [locale, setLocale] = useState("en");
@@ -37,29 +37,7 @@ export default function ProfilePage() {
const [dbStatus, setDbStatus] = useState({ type: "", message: "" });
const [dbAuth, setDbAuth] = useState({ open: false, mode: "", password: "" });
const pendingImportRef = useRef(null);
const [oidcForm, setOidcForm] = useState({
authMode: "password",
oidcIssuerUrl: "",
oidcClientId: "",
oidcScopes: "openid profile email",
oidcLoginLabel: "Sign in with OIDC",
});
const [oidcClientSecret, setOidcClientSecret] = useState("");
const [oidcStatus, setOidcStatus] = useState({ type: "", message: "" });
const [oidcLoading, setOidcLoading] = useState(false);
const [oidcTestLoading, setOidcTestLoading] = useState(false);
const [oidcTestStatus, setOidcTestStatus] = useState({ type: "", message: "" });
const [oidcRedirectUri, setOidcRedirectUri] = useState("/api/auth/oidc/callback");
const [oidcExpanded, setOidcExpanded] = useState(false);
const importFileRef = useRef(null);
const [proxyForm, setProxyForm] = useState({
outboundProxyEnabled: false,
outboundProxyUrl: "",
outboundNoProxy: "",
});
const [proxyStatus, setProxyStatus] = useState({ type: "", message: "" });
const [proxyLoading, setProxyLoading] = useState(false);
const [proxyTestLoading, setProxyTestLoading] = useState(false);
useEffect(() => {
if (!user) fetchCurrentUser();
@@ -74,20 +52,6 @@ export default function ProfilePage() {
.then((res) => res.json())
.then((data) => {
setSettings(data);
setOidcForm({
authMode: data?.authMode || "password",
oidcIssuerUrl: data?.oidcIssuerUrl || "",
oidcClientId: data?.oidcClientId || "",
oidcScopes: data?.oidcScopes || "openid profile email",
oidcLoginLabel: data?.oidcLoginLabel || "Sign in with OIDC",
});
setOidcClientSecret("");
if (data?.authMode === "oidc" || data?.authMode === "both") setOidcExpanded(true);
setProxyForm({
outboundProxyEnabled: data?.outboundProxyEnabled === true,
outboundProxyUrl: data?.outboundProxyUrl || "",
outboundNoProxy: data?.outboundNoProxy || "",
});
setLoading(false);
})
.catch((err) => {
@@ -96,109 +60,6 @@ export default function ProfilePage() {
});
}, []);
useEffect(() => {
if (typeof window !== "undefined") {
setOidcRedirectUri(`${window.location.origin}/api/auth/oidc/callback`);
}
}, []);
const updateOutboundProxy = async (e) => {
e.preventDefault();
if (settings.outboundProxyEnabled !== true) return;
setProxyLoading(true);
setProxyStatus({ type: "", message: "" });
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
outboundProxyUrl: proxyForm.outboundProxyUrl,
outboundNoProxy: proxyForm.outboundNoProxy,
}),
});
const data = await res.json();
if (res.ok) {
setSettings((prev) => ({ ...prev, ...data }));
setProxyStatus({ type: "success", message: "Proxy settings applied" });
} else {
setProxyStatus({ type: "error", message: data.error || "Failed to update proxy settings" });
}
} catch (err) {
setProxyStatus({ type: "error", message: "An error occurred" });
} finally {
setProxyLoading(false);
}
};
const testOutboundProxy = async () => {
if (settings.outboundProxyEnabled !== true) return;
const proxyUrl = (proxyForm.outboundProxyUrl || "").trim();
if (!proxyUrl) {
setProxyStatus({ type: "error", message: "Please enter a Proxy URL to test" });
return;
}
setProxyTestLoading(true);
setProxyStatus({ type: "", message: "" });
try {
const res = await fetch("/api/settings/proxy-test", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ proxyUrl }),
});
const data = await res.json();
if (res.ok && data?.ok) {
setProxyStatus({
type: "success",
message: `Proxy test OK (${data.status}) in ${data.elapsedMs}ms`,
});
} else {
setProxyStatus({
type: "error",
message: data?.error || "Proxy test failed",
});
}
} catch (err) {
setProxyStatus({ type: "error", message: "An error occurred" });
} finally {
setProxyTestLoading(false);
}
};
const updateOutboundProxyEnabled = async (outboundProxyEnabled) => {
setProxyLoading(true);
setProxyStatus({ type: "", message: "" });
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ outboundProxyEnabled }),
});
const data = await res.json();
if (res.ok) {
setSettings((prev) => ({ ...prev, ...data }));
setProxyForm((prev) => ({ ...prev, outboundProxyEnabled: data?.outboundProxyEnabled === true }));
setProxyStatus({
type: "success",
message: outboundProxyEnabled ? "Proxy enabled" : "Proxy disabled",
});
} else {
setProxyStatus({ type: "error", message: data.error || "Failed to update proxy settings" });
}
} catch (err) {
setProxyStatus({ type: "error", message: "An error occurred" });
} finally {
setProxyLoading(false);
}
};
const handlePasswordChange = async (e) => {
e.preventDefault();
if (passwords.new !== passwords.confirm) {
@@ -234,239 +95,6 @@ export default function ProfilePage() {
}
};
const updateFallbackStrategy = async (strategy) => {
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ fallbackStrategy: strategy }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, fallbackStrategy: strategy }));
}
} catch (err) {
console.error("Failed to update settings:", err);
}
};
const updateComboStrategy = async (strategy) => {
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ comboStrategy: strategy }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, comboStrategy: strategy }));
}
} catch (err) {
console.error("Failed to update combo strategy:", err);
}
};
const updateStickyLimit = async (limit) => {
const numLimit = parseInt(limit);
if (isNaN(numLimit) || numLimit < 1) return;
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ stickyRoundRobinLimit: numLimit }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, stickyRoundRobinLimit: numLimit }));
}
} catch (err) {
console.error("Failed to update sticky limit:", err);
}
};
const updateComboStickyLimit = async (limit) => {
const numLimit = parseInt(limit);
if (isNaN(numLimit) || numLimit < 1) return;
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ comboStickyRoundRobinLimit: numLimit }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, comboStickyRoundRobinLimit: numLimit }));
}
} catch (err) {
console.error("Failed to update combo sticky limit:", err);
}
};
const updateRequireLogin = async (requireLogin) => {
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ requireLogin }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, requireLogin }));
}
} catch (err) {
console.error("Failed to update require login:", err);
}
};
const updateOidcForm = (field, value) => {
setOidcForm((prev) => ({ ...prev, [field]: value }));
};
const saveOidcSettings = async (authMode = oidcForm.authMode || "password") => {
const issuerUrl = oidcForm.oidcIssuerUrl.trim();
const clientId = oidcForm.oidcClientId.trim();
const scopes = oidcForm.oidcScopes.trim();
const loginLabel = oidcForm.oidcLoginLabel.trim();
const secret = oidcClientSecret.trim();
if (authMode !== "password" && (!issuerUrl || !clientId || !secret) && !settings.oidcConfigured) {
setOidcStatus({ type: "error", message: "Issuer URL, client ID, and client secret are required to enable OIDC." });
return;
}
setOidcLoading(true);
setOidcStatus({ type: "", message: "" });
setOidcTestStatus({ type: "", message: "" });
try {
const payload = {
authMode,
oidcIssuerUrl: issuerUrl,
oidcClientId: clientId,
oidcScopes: scopes || "openid profile email",
oidcLoginLabel: loginLabel || "Sign in with OIDC",
};
if (secret) {
payload.oidcClientSecret = secret;
}
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(payload),
});
const data = await res.json();
if (res.ok) {
setSettings((prev) => ({ ...prev, ...data }));
setOidcForm({
authMode: data?.authMode || authMode,
oidcIssuerUrl: data?.oidcIssuerUrl || issuerUrl,
oidcClientId: data?.oidcClientId || clientId,
oidcScopes: data?.oidcScopes || scopes || "openid profile email",
oidcLoginLabel: data?.oidcLoginLabel || loginLabel || "Sign in with OIDC",
});
setOidcClientSecret("");
setOidcStatus({
type: "success",
message:
authMode === "oidc"
? "OIDC login enabled"
: authMode === "both"
? "Password and OIDC login enabled"
: "OIDC settings saved",
});
} else {
setOidcStatus({ type: "error", message: data.error || "Failed to save OIDC settings" });
}
} catch (err) {
setOidcStatus({ type: "error", message: "An error occurred" });
} finally {
setOidcLoading(false);
}
};
const testOidcConnection = async () => {
const issuerUrl = oidcForm.oidcIssuerUrl.trim();
const clientId = oidcForm.oidcClientId.trim();
const scopes = oidcForm.oidcScopes.trim();
const secret = oidcClientSecret.trim();
if (!issuerUrl || !clientId) {
setOidcTestStatus({ type: "error", message: "Issuer URL and client ID are required to test the connection." });
return;
}
setOidcTestLoading(true);
setOidcStatus({ type: "", message: "" });
setOidcTestStatus({ type: "", message: "" });
try {
const saveRes = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
authMode: oidcForm.authMode || settings.authMode || "password",
oidcIssuerUrl: issuerUrl,
oidcClientId: clientId,
oidcScopes: scopes || "openid profile email",
oidcLoginLabel: oidcForm.oidcLoginLabel.trim() || "Sign in with OIDC",
...(secret ? { oidcClientSecret: secret } : {}),
}),
});
const saved = await saveRes.json().catch(() => ({}));
if (!saveRes.ok) {
setOidcTestStatus({
type: "error",
message: saved.error || "Failed to save OIDC settings before testing",
});
return;
}
const res = await fetch("/api/auth/oidc/test", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
issuerUrl: saved.oidcIssuerUrl || issuerUrl,
clientId: saved.oidcClientId || clientId,
scopes: saved.oidcScopes || scopes || "openid profile email",
}),
});
const data = await res.json().catch(() => ({}));
if (res.ok && data?.ok) {
const statusMessage = data.clientSecretTested
? data.clientSecretValid === true
? `Connection OK. Discovery loaded from ${data.issuerUrl}. Client secret validated too.`
: `Connection OK. Discovery loaded from ${data.issuerUrl}. Client secret was not checked.`
: `Connection OK. Discovery loaded from ${data.issuerUrl}.`;
setOidcTestStatus({
type: "success",
message: statusMessage,
});
} else {
setOidcTestStatus({ type: "error", message: data.error || "OIDC connection test failed" });
}
} catch (err) {
setOidcTestStatus({ type: "error", message: "An error occurred" });
} finally {
setOidcTestLoading(false);
}
};
const updateObservabilityEnabled = async (enabled) => {
try {
const res = await fetch("/api/settings", {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ enableObservability: enabled }),
});
if (res.ok) {
setSettings(prev => ({ ...prev, enableObservability: enabled }));
}
} catch (err) {
console.error("Failed to update enableObservability:", err);
}
};
const reloadSettings = async () => {
try {
const res = await fetch("/api/settings");
@@ -564,8 +192,6 @@ export default function ProfilePage() {
else if (mode === "import") await runImportDatabase(password);
};
const observabilityEnabled = settings.enableObservability === true;
const handleShutdown = async () => {
setIsShuttingDown(true);
try {
@@ -689,30 +315,15 @@ export default function ProfilePage() {
</button>
</Card>
{/* Security */}
{/* Password */}
<Card>
<div className="flex items-center gap-3 mb-4">
<div className="p-2 rounded-lg bg-primary/10 text-primary shrink-0">
<span className="material-symbols-outlined text-[20px]">shield</span>
<span className="material-symbols-outlined text-[20px]">password</span>
</div>
<h3 className="text-base sm:text-lg font-semibold">Security</h3>
<h3 className="text-base sm:text-lg font-semibold">Password</h3>
</div>
<div className="flex flex-col gap-4">
<div className="flex items-start sm:items-center justify-between gap-4">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Require login</p>
<p className="text-xs sm:text-sm text-text-muted">
When ON, dashboard requires password. When OFF, access without login.
</p>
</div>
<Toggle
checked={settings.requireLogin === true}
onChange={() => updateRequireLogin(!settings.requireLogin)}
disabled={loading}
/>
</div>
{settings.requireLogin === true && (
<form onSubmit={handlePasswordChange} className="flex flex-col gap-4 pt-4 border-t border-border/50">
<form onSubmit={handlePasswordChange} className="flex flex-col gap-4">
{settings.hasPassword && (
<div className="flex flex-col gap-2">
<label className="text-xs sm:text-sm font-medium">Current Password</label>
@@ -766,358 +377,7 @@ export default function ProfilePage() {
{settings.hasPassword ? "Update Password" : "Set Password"}
</Button>
</div>
</form>
)}
</div>
</Card>
{/* OIDC */}
<Card>
<button
type="button"
onClick={() => setOidcExpanded((v) => !v)}
className="w-full flex items-center gap-3 text-left"
>
<div className="p-2 rounded-lg bg-indigo-500/10 text-indigo-500 shrink-0">
<span className="material-symbols-outlined text-[20px]">lock_open</span>
</div>
<div className="flex-1 min-w-0">
<h3 className="text-base sm:text-lg font-semibold">OIDC Dashboard Login</h3>
<p className="text-xs text-text-muted">
{settings.authMode === "oidc" ? "OIDC active" : settings.authMode === "both" ? "Password + OIDC active" : "Optional SSO via Authentik/Keycloak/Google"}
</p>
</div>
<span className="material-symbols-outlined text-text-muted shrink-0">
{oidcExpanded ? "expand_less" : "expand_more"}
</span>
</button>
{oidcExpanded && (
<div className="flex flex-col gap-4 mt-4">
<p className="text-xs sm:text-sm text-text-muted">
Use Authentik or any OIDC provider to sign in to the dashboard. You can enable password-only, OIDC-only, or both for the dashboard; model API access still uses API keys.
</p>
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Auth Mode</label>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-2">
{[
{
value: "password",
title: "Password only",
desc: "Keep the legacy password login.",
},
{
value: "oidc",
title: "OIDC only",
desc: "Require OIDC for dashboard access.",
},
{
value: "both",
title: "Both",
desc: "Allow either password or OIDC.",
},
].map((option) => {
const active = oidcForm.authMode === option.value;
return (
<button
key={option.value}
type="button"
onClick={() => updateOidcForm("authMode", option.value)}
className={cn(
"text-left rounded-lg border p-3 transition-colors",
active
? "border-primary bg-primary/5"
: "border-border bg-bg hover:bg-black/5 dark:hover:bg-white/5"
)}
disabled={loading || oidcLoading}
>
<p className="font-medium text-sm sm:text-base">{option.title}</p>
<p className="text-xs sm:text-sm text-text-muted mt-1">{option.desc}</p>
</button>
);
})}
</div>
</div>
<div className="grid grid-cols-1 gap-4">
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Issuer URL</label>
<Input
placeholder="https://auth.example.com/application/o/9router/"
value={oidcForm.oidcIssuerUrl}
onChange={(e) => updateOidcForm("oidcIssuerUrl", e.target.value)}
disabled={loading || oidcLoading}
/>
</div>
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Client ID</label>
<Input
placeholder="9router-dashboard"
value={oidcForm.oidcClientId}
onChange={(e) => updateOidcForm("oidcClientId", e.target.value)}
disabled={loading || oidcLoading}
/>
</div>
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Client Secret</label>
<Input
type="password"
placeholder="Leave blank to keep existing secret"
value={oidcClientSecret}
onChange={(e) => setOidcClientSecret(e.target.value)}
disabled={loading || oidcLoading}
/>
<p className="text-xs sm:text-sm text-text-muted">This value is write-only after saving.</p>
</div>
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Scopes</label>
<Input
placeholder="openid profile email"
value={oidcForm.oidcScopes}
onChange={(e) => updateOidcForm("oidcScopes", e.target.value)}
disabled={loading || oidcLoading}
/>
</div>
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Login Button Label</label>
<Input
placeholder="Sign in with OIDC"
value={oidcForm.oidcLoginLabel}
onChange={(e) => updateOidcForm("oidcLoginLabel", e.target.value)}
disabled={loading || oidcLoading}
/>
</div>
</div>
<div className="rounded-lg border border-border bg-bg p-3 text-xs sm:text-sm text-text-muted">
<p className="font-medium text-text-main mb-1">Redirect URI</p>
<code className="block break-all font-mono">{oidcRedirectUri}</code>
</div>
<div className="flex flex-col sm:flex-row gap-2 pt-2 border-t border-border/50">
<Button type="button" variant="primary" loading={oidcLoading} onClick={() => saveOidcSettings()} className="w-full sm:w-auto">
Save auth mode
</Button>
<Button type="button" variant="outline" loading={oidcTestLoading} onClick={testOidcConnection} className="w-full sm:w-auto">
Test connection
</Button>
</div>
{oidcTestStatus.message && (
<p className={`text-xs sm:text-sm ${oidcTestStatus.type === "error" ? "text-red-500" : "text-green-500"}`}>
{oidcTestStatus.message}
</p>
)}
{oidcStatus.message && (
<p className={`text-xs sm:text-sm ${oidcStatus.type === "error" ? "text-red-500" : "text-green-500"}`}>
{oidcStatus.message}
</p>
)}
{settings.authMode === "oidc" && (
<p className="text-xs sm:text-sm text-amber-600 dark:text-amber-400">
OIDC login is currently active. Password login is disabled until you switch back.
</p>
)}
{settings.authMode === "both" && (
<p className="text-xs sm:text-sm text-amber-600 dark:text-amber-400">
Password and OIDC login are both active.
</p>
)}
</div>
)}
</Card>
{/* Routing Preferences */}
<Card>
<div className="flex items-center gap-3 mb-4">
<div className="p-2 rounded-lg bg-blue-500/10 text-blue-500 shrink-0">
<span className="material-symbols-outlined text-[20px]">route</span>
</div>
<h3 className="text-base sm:text-lg font-semibold">Routing Strategy</h3>
</div>
<div className="flex flex-col gap-4">
<div className="flex items-start sm:items-center justify-between gap-4">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Round Robin</p>
<p className="text-xs sm:text-sm text-text-muted">
Cycle through accounts to distribute load
</p>
</div>
<Toggle
checked={settings.fallbackStrategy === "round-robin"}
onChange={() => updateFallbackStrategy(settings.fallbackStrategy === "round-robin" ? "fill-first" : "round-robin")}
disabled={loading}
/>
</div>
{/* Sticky Round Robin Limit */}
{settings.fallbackStrategy === "round-robin" && (
<div className="flex items-start sm:items-center justify-between gap-4 pt-2 border-t border-border/50">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Sticky Limit</p>
<p className="text-xs sm:text-sm text-text-muted">
Calls per account before switching
</p>
</div>
<Input
type="number"
min="1"
max="10"
value={settings.stickyRoundRobinLimit || 3}
onChange={(e) => updateStickyLimit(e.target.value)}
disabled={loading}
className="w-16 sm:w-20 text-center shrink-0"
/>
</div>
)}
{/* Combo Round Robin */}
<div className="flex items-start sm:items-center justify-between gap-4 pt-4 border-t border-border/50">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Combo Round Robin</p>
<p className="text-xs sm:text-sm text-text-muted">
Cycle through providers in combos instead of always starting with first
</p>
</div>
<Toggle
checked={settings.comboStrategy === "round-robin"}
onChange={() => updateComboStrategy(settings.comboStrategy === "round-robin" ? "fallback" : "round-robin")}
disabled={loading}
/>
</div>
{/* Combo Sticky Round Robin Limit */}
{settings.comboStrategy === "round-robin" && (
<div className="flex items-center justify-between pt-2 border-t border-border/50">
<div>
<p className="font-medium">Combo Sticky Limit</p>
<p className="text-sm text-text-muted">
Calls per combo model before switching
</p>
</div>
<Input
type="number"
min="1"
max="100"
value={settings.comboStickyRoundRobinLimit || 1}
onChange={(e) => updateComboStickyLimit(e.target.value)}
disabled={loading}
className="w-20 text-center"
/>
</div>
)}
<p className="text-xs text-text-muted italic pt-2 border-t border-border/50">
{settings.fallbackStrategy === "round-robin"
? `Currently distributing requests across all available accounts with ${settings.stickyRoundRobinLimit || 3} calls per account.`
: "Currently using accounts in priority order (Fill First)."}
{settings.comboStrategy === "round-robin"
? ` Combos rotate after ${settings.comboStickyRoundRobinLimit || 1} call${(settings.comboStickyRoundRobinLimit || 1) === 1 ? "" : "s"} per model.`
: " Combos always start with their first model."}
</p>
</div>
</Card>
{/* Network */}
<Card>
<div className="flex items-center gap-3 mb-4">
<div className="p-2 rounded-lg bg-purple-500/10 text-purple-500 shrink-0">
<span className="material-symbols-outlined text-[20px]">wifi</span>
</div>
<h3 className="text-base sm:text-lg font-semibold">Network</h3>
</div>
<div className="flex flex-col gap-4">
<div className="flex items-start sm:items-center justify-between gap-4">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Outbound Proxy</p>
<p className="text-xs sm:text-sm text-text-muted">Enable proxy for OAuth + provider outbound requests.</p>
</div>
<Toggle
checked={settings.outboundProxyEnabled === true}
onChange={() => updateOutboundProxyEnabled(!(settings.outboundProxyEnabled === true))}
disabled={loading || proxyLoading}
/>
</div>
{settings.outboundProxyEnabled === true && (
<form onSubmit={updateOutboundProxy} className="flex flex-col gap-4 pt-2 border-t border-border/50">
<div className="flex flex-col gap-2">
<label className="font-medium text-sm sm:text-base">Proxy URL</label>
<Input
placeholder="http://127.0.0.1:7897"
value={proxyForm.outboundProxyUrl}
onChange={(e) => setProxyForm((prev) => ({ ...prev, outboundProxyUrl: e.target.value }))}
disabled={loading || proxyLoading}
/>
<p className="text-xs sm:text-sm text-text-muted">Leave empty to inherit existing env proxy (if any).</p>
</div>
<div className="flex flex-col gap-2 pt-2 border-t border-border/50">
<label className="font-medium text-sm sm:text-base">No Proxy</label>
<Input
placeholder="localhost,127.0.0.1"
value={proxyForm.outboundNoProxy}
onChange={(e) => setProxyForm((prev) => ({ ...prev, outboundNoProxy: e.target.value }))}
disabled={loading || proxyLoading}
/>
<p className="text-xs sm:text-sm text-text-muted">Comma-separated hostnames/domains to bypass the proxy.</p>
</div>
<div className="pt-2 border-t border-border/50 flex flex-col sm:flex-row items-stretch sm:items-center gap-2">
<Button
type="button"
variant="secondary"
loading={proxyTestLoading}
disabled={loading || proxyLoading}
onClick={testOutboundProxy}
className="w-full sm:w-auto"
>
Test proxy URL
</Button>
<Button type="submit" variant="primary" loading={proxyLoading} className="w-full sm:w-auto">
Apply
</Button>
</div>
</form>
)}
{proxyStatus.message && (
<p className={`text-xs sm:text-sm ${proxyStatus.type === "error" ? "text-red-500" : "text-green-500"} pt-2 border-t border-border/50`}>
{proxyStatus.message}
</p>
)}
</div>
</Card>
{/* Observability Settings */}
<Card>
<div className="flex items-center gap-3 mb-4">
<div className="p-2 rounded-lg bg-orange-500/10 text-orange-500 shrink-0">
<span className="material-symbols-outlined text-[20px]">monitoring</span>
</div>
<h3 className="text-base sm:text-lg font-semibold">Observability</h3>
</div>
<div className="flex items-start sm:items-center justify-between gap-4">
<div className="flex-1 min-w-0">
<p className="font-medium text-sm sm:text-base">Enable Observability</p>
<p className="text-xs sm:text-sm text-text-muted">
Record request details for inspection in the logs view
</p>
</div>
<Toggle
checked={observabilityEnabled}
onChange={updateObservabilityEnabled}
disabled={loading}
/>
</div>
</form>
</Card>
{/* Account actions */}
+2 -82
View File
@@ -1,84 +1,4 @@
import { NextResponse } from "next/server";
import { cookies } from "next/headers";
import { getSettings } from "@/lib/localDb";
import { fetchOidcDiscovery, getPublicOrigin, probeOidcClientSecret } from "@/lib/auth/oidc";
import { verifyDashboardAuthToken } from "@/lib/auth/dashboardSession";
async function canAccessTestRoute() {
const settings = await getSettings();
if (settings.requireLogin === false) return true;
const cookieStore = await cookies();
const token = cookieStore.get("auth_token")?.value;
return await verifyDashboardAuthToken(token);
}
export async function POST(request) {
try {
if (!(await canAccessTestRoute())) {
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
}
const body = await request.json().catch(() => ({}));
const settings = await getSettings();
const issuerUrl = String(body.issuerUrl || settings.oidcIssuerUrl || "").trim();
const clientId = String(body.clientId || settings.oidcClientId || "").trim();
const scopes = String(body.scopes || settings.oidcScopes || "openid profile email").trim() || "openid profile email";
const clientSecret = String(
Object.prototype.hasOwnProperty.call(body, "clientSecret")
? body.clientSecret
: settings.oidcClientSecret || ""
).trim();
if (!issuerUrl) {
return NextResponse.json({ error: "Issuer URL is required" }, { status: 400 });
}
if (!clientId) {
return NextResponse.json({ error: "Client ID is required" }, { status: 400 });
}
const discovery = await fetchOidcDiscovery(issuerUrl);
const redirectUri = `${getPublicOrigin(request)}/api/auth/oidc/callback`;
const secretProbe = await probeOidcClientSecret({
tokenEndpoint: discovery.token_endpoint,
clientId,
clientSecret,
redirectUri,
});
if (secretProbe.tested && secretProbe.valid === false) {
return NextResponse.json({
ok: false,
discoveryOk: true,
clientSecretTested: true,
clientSecretValid: false,
issuerUrl,
clientId,
scopes,
redirectUri,
authorizationEndpoint: discovery.authorization_endpoint || "",
tokenEndpoint: discovery.token_endpoint || "",
jwksUri: discovery.jwks_uri || "",
error: `Discovery loaded, but the client secret is not valid: ${secretProbe.message}`,
});
}
return NextResponse.json({
ok: true,
discoveryOk: true,
clientSecretTested: secretProbe.tested,
clientSecretValid: secretProbe.valid,
issuerUrl,
clientId,
scopes,
redirectUri,
authorizationEndpoint: discovery.authorization_endpoint || "",
tokenEndpoint: discovery.token_endpoint || "",
jwksUri: discovery.jwks_uri || "",
message: secretProbe.message,
});
} catch (error) {
return NextResponse.json({ error: error.message || "OIDC test failed" }, { status: 500 });
}
export async function POST() {
return NextResponse.json({ error: "OIDC settings are not available" }, { status: 403 });
}
+2 -46
View File
@@ -1,50 +1,6 @@
import { NextResponse } from "next/server";
import { getComboById, updateComboStrategy } from "@/lib/localDb";
import { requireUsageDashboardUser } from "@/lib/auth/currentUser";
import { resetComboRotation } from "open-sse/services/combo.js";
export const dynamic = "force-dynamic";
const STRATEGIES = new Set(["fallback", "round-robin", "fusion"]);
function normalizeStrategy(strategy) {
const normalized = {};
if (strategy.fallbackStrategy !== undefined) {
if (!STRATEGIES.has(strategy.fallbackStrategy)) return null;
normalized.fallbackStrategy = strategy.fallbackStrategy;
}
if (strategy.judgeModel !== undefined) {
if (typeof strategy.judgeModel !== "string" || strategy.judgeModel.length > 256) return null;
normalized.judgeModel = strategy.judgeModel.trim();
}
return normalized;
}
export async function PATCH(request, { params }) {
try {
const user = await requireUsageDashboardUser();
const { id } = await params;
const ownerId = user.role === "admin" ? undefined : user.id;
const combo = await getComboById(id, ownerId);
if (!combo) return NextResponse.json({ error: "Combo not found" }, { status: 404 });
const { strategy } = await request.json();
if (!strategy || typeof strategy !== "object" || Array.isArray(strategy)) {
return NextResponse.json({ error: "Strategy must be an object" }, { status: 400 });
}
const normalizedStrategy = normalizeStrategy(strategy);
if (!normalizedStrategy) {
return NextResponse.json({ error: "Invalid combo strategy" }, { status: 400 });
}
const settings = await updateComboStrategy(combo.id, normalizedStrategy);
resetComboRotation(combo.id);
return NextResponse.json({ strategy: settings.comboStrategies[combo.id] || {} });
} catch (error) {
if (error.message === "Unauthorized") {
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
}
console.log("Error updating combo strategy:", error);
return NextResponse.json({ error: "Failed to update combo strategy" }, { status: 500 });
}
export async function PATCH() {
return NextResponse.json({ error: "Routing strategy settings are not available" }, { status: 403 });
}
+2 -21
View File
@@ -1,23 +1,4 @@
import { NextResponse } from "next/server";
import { testProxyUrl } from "@/lib/network/proxyTest";
export async function POST(request) {
try {
const body = await request.json();
const result = await testProxyUrl({
proxyUrl: body?.proxyUrl,
testUrl: body?.testUrl,
timeoutMs: body?.timeoutMs,
});
if (result?.ok) {
return NextResponse.json(result);
}
const status = typeof result?.status === "number" ? result.status : 500;
return NextResponse.json({ ok: false, error: result?.error || "Proxy test failed" }, { status });
} catch (err) {
const message = err?.name === "AbortError" ? "Proxy test timed out" : (err?.message || String(err));
return NextResponse.json({ ok: false, error: message }, { status: 500 });
}
export async function POST() {
return NextResponse.json({ error: "Network settings are not available" }, { status: 403 });
}
+1 -12
View File
@@ -1,15 +1,4 @@
import { NextResponse } from "next/server";
import { getSettings } from "@/lib/localDb";
export async function GET() {
try {
const settings = await getSettings();
const requireLogin = settings.requireLogin !== false;
const tunnelDashboardAccess = settings.tunnelDashboardAccess !== false;
const tunnelUrl = settings.tunnelUrl || "";
const tailscaleUrl = settings.tailscaleUrl || "";
return NextResponse.json({ requireLogin, tunnelDashboardAccess, tunnelUrl, tailscaleUrl });
} catch (error) {
return NextResponse.json({ requireLogin: true }, { status: 200 });
}
return NextResponse.json({ error: "Login settings are not available" }, { status: 403 });
}
+28 -4
View File
@@ -16,6 +16,28 @@ const SETTINGS_RESPONSE_HEADERS = {
// Secrets must never be mass-assigned from request body (CWE-915)
const PROTECTED_SETTING_KEYS = ["password", "mitmSudoEncrypted"];
// These capabilities are intentionally not configurable through the dashboard.
// Keep the server-side policy here so callers cannot bypass the hidden UI.
const RESTRICTED_SETTING_KEYS = [
"requireLogin",
"authMode",
"oidcIssuerUrl",
"oidcClientId",
"oidcClientSecret",
"oidcScopes",
"oidcLoginLabel",
"oidcConfigured",
"fallbackStrategy",
"stickyRoundRobinLimit",
"comboStrategy",
"comboStickyRoundRobinLimit",
"comboStrategies",
"outboundProxyEnabled",
"outboundProxyUrl",
"outboundNoProxy",
"enableObservability",
];
// Token savers change gateway-wide request processing and can start or manage
// local helper processes. They are therefore administrator-only settings.
const TOKEN_SAVER_SETTING_KEYS = [
@@ -38,6 +60,7 @@ export async function GET() {
try {
const settings = await getSettings();
const { password, oidcClientSecret, ...safeSettings } = settings;
for (const key of RESTRICTED_SETTING_KEYS) delete safeSettings[key];
const user = await requireUsageDashboardUser();
if (user.role !== "admin") {
const ownedComboIds = new Set((await getCombos(user.id)).map((combo) => combo.id));
@@ -46,8 +69,6 @@ export async function GET() {
);
for (const key of TOKEN_SAVER_SETTING_KEYS) delete safeSettings[key];
}
safeSettings.oidcConfigured = !!(safeSettings.oidcIssuerUrl && safeSettings.oidcClientId && oidcClientSecret);
const enableRequestLogs = process.env.ENABLE_REQUEST_LOGS === "true";
const enableTranslator = process.env.ENABLE_TRANSLATOR === "true";
@@ -67,10 +88,13 @@ export async function PATCH(request) {
try {
const body = await request.json();
if (RESTRICTED_SETTING_KEYS.some((key) => Object.prototype.hasOwnProperty.call(body, key))) {
return NextResponse.json({ error: "This setting is not available" }, { status: 403 });
}
if (
Object.prototype.hasOwnProperty.call(body, "requireApiKey") ||
Object.prototype.hasOwnProperty.call(body, "tunnelDashboardAccess") ||
Object.prototype.hasOwnProperty.call(body, "comboStrategies") ||
TOKEN_SAVER_SETTING_KEYS.some((key) => Object.prototype.hasOwnProperty.call(body, key))
) {
let user;
@@ -144,7 +168,7 @@ export async function PATCH(request) {
}
const { password, oidcClientSecret, ...safeSettings } = settings;
safeSettings.oidcConfigured = !!(safeSettings.oidcIssuerUrl && safeSettings.oidcClientId && oidcClientSecret);
for (const key of RESTRICTED_SETTING_KEYS) delete safeSettings[key];
return NextResponse.json(safeSettings, { headers: SETTINGS_RESPONSE_HEADERS });
} catch (error) {
console.log("Error updating settings:", error);