Adds a self-service MFA setup UI for local-auth users:
- frontend/components/auth/MfaCard.tsx — three-stage card:
1. Idle → 'Enable MFA' / 'Disable MFA' (state-aware)
2. Setup → confirm password → POST /auth/mfa/setup, receive secret+URI
3. Activate → QR (qrcode.react SVG, all client-side, no external service)
+ readable secret fallback + 6-digit code field → POST /auth/mfa/activate
Disable flow: password confirm → POST /auth/mfa/disable. Card hides
itself for non-local users (their IdP handles MFA).
- frontend/app/settings/page.tsx renders MfaCard above the existing
'Your Profile' panel.
- /auth/me now returns auth_provider and mfa_enabled so the card can
decide which state to show without an extra fetch.
- qrcode.react dependency added (~20KB, MIT). QR renders locally as SVG;
the otpauth secret never leaves the browser.
36 lines
839 B
JSON
36 lines
839 B
JSON
{
|
|
"name": "frontend",
|
|
"version": "0.1.0",
|
|
"private": true,
|
|
"scripts": {
|
|
"dev": "next dev",
|
|
"build": "next build --webpack",
|
|
"start": "next start",
|
|
"lint": "eslint"
|
|
},
|
|
"dependencies": {
|
|
"@headlessui/react": "^2.2.9",
|
|
"@heroicons/react": "^2.2.0",
|
|
"@tailwindcss/typography": "^0.5.19",
|
|
"axios": "^1.13.3",
|
|
"clsx": "^2.1.1",
|
|
"daisyui": "^5.5.14",
|
|
"date-fns": "^4.1.0",
|
|
"next": "16.1.5",
|
|
"next-auth": "^4.24.13",
|
|
"qrcode.react": "^4.2.0",
|
|
"react": "19.2.3",
|
|
"react-dom": "19.2.3",
|
|
"tailwind-merge": "^3.4.0"
|
|
},
|
|
"devDependencies": {
|
|
"@tailwindcss/postcss": "^4",
|
|
"@types/node": "^20",
|
|
"@types/react": "^19",
|
|
"@types/react-dom": "^19",
|
|
"eslint": "^9",
|
|
"eslint-config-next": "16.1.5",
|
|
"tailwindcss": "^4",
|
|
"typescript": "^5"
|
|
}
|
|
} |