story-research-zapwall/features/account-creation-buttons-separation.md
2025-12-28 21:40:46 +01:00

53 lines
2.4 KiB
Markdown

# Account Creation Buttons Separation
**Date**: December 2024
**Auteur**: Équipe 4NK
## Objectif
Remplacer le bouton unique "Créer un compte ou importer une clé" par deux boutons distincts "Générer un nouveau compte" et "Importer une clé existante" pour améliorer la clarté de l'interface utilisateur.
## Motivations
- Améliorer la clarté de l'interface utilisateur
- Permettre aux utilisateurs de choisir directement l'action souhaitée sans étape intermédiaire
- Réduire le nombre de clics nécessaires pour accéder à la fonctionnalité d'import
## Modifications
### Composants modifiés
1. **components/CreateAccountModal.tsx** :
- Ajout d'une prop optionnelle `initialStep` pour permettre d'initialiser la modal directement au step 'import' ou 'choose'
- Modification du hook `useAccountCreation` pour accepter un paramètre `initialStep` avec valeur par défaut 'choose'
2. **components/AuthorPresentationEditor.tsx** :
- Refactorisation du composant `NoAccountView` pour afficher deux boutons distincts
- Extraction des boutons dans un composant séparé `NoAccountActionButtons` pour respecter la limite de lignes de fonction (max-lines-per-function)
- Ajout de la gestion d'état pour déterminer quel step de la modal afficher
- Suppression du paramètre `connected` inutilisé dans `AuthorPresentationFormView`
### Structure du code
- `NoAccountActionButtons` : Composant réutilisable pour les boutons d'action
- `NoAccountView` : Gère l'état de la modal et détermine quel step afficher
## Modalités de déploiement
Aucun déploiement spécial nécessaire. Les modifications sont purement frontend et seront déployées avec la prochaine version de l'application.
## Modalités d'analyse
### Vérifications à effectuer
1. Tester que le bouton "Générer un nouveau compte" ouvre la modal avec le step 'choose'
2. Tester que le bouton "Importer une clé existante" ouvre directement la modal avec le step 'import'
3. Vérifier que le comportement de la modal reste inchangé une fois ouverte
4. Vérifier que les autres usages de `CreateAccountModal` (dans `ConnectButton.tsx`) fonctionnent correctement avec la prop optionnelle
### Points d'attention
- La prop `initialStep` est optionnelle et rétrocompatible
- Le composant `NoAccountActionButtons` respecte la limite de lignes de fonction
- La fonction `NoAccountView` respecte la limite de 40 lignes après refactorisation