KentuckySato/crazee-burger

F06 - Create Admin button

Closed this issue · 0 comments

✅ Règles métier

  • Quand l'utilisateur arrive sur la page de commande, il voit dans la navbar un bouton admin qui affiche "ACTIVER LE MODE ADMIN".
  • Quand l'utilisateur clique sur le bouton admin pour la première fois, le bouton change et affiche alors "DÉSACTIVER LE MODE ADMIN" et une pop-up / toast de notification apparait en bas à droite de l'écran pour l'informer qu'il est entré en mode admin avec en message "Mode admin activé".
  • Le toast de notification n'apparait QUE lorsque l'utilisateur passe du mode NON ADMIN au mode ADMIN.
  • Quand l'utilisateur re-clique sur le bouton admin, le bouton re-change et ré-affiche "ACTIVER LE MODE ADMIN".
  • Quand l'utilisateur recharge la page, le bouton revient sur sa position initiale (le bouton admin affiche "ACTIVER LE MODE ADMIN")

🎨 Assets

  • Maquette prototype (i.e. vidéo maquette)
  • Maquette avec les dimensions
  • Pour la pop-up de notifications : utiliser la librairie react-toastify
  • Un collègue qui a entendu parler de votre ticket vous informe qu'il a déjà codé un composant, ToggleButton.js, qui ressemble à votre boutton admin - il vous fourni le code dans les assets (qu'est-ce qu'il est sympa !). Il vous précise en plus que le bouton se sert du même design system que celui du projet Crazee Burger ! Décidément, quel collègue en or !
  • Pris par le temps, il vous a aussi laissé plusieurs fichiers avec du code à l'intérieur qu'il a précisé être très utile pour la réalisation du ticket mais sans vous expliquer à quoi cela pourrait servir exactement ni comment (il devait partir en urgence à une compétition de match Pokémon très importante). Le code en question est disponible dans les fichiers "codeMystère.txt" et "NavbarRightSideIncomplet.js"

#16
https://crazee-burger-5fvcsjtg1-kentuckyss.vercel.app