# Page Signature Salarié Unifiée - Contrats et Avenants ## Résumé La page `/signature-salarie` a été adaptée pour gérer à la fois les **contrats CDDU** et les **avenants**, offrant une expérience unifiée au lieu de créer deux pages séparées. ## Modifications réalisées ### 1. API Routes #### `/api/signature-salarie/check-status` (route.ts) - ✅ **Recherche dans les deux tables** : 1. Cherche d'abord dans `cddu_contracts` via `employee_docuseal_slug` 2. Si non trouvé, cherche dans `avenants` via `employee_docuseal_slug` - ✅ **Nouveau champ retourné** : `documentType` ('contrat' ou 'avenant') - ✅ **Gestion des données** : - Pour les contrats : utilise directement les champs du contrat - Pour les avenants : utilise les données du contrat parent via la relation - ✅ **Variables unifiées** : - `employeeId`, `orgId`, `docusealSubmissionId`, `pdfS3Key`, `documentId` - Permet de gérer les deux types de documents avec le même code #### `/api/signature-salarie/verify-birthdate` (route.ts) - ✅ **Recherche dans les deux tables** : 1. Cherche d'abord dans `cddu_contracts` 2. Si non trouvé, cherche dans `avenants` avec jointure sur `cddu_contracts` - ✅ **Récupération du salarié** : - Utilise `employeeId` extrait du contrat ou de l'avenant - Vérifie la date de naissance de manière identique pour les deux types ### 2. Composants UI #### `SignatureSalarieContent.tsx` - ✅ **État `signatureData` étendu** : ```typescript { contract: any; signed_at: string | null; downloadUrl: string | null; documentType?: 'contrat' | 'avenant'; // Nouveau } ``` - ✅ **Titre dynamique** : - "Signature électronique - Contrat" ou "Signature électronique - Avenant" - ✅ **Props transmis** : - `AlreadySignedCard` et `ToSignCard` reçoivent `documentType` #### `AlreadySignedCard.tsx` - ✅ **Nouveau prop** : `documentType?: 'contrat' | 'avenant'` - ✅ **Textes adaptés** : - Header : "Contrat signé" → "Avenant signé" (selon le type) - Message : "Vous avez signé électroniquement ce contrat." → "...cet avenant." #### `ToSignCard.tsx` - ✅ **Nouveau prop** : `documentType?: 'contrat' | 'avenant'` - ✅ **Textes adaptés** : - Alerte : "Contrat en attente de signature" → "Avenant en attente..." - Instructions : "...prendre connaissance du contrat..." → "...de l'avenant..." - Section : "Détails du contrat" → "Détails de l'avenant" - Bouton : "Voir et signer votre contrat" → "Voir et signer votre avenant" ### 3. Webhook #### `/api/webhooks/docuseal-amendment` (route.ts) - ✅ **Lien de signature** : - Redirige vers : `https://paie.odentas.fr/signature-salarie/?docuseal_id=xxx` - Utilise la même page que les contrats ## Architecture ``` ┌─────────────────────────────────────────────────┐ │ /signature-salarie/?docuseal_id=xxx │ └─────────────────────────────────────────────────┘ │ ▼ ┌────────────────────────────────────┐ │ SignatureSalarieContent.tsx │ │ - Vérifie le statut │ │ - Affiche modal de vérification │ └────────────────────────────────────┘ │ ▼ ┌────────────────────────────────────┐ │ /api/signature-salarie/ │ │ check-status │ │ │ │ 1. Cherche dans cddu_contracts │ │ 2. Sinon cherche dans avenants │ │ 3. Retourne documentType │ └────────────────────────────────────┘ │ ┌───────────┴───────────┐ ▼ ▼ ┌──────────────────┐ ┌──────────────────┐ │ AlreadySignedCard│ │ ToSignCard │ │ + documentType │ │ + documentType │ │ │ │ │ │ "Avenant signé" │ │ "Signer avenant" │ └──────────────────┘ └──────────────────┘ ``` ## Base de données ### Tables impliquées #### `cddu_contracts` - Champ utilisé : `employee_docuseal_slug` - Contient : Les contrats CDDU classiques #### `avenants` - Champ utilisé : `employee_docuseal_slug` - Relation : `cddu_contracts` (foreign key) - Contient : Les avenants aux contrats existants ### Requêtes Supabase **Recherche de contrat :** ```typescript const { data: contract } = await supabase .from('cddu_contracts') .select('*') .eq('employee_docuseal_slug', docuseal_id) .maybeSingle(); ``` **Recherche d'avenant :** ```typescript const { data: avenant } = await supabase .from('avenants') .select(` *, cddu_contracts!inner ( employee_id, contract_number, ... ) `) .eq('employee_docuseal_slug', docuseal_id) .maybeSingle(); ``` ## Tests à effectuer ### Test 1 : Signature d'un contrat classique 1. ✅ Envoyer un contrat CDDU à un salarié 2. ✅ Le salarié reçoit un email avec lien `/signature-salarie/?docuseal_id=xxx` 3. ✅ La page affiche "Contrat" dans le titre 4. ✅ Le salarié signe 5. ✅ La page affiche "Contrat signé" ### Test 2 : Signature d'un avenant 1. ✅ Envoyer un avenant à un salarié (depuis l'interface Staff) 2. ✅ L'employeur signe l'avenant 3. ✅ Le salarié reçoit un email avec lien `/signature-salarie/?docuseal_id=xxx` 4. ✅ La page affiche "Avenant" dans le titre 5. ✅ Les textes sont adaptés ("Signer votre avenant") 6. ✅ Le salarié signe 7. ✅ La page affiche "Avenant signé" ### Test 3 : Vérification date de naissance 1. ✅ Pour un contrat : vérifie dans `cddu_contracts` → `salaries` 2. ✅ Pour un avenant : vérifie dans `avenants` → `cddu_contracts` → `salaries` 3. ✅ Date de naissance correcte : accès autorisé 4. ✅ Date de naissance incorrecte : accès refusé ## Avantages de l'approche unifiée ### ✅ Avantages 1. **UX cohérente** : Même expérience pour contrats et avenants 2. **Moins de code** : Pas de duplication de pages 3. **Maintenance simplifiée** : Une seule page à maintenir 4. **Évolutivité** : Facile d'ajouter d'autres types de documents ### ⚠️ Points d'attention 1. **TypeScript** : Vérifier que `documentType` est toujours défini 2. **Tests** : Tester les deux flux (contrat ET avenant) 3. **Logs** : Vérifier que les logs distinguent bien contrat/avenant ## Commit ``` feat: Page signature-salarie adaptée pour contrats et avenants - check-status: cherche dans cddu_contracts ET avenants - verify-birthdate: cherche dans les deux tables - Retourne documentType ('contrat' ou 'avenant') - UI adaptée: AlreadySignedCard et ToSignCard affichent le type - Titre dynamique: 'Contrat' ou 'Avenant' selon le document - Textes adaptés: 'Voir et signer votre avenant/contrat' ``` **Hash** : `58e8fa4` ## Prochaines étapes suggérées 1. ✅ Tester le flux complet avec un avenant réel 2. ⏳ Ajouter des analytics PostHog pour tracker les signatures d'avenants 3. ⏳ Créer une page de liste des avenants signés (côté salarié) 4. ⏳ Ajouter des notifications push pour les avenants en attente --- **Date de création** : $(date +%Y-%m-%d) **Auteur** : GitHub Copilot **Version** : 1.0