fix: restrict the setting options for user role

src/app/(dashboard)/dashboard/profile/page.js

@@ -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 */}

src/app/api/auth/oidc/test/route.js

@@ -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 });
 }

src/app/api/combos/[id]/strategy/route.js

@@ -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 });
 }

src/app/api/settings/proxy-test/route.js

@@ -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 });
 }

src/app/api/settings/require-login/route.js

@@ -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 });
 }

src/app/api/settings/route.js

@@ -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);

src/dashboardGuard.js

@@ -28,7 +28,6 @@ const PUBLIC_API_PATHS = [
   "/api/auth/status",
   "/api/auth/oidc",
   "/api/version",
-  "/api/settings/require-login",
 ];
 
 // Public top-level prefixes (LLM API endpoints with their own API key auth).
@@ -48,11 +47,27 @@ const ALWAYS_PROTECTED = [
 // is disabled for local single-user deployments. CLI Tools directly read and
 // mutate the account running 9Router's local CLI configuration, so they are
 // host administration rather than per-user dashboard preferences.
-const ADMIN_ONLY_PATHS = ["/api/users", "/api/tunnel", "/api/headroom", "/api/pxpipe", "/api/cli-tools"];
+const ADMIN_ONLY_PATHS = [
+  "/api/users",
+  "/api/tunnel",
+  "/api/headroom",
+  "/api/pxpipe",
+  "/api/cli-tools",
+  "/api/media-providers",
+  "/api/proxy-pools",
+  "/api/translator/console-logs",
+];
 
 // Dashboard paths requiring an administrator. Combo access is handled by its
 // owner-scoped API routes and is available to authenticated users.
-const ADMIN_ONLY_DASHBOARD_PATHS = ["/dashboard/token-saver", "/dashboard/pxpipe", "/dashboard/cli-tools"];
+const ADMIN_ONLY_DASHBOARD_PATHS = [
+  "/dashboard/token-saver",
+  "/dashboard/pxpipe",
+  "/dashboard/cli-tools",
+  "/dashboard/media-providers",
+  "/dashboard/proxy-pools",
+  "/dashboard/console-log",
+];
 
 // Require auth, but allow through if requireLogin is disabled
 const PROTECTED_API_PATHS = [

src/shared/components/NineRemoteButton.js

@@ -1,23 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import NineRemotePromoModal from "./NineRemotePromoModal";
-
-export default function NineRemoteButton() {
-  const [isOpen, setIsOpen] = useState(false);
-
-  return (
-    <>
-      <button
-        onClick={() => setIsOpen(true)}
-        className="relative flex items-center gap-1.5 px-2.5 py-1.5 rounded-lg transition-all text-text-muted hover:text-text-main hover:bg-black/5 dark:hover:bg-white/5"
-        title="9Remote"
-      >
-        <span className="material-symbols-outlined text-[18px]">computer</span>
-        <span className="text-xs font-medium">Remote</span>
-      </button>
-
-      <NineRemotePromoModal isOpen={isOpen} onClose={() => setIsOpen(false)} />
-    </>
-  );
-}

src/shared/components/NineRemotePromoModal.js

@@ -1,99 +0,0 @@
-"use client";
-
-import { useEffect } from "react";
-import { createPortal } from "react-dom";
-
-const FEATURES = [
-  { icon: "terminal", label: "Terminal", desc: "Full shell access" },
-  { icon: "cast", label: "Desktop", desc: "Screen sharing" },
-  { icon: "folder_open", label: "Files", desc: "Browse & edit files" },
-];
-
-const BULLETS = [
-  { icon: "qr_code_scanner", text: "Scan QR to connect instantly" },
-  { icon: "wifi_off", text: "No port forwarding needed" },
-  { icon: "devices", text: "Works on any device" },
-];
-
-const NINE_REMOTE_URL = "https://9remote.cc";
-
-export default function NineRemotePromoModal({ isOpen, onClose }) {
-  useEffect(() => {
-    if (!isOpen) return;
-    document.body.style.overflow = "hidden";
-    const onEsc = (e) => { if (e.key === "Escape") onClose(); };
-    document.addEventListener("keydown", onEsc);
-    return () => { document.body.style.overflow = ""; document.removeEventListener("keydown", onEsc); };
-  }, [isOpen, onClose]);
-
-  if (!isOpen) return null;
-
-  return createPortal(
-    <div className="fixed inset-0 z-[9999] flex items-center justify-center p-4">
-      <div className="absolute inset-0 bg-black/50 backdrop-blur-[2px] fade-in" onClick={onClose} />
-
-      <div className="relative w-full max-w-sm rounded-[14px] overflow-hidden shadow-[var(--shadow-elev)] fade-in flex flex-col bg-surface border border-border-subtle">
-        {/* Header */}
-        <div className="flex items-center justify-between px-5 py-3 border-b border-border-subtle">
-          <div className="flex items-center gap-3">
-            <div className="w-7 h-7 rounded-[8px] flex items-center justify-center bg-primary">
-              <span className="material-symbols-outlined text-white text-base">terminal</span>
-            </div>
-            <span className="text-xs font-bold uppercase tracking-wider text-primary font-mono">9Remote</span>
-          </div>
-          <button
-            onClick={onClose}
-            className="p-1.5 rounded-[10px] text-text-muted hover:bg-surface-2 hover:text-text-main transition-colors"
-          >
-            <span className="material-symbols-outlined text-base">close</span>
-          </button>
-        </div>
-
-        {/* Body */}
-        <div className="px-7 py-7 pb-9 flex flex-col gap-6">
-          {/* Hero */}
-          <div className="flex flex-col items-center gap-2 text-center mt-2">
-            <div className="w-14 h-14 rounded-[14px] flex items-center justify-center mb-1 bg-primary shadow-[var(--shadow-warm)]">
-              <span className="material-symbols-outlined text-white text-[30px]">terminal</span>
-            </div>
-            <h1 className="text-lg font-bold text-text-main tracking-tight">9Remote</h1>
-            <p className="text-xs text-text-muted leading-5 max-w-[220px]">
-              Access your terminal, desktop &amp; files from anywhere
-            </p>
-          </div>
-
-          {/* Feature cards */}
-          <div className="flex gap-2 w-full">
-            {FEATURES.map(({ icon, label, desc }) => (
-              <div key={label} className="flex-1 flex flex-col items-center gap-1.5 py-4 px-1 rounded-[10px] border border-border-subtle bg-surface-2">
-                <span className="material-symbols-outlined text-primary text-[22px]">{icon}</span>
-                <p className="text-xs font-semibold text-text-main">{label}</p>
-                <p className="text-[10px] text-text-muted text-center leading-4">{desc}</p>
-              </div>
-            ))}
-          </div>
-
-          {/* Bullets */}
-          <div className="flex flex-col gap-3 w-full">
-            {BULLETS.map(({ icon, text }) => (
-              <div key={icon} className="flex items-center gap-2.5">
-                <span className="material-symbols-outlined flex-shrink-0 text-primary text-[16px]">{icon}</span>
-                <span className="text-xs text-text-muted">{text}</span>
-              </div>
-            ))}
-          </div>
-
-          {/* CTA */}
-          <button
-            onClick={() => window.open(NINE_REMOTE_URL, "_blank")}
-            className="w-full py-3 flex items-center justify-center gap-2 text-sm font-semibold text-white rounded-[10px] bg-primary hover:bg-primary-hover shadow-[var(--shadow-warm)] active:scale-[0.98] transition-all"
-          >
-            <span className="material-symbols-outlined text-base">open_in_new</span>
-            Get 9Remote
-          </button>
-        </div>
-      </div>
-    </div>,
-    document.body
-  );
-}

src/shared/components/Sidebar.js

@@ -11,7 +11,6 @@ import { useCopyToClipboard } from "@/shared/hooks/useCopyToClipboard";
 import useUserStore from "@/store/userStore";
 import Button from "./Button";
 import { ConfirmModal } from "./Modal";
-import NineRemotePromoModal from "./NineRemotePromoModal";
 
 // const VISIBLE_MEDIA_KINDS = ["embedding", "image", "imageToText", "tts", "stt", "webSearch", "webFetch", "video", "music"];
 const VISIBLE_MEDIA_KINDS = ["embedding", "image", "tts", "stt"];
@@ -32,19 +31,18 @@ const navItems = [
 ];
 
 const debugItems = [
-  { href: "/dashboard/console-log", label: "Console Log", icon: "terminal" },
+  { href: "/dashboard/console-log", label: "Console Log", icon: "terminal", adminOnly: true },
   { href: "/dashboard/translator", label: "Translator", icon: "translate" },
 ];
 
 const systemItems = [
-  { href: "/dashboard/proxy-pools", label: "Proxy Pools", icon: "lan" },
+  { href: "/dashboard/proxy-pools", label: "Proxy Pools", icon: "lan", adminOnly: true },
   { href: "/dashboard/skills", label: "Skills", icon: "extension" },
 ];
 
 export default function Sidebar({ onClose }) {
   const pathname = usePathname();
   const [mediaOpen, setMediaOpen] = useState(false);
-  const [showRemoteModal, setShowRemoteModal] = useState(false);
   const [isDisconnected, setIsDisconnected] = useState(false);
   const [updateInfo, setUpdateInfo] = useState(null);
   const [showUpdateModal, setShowUpdateModal] = useState(false);
@@ -196,58 +194,62 @@ export default function Sidebar({ onClose }) {
               System
             </p>
 
-            {/* Media Providers accordion */}
-            <button
-              onClick={() => setMediaOpen((v) => !v)}
-              className={cn(
-                "w-full flex items-center gap-3 px-3 py-1 rounded-lg transition-all group",
-                pathname.startsWith("/dashboard/media-providers")
-                  ? "bg-primary/10 text-primary"
-                  : "text-text-muted hover:bg-surface-2 hover:text-text-main"
-              )}
-            >
-              <span className="material-symbols-outlined text-[18px]">perm_media</span>
-              <span className="text-[13px] font-medium flex-1 text-left">Media Providers</span>
-              <span className="material-symbols-outlined text-[14px] transition-transform" style={{ transform: mediaOpen ? "rotate(180deg)" : "rotate(0deg)" }}>
-                expand_more
-              </span>
-            </button>
-            {mediaOpen && (
-              <div className="pl-4">
-                {MEDIA_PROVIDER_KINDS.filter((k) => VISIBLE_MEDIA_KINDS.includes(k.id)).map((kind) => (
-                  <Link
-                    key={kind.id}
-                    href={`/dashboard/media-providers/${kind.id}`}
-                    onClick={onClose}
-                    className={cn(
-                      "flex items-center gap-3 px-4 py-1 rounded-lg transition-all group",
-                      pathname.startsWith(`/dashboard/media-providers/${kind.id}`)
-                        ? "bg-primary/10 text-primary"
-                        : "text-text-muted hover:bg-surface-2 hover:text-text-main"
-                    )}
-                  >
-                    <span className="material-symbols-outlined text-[16px]">{kind.icon}</span>
-                    <span className="text-sm">{kind.label}</span>
-                  </Link>
-                ))}
-                <Link
-                  key={COMBINED_WEB_ITEM.id}
-                  href={COMBINED_WEB_ITEM.href}
-                  onClick={onClose}
+            {/* Media providers are configuration pages, visible only to administrators. */}
+            {user?.role === "admin" && (
+              <>
+                <button
+                  onClick={() => setMediaOpen((v) => !v)}
                   className={cn(
-                    "flex items-center gap-3 px-4 py-1 rounded-lg transition-all group",
-                    pathname.startsWith(COMBINED_WEB_ITEM.href)
+                    "w-full flex items-center gap-3 px-3 py-1 rounded-lg transition-all group",
+                    pathname.startsWith("/dashboard/media-providers")
                       ? "bg-primary/10 text-primary"
                       : "text-text-muted hover:bg-surface-2 hover:text-text-main"
                   )}
                 >
-                  <span className="material-symbols-outlined text-[16px]">{COMBINED_WEB_ITEM.icon}</span>
-                  <span className="text-sm">{COMBINED_WEB_ITEM.label}</span>
-                </Link>
-              </div>
+                  <span className="material-symbols-outlined text-[18px]">perm_media</span>
+                  <span className="text-[13px] font-medium flex-1 text-left">Media Providers</span>
+                  <span className="material-symbols-outlined text-[14px] transition-transform" style={{ transform: mediaOpen ? "rotate(180deg)" : "rotate(0deg)" }}>
+                    expand_more
+                  </span>
+                </button>
+                {mediaOpen && (
+                  <div className="pl-4">
+                    {MEDIA_PROVIDER_KINDS.filter((k) => VISIBLE_MEDIA_KINDS.includes(k.id)).map((kind) => (
+                      <Link
+                        key={kind.id}
+                        href={`/dashboard/media-providers/${kind.id}`}
+                        onClick={onClose}
+                        className={cn(
+                          "flex items-center gap-3 px-4 py-1 rounded-lg transition-all group",
+                          pathname.startsWith(`/dashboard/media-providers/${kind.id}`)
+                            ? "bg-primary/10 text-primary"
+                            : "text-text-muted hover:bg-surface-2 hover:text-text-main"
+                        )}
+                      >
+                        <span className="material-symbols-outlined text-[16px]">{kind.icon}</span>
+                        <span className="text-sm">{kind.label}</span>
+                      </Link>
+                    ))}
+                    <Link
+                      key={COMBINED_WEB_ITEM.id}
+                      href={COMBINED_WEB_ITEM.href}
+                      onClick={onClose}
+                      className={cn(
+                        "flex items-center gap-3 px-4 py-1 rounded-lg transition-all group",
+                        pathname.startsWith(COMBINED_WEB_ITEM.href)
+                          ? "bg-primary/10 text-primary"
+                          : "text-text-muted hover:bg-surface-2 hover:text-text-main"
+                      )}
+                    >
+                      <span className="material-symbols-outlined text-[16px]">{COMBINED_WEB_ITEM.icon}</span>
+                      <span className="text-sm">{COMBINED_WEB_ITEM.label}</span>
+                    </Link>
+                  </div>
+                )}
+              </>
             )}
 
-            {systemItems.map((item) => (
+            {systemItems.filter((item) => !item.adminOnly || user?.role === "admin").map((item) => (
               <Link
                 key={item.href}
                 href={item.href}
@@ -289,7 +291,8 @@ export default function Sidebar({ onClose }) {
 
             {/* Debug items (inside System section, before Settings) */}
             {debugItems.map((item) => {
-              const show = item.href !== "/dashboard/translator" || enableTranslator;
+              const show = (!item.adminOnly || user?.role === "admin") &&
+                (item.href !== "/dashboard/translator" || enableTranslator);
               return show ? (
                 <Link
                   key={item.href}
@@ -315,20 +318,6 @@ export default function Sidebar({ onClose }) {
               ) : null;
             })}
 
-            {/* Remote */}
-            <button
-              onClick={() => setShowRemoteModal(true)}
-              className={cn(
-                "flex items-center gap-3 px-3 py-1 rounded-lg transition-all group w-full",
-                "text-text-muted hover:bg-surface-2 hover:text-text-main"
-              )}
-            >
-              <span className="material-symbols-outlined text-[18px] group-hover:text-primary transition-colors">
-                computer
-              </span>
-              <span className="text-[13px] font-medium">Remote</span>
-            </button>
-
             {/* Settings */}
             <Link
               href="/dashboard/profile"
@@ -355,9 +344,6 @@ export default function Sidebar({ onClose }) {
 
       </aside>
 
-      {/* Remote Promo Modal */}
-      <NineRemotePromoModal isOpen={showRemoteModal} onClose={() => setShowRemoteModal(false)} />
-
       {/* Update Confirmation Modal */}
       <ConfirmModal
         isOpen={showUpdateModal}

src/shared/components/index.js

@@ -20,7 +20,6 @@ export { default as ComboFormModal } from "./ComboFormModal";
 export { default as McpMarketplaceModal } from "./McpMarketplaceModal";
 export { default as UsageStats } from "./UsageStats";
 export { default as LanguageSwitcher } from "./LanguageSwitcher";
-export { default as NineRemoteButton } from "./NineRemoteButton";
 export { default as HeaderMenu } from "./HeaderMenu";
 export { default as ChangelogModal } from "./ChangelogModal";
 export { default as RequestLogger } from "./RequestLogger";