Merge pull request #6106 from betagouv/improve-password-reset

Amélioration de l'interface de ré-inititialisation de mot de passe (#6106)

app/assets/stylesheets/auth.scss

@@ -10,7 +10,7 @@
   // The procedure description can still be read from the /commencer
   // pages.
   @media (max-width: $two-columns-breakpoint) {
-    .procedure-description {
+    .procedure-preview {
       display: none;
     }
   }

app/assets/stylesheets/flex.scss

@@ -45,3 +45,7 @@
 .flex-grow {
   flex-grow: 1;
 }
+
+.flex-no-shrink {
+  flex-shrink: 0;
+}

app/views/instructeurs/passwords/new.html.haml

@@ -17,5 +17,5 @@
       %br
       %br
       .actions
-        = f.submit 'Réinitialiser', class: 'btn btn-primary'
+        = f.submit 'Demander un nouveau mot de passe', class: 'button large expand primary'
       %br

app/views/super_admins/passwords/new.html.haml

@@ -14,4 +14,4 @@
       = f.label :email, 'Email'
       = f.email_field :email, autofocus: true
 
-      = f.submit 'Réinitialiser', class: 'button primary'
+      = f.submit 'Demander un nouveau mot de passe', class: 'button large expand primary'

app/views/users/passwords/new.html.haml

@@ -9,9 +9,11 @@
 
     = form_for(resource, as: resource_name, url: password_path(resource_name), html: { class: 'form' }) do |f|
 
-      %h1 Mot de passe oublié
+      %h1= t('devise.passwords.new.forgot_your_password')
+
+      %p.notice= t('views.passwords.new.send_me_reset_password_instructions')
 
       = f.label :email, 'Email'
       = f.email_field :email, autofocus: true
 
-      = f.submit 'Réinitialiser', class: 'button primary'
+      = f.submit 'Demander un nouveau mot de passe', class: 'button expand primary'

app/views/users/sessions/new.html.haml

@@ -2,7 +2,7 @@
 
 .auth-form.sign-in-form
 
-  = form_for User.new, url: user_session_path, html: { class: "form" } do |f|
+  = form_for resource, url: user_session_path, html: { class: "form" } do |f|
     %h1.huge-title= t('views.sessions.new.title')
 
     = render partial: 'shared/france_connect_login', locals: { url: france_connect_particulier_path }
@@ -14,7 +14,7 @@
     = f.password_field :password, autocomplete: 'current-password'
 
     .auth-options
-      %div
+      .flex-no-shrink
         = f.check_box :remember_me
         = f.label :remember_me, t('views.sessions.new.remember_me'), class: 'remember-me'
 

config/locales/en.yml

@@ -49,7 +49,7 @@ en:
       new:
         title: Sign in
         email: Email address (name@site.com)
-        password: Password (minimum length %{min_length} characters)
+        password: Password
         remember_me: Remember me
         reset_password: Forgot password?
         connection: Sign in
@@ -58,8 +58,11 @@ en:
     commencer:
       no_procedure:
         ligne1: A simple tool
-        ligne2: to manage dematerialized 
+        ligne2: to manage dematerialized
         ligne3: administrative forms.
+    passwords:
+      new:
+        send_me_reset_password_instructions: "Fill-in your account's email, and we’ll send you instructions to reset your password."
   modal:
     publish:
       title:
@@ -172,4 +175,4 @@ en:
     draft:
       zero: Draft
       one: Draft
-      other: Drafts
+      other: Drafts

config/locales/fr.yml

@@ -39,9 +39,9 @@ fr:
       new:
         title: Connectez-vous
         email: Email (nom@site.com)
-        password: Mot de passe (%{min_length} caractères minimum)
+        password: Mot de passe
         remember_me: Se souvenir de moi
-        reset_password: Mot de passe oublié ?
+        reset_password: Mot de passe oublié ?
         connection: Se connecter
         are_you_new: Vous êtes nouveau sur %{app_name} ?
         find_procedure: Trouvez votre démarche
@@ -50,6 +50,9 @@ fr:
         ligne1: Un outil simple
         ligne2: pour gérer les formulaires
         ligne3: administratifs dématérialisés.
+    passwords:
+      new:
+        send_me_reset_password_instructions: "Indiquez l’email de votre compte, et nous vous enverrons un lien pour créer un nouveau mot de passe."
   modal:
     publish:
       title:
@@ -185,4 +188,4 @@ fr:
     draft:
       zero: Brouillon
       one: Brouillon
-      other: Brouillons
+      other: Brouillons

spec/features/sessions/sign_in_spec.rb

@@ -6,8 +6,11 @@ feature 'Signin in:' do
     visit root_path
     click_on 'Connexion'
 
-    sign_in_with user.email, password
+    sign_in_with user.email, 'invalid-password'
+    expect(page).to have_content 'Courriel ou mot de passe incorrect.'
+    expect(page).to have_field('Email', with: user.email)
 
+    sign_in_with user.email, password
     expect(page).to have_current_path dossiers_path
   end
 

spec/features/users/managing_password_spec.rb

@@ -6,12 +6,12 @@ feature 'Managing password:' do
     scenario 'a simple user can reset their password' do
       visit root_path
       click_on 'Connexion'
-      click_on 'Mot de passe oublié ?'
+      click_on 'Mot de passe oublié ?'
       expect(page).to have_current_path(new_user_password_path)
 
       fill_in 'Email', with: user.email
       perform_enqueued_jobs do
-        click_on 'Réinitialiser'
+        click_on 'Demander un nouveau mot de passe'
       end
       expect(page).to have_content('Si votre courriel existe dans notre base de données, vous recevrez un lien vous permettant de récupérer votre mot de passe.')
 
@@ -33,12 +33,12 @@ feature 'Managing password:' do
     scenario 'an admin can reset their password' do
       visit root_path
       click_on 'Connexion'
-      click_on 'Mot de passe oublié ?'
+      click_on 'Mot de passe oublié ?'
       expect(page).to have_current_path(new_user_password_path)
 
       fill_in 'Email', with: user.email
       perform_enqueued_jobs do
-        click_on 'Réinitialiser'
+        click_on 'Demander un nouveau mot de passe'
       end
       expect(page).to have_content('Si votre courriel existe dans notre base de données, vous recevrez un lien vous permettant de récupérer votre mot de passe.')
 

spec/views/users/sessions/new.html.haml_spec.rb

@@ -3,7 +3,7 @@ describe 'users/sessions/new.html.haml', type: :view do
 
   before(:each) do
     allow(view).to receive(:devise_mapping).and_return(Devise.mappings[:user])
-    allow(view).to receive(:resource_name).and_return(:user)
+    allow(view).to receive(:resource).and_return(:user)
   end
 
   before do