Us Perso ‐ modifier le profil - loyde07/RDI25 GitHub Wiki

- Us Perso USR04 - En tant que joueur, je souhaite modifier mes informations afin de garder mon profil à jour

Code USR04

Liens vers le commit: de la user story USR04

Liens vers la User story : USR04

Valeur pour le client

Permet à un joueur/utilisateur connecté de corriger ou mettre à jour ses informations personnelles (nom, prénom, pseudo, mot de passe), ce qui est indispensable dans une app moderne respectant les bonnes pratiques de gestion de compte.

Description complète

Cette User Story permet à un utilisateur authentifié de modifier les informations de son profil via une interface dédiée.

  • Accessible uniquement aux utilisateurs connectés.
  • Affiche un formulaire pré-rempli avec les informations actuelles.
  • Permet de modifier :
    • nom
    • prénom
    • pseudo
    • mot de passe (optionnel avec confirmation)
  • En cas de succès, redirection vers le dashboard.
  • Affichage d’erreurs en cas de mot de passe non confirmé ou autre échec backend.
  • Sécurisé via un token JWT (authentification obligatoire).
  • Met à jour les données dans la base via une API PUT /updateProfile.
  • la possibilité d'annuler la modification en cours.

Maquette

Page de compte utilisateur

/dashboard

Accessible une fois l'utilisateur inscrit, authentifier et connecté

  • image
    • l'icone qui permet d'importer une image, pour la photo de profile
    • un bouton modifier profile pour accéder à la page dédié

Page de modification du profil

/editProfile

Accéssible depuis la page de profil

  • image
    • On y trouve les différents champs à modifier qui correspondent aux données de l'utilisateur
    • les champs sont préremplis par les données de l'utilisateur
    • la confirmation par double mot de passe
    • Une mesure de la force du mot de passe mis à jour
    • Un bouton pour annuler les modification et retourner à la page de profile

Références / Dépendances

  • Dépend de :
    • USR01(inscription en tant que visiteur)
    • USR02 (Connexion utilisateur)
    • USR03 (Consultation du compte utilisateur)

Critères d’acceptation (scénarios)

  • Connexion requise: L’utilisateur ne peut accéder à la page que s’il est connecté
  • Formulaire pré-rempli: Le formulaire affiche les infos actuelles
  • Modification réussie: Si les champs sont valides, les données sont mises à jour en base
  • Mot de passe cohérent: Si un nouveau mot de passe est saisi, confirmPassword doit correspondre
  • Feedback utilisateur: Messages de succès ou d’erreur affichés via toast
  • Redirection: Après mise à jour, redirection vers /dashboard

Découpage en tâches techniques

Créer la route PUT /updateProfile

  • Sécurisée par verifyToken, récupère l’ID utilisateur depuis le token et met à jour les champs reçus

  • modules : JWT, express

Implémenter le controller updateProfile

  • Met à jour en base après validation, hash le mot de passe si fourni

  • modules: bcrypt, mongoose

Créer le formulaire React

  • Affiche les données actuelles dans les inputs

  • module: AuthContext

Gérer l’envoi avec handleUpdateProfile

  • Vérifie les mots de passe, appelle la méthode API

  • module: axios

Ajouter la méthode updateProfile() dans le store Zustand

  • Met à jour le state global après succès

  • module: Zustand, axios

Affichage des feedbacks

  • Messages de succès ou d’erreur via toast

-module: Zustand, Toast

Complexité et durée estimée

  • Complexité : moyenne
  • Durée estimée : 1 journée complète (6–8h)
    • Frontend : ~3h
    • Backend : ~2h

Analyse et testing

Présentation vidéo