feat: multi-user authentication (dual mode)
Add optional login protection for the web UI/API, intended for shared machines (e.g. AI servers). Dual mode: with no users configured the API and web UI are open (as before); once at least one user exists, every /api/* and /ws/* endpoint requires a valid session. - bcrypt password hashing: passwords stored as $2b$ hashes in /etc/nvcurve/users.json (0600, root-owned); plaintext never persisted. - 24-hour sessions: HttpOnly cookie for browsers, Authorization: Bearer token for CLI/scripts; in-memory, invalidated on server restart. - Multi-user: multiple named accounts (no shared-password mode). - New CLI: nvcurve user add|list|remove|set-password (root for mutating ops; password always prompted, never a CLI argument). - New endpoints: GET /api/ping (public), /api/auth/status|login|logout|users. - Web UI: sign-in screen when auth is enabled; status bar shows the signed-in user with sign-out; expired sessions (401) re-show sign-in. - Brute-force lockout: 10 failed logins/IP within 5 min -> 15 min lockout. - New dependency: bcrypt. Also: LSP config (pyrightconfig.json) pointing at the project .venv, and small error-handling cleanups in daemon.py/server.py.
This commit is contained in:
1 parent
af23a10f25
commit
bbd692ea2e
16 files changed
+2085
-483
No files matched your search
+149
-47
@@ -1,31 +1,102 @@
|
||||
import { useGpu } from './hooks/useGpu';
|
||||
import { useCurve } from './hooks/useCurve';
|
||||
import { useMonitor } from './hooks/useMonitor';
|
||||
import { StatusBar } from './components/Monitor/StatusBar';
|
||||
import { LiveMonitor } from './components/Monitor/LiveMonitor';
|
||||
import { CurveEditor } from './components/CurveEditor/CurveEditor';
|
||||
import { PointTable } from './components/PointTable/PointTable';
|
||||
import { PerformancePanel } from './components/Limits/PerformancePanel';
|
||||
import { PerformanceMonitor } from './components/Monitor/PerformanceMonitor';
|
||||
import { FanMonitor } from './components/Monitor/FanMonitor';
|
||||
import { FanCurveEditor } from './components/Fans/FanCurveEditor';
|
||||
import { ProfilePanel } from './components/Profiles/ProfilePanel';
|
||||
import { api } from './api/client';
|
||||
import { useCurveStore } from './store/curveStore';
|
||||
import { Toaster } from 'sonner';
|
||||
import { Loader, ChevronDown } from 'lucide-react';
|
||||
import { useState, useRef, useEffect } from 'react';
|
||||
import type { FanState } from './types';
|
||||
import { useGpu } from "./hooks/useGpu";
|
||||
import { useCurve } from "./hooks/useCurve";
|
||||
import { useMonitor } from "./hooks/useMonitor";
|
||||
import { StatusBar } from "./components/Monitor/StatusBar";
|
||||
import { LiveMonitor } from "./components/Monitor/LiveMonitor";
|
||||
import { CurveEditor } from "./components/CurveEditor/CurveEditor";
|
||||
import { PointTable } from "./components/PointTable/PointTable";
|
||||
import { PerformancePanel } from "./components/Limits/PerformancePanel";
|
||||
import { PerformanceMonitor } from "./components/Monitor/PerformanceMonitor";
|
||||
import { FanMonitor } from "./components/Monitor/FanMonitor";
|
||||
import { FanCurveEditor } from "./components/Fans/FanCurveEditor";
|
||||
import { ProfilePanel } from "./components/Profiles/ProfilePanel";
|
||||
import { api, onUnauthorized } from "./api/client";
|
||||
import { LoginScreen } from "./components/Auth/LoginScreen";
|
||||
import { useCurveStore } from "./store/curveStore";
|
||||
import { Toaster } from "sonner";
|
||||
import { Loader, ChevronDown } from "lucide-react";
|
||||
import { useState, useRef, useEffect } from "react";
|
||||
import type { FanState } from "./types";
|
||||
|
||||
type AuthState = "checking" | "login" | "ok";
|
||||
|
||||
export default function App() {
|
||||
const [authState, setAuthState] = useState<AuthState>("checking");
|
||||
const [authUser, setAuthUser] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false;
|
||||
api
|
||||
.authStatus()
|
||||
.then((s) => {
|
||||
if (cancelled) return;
|
||||
if (s.auth_required && !s.authenticated) {
|
||||
setAuthState("login");
|
||||
} else {
|
||||
setAuthUser(s.username);
|
||||
setAuthState("ok");
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
// Server unreachable — fall through to the normal (no-auth) flow.
|
||||
if (!cancelled) setAuthState("ok");
|
||||
});
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
onUnauthorized(() => setAuthState("login"));
|
||||
return () => onUnauthorized(null);
|
||||
}, []);
|
||||
|
||||
function handleLogout() {
|
||||
api.logout().catch(() => {});
|
||||
setAuthUser(null);
|
||||
setAuthState("login");
|
||||
}
|
||||
|
||||
if (authState === "checking") {
|
||||
return (
|
||||
<div className="min-h-screen bg-zinc-950 flex items-center justify-center">
|
||||
<Loader className="animate-spin text-zinc-500" size={28} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (authState === "login") {
|
||||
return (
|
||||
<LoginScreen
|
||||
onSuccess={(username) => {
|
||||
setAuthUser(username);
|
||||
setAuthState("ok");
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return <MainApp user={authUser} onLogout={handleLogout} />;
|
||||
}
|
||||
|
||||
function MainApp({
|
||||
user,
|
||||
onLogout,
|
||||
}: {
|
||||
user: string | null;
|
||||
onLogout: () => void;
|
||||
}) {
|
||||
const gpuInfo = useGpu();
|
||||
const { curve, wsStatus: curveWsStatus } = useCurve();
|
||||
const { monitor, monitorHistory, wsStatus: monitorWsStatus } = useMonitor();
|
||||
const { setCurve, activeProfile, setActiveProfile, selectedGpuIndex } = useCurveStore();
|
||||
const { setCurve, activeProfile, setActiveProfile, selectedGpuIndex } =
|
||||
useCurveStore();
|
||||
|
||||
const [activeTab, setActiveTab] = useState<'curve' | 'performance' | 'fans'>('curve');
|
||||
const [activeTab, setActiveTab] = useState<"curve" | "performance" | "fans">(
|
||||
"curve",
|
||||
);
|
||||
const [fanState, setFanState] = useState<FanState | null>(null);
|
||||
const [activeDomain, setActiveDomain] = useState<'gpu' | 'memory'>('gpu');
|
||||
const [activeDomain, setActiveDomain] = useState<"gpu" | "memory">("gpu");
|
||||
const [isProfileOpen, setIsProfileOpen] = useState(false);
|
||||
const profileRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
@@ -37,14 +108,20 @@ export default function App() {
|
||||
|
||||
useEffect(() => {
|
||||
function handleClickOutside(event: MouseEvent) {
|
||||
if (profileRef.current && !profileRef.current.contains(event.target as Node)) {
|
||||
if (
|
||||
profileRef.current &&
|
||||
!profileRef.current.contains(event.target as Node)
|
||||
) {
|
||||
setIsProfileOpen(false);
|
||||
}
|
||||
}
|
||||
document.addEventListener("mousedown", handleClickOutside);
|
||||
|
||||
// Fetch initial active profile
|
||||
api.profiles(selectedGpuIndex).then(data => setActiveProfile(data.active)).catch(console.error);
|
||||
api
|
||||
.profiles(selectedGpuIndex)
|
||||
.then((data) => setActiveProfile(data.active))
|
||||
.catch(console.error);
|
||||
|
||||
return () => document.removeEventListener("mousedown", handleClickOutside);
|
||||
}, [selectedGpuIndex, setActiveProfile]);
|
||||
@@ -54,28 +131,36 @@ export default function App() {
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (activeTab === 'fans') {
|
||||
if (activeTab === "fans") {
|
||||
refreshFans();
|
||||
}
|
||||
}, [activeTab, selectedGpuIndex]);
|
||||
|
||||
// Worst connection status wins
|
||||
const wsStatus =
|
||||
monitorWsStatus === 'disconnected' || curveWsStatus === 'disconnected'
|
||||
? 'disconnected'
|
||||
: monitorWsStatus === 'connecting' || curveWsStatus === 'connecting'
|
||||
? 'connecting'
|
||||
: 'connected';
|
||||
monitorWsStatus === "disconnected" || curveWsStatus === "disconnected"
|
||||
? "disconnected"
|
||||
: monitorWsStatus === "connecting" || curveWsStatus === "connecting"
|
||||
? "connecting"
|
||||
: "connected";
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-zinc-950 text-zinc-100 flex flex-col">
|
||||
<Toaster theme="dark" position="top-right" />
|
||||
<StatusBar gpuInfo={gpuInfo} wsStatus={wsStatus} monitor={monitor} />
|
||||
<StatusBar
|
||||
gpuInfo={gpuInfo}
|
||||
wsStatus={wsStatus}
|
||||
monitor={monitor}
|
||||
user={user}
|
||||
onLogout={onLogout}
|
||||
/>
|
||||
|
||||
{wsStatus !== 'connected' && (
|
||||
{wsStatus !== "connected" && (
|
||||
<div className="bg-amber-500/10 border-b border-amber-500/20 text-amber-500 px-4 py-2 text-center text-sm font-medium flex justify-center items-center gap-2">
|
||||
<Loader size={14} className="animate-spin" />
|
||||
{wsStatus === 'connecting' ? 'Reconnecting to backend...' : 'Connection lost. Retrying...'}
|
||||
{wsStatus === "connecting"
|
||||
? "Reconnecting to backend..."
|
||||
: "Connection lost. Retrying..."}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -84,20 +169,20 @@ export default function App() {
|
||||
<div className="flex justify-between items-end border-b border-zinc-800 pb-2">
|
||||
<div className="flex gap-6">
|
||||
<button
|
||||
onClick={() => setActiveTab('curve')}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === 'curve' ? 'border-pink-500 text-zinc-100' : 'border-transparent text-zinc-500 hover:text-zinc-300'}`}
|
||||
onClick={() => setActiveTab("curve")}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === "curve" ? "border-pink-500 text-zinc-100" : "border-transparent text-zinc-500 hover:text-zinc-300"}`}
|
||||
>
|
||||
Curve
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setActiveTab('performance')}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === 'performance' ? 'border-pink-500 text-zinc-100' : 'border-transparent text-zinc-500 hover:text-zinc-300'}`}
|
||||
onClick={() => setActiveTab("performance")}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === "performance" ? "border-pink-500 text-zinc-100" : "border-transparent text-zinc-500 hover:text-zinc-300"}`}
|
||||
>
|
||||
Performance
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setActiveTab('fans')}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === 'fans' ? 'border-pink-500 text-zinc-100' : 'border-transparent text-zinc-500 hover:text-zinc-300'}`}
|
||||
onClick={() => setActiveTab("fans")}
|
||||
className={`text-lg font-medium pb-2 -mb-[9px] border-b-2 transition-colors ${activeTab === "fans" ? "border-pink-500 text-zinc-100" : "border-transparent text-zinc-500 hover:text-zinc-300"}`}
|
||||
>
|
||||
Fans
|
||||
</button>
|
||||
@@ -113,13 +198,23 @@ export default function App() {
|
||||
<span className="text-zinc-200">{activeProfile}</span>
|
||||
</>
|
||||
) : (
|
||||
'Profiles'
|
||||
"Profiles"
|
||||
)}
|
||||
<ChevronDown size={14} className={isProfileOpen ? "rotate-180 transition-transform" : "transition-transform"} />
|
||||
<ChevronDown
|
||||
size={14}
|
||||
className={
|
||||
isProfileOpen
|
||||
? "rotate-180 transition-transform"
|
||||
: "transition-transform"
|
||||
}
|
||||
/>
|
||||
</button>
|
||||
{isProfileOpen && (
|
||||
<div className="absolute right-0 top-full mt-2 w-80 z-50 shadow-[0_8px_30px_rgb(0,0,0,0.8)] border border-zinc-700/50 rounded-lg overflow-hidden">
|
||||
<ProfilePanel activeProfile={activeProfile} onProfileApplied={setActiveProfile} />
|
||||
<ProfilePanel
|
||||
activeProfile={activeProfile}
|
||||
onProfileApplied={setActiveProfile}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -127,7 +222,7 @@ export default function App() {
|
||||
|
||||
{/* Main content area */}
|
||||
<div className="flex flex-col gap-4 w-full">
|
||||
{activeTab === 'curve' ? (
|
||||
{activeTab === "curve" ? (
|
||||
<>
|
||||
<div className="flex gap-4 items-stretch w-full">
|
||||
<div className="flex-1 min-w-0 flex flex-col">
|
||||
@@ -155,20 +250,27 @@ export default function App() {
|
||||
{curve && (
|
||||
<div className="w-full">
|
||||
<PointTable
|
||||
points={curve.points.filter(p => p.domain === activeDomain)}
|
||||
currentVoltageMv={activeDomain === 'gpu' ? currentVoltageMv : null}
|
||||
readOnly={activeDomain === 'memory'}
|
||||
points={curve.points.filter(
|
||||
(p) => p.domain === activeDomain,
|
||||
)}
|
||||
currentVoltageMv={
|
||||
activeDomain === "gpu" ? currentVoltageMv : null
|
||||
}
|
||||
readOnly={activeDomain === "memory"}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : activeTab === 'performance' ? (
|
||||
) : activeTab === "performance" ? (
|
||||
<div className="flex gap-4 items-start w-full">
|
||||
<div className="flex-1 min-w-0">
|
||||
<PerformancePanel />
|
||||
</div>
|
||||
<div className="w-80 shrink-0 flex flex-col">
|
||||
<PerformanceMonitor monitor={monitor} history={monitorHistory} />
|
||||
<PerformanceMonitor
|
||||
monitor={monitor}
|
||||
history={monitorHistory}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
Reference in new issue
Block a user