[FEATURE] Ajout du nouveau formulaire de connexion Pix App (PIX-14002)

[bpetetot]

🦄 Problème

Dans le cadre du nouveau design des pages d'authentification de Pix App, nous modifions le design du formulaire de login.

🤖 Proposition

Cette PR contient uniquement la migration du design du formulaire de signin (email/password) de la page d'authentification:

• Nouveau design du formulaire
• Brancher le bouton "Je me connecte" (Authentification)
• Brancher le lien "Mot de passe oublié"
• Gérer des erreurs
• Ajouter les tests pour la nouvelle version (sous feature switch)
  De plus, les premiers feedbacks de l'équipe design ont été pris en compte dans cette PR.

Note

Le test d'acceptance suivant a été renommé et déplacé:

• Avant: mon-pix/tests/acceptance/authentication-test.js
• Après: mon-pix/tests/acceptance/authentication/authentication-redirections-test.js

💯 Pour tester

• Dans le fichier .env de l'api (déjà fait pour la RA), ajouter:

FT_NEW_AUTHENTICATION_DESIGN_ENABLED=true

• Aller sur Pix App et vérifier que la nouvelle mire de connexion s'affiche correctement (formulaire de connexion uniquement)

Tester:

• Une connexion "classique" => superadmin@example.net
  • Les champs doivent être obligatoires.
  • Le bouton "Je ne connecte" est désactivé tant que les 2 champs ne sont pas remplis.
  • L'utilisateur est redirigé sur pix app une fois connecté.
• Le lien "Mot de passe oublié".
  • Redirige vers la page "Mot de passe oublié" (ancien design)
• Les cas d'erreurs:
  • Utilisateur avec mot de passe temporaire => hermione@school.net / xzjgcg56
  • Utilisateur temporairement bloqué: temporary-blocked@example.net (faire quelques tentatives avec un mauvais mot de passe pour que ça bloque)
  • Utilisateur bloqué: blocked@example.net (faire des 1 ou 2 tentatives avec un mauvais mot de passe pour que ça bloque)
• [Sur la version pix.org] Le changement de langue:
  • Le texte de la page doit changer en fonction de la langue choisie
  • Un message d'erreur affiché doit également voir son texte changer (ancien bug corrigé)

Screenshot

[pix-bot-github]

Une fois les applications déployées, elles seront accessibles via les liens suivants :

• App (.fr)
• App (.org)
• Orga (.fr)
• Orga (.org)
• Certif (.fr)
• Certif (.org)
• Junior
• Admin
• API
• Audit Logger

Les variables d'environnement seront accessibles via les liens suivants :

• scalingo front
• scalingo api
• scalingo audit-logger

[mariannebost]

Les cas d'erreurs pour
Utilisateur temporairement bloqué: temporary-blocked@example.net
Utilisateur bloqué: blocked@example.net
Ne semble pas fonctionner car j'arrive à me connecter

[bpetetot]

Les cas d'erreurs pour
Utilisateur temporairement bloqué: temporary-blocked@example.net
Utilisateur bloqué: blocked@example.net
Ne semble pas fonctionner car j'arrive à me connecter

C'était un souci de process (il fallait faire des 1 ou 2 tentatives avec un faux mot de passe pour que ça bloque), normalement c'est bon maintenant ;)

[lego-technix]

✅ Lu et testé fonctionnellement avec succès avec Firefox

Rien de plus à ajouter à la super revue réalisée par @er-lim

[er-lim]

Tests en RA sur firefox Desktop + tablette ✅