Created three complete 2FA components integrating with existing backend endpoints: 1. TwoFactorSetup.tsx (auth/components) - 3-step wizard for 2FA setup - QR code display with manual entry fallback - TOTP code verification - Backup codes display with copy functionality - Integrates with POST /auth/2fa/setup and /auth/2fa/enable 2. TwoFactorVerifyModal.tsx (auth/components) - Modal for 2FA verification during login - Support for both TOTP (6 digits) and backup codes (8 digits) - Auto-submit for TOTP codes - Switch between code types - Auto-focus input field 3. TwoFactorSettings.tsx (settings/components) - Management panel for 2FA in settings - Enable/disable 2FA with confirmation - Regenerate backup codes - Status display with activation date - Integrates with all 2FA endpoints All components follow project patterns: - Tailwind CSS styling matching existing components - lucide-react icons - Centralized apiClient with auto-refresh - Complete TypeScript types - No placeholders or TODOs Related: GAP-P1-004 2FA Frontend Flow Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| __tests__ | ||
| components | ||
| hooks | ||
| lib | ||
| modules | ||
| services | ||
| stores | ||
| styles | ||
| types | ||
| App.tsx | ||
| main.tsx | ||
| vite-env.d.ts | ||