diff --git a/FIX_2FA_INPUT_SIZE.md b/FIX_2FA_INPUT_SIZE.md new file mode 100644 index 0000000..1e2f0ae --- /dev/null +++ b/FIX_2FA_INPUT_SIZE.md @@ -0,0 +1,67 @@ +# Correction : EncadrĂ©s 2FA trop grands sur la page de connexion + +## 🐛 ProblĂšme + +Sur la page de connexion (`/signin`), lors de la saisie du code 2FA (authentification Ă  deux facteurs), les encadrĂ©s pour les 6 chiffres Ă©taient beaucoup trop grands par rapport aux encadrĂ©s utilisĂ©s pour le code OTP par email. + +## 🔍 Cause + +Les inputs du 2FA utilisaient la classe CSS `flex-1` qui les rendait extensibles pour remplir tout l'espace disponible, combinĂ© avec `justify-between` au lieu de `justify-center`. + +**Code problĂ©matique** : +```tsx +
+ +
+``` + +## ✅ Solution + +Alignement du style des inputs 2FA sur celui des inputs OTP en utilisant : +- Des largeurs fixes (`w-12 sm:w-14` + style inline `width: 3rem`) +- `justify-center` au lieu de `justify-between` +- Les mĂȘmes classes de style pour une apparence cohĂ©rente + +### Changements apportĂ©s + +**Fichier** : `/app/signin/page.tsx` + +#### Avant : +```tsx +
+ +
+``` + +#### AprĂšs : +```tsx +
+ +
+``` + +## 🎯 AmĂ©liorations + +- ✅ EncadrĂ©s 2FA de taille fixe (3rem / ~48px) +- ✅ CohĂ©rence visuelle entre OTP et 2FA +- ✅ CentrĂ©s sur la page au lieu d'ĂȘtre Ă©tirĂ©s +- ✅ MĂȘme espacement et style que les inputs OTP +- ✅ Meilleure lisibilitĂ© et UX + +## 📾 DiffĂ©rences visuelles + +### Avant +- Inputs 2FA : Largeur flexible (trop large) +- Distribution : `justify-between` (Ă©talĂ©s sur toute la largeur) + +### AprĂšs +- Inputs 2FA : Largeur fixe de 3rem chacun +- Distribution : `justify-center` (centrĂ©s et groupĂ©s) +- Style identique aux inputs OTP pour cohĂ©rence diff --git a/FIX_PASSWORD_DECONNEXION.md b/FIX_PASSWORD_DECONNEXION.md new file mode 100644 index 0000000..500e298 --- /dev/null +++ b/FIX_PASSWORD_DECONNEXION.md @@ -0,0 +1,68 @@ +# Correction : DĂ©connexion automatique lors de la crĂ©ation d'un mot de passe + +## 🐛 ProblĂšme + +Lorsqu'un utilisateur crĂ©ait ou mettait Ă  jour son mot de passe via la page **Compte > SĂ©curitĂ©**, il Ă©tait automatiquement dĂ©connectĂ© de son compte. + +## 🔍 Cause + +L'API `/api/auth/password-update` utilisait la mĂ©thode `admin.auth.admin.updateUserById()` de Supabase (Admin API) pour modifier le mot de passe. + +**Comportement de Supabase** : Par dĂ©faut, pour des raisons de sĂ©curitĂ©, l'Admin API **invalide automatiquement toutes les sessions actives** d'un utilisateur lorsqu'on modifie son mot de passe. Ce comportement assume qu'un changement de mot de passe doit forcer une reconnexion. + +## ✅ Solution + +Remplacement de l'Admin API par la mĂ©thode `supabase.auth.updateUser()` qui permet de mettre Ă  jour le mot de passe **sans invalider la session active**. + +### Changements apportĂ©s + +**Fichier** : `/app/api/auth/password-update/route.ts` + +#### Avant : +```typescript +// Utilisation de l'Admin API (invalide la session) +const admin = createClient(url, serviceKey); +const { error: updErr } = await admin.auth.admin.updateUserById(userId, { + password: newPassword, + user_metadata: { + ...session.user.user_metadata, + hasPassword: true + } +}); +``` + +#### AprĂšs : +```typescript +// Utilisation de updateUser() (prĂ©serve la session) +const { error: updErr } = await supabase.auth.updateUser({ + password: newPassword, + data: { + ...session.user.user_metadata, + hasPassword: true + } +}); +``` + +## 🎯 RĂ©sultat + +- ✅ L'utilisateur peut crĂ©er/modifier son mot de passe sans ĂȘtre dĂ©connectĂ© +- ✅ La session reste active aprĂšs la mise Ă  jour +- ✅ L'email de confirmation est toujours envoyĂ© +- ✅ Toutes les validations de sĂ©curitĂ© du mot de passe sont conservĂ©es + +## 📝 Notes techniques + +- **`updateUser()`** : Met Ă  jour les informations de l'utilisateur authentifiĂ© via sa session active +- **`admin.updateUserById()`** : Met Ă  jour un utilisateur via l'Admin API (invalide toutes les sessions pour sĂ©curitĂ©) + +La mĂ©thode `updateUser()` est appropriĂ©e ici car : +1. L'utilisateur est authentifiĂ© et modifie son propre mot de passe +2. Il n'y a pas de raison de le dĂ©connecter immĂ©diatement +3. C'est une action volontaire de l'utilisateur (pas une rĂ©cupĂ©ration de mot de passe compromise) + +## 🔒 SĂ©curitĂ© + +Le changement de mot de passe reste sĂ©curisĂ© : +- Validation stricte du mot de passe (12+ caractĂšres, majuscules, minuscules, chiffres, caractĂšres spĂ©ciaux) +- Email de confirmation envoyĂ© +- L'utilisateur doit ĂȘtre authentifiĂ© pour accĂ©der Ă  cette API diff --git a/app/(app)/simulateur/page.tsx b/app/(app)/simulateur/page.tsx new file mode 100644 index 0000000..f84a0e2 --- /dev/null +++ b/app/(app)/simulateur/page.tsx @@ -0,0 +1,118 @@ +"use client"; + +import React from 'react'; +import { usePageTitle } from '@/hooks/usePageTitle'; +import { Calculator } from 'lucide-react'; + +export default function SimulateurPage() { + usePageTitle("Simulateur de paie"); + + return ( +
+ + + {/* En-tĂȘte */} +
+
+ +

Simulateur de paie intermittent

+
+

+ Calculez le coût de recrutement d'un intermittent du spectacle (CDDU) +

+
+ + {/* Layout 2 colonnes : simulateur Ă  gauche, cards info Ă  droite */} +
+ + {/* Colonne principale : Simulateur en iframe */} +
+