DangerZone

Composant de zone dangereuse pour la suppression irréversible de toutes les transactions. Implémente un double mécanisme de confirmation : modal + checkbox obligatoire avant d'activer le bouton de suppression.

Source : src/components/ui/danger-zone.tsx

Aucune prop

DangerZone est autocontenu — il gère son propre état de modal et appelle deleteAllTransactions.

<DangerZone />

Flux d'interaction

Bouton "Supprimer toutes les transactions"
  └── Ouvre modal de confirmation
        ├── Affiche avertissement irréversible
        ├── Checkbox "Je comprends..." (obligatoire)
        └── Bouton "Supprimer définitivement" (désactivé tant que checkbox non cochée)
              ├── En cours → spinner
              ├── Succès → message vert + fermeture auto après 1.5 s
              └── Erreur → message rouge

Garde-fous UX

• Checkbox requise : le bouton de suppression reste disabled tant que l'utilisateur n'a pas coché explicitement
• Fermeture pendant l'action : cliquer en dehors de la modal est bloqué pendant isPending
• Couleurs : bouton trigger en rouge atténué (rgba(239,68,68,0.1)) — signal danger sans agressivité visuelle permanente

À ne pas faire

• Ne pas retirer la checkbox de confirmation — c'est la seule protection contre les suppressions accidentelles
• Ne pas ajouter d'autres actions destructives dans ce composant — créer un composant séparé par action

Voir aussi

• PasswordForm
• Règles — Transactions