megaproxy/MyMidas
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Disable 2FA setup/disable buttons in demo mode

Browse source 
Shows the 2FA section as normal but disables both the 'Set up 2FA' and
'Disable 2FA' buttons with opacity and cursor-not-allowed, plus a small
amber note explaining why, matching the pattern used for password changes.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
megaproxy 2026-04-23 23:21:21 +00:00
parent 1854026a76
commit 3126b103b1
1 changed files with 13 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
frontend/src/pages/settings/SettingsPage.tsx
View file

@ -273,6 +273,7 @@ function PasswordCard() {
function TotpCard() { function TotpCard() {
const qc = useQueryClient(); const qc = useQueryClient();
const isDemo = useDemoMode();
const totpEnabled = useAuthStore(s => s.totpEnabled); const totpEnabled = useAuthStore(s => s.totpEnabled);
const { setToken, token, userId, displayName } = useAuthStore(); const { setToken, token, userId, displayName } = useAuthStore();
@ -346,10 +347,14 @@ function TotpCard() {
{step === "idle" && !totpEnabled && ( {step === "idle" && !totpEnabled && (
<div className="space-y-3"> <div className="space-y-3">
<p className="text-sm text-muted-foreground">Add an extra layer of security with an authenticator app.</p> <p className="text-sm text-muted-foreground">Add an extra layer of security with an authenticator app.</p>
{isDemo && (
<p className="text-xs text-amber-400/80">2FA setup is disabled in demo mode.</p>
)}
<button <button
onClick={() => setupMutation.mutate()} onClick={() => setupMutation.mutate()}
disabled={setupMutation.isPending} disabled={isDemo || setupMutation.isPending}
className="flex items-center gap-2 bg-primary text-primary-foreground px-4 py-2 rounded-lg text-sm font-medium hover:bg-primary/90 disabled:opacity-50 transition-colors" title={isDemo ? "Disabled in demo mode" : undefined}
className="flex items-center gap-2 bg-primary text-primary-foreground px-4 py-2 rounded-lg text-sm font-medium hover:bg-primary/90 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
> >
{setupMutation.isPending && <Loader2 className="w-4 h-4 animate-spin" />} {setupMutation.isPending && <Loader2 className="w-4 h-4 animate-spin" />}
Set up 2FA Set up 2FA
@ -360,9 +365,14 @@ function TotpCard() {
{step === "idle" && totpEnabled && ( {step === "idle" && totpEnabled && (
<div className="space-y-3"> <div className="space-y-3">
<p className="text-sm text-muted-foreground">2FA is active. Your account is protected.</p> <p className="text-sm text-muted-foreground">2FA is active. Your account is protected.</p>
{isDemo && (
<p className="text-xs text-amber-400/80">2FA changes are disabled in demo mode.</p>
)}
<button <button
onClick={() => setStep("disable")} onClick={() => setStep("disable")}
className="flex items-center gap-2 border border-destructive/40 text-destructive px-4 py-2 rounded-lg text-sm font-medium hover:bg-destructive/10 transition-colors" disabled={isDemo}
title={isDemo ? "Disabled in demo mode" : undefined}
className="flex items-center gap-2 border border-destructive/40 text-destructive px-4 py-2 rounded-lg text-sm font-medium hover:bg-destructive/10 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
> >
Disable 2FA Disable 2FA
</button> </button>