diff --git a/.copilot-instructions.md b/.copilot-instructions.md new file mode 100644 index 0000000..f0b7dce --- /dev/null +++ b/.copilot-instructions.md @@ -0,0 +1,127 @@ +# Instructions pour Copilot - Espace Paie Odentas + +## 📋 Context du Projet + +**Nom du projet** : Nouvel Espace Paie Odentas +**Type** : Application Web Next.js 14 (Full-Stack) +**Langage principal** : TypeScript + React +**Base de donnĂ©es** : Supabase (PostgreSQL) +**Authentification** : Supabase Auth + 2FA TOTP +**HĂ©bergement** : Vercel (rĂ©gion cdg1 - Paris) + +## 🎯 Architecture du Projet + +### Stack Technologique +- **Frontend** : Next.js 14, React 18, TypeScript, Tailwind CSS +- **Backend** : Next.js API Routes, TypeScript +- **Authentification** : Supabase Auth, TOTP 2FA +- **Base de donnĂ©es** : Supabase PostgreSQL +- **Stockage** : AWS S3, Supabase Storage +- **Signatures Ă©lectroniques** : Docuseal +- **Analytics** : PostHog +- **PDF** : PDFMonkey + +### Structure des Dossiers +``` +/app → Next.js App Router (pages et layouts) +/app/api → API Routes (devraient ĂȘtre sur cdg1 dans vercel.json) +/components → Composants React rĂ©utilisables +/lib → Utilitaires et helpers +/hooks → Hooks React personnalisĂ©s +/templates-mails → Templates d'emails HTML +/public → Assets statiques +``` + +## 🔑 Points Importants + +### 1. Authentification & SĂ©curitĂ© +- Toujours utiliser `createRouteHandlerClient` pour les routes API +- Le 2FA TOTP est activable mais optionnel +- Les statuts MFA sont : "verified" (activĂ©) et autres (dĂ©sactivĂ©) +- **Important** : Comparer avec `!== "verified"` au lieu de `=== "unverified"` (le type n'existe pas) + +### 2. Configuration Vercel +- **RĂ©gion des Functions API** : cdg1 (Paris) - À MAINTENIR dans vercel.json +- Les functions ne doivent PAS ĂȘtre sur iad1 (risque de panne) +- Configuration dans `vercel.json` : + ```json + "regions": ["cdg1"] + ``` + +### 3. Base de DonnĂ©es +- Tables principales : + - `profiles` → Utilisateurs + - `organizations` → Entreprises/clients + - `employees` → SalariĂ©s + - `contracts` → Contrats CDDU et RG + - `payslips` → Fiches de paie + - `cotisations` → Cotisations mensuelles + - `salary_transfers` → Virements salaires + +### 4. RĂ©gimes de Contrats +- **CDDU** : CDD d'usage (intermittents du spectacle) + - `CDDU_MONO` : Mono-mois + - `CDDU_MULTI` : Multi-mois +- **RG** : RĂ©gime GĂ©nĂ©ral (salaires classiques) + +### 5. Composants ClĂ©s + +#### Formulaire CDDU +- Fichier : `components/contrats/NouveauCDDUForm.tsx` +- Contient un bouton calculatrice pour saisir les montants +- Utilise le composant `Calculator` pour les calculs +- Support des deux rĂ©gimes (CDDU et RG) + +#### Calculatrice +- Fichier : `components/Calculator.tsx` +- Modale draggable avec focus +- **Important** : VĂ©rifier que le focus ne capture pas les autres champs +- Utiliser `calculatorRef.current.contains(document.activeElement)` pour vĂ©rifier le focus + +### 6. Hooks PersonnalisĂ©s +- `useDemoMode()` → Mode dĂ©mo activĂ©/dĂ©sactivĂ© +- `usePageTitle()` → DĂ©finir le titre de la page +- `usePostHog()` → Analytics PostHog + +## ✅ Standards de Code + +### TypeScript +- Toujours dĂ©finir les types explicitement +- Utiliser les enums pour les statuts +- Valider les types de statuts MFA avec `!==` plutĂŽt que `===` +- JAMAIS d'emojis dans le code (commentaires, messages, etc.) + +### Composants React +- Utiliser "use client" pour les composants interactifs +- PrĂ©fĂ©rer les fonctions pures +- Gestion du focus : vĂ©rifier que le focus est bien sur l'Ă©lĂ©ment avant de capturer les Ă©vĂ©nements +- Pour l'UI/UX : Uniquement des icĂŽnes Lucide React (depuis `lucide-react`) +- JAMAIS d'emojis dans l'interface utilisateur + +### Styling +- Utiliser Tailwind CSS avec les utilitaires de base +- Palette de couleurs : slate, indigo, orange, green, red +- RĂ©utiliser les classes composables (flex, gap, etc.) + +## 🐛 Corrections RĂ©centes + +- Ajout du bouton calculatrice au formulaire CDDU +- Correction des comparaisons de statut MFA (unverified → !== "verified") +- Correction du focus trap de la calculatrice +- Migration des API Functions de iad1 vers cdg1 + +## 📝 Conventions de Commit + +- `feat:` → Nouvelle fonctionnalitĂ© +- `fix:` → Correction de bug +- `chore:` → TĂąche de maintenance +- `style:` → Changements de style uniquement +- `refactor:` → Refactorisation de code + +## ⚠ Points d'Attention + +1. **RĂ©gion Vercel** : Toujours vĂ©rifier que cdg1 est dĂ©fini dans vercel.json +2. **Authentification** : Ne jamais exposer les tokens en client-side +3. **Focus management** : Toujours vĂ©rifier le focus avant de capturer les Ă©vĂ©nements clavier +4. **Typage MFA** : Utiliser `!== "verified"` pour les comparaisons, jamais `=== "unverified"` +5. **Build local** : Tester avec `npm run build` avant de pousser