Merge pull request #9480 from mfo/US/enhance-agent-connect

amelioration(agent-connect): tous les agents peuvent s'agent connecté

app/assets/stylesheets/auth.scss

@@ -10,12 +10,6 @@
   //
   // The procedure description can still be read from the /commencer
   // pages.
-  @media (max-width: $two-columns-breakpoint) {
-    .agent-intro {
-      display: none;
-    }
-  }
-
   .column {
     padding-top: $default-spacer;
   }
@@ -37,14 +31,6 @@
     margin-bottom: 0;
   }
 
-  hr {
-    margin-top: 30px;
-    margin-bottom: 30px;
-    background-color: $grey;
-    border: none;
-    height: 1px;
-  }
-
   .register {
     display: flex;
     justify-content: space-between;

app/views/agent_connect/agent/index.html.haml

@@ -1,36 +1,34 @@
 - content_for(:title, t('.cta'))
 
 #agentconnect
-  .two-columns
-    .columns-container
-      .column.agent-intro
-        %h1.mt-2.mb-2.agent= t('.you_are_an_agent')
-        .box= t('.in_progress_html')
+  .fr-container
+    .fr-grid-row.fr-grid-row--gutters
 
-        .center.mt-2
-          %span.citizen= t('.you_are_a_citizen')
-          %br
-          %br
-          = link_to t('.citizen_page'), new_user_session_path, class: "fr-btn fr-btn--secondary"
-
-      .column
-        %h1.fr-my-2w
-          = t('.connect')
-
-        .fr-connect-group.fr-my-2w
-          = link_to(agent_connect_login_path, class: "fr-btn fr-connect") do
-            %span.fr-connect__login
-              = t('.signin_with')
-            %span.fr-connect__brand AgentConnect
-          %p
-            = link_to t('.whats_agentconnect'), 'https://agentconnect.gouv.fr/', target: '_blank', rel: "noopener"
-
-
-        %p.fr-hr-or= t('views.shared.france_connect_login.separator')
+      .fr-col-lg.fr-p-6w.fr-background-alt--grey
 
         #session-new.auth-form.sign-in-form
           = form_for User.new, url: user_session_path do |f|
 
+            %h1.fr-h2= t('views.users.sessions.new.sign_in', application_name: APPLICATION_NAME)
+
+            .fr-mb-0.fr-fieldset
+              .fr-fieldset__legend
+                %h2.fr-h6= t('.cta')
+
+              .fr-fieldset__element
+                %p= t('.explanation')
+
+                .fr-connect-group.fr-my-2w
+                  = link_to(agent_connect_login_path, class: "fr-btn fr-connect") do
+                    %span.fr-connect__login
+                      = t('.signin_with')
+                    %span.fr-connect__brand AgentConnect
+                  %p
+                    = link_to t('.whats_agentconnect'), 'https://agentconnect.gouv.fr/', target: '_blank', rel: "noopener"
+
+
+            %p.fr-hr-or= t('views.shared.france_connect_login.separator')
+
             %fieldset.fr-mb-0.fr-fieldset{ aria: { labelledby: 'new-account-legend' } }
               %legend.fr-fieldset__legend#new-account-legend
                 %h2.fr-h6= I18n.t('views.users.sessions.new.subtitle')
@@ -53,8 +51,22 @@
                     = f.check_box :remember_me
                     = f.label :remember_me, t('views.users.sessions.new.remember_me'), class: 'remember-me'
 
+            %ul.fr-btns-group
+              %li= f.submit t('views.users.sessions.new.connection'), class: "fr-btn"
+
+          %hr
+
+          %h2.fr-h6= t('.you_are_a_citizen')
+          %ul.fr-btns-group
+            %li= link_to t('.citizen_page'), new_user_session_path, class: "fr-btn fr-btn--secondary width-100"
+
+      .fr-col-lg.fr-p-6w
+        = render Dsfr::CalloutComponent.new(title: t('.full_deploy_title'), icon: 'fr-icon-information-line') do |c|
+          - c.with_body do
+            = t('.full_deploy_body')
+        %h2.fr-h6= t('.whats_ds', application_name: APPLICATION_NAME)
+        = image_tag "landing/hero/dematerialiser.svg", class: "paperless-logo", alt: ""
 
-            = f.submit t('views.users.sessions.new.connection'), class: "fr-btn fr-btn--lg"
 
 - content_for :footer do
   = render partial: 'users/dossiers/index_footer'

app/views/user_mailer/invite_instructeur.html.haml

@@ -17,6 +17,11 @@
 %p
   Lors de vos prochaines connexions sur #{APPLICATION_NAME} cliquez sur le bouton « Se connecter » positionné sur le haut de page ou bien sur ce lien : 
   = link_to new_user_session_url, new_user_session_url
+
+- if AgentConnectService.enabled?
+  %p
+    Vous êtes un agent de l'état et avez accès à AgentConnect ? Vous pouvez utiliser la connexion AgentConnect en suivant ce lien : 
+    = link_to agent_connect_url, agent_connect_url
 %p
   Nous vous invitons aussi à consulter notre tutoriel à destination des nouveaux instructeurs :
   = link_to(INSTRUCTEUR_TUTORIAL_URL, INSTRUCTEUR_TUTORIAL_URL)

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

@@ -22,4 +22,5 @@
           - c.describedby do
             = render partial: "devise/password_rules", locals: { id: c.describedby_id }
 
-    = f.submit t('views.shared.account.create'), class: "fr-btn fr-btn--lg"
+    %ul.fr-btns-group
+      %li= f.submit t('views.shared.account.create'), class: "fr-btn"

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

@@ -29,11 +29,12 @@
             = f.check_box :remember_me
             = f.label :remember_me, t('views.users.sessions.new.remember_me'), class: 'remember-me'
 
-
-    = f.submit t('views.users.sessions.new.connection'), class: "fr-btn fr-btn--lg"
+      .fr-fieldset__element
+        %ul.fr-btns-group
+          %li= f.submit t('views.users.sessions.new.connection'), class: "fr-btn fr-btn--lg"
 
   - if AgentConnectService.enabled?
     %p.fr-hr-or= t('views.shared.france_connect_login.separator')
-    .center
-      %h2.important-header.mb-1= t('views.users.sessions.new.state_civil_servant')
-      = link_to t('views.users.sessions.new.connect_with_agent_connect'), agent_connect_path, class: "fr-btn fr-btn--secondary"
+    %h2.important-header.mb-1= t('views.users.sessions.new.state_civil_servant')
+    %ul.fr-btns-group
+      %li= link_to t('views.users.sessions.new.connect_with_agent_connect'), agent_connect_path, class: "fr-btn fr-btn--secondary"

config/locales/views/agent_connect/agent/en.yml

@@ -3,18 +3,12 @@ en:
     agent:
       index:
         cta: Connect with AgentConnect
-        you_are_an_agent: Are you an employee of the state civil service or of a state operator?
-        in_progress_html: |
-          <p>
-            <b class="bold">AgentConnect is currently being deployed.</b>
-            <br>
-            The ministries and operators that can currently benefit from it are&nbsp;:
-          </p>
-          <ul>
-            <li>the Insee</li>
-          </ul>
-        you_are_a_citizen: You are an individual ?
+        explanation: Agent connect is the solution powered by the state to secure and simplify the connection to online services
+        full_deploy_title: Agent connect is now fully available
+        full_deploy_body: All ministries and operators are able to use it
+        you_are_a_citizen: Are you a citizen ?
         citizen_page: Go to our dedicated page
-        connect: Connect
+        signin_with: "Sign in with"
         whats_agentconnect: 'What is AgentConnect?'
+        whats_ds: '%{application_name}, the national platform to dematerialize administrative procedures'
         pro_email: Professional email

config/locales/views/agent_connect/agent/fr.yml

@@ -2,20 +2,13 @@ fr:
   agent_connect:
     agent:
       index:
-        cta: S’identifier avec AgentConnect
-        you_are_an_agent: Vous êtes agent de la fonction publique dʼÉtat ou dʼun opérateur de lʼÉtat ?
-        in_progress_html: |
-          <p>
-            <b class="bold">AgentConnect est en cours de déploiement.</b>
-            <br>
-            Les ministères et opérateurs qui peuvent lʼutiliser à ce jour sont&nbsp;:
-          </p>
-          <ul>
-            <li>lʼInsee</li>
-          </ul>
+        cta: Se connecter avec AgentConnect
+        explanation: AgentConnect est la solution proposée par l'État pour sécuriser et simplifier la connexion aux services en ligne
+        full_deploy_title: AgentConnect est désormais entièrement deployé
+        full_deploy_body: Tous les ministères et opérateurs peuvent l'utiliser à ce jour
         you_are_a_citizen: Vous êtes un particulier ?
-        citizen_page: Accéder à notre page dédiée
-        connect: Connectez-vous
+        citizen_page: Se connecter sur votre espace
         signin_with: "S’identifier avec"
         whats_agentconnect: 'Quʼest ce quʼAgentConnect ?'
+        whats_ds: '%{application_name}, la plateforme nationale de dématérialisation des démarches administratives'
         pro_email: Adresse électronique professionnelle