# Résumé des Corrections - Signatures DocuSeal

## Date: 14 octobre 2025

## Problème identifié

❌ **Erreur** : `Unable to find form with slug 'mj9RzzWW2LbvnT?data-allow-typed-signature=false'`

**Cause** : Les paramètres `data-*` étaient ajoutés à l'URL du slug DocuSeal, ce qui causait une erreur 404.

## Solution implémentée

Les attributs `data-*` de DocuSeal doivent être passés comme **attributs HTML** sur le composant `<docuseal-form>`, **pas dans l'URL** `data-src`.

### ✅ Modifications effectuées

#### 1. Composant `<docuseal-form>` 

**Fichiers modifiés** :
- `/app/(app)/contrats/[id]/page.tsx`
- `/app/(app)/signatures-electroniques/page.tsx`

**Avant** (❌ incorrect) :
```tsx
<docuseal-form
  data-src="https://docuseal.eu/s/mj9RzzWW2LbvnT?data-allow-typed-signature=false">
</docuseal-form>
```

**Après** (✅ correct) :
```tsx
<docuseal-form
  data-src="https://docuseal.eu/s/mj9RzzWW2LbvnT"
  data-language="fr"
  data-with-title="false"
  data-background-color="#fff"
  data-allow-typed-signature="false">
</docuseal-form>
```

#### 2. Génération des URLs propres

**Fichiers modifiés** :
- `/app/(app)/contrats/[id]/page.tsx` (lignes ~703-710, ~736-744)
- `/app/(app)/signatures-electroniques/page.tsx` (lignes ~203-218, ~243-251)
- `/app/api/docuseal-signature/route.ts` (lignes ~225-233)

**Changement** : Les URLs DocuSeal sont maintenant générées **sans paramètres de requête**.

```typescript
// ✅ Correct
embed = `https://docuseal.eu/s/${docusealId}`;

// ❌ Ancien (incorrect)
embed = `https://docuseal.eu/s/${docusealId}?data-allow-typed-signature=false`;
```

## État actuel de la fonctionnalité

### ✅ Désactivation de la saisie manuelle

**Statut** : Implémenté et fonctionnel

L'attribut `data-allow-typed-signature="false"` est ajouté sur le composant `<docuseal-form>` dans :
- Page de détail d'un contrat (`/contrats/[id]`)
- Page des signatures électroniques (`/signatures-electroniques`)

### ⏳ Pré-remplissage de la signature (EN COURS)

**Statut** : Implémentation partielle

**Ce qui fonctionne** :
- ✅ Colonne `signature_b64` créée dans `organization_details`
- ✅ L'API récupère la signature depuis la base de données
- ✅ Le paramètre `orgId` est passé depuis les composants

**Ce qui reste à faire** :
- [ ] Ajouter `data-signature` dynamiquement sur `<docuseal-form>`
- [ ] Récupérer la signature côté client ou la passer via le serveur
- [ ] Tester avec une vraie signature base64

## Comment tester

### Test 1 : Désactivation de la saisie manuelle

1. Créer une nouvelle signature électronique depuis :
   - `/staff/contrats/[id]` (bouton "Lancer signature électronique")
   - Ou `/staff/contrats` (sélection multiple + signature groupée)

2. Ouvrir le lien de signature (en tant qu'employeur)

3. **Vérifier** :
   - ❌ L'option "Saisir" ne doit PAS être disponible
   - ✅ Les options "Dessiner" et "Charger" doivent être disponibles

### Test 2 : Pré-remplissage de la signature (à venir)

1. Ajouter une signature dans la base :
```sql
UPDATE organization_details 
SET signature_b64 = 'data:image/png;base64,iVBORw0KG...'
WHERE org_id = 'VOTRE_ORG_ID';
```

2. Créer une signature électronique pour un contrat de cette organisation

3. **Vérifier** :
   - La signature devrait être pré-remplie pour l'employeur
   - L'employeur peut la valider ou la remplacer

## Prochaines étapes

### Pour le pré-remplissage de la signature

**Option A** : Via l'API DocuSeal (recommandé)
- Utiliser le paramètre `values` lors de la création de la soumission
- Nécessite de connaître le nom exact du champ de signature dans le template

**Option B** : Côté client
- Récupérer la signature depuis Supabase côté client
- L'injecter dans l'attribut `data-signature` du composant
- Plus complexe mais plus flexible

**Option C** : URL encode dans signature_link
- Stocker la signature encodée dans le lien de signature
- L'extraire et l'ajouter dynamiquement au composant
- Limite de taille d'URL potentielle

## Documentation de référence

- **DocuSeal Embed Documentation** : https://docs.docuseal.co/embed
- **Attributs data-*** :
  - `data-allow-typed-signature`: boolean (default: true)
  - `data-signature`: string (base64, URL, ou texte)
  - `data-language`: string (ex: "fr")
  - `data-with-title`: boolean
  - `data-background-color`: string

## Notes importantes

⚠️ Les attributs `data-*` de DocuSeal sont des **attributs HTML**, pas des paramètres d'URL.

⚠️ L'URL `data-src` doit pointer vers le slug DocuSeal pur sans query parameters.

⚠️ Pour le pré-remplissage, le format base64 doit être complet : `data:image/png;base64,...`