fix: login mode card update, OIDC service improvements, auth middleware refinements
This commit is contained in:
null
parent
26b6fb13e5
commit
a6b2e8bb87
|
|
@ -12,23 +12,29 @@ import {
|
|||
AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle,
|
||||
AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction,
|
||||
} from '@/components/ui/alert-dialog';
|
||||
import { LogIn, UserCheck, ShieldCheck } from 'lucide-react';
|
||||
|
||||
export default function LoginModeCard({ users }) {
|
||||
export default function LoginModeCard({ users, onModeChange }) {
|
||||
const [modeData, setModeData] = useState(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [loadError, setLoadError] = useState('');
|
||||
const [saving, setSaving] = useState(false);
|
||||
const [selected, setSelected] = useState('multi'); // local UI selection
|
||||
const [selectedUser, setSelectedUser] = useState('');
|
||||
|
||||
const [confirmSingle, setConfirmSingle] = useState(false);
|
||||
const [pendingUserId, setPendingUserId] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
api.authModeConfig()
|
||||
.then(d => { setModeData(d); setSelectedUser(d.default_user_id?.toString() || ''); })
|
||||
.then(d => {
|
||||
setModeData(d);
|
||||
const mode = d.auth_mode === 'single' ? 'single' : 'multi';
|
||||
setSelected(mode);
|
||||
setSelectedUser(d.default_user_id?.toString() || '');
|
||||
onModeChange?.(mode);
|
||||
})
|
||||
.catch(err => setLoadError(err.message || 'Failed to load login mode config'))
|
||||
.finally(() => setLoading(false));
|
||||
}, []);
|
||||
}, []); // eslint-disable-line
|
||||
|
||||
const doSetMode = async (mode, userId) => {
|
||||
setSaving(true);
|
||||
|
|
@ -39,77 +45,164 @@ export default function LoginModeCard({ users }) {
|
|||
});
|
||||
const d = await api.authModeConfig();
|
||||
setModeData(d);
|
||||
toast.success(mode === 'single' ? 'Single-user mode enabled.' : 'Login requirement restored.');
|
||||
const resolved = d.auth_mode === 'single' ? 'single' : 'multi';
|
||||
setSelected(resolved);
|
||||
setSelectedUser(d.default_user_id?.toString() || '');
|
||||
onModeChange?.(resolved);
|
||||
toast.success(mode === 'single' ? 'No Login mode enabled.' : 'Login requirement restored.');
|
||||
} catch (err) {
|
||||
toast.error(err.message || 'Failed to update auth mode.');
|
||||
toast.error(err.message || 'Failed to update login mode.');
|
||||
// revert UI selection on error
|
||||
setSelected(modeData?.auth_mode === 'single' ? 'single' : 'multi');
|
||||
} finally {
|
||||
setSaving(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleRequestSingle = () => {
|
||||
if (!selectedUser) { toast.error('Select a user first.'); return; }
|
||||
setPendingUserId(selectedUser);
|
||||
const handleSave = () => {
|
||||
if (selected === 'single') {
|
||||
if (!selectedUser) { toast.error('Select a user account first.'); return; }
|
||||
setConfirmSingle(true);
|
||||
};
|
||||
|
||||
const handleConfirmSingle = () => {
|
||||
setConfirmSingle(false);
|
||||
doSetMode('single', pendingUserId);
|
||||
} else {
|
||||
doSetMode('multi', null);
|
||||
}
|
||||
};
|
||||
|
||||
if (loading) return <Card><CardContent className="py-8 text-center text-muted-foreground text-sm">Loading…</CardContent></Card>;
|
||||
if (loadError) return <Card><CardContent className="py-8 text-center text-sm text-destructive">{loadError}</CardContent></Card>;
|
||||
|
||||
const isMulti = !modeData || modeData.auth_mode === 'multi';
|
||||
const currentMode = modeData?.auth_mode === 'single' ? 'single' : 'multi';
|
||||
const isDirty = selected !== currentMode || (selected === 'single' && selectedUser !== (modeData?.default_user_id?.toString() || ''));
|
||||
const activeUser = users?.find(u => u.id === modeData?.default_user_id);
|
||||
const selectedUsername = users?.find(u => u.id.toString() === selectedUser)?.username ?? selectedUser;
|
||||
const pendingUsername = users?.find(u => u.id.toString() === selectedUser)?.username ?? selectedUser;
|
||||
const regularUsers = (users || []).filter(u => u.role === 'user');
|
||||
|
||||
return (
|
||||
<>
|
||||
<Card>
|
||||
<CardHeader className="pb-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<CardTitle>Login Mode</CardTitle>
|
||||
<Badge className={isMulti ? 'bg-sky-500/15 text-sky-400 border-sky-500/20' : 'bg-amber-500/15 text-amber-400 border-amber-500/20'}>
|
||||
{isMulti ? 'Multi-user' : 'Single-user'}
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
Choose how users access this app.
|
||||
</p>
|
||||
</div>
|
||||
<Badge className={
|
||||
currentMode === 'single'
|
||||
? 'bg-violet-500/15 text-violet-400 border-violet-500/20'
|
||||
: 'bg-sky-500/15 text-sky-400 border-sky-500/20'
|
||||
}>
|
||||
{currentMode === 'single' ? 'No Login' : 'Require Login'}
|
||||
</Badge>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
{isMulti ? (
|
||||
<>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Single-user mode bypasses the login screen and automatically signs in as the selected user.
|
||||
|
||||
<CardContent className="space-y-3">
|
||||
{/* Option: Require Login */}
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setSelected('multi')}
|
||||
className={`w-full text-left rounded-lg border px-4 py-3.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${
|
||||
selected === 'multi'
|
||||
? 'border-primary/50 bg-primary/5'
|
||||
: 'border-border/60 bg-muted/20 hover:border-border hover:bg-muted/40'
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-start gap-3">
|
||||
<div className={`mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 ${
|
||||
selected === 'multi' ? 'border-primary' : 'border-muted-foreground/40'
|
||||
}`}>
|
||||
{selected === 'multi' && <div className="h-2 w-2 rounded-full bg-primary" />}
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<LogIn className="h-4 w-4 text-muted-foreground" />
|
||||
<span className="text-sm font-medium">Require Login</span>
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground mt-1">
|
||||
Users must sign in with a username and password, or via OIDC. Authentication methods are configured below.
|
||||
</p>
|
||||
<div className="space-y-1.5">
|
||||
<Label>Default user</Label>
|
||||
{currentMode === 'multi' && (
|
||||
<p className="text-xs text-emerald-500 mt-1 font-medium">Currently active</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
{/* Option: No Login */}
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setSelected('single')}
|
||||
className={`w-full text-left rounded-lg border px-4 py-3.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring ${
|
||||
selected === 'single'
|
||||
? 'border-violet-500/50 bg-violet-500/5'
|
||||
: 'border-border/60 bg-muted/20 hover:border-border hover:bg-muted/40'
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-start gap-3">
|
||||
<div className={`mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 ${
|
||||
selected === 'single' ? 'border-violet-500' : 'border-muted-foreground/40'
|
||||
}`}>
|
||||
{selected === 'single' && <div className="h-2 w-2 rounded-full bg-violet-500" />}
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<UserCheck className="h-4 w-4 text-muted-foreground" />
|
||||
<span className="text-sm font-medium">No Login — Single User</span>
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground mt-1">
|
||||
Anyone who opens the app is automatically signed in as the selected user. No login screen is shown.
|
||||
Admin routes still require a session.
|
||||
</p>
|
||||
{currentMode === 'single' && (
|
||||
<p className="text-xs text-violet-400 mt-1 font-medium">
|
||||
Currently active — signed in as <span className="text-foreground">{activeUser?.username ?? '—'}</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
{/* User selector — shown only when No Login is selected */}
|
||||
{selected === 'single' && (
|
||||
<div className="rounded-lg border border-border/60 bg-muted/10 px-4 py-3 space-y-2">
|
||||
<Label className="text-xs text-muted-foreground">Auto sign-in as</Label>
|
||||
<Select value={selectedUser} onValueChange={setSelectedUser}>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select a user…" />
|
||||
<SelectValue placeholder="Select a user account…" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{(users || []).filter(u => u.role === 'user').map(u => (
|
||||
{regularUsers.map(u => (
|
||||
<SelectItem key={u.id} value={u.id.toString()}>{u.username}</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{regularUsers.length === 0 && (
|
||||
<p className="text-xs text-amber-500">No regular user accounts found. Create a user account first.</p>
|
||||
)}
|
||||
</div>
|
||||
<Button onClick={handleRequestSingle} disabled={saving} className="w-full">
|
||||
{saving ? 'Enabling…' : 'Enable Single-User Mode'}
|
||||
</Button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Currently auto-signing in as{' '}
|
||||
<span className="font-medium text-foreground">{activeUser?.username ?? '—'}</span>.
|
||||
Restoring login requirement will require all users to sign in manually.
|
||||
)}
|
||||
|
||||
{/* Security note for single mode */}
|
||||
{selected === 'single' && (
|
||||
<div className="flex gap-2 rounded-lg border border-amber-500/25 bg-amber-500/10 px-3 py-2.5">
|
||||
<ShieldCheck className="h-4 w-4 text-amber-500 shrink-0 mt-0.5" />
|
||||
<p className="text-xs text-amber-600 dark:text-amber-400">
|
||||
Only use this on trusted private networks. Anyone with access to the URL is signed in automatically.
|
||||
</p>
|
||||
<Button variant="outline" onClick={() => doSetMode('multi', null)} disabled={saving} className="w-full">
|
||||
{saving ? 'Restoring…' : 'Restore Login Requirement'}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isDirty && (
|
||||
<Button
|
||||
onClick={handleSave}
|
||||
disabled={saving || (selected === 'single' && !selectedUser)}
|
||||
className="w-full"
|
||||
variant={selected === 'single' ? 'default' : 'outline'}
|
||||
>
|
||||
{saving ? 'Saving…' : selected === 'single' ? 'Enable No Login Mode' : 'Restore Login Requirement'}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
|
@ -117,17 +210,17 @@ export default function LoginModeCard({ users }) {
|
|||
<AlertDialog open={confirmSingle} onOpenChange={setConfirmSingle}>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Enable Single-User Mode?</AlertDialogTitle>
|
||||
<AlertDialogTitle>Enable No Login Mode?</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
Anyone who opens the app will be automatically signed in as{' '}
|
||||
<span className="font-medium text-foreground">{selectedUsername}</span>.
|
||||
<span className="font-medium text-foreground">{pendingUsername}</span>.
|
||||
The admin login still requires a password.
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handleConfirmSingle}>
|
||||
Enable Single-User Mode
|
||||
<AlertDialogAction onClick={() => { setConfirmSingle(false); doSetMode('single', selectedUser); }}>
|
||||
Enable No Login Mode
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ export default function AdminPage() {
|
|||
const [hasUsers, setHasUsers] = useState(null);
|
||||
const [loadError, setLoadError] = useState('');
|
||||
const [users, setUsers] = useState([]);
|
||||
const [authMode, setAuthMode] = useState('multi');
|
||||
|
||||
const loadMe = useCallback(async () => {
|
||||
try {
|
||||
|
|
@ -85,8 +86,8 @@ export default function AdminPage() {
|
|||
<BankSyncAdminCard />
|
||||
<BackupManagementCard />
|
||||
<CleanupPanel />
|
||||
<LoginModeCard users={users} />
|
||||
<AuthMethodsCard />
|
||||
<LoginModeCard users={users} onModeChange={setAuthMode} />
|
||||
{authMode !== 'single' && <AuthMethodsCard />}
|
||||
<AddUserCard onCreated={loadUsers} />
|
||||
<UsersTable users={users} onRefresh={loadUsers} currentUser={me} />
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ export default function LoginPage() {
|
|||
const [password, setPassword] = useState('');
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState('');
|
||||
const [authMode, setAuthMode] = useState({ local_enabled: true, oidc_enabled: false });
|
||||
const [authMode, setAuthMode] = useState(null); // null = still loading
|
||||
|
||||
const [pendingUser, setPendingUser] = useState(null);
|
||||
const [showChangePw, setShowChangePw] = useState(false);
|
||||
|
|
@ -78,9 +78,9 @@ export default function LoginPage() {
|
|||
}
|
||||
};
|
||||
|
||||
const localEnabled = authMode.local_enabled !== false;
|
||||
const oidcEnabled = !!authMode.oidc_enabled && !!authMode.oidc_login_url;
|
||||
const providerName = authMode.oidc_provider_name || 'authentik';
|
||||
const localEnabled = authMode?.local_enabled !== false;
|
||||
const oidcEnabled = !!authMode?.oidc_enabled && !!authMode?.oidc_login_url;
|
||||
const providerName = authMode?.oidc_provider_name || 'authentik';
|
||||
const isAuthentikProvider = providerName.toLowerCase().includes('authentik');
|
||||
|
||||
const handleChangePassword = async (e) => {
|
||||
|
|
@ -139,7 +139,12 @@ export default function LoginPage() {
|
|||
/>
|
||||
</div>
|
||||
|
||||
{/* Card */}
|
||||
{/* Card — hidden while auth mode is still resolving to avoid flash in single-user mode */}
|
||||
{authMode === null ? (
|
||||
<div className="surface-elevated p-8 flex items-center justify-center min-h-[120px]">
|
||||
<span className="text-sm text-muted-foreground">Loading…</span>
|
||||
</div>
|
||||
) : (
|
||||
<div className="surface-elevated p-8 space-y-6">
|
||||
|
||||
<div>
|
||||
|
|
@ -238,6 +243,7 @@ export default function LoginPage() {
|
|||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)} {/* end authMode !== null */}
|
||||
</div>
|
||||
|
||||
{/* Change Password Dialog */}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
const { getSessionUser, COOKIE_NAME, publicUser } = require('../services/authService');
|
||||
const crypto = require('crypto');
|
||||
const { getSessionUser, COOKIE_NAME, SINGLE_COOKIE_NAME, cookieOpts, publicUser, recordLogin } = require('../services/authService');
|
||||
const { getDb, getSetting } = require('../db/database');
|
||||
const { standardizeError } = require('./errorFormatter');
|
||||
|
||||
|
|
@ -24,6 +25,28 @@ function requireAuth(req, res, next) {
|
|||
if (singleUser) {
|
||||
req.user = singleUser;
|
||||
req.singleUserMode = true;
|
||||
|
||||
// Track logins via a presence cookie so login history works without a real session.
|
||||
// A new cookie = new browser/device visit → record a login entry.
|
||||
const existing = req.cookies?.[SINGLE_COOKIE_NAME];
|
||||
if (existing) {
|
||||
req.singleSessionId = existing;
|
||||
} else {
|
||||
const sessionId = crypto.randomUUID();
|
||||
res.cookie(SINGLE_COOKIE_NAME, sessionId, {
|
||||
httpOnly: true,
|
||||
sameSite: 'strict',
|
||||
secure: cookieOpts(req).secure,
|
||||
maxAge: 30 * 86400 * 1000, // 30 days
|
||||
path: '/',
|
||||
});
|
||||
req.singleSessionId = sessionId;
|
||||
// Non-blocking — don't delay the first request
|
||||
setImmediate(() => {
|
||||
try { recordLogin(singleUser.id, req.ip, req.get('user-agent'), sessionId); } catch {}
|
||||
});
|
||||
}
|
||||
|
||||
return next();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ function getAppVersion() {
|
|||
}
|
||||
|
||||
const { getDb, getSetting, setSetting } = require('../db/database');
|
||||
const { login, logout, hashPassword, cookieOpts, COOKIE_NAME, rotateSessionId, invalidateOtherSessions, recordLogin, recordFailedLogin } = require('../services/authService');
|
||||
const { login, logout, hashPassword, cookieOpts, COOKIE_NAME, SINGLE_COOKIE_NAME, rotateSessionId, invalidateOtherSessions, recordLogin, recordFailedLogin } = require('../services/authService');
|
||||
const { decryptSecret } = require('../services/encryptionService');
|
||||
const { getCsrfToken } = require('../middleware/csrf');
|
||||
const { requireAuth, requireAdmin } = require('../middleware/requireAuth');
|
||||
|
|
@ -124,8 +124,11 @@ router.get('/login-history', requireAuth, (req, res) => {
|
|||
try { return decryptSecret(v); } catch { return null; }
|
||||
};
|
||||
|
||||
// Compute fingerprint of the current session cookie to mark "this session"
|
||||
const currentCookie = req.cookies?.[COOKIE_NAME];
|
||||
// Compute fingerprint of the current session cookie to mark "this session".
|
||||
// Single-user mode has no COOKIE_NAME — use the presence cookie instead.
|
||||
const currentCookie = req.singleUserMode
|
||||
? req.cookies?.[SINGLE_COOKIE_NAME]
|
||||
: req.cookies?.[COOKIE_NAME];
|
||||
const currentFingerprint = currentCookie
|
||||
? require('crypto').createHash('sha256').update(currentCookie).digest('hex').slice(0, 32)
|
||||
: null;
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@ router.get('/callback', async (req, res) => {
|
|||
const session = await createSession(user.id);
|
||||
if (!session) throw new Error('Failed to create local session after OIDC login');
|
||||
|
||||
recordLogin(user.id, req.ip, req.get('user-agent'));
|
||||
recordLogin(user.id, req.ip, req.get('user-agent'), session.sessionId);
|
||||
res.cookie(COOKIE_NAME, session.sessionId, cookieOpts(req));
|
||||
res.redirect(savedState.redirect_to || '/');
|
||||
} catch (err) {
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ const { buildDeviceFingerprint } = require('./loginFingerprint');
|
|||
const { encryptSecret, decryptSecret } = require('./encryptionService');
|
||||
|
||||
const COOKIE_NAME = 'bt_session';
|
||||
const SINGLE_COOKIE_NAME = 'bt_single_session';
|
||||
const SESSION_DAYS = 7;
|
||||
|
||||
function envFlag(name) {
|
||||
|
|
@ -358,4 +359,4 @@ function invalidateOtherSessions(userId, keepSessionId) {
|
|||
return result;
|
||||
}
|
||||
|
||||
module.exports = { login, logout, createSession, getSessionUser, hashPassword, publicUser, pruneExpiredSessions, cookieOpts, COOKIE_NAME, SESSION_DAYS, rotateSessionId, invalidateOtherSessions, recordLogin, recordFailedLogin };
|
||||
module.exports = { login, logout, createSession, getSessionUser, hashPassword, publicUser, pruneExpiredSessions, cookieOpts, COOKIE_NAME, SINGLE_COOKIE_NAME, SESSION_DAYS, rotateSessionId, invalidateOtherSessions, recordLogin, recordFailedLogin };
|
||||
|
|
|
|||
|
|
@ -318,6 +318,9 @@ function applyAuthModeSettings(body = {}) {
|
|||
? trimOrEmpty(oidc_admin_group)
|
||||
: getAdminOidcSettings().oidc_admin_group;
|
||||
|
||||
// Single-user mode bypasses the login screen entirely — lockout checks don't apply
|
||||
const isSingleMode = auth_mode === 'single' || (auth_mode === undefined && getSetting('auth_mode') === 'single');
|
||||
if (!isSingleMode) {
|
||||
if (!nextLocal && !nextOidc) {
|
||||
throw serviceError('Cannot disable all login methods. At least one must remain enabled.');
|
||||
}
|
||||
|
|
@ -330,6 +333,7 @@ function applyAuthModeSettings(body = {}) {
|
|||
if (nextOidc && !oidcConfigured) {
|
||||
throw serviceError('Cannot enable OIDC login until issuer URL, client ID, client secret, and redirect URI are configured.');
|
||||
}
|
||||
}
|
||||
|
||||
if (auth_mode !== undefined) {
|
||||
if (auth_mode === 'single') setSetting('default_user_id', default_user_id);
|
||||
|
|
|
|||
Loading…
Reference in New Issue