# Analyse des améliorations prioritaires — chat-widget

Date d'analyse : 2026-04-28

## P0 — Priorité critique (sécurité, confidentialité, robustesse)

1. **Réduire/masquer les logs sensibles dans `webhook-proxy`**
   - Le proxy journalise des payloads complets (messages utilisateurs, user_id, contenu brut webhook), ce qui augmente les risques RGPD et d'exposition de données.
   - Action : passer à un logging structuré avec redaction (`message` tronqué/hashé, suppression des IDs sensibles en production, niveaux de logs par environnement).

2. **Durcir l'identité utilisateur et la persistance cookie**
   - L'UUID client est généré via `Math.random()` (faible entropie) et la valeur cookie JSON n'est pas encodée.
   - Action : utiliser `crypto.randomUUID()` (fallback propre si indisponible), encoder/décoder les cookies (`encodeURIComponent` / `decodeURIComponent`) et documenter la durée de conservation.

3. **Empêcher les collisions d'historique entre bots/sites**
   - L'historique localStorage est stocké sous une clé globale (`chatyx_history`) non scindée par `botId`, ce qui peut mélanger des conversations entre instances.
   - Action : namespace par bot + domaine (ex. `chatyx_history:${origin}:${botId}`), prévoir migration douce des anciennes clés.

## P1 — Priorité élevée (qualité produit, accessibilité, maintenabilité)

4. **Ajouter un cycle de vie propre du widget (cleanup listeners)**
   - Le widget ajoute des listeners globaux (`window`, `document`, `visualViewport`) sans mécanisme de destruction ; en multi-init, risque de fuites et comportements dupliqués.
   - Action : exposer `destroy()` (removeEventListener + suppression DOM), et protéger contre double initialisation.

5. **Améliorer l'accessibilité (A11y)**
   - Plusieurs contrôles interactifs sont des `<div>` cliquables et l'input n'a pas de label explicite, ce qui dégrade navigation clavier/lecteurs d'écran.
   - Action : utiliser des `<button>` natifs, `aria-label` sur actions, gestion `Enter/Space`, label associé au champ de saisie.

6. **Découper `widget.js` (actuellement monolithique)**
   - Le module central concentre rendu, réseau, état, animations et consentement, ce qui freine l'évolution et augmente la surface de régression.
   - Action : extraire en sous-modules (UI renderer, transport, state store, consent, unread badge, events), puis renforcer tests unitaires ciblés.

7. **Durcir la gestion réseau côté front**
   - `fetchBotConfig()` ne bénéficie pas de retry/timeout ; `sendAndFetch()` ne distingue pas clairement les classes d'erreurs.
   - Action : timeout via `AbortController`, retries bornés, mapping d'erreurs métier (quota, 4xx, 5xx, réseau) vers messages UX dédiés.

## P2 — Priorité moyenne (performance, UX, observabilité)

8. **Limiter/compacter l'historique local**
   - L'historique est append-only sans plafond explicite ; peut gonfler localStorage et ralentir rendu sur sessions longues.
   - Action : cap (ex. 100-300 messages), purge FIFO, option de résumé compressé côté backend si nécessaire.

9. **Uniformiser l'internationalisation et la qualité des messages d'erreur**
   - Le code mélange messages console FR/EN et réponses d'erreur génériques.
   - Action : centraliser catalogues erreurs et traces, distinguer messages dev vs utilisateur.

10. **Mettre en place des garde-fous produit/qualité**
    - Couverture test solide sur utilitaires, mais peu de tests d'intégration DOM du widget complet.
    - Action : ajouter tests d'intégration (ou e2e légers) sur flux critiques : consentement, streaming, quotas, reconnect, thème, carousel.

---

## Plan d'implémentation recommandé

- **Sprint 1 (P0)** : logs/redaction + UUID/cookie + namespace historique.
- **Sprint 2 (P1)** : cleanup lifecycle + A11y + fiabilisation réseau.
- **Sprint 3 (P1/P2)** : refactor modulaire `widget.js` + tests d'intégration.
- **Sprint 4 (P2)** : optimisation historique, observabilité, UX erreurs.

## KPIs de suivi

- Taux d'erreurs front (réseau/streaming) et temps moyen de réponse.
- Taille moyenne de `localStorage` par session et temps de rendu initial.
- Score accessibilité (Lighthouse / axe) et taux d'usage clavier.
- Nombre d'incidents liés aux logs sensibles / conformité RGPD.