POST /api/auth/2fa/setup
Body: { userId: string, email: string }
Response: {
  success: true,
  data: {
    secret: string,
    qrCodeDataUrl: string,
    backupCodes: string[],
    manualEntryCode: string
  }
}

POST /api/auth/2fa/verify-setup
Body: {
  userId: string,
  secret: string,
  code: string,
  backupCodes: string[]
}
Response: { success: true }

POST /api/auth/2fa/verify
Body: {
  userId: string,
  code: string,
  rememberDevice: boolean
}
Response: {
  success: true,
  usedBackupCode: boolean
}

GET /api/auth/2fa/status?userId={userId}
Response: {
  success: true,
  data: {
    isEnabled: boolean,
    backupCodes: { total, unused, used },
    trustedDevices: Device[]
  }
}

import { use2FA } from '@/hooks/use-2fa'

function Component() {
  const {
    status,           // Current 2FA status
    setupData,        // Setup data (QR, codes, etc.)
    loading,          // Loading state
    error,            // Error message
    startSetup,       // Start setup flow
    verifyAndEnable,  // Verify and enable 2FA
    disable,          // Disable 2FA
    regenerateBackupCodes,  // Get new backup codes
    removeTrustedDevice,    // Remove trusted device
    refreshStatus,    // Refresh status
  } = use2FA()

  // Start setup
  const handleSetup = async () => {
    const result = await startSetup()
    if (result.success) {
      // Show QR: setupData.qrCodeDataUrl
      // Show codes: setupData.backupCodes
    }
  }

  // Verify code
  const handleVerify = async (code: string) => {
    const result = await verifyAndEnable(code)
    if (result.success) {
      // 2FA enabled!
    }
  }

  return (
    <div>
      {status?.isEnabled ? 'Enabled' : 'Disabled'}
      <button onClick={handleSetup}>Enable 2FA</button>
    </div>
  )
}

import { TwoFactorVerify } from '@/components/auth/TwoFactorVerify'

function LoginPage() {
  const [showTwoFactor, setShowTwoFactor] = useState(false)
  const [userId, setUserId] = useState('')

  return (
    <TwoFactorVerify
      open={showTwoFactor}
      userId={userId}
      onVerified={(rememberDevice) => {
        // Complete login
      }}
      onCancel={() => setShowTwoFactor(false)}
    />
  )
}