feat(frontend): move 2FA management into dedicated tab with inline stepper

messages/en.json

@@ -6,6 +6,10 @@
   "2fa-contact-members-before-enabling": "We recommend contacting these members and asking them to enable 2FA in their account settings before you proceed.",
   "2fa-disabled": "Disabled 2FA",
   "2fa-enabled": "2FA Enabled",
+  "2fa-is-enabled": "Two-factor authentication is enabled",
+  "2fa-is-enabled-description": "Your account is protected with two-factor authentication.",
+  "2fa-is-not-enabled": "Two-factor authentication is not enabled",
+  "2fa-is-not-enabled-description": "Protect your account by enabling two-factor authentication.",
   "2fa-enforcement-description": "When enabled, all organization members must have two-factor authentication enabled to access this organization. Members without 2FA will be locked out until they enable it.",
   "2fa-enforcement-disabled": "2FA enforcement has been disabled.",
   "2fa-enforcement-enable-anyway": "Enable Anyway",
@@ -18,8 +22,15 @@
   "2fa-members-status": "Members 2FA Status",
   "2fa-members-will-be-impacted": "{count} member(s) will be impacted",
   "2fa-not-enabled": "2FA Not Enabled",
+  "2fa-setup-date": "Set up on {date}",
   "2fa-setup-org-access": "Enable two-factor authentication to access this organization. Your organization requires 2FA for all members.",
   "2fa-setup-required": "Two-Factor Authentication Required",
+  "2fa-step-captcha": "Solve CAPTCHA",
+  "2fa-step-enter-code": "Enter verification code",
+  "2fa-step-scan-qr": "Scan QR code",
+  "2fa-step-send-code": "Send verification code",
+  "2fa-step-verify-totp": "Verify authenticator code",
+  "2fa-verify-and-enable": "Verify & Enable 2FA",
   "email-otp-2fa-title": "Email verification for 2FA",
   "email-otp-2fa-description": "Verify your email with a one-time code before enabling 2FA. Verification expires after 1 hour.",
   "email-otp-code-required": "Enter the verification code",
@@ -891,6 +902,7 @@
   "logs": "Logs",
   "low-adoption-warning": "Low adoption - only {percent}% on latest",
   "major": "Major",
+  "manage-2fa": "Manage 2FA",
   "manage-default-channel": "Manage in App settings",
   "manifest": "Manifest",
   "manifest-already-cached": "Already cached",
@@ -1241,6 +1253,7 @@
   "required-encryption-key-description": "Lock bundle uploads to a specific encryption key. Only bundles encrypted with this key will be accepted.",
   "required-encryption-key-help": "Enter the first 21 characters of your base64-encoded public key. Leave empty to accept any encrypted bundle.",
   "required-encryption-key-placeholder": "Enter 21-character key fingerprint",
+  "resend": "Resend",
   "resend-email": "Resend Confirmation Email",
   "reset-password": "Reset Password",
   "reset-spoofed-user": "Stop spoofing",

src/constants/accountTabs.ts

@@ -2,9 +2,11 @@ import type { Tab } from '~/components/comp_def'
 import IconBell from '~icons/heroicons/bell'
 import IconInfo from '~icons/heroicons/information-circle'
 import IconLock from '~icons/heroicons/lock-closed'
+import IconShieldCheck from '~icons/heroicons/shield-check'
 
 export const accountTabs: Tab[] = [
   { label: 'general', key: '/settings/account', icon: IconInfo },
   { label: 'notifications', key: '/settings/account/notifications', icon: IconBell },
   { label: 'change-password', key: '/settings/account/change-password', icon: IconLock },
+  { label: 'manage-2fa', key: '/settings/account/manage-2fa', icon: IconShieldCheck },
 ]