[BUMP] Update dependency @1024pix/pix-ui to ^48.7.0 (certif)

#10595
1024pix · Nov 20, 2024 · cdb1ead · cdb1ead
2 parents 7791cc9 + 01e783d
commit cdb1ead
Show file tree

Hide file tree

Showing 13 changed files with 128 additions and 156 deletions.
diff --git a/...sions/session-details/enrolled-candidates/candidate-creation-modal-complementary-list.gjs b/...sions/session-details/enrolled-candidates/candidate-creation-modal-complementary-list.gjs
@@ -1,3 +1,4 @@
+import PixLabel from '@1024pix/pix-ui/components/pix-label';
 import PixRadioButton from '@1024pix/pix-ui/components/pix-radio-button';
 import { fn } from '@ember/helper';
 import { on } from '@ember/modifier';
@@ -41,8 +42,9 @@ export default class CandidateCreationModalComplementaryList extends Component {
     <div class='new-candidate-modal-form__field'>
       <fieldset id='complementary-certifications'>
         <legend class='label'>
-          <abbr title={{t 'common.forms.required'}} class='mandatory-mark' aria-hidden='true'>*</abbr>
-          {{this.fieldsetLegend}}
+          <PixLabel @requiredLabel={{t 'common.forms.required'}}>
+            {{this.fieldsetLegend}}
+          </PixLabel>
         </legend>
         <PixRadioButton required name='subscriptions' {{on 'change' (fn @updateComplementaryCertification null)}}>
           <:label>{{this.firstInputLabel}}</:label>

diff --git a/.../app/components/sessions/session-details/enrolled-candidates/candidate-creation-modal.gjs b/.../app/components/sessions/session-details/enrolled-candidates/candidate-creation-modal.gjs
@@ -1,6 +1,7 @@
 import PixButton from '@1024pix/pix-ui/components/pix-button';
 import PixIcon from '@1024pix/pix-ui/components/pix-icon';
 import PixInput from '@1024pix/pix-ui/components/pix-input';
+import PixLabel from '@1024pix/pix-ui/components/pix-label';
 import PixMessage from '@1024pix/pix-ui/components/pix-message';
 import PixModal from '@1024pix/pix-ui/components/pix-modal';
 import PixRadioButton from '@1024pix/pix-ui/components/pix-radio-button';
@@ -265,8 +266,9 @@ export default class CandidateCreationModal extends Component {
           <div class='new-candidate-modal-form__field'>
             <fieldset>
               <legend class='label'>
-                <abbr title={{t 'common.forms.required'}} class='mandatory-mark' aria-hidden='true'>*</abbr>
-                {{t 'common.labels.candidate.gender.title'}}
+                <PixLabel @requiredLabel={{t 'common.forms.required'}}>
+                  {{t 'common.labels.candidate.gender.title'}}
+                </PixLabel>
               </legend>
               <div class='radio-button-container'>
                 <PixRadioButton
@@ -329,8 +331,9 @@ export default class CandidateCreationModal extends Component {
             <div class='new-candidate-modal-form__field'>
               <fieldset>
                 <legend class='label'>
-                  <abbr title={{t 'common.forms.required'}} class='mandatory-mark' aria-hidden='true'>*</abbr>
-                  {{t 'common.labels.candidate.birth-geographical-code'}}
+                  <PixLabel @requiredLabel={{t 'common.forms.required'}}>
+                    {{t 'common.labels.candidate.birth-geographical-code'}}
+                  </PixLabel>
                 </legend>
                 <div class='radio-button-container'>
                   <PixRadioButton

diff --git a/certif/app/styles/app.scss b/certif/app/styles/app.scss
@@ -84,26 +84,3 @@ input:invalid {
 * {
   box-sizing: border-box;
 }
-
-.pix-toast__icon .pix-icon {
-  fill: var(--pix-neutral-0);
-}
-
-.pix-icon-button {
-  &:active:enabled,
-  &:focus:enabled {
-    .pix-icon {
-      fill: var(--pix-neutral-0);
-    }
-  }
-}
-
-.pix-toast__close-button-container button {
-  &:hover:enabled,
-  &:active:enabled,
-  &:focus:enabled {
-    .pix-icon {
-      fill: var(--pix-neutral-0);
-    }
-  }
-}
diff --git a/certif/app/styles/pages/authenticated/sessions/details.scss b/certif/app/styles/pages/authenticated/sessions/details.scss
@@ -124,12 +124,6 @@
 
   &__clipboard-button {
     margin-left: 4px;
-
-    .pix-icon-button {
-      &:hover {
-        background-color: var(--pix-neutral-100);
-      }
-    }
   }
 }
 

diff --git a/certif/app/templates/authenticated/sessions/new.hbs b/certif/app/templates/authenticated/sessions/new.hbs
@@ -32,10 +32,9 @@
     </PixInput>
 
     <div class="session-form__field {{if this.isSessionDateMissing 'session-form__field--error'}}">
-      <label for="session-date" class="label">
-        <abbr title={{t "common.forms.required"}} class="mandatory-mark" aria-hidden="true">*</abbr>
+      <PixLabel @requiredLabel={{t "common.forms.required"}} for="session-date">
         {{t "common.forms.session-labels.date-start"}}
-      </label>
+      </PixLabel>
       <EmberFlatpickr
         id="session-date"
         @altFormat="d/m/Y"
@@ -59,10 +58,9 @@
     </div>
 
     <div class="session-form__field {{if this.isSessionTimeMissing 'session-form__field--error'}}">
-      <label for="session-time" class="label">
-        <abbr title={{t "common.forms.required"}} class="mandatory-mark" aria-hidden="true">*</abbr>
+      <PixLabel @requiredLabel={{t "common.forms.required"}} for="session-time">
         {{t "common.forms.session-labels.time-start"}}
-      </label>
+      </PixLabel>
       <EmberFlatpickr
         id="session-time"
         @onChange={{this.onTimePicked}}

diff --git a/certif/app/templates/authenticated/sessions/update.hbs b/certif/app/templates/authenticated/sessions/update.hbs
@@ -34,10 +34,9 @@
     </PixInput>
 
     <div class="session-form__field {{if this.isSessionDateMissing 'session-form__field--error'}}">
-      <label for="session-date" class="label">
-        <abbr title={{t "common.forms.required"}} class="mandatory-mark" aria-hidden="true">*</abbr>
+      <PixLabel @requiredLabel={{t "common.forms.required"}} for="session-date">
         {{t "common.forms.session-labels.date-start"}}
-      </label>
+      </PixLabel>
       <EmberFlatpickr
         id="session-date"
         @altFormat="d/m/Y"
@@ -59,10 +58,9 @@
     </div>
 
     <div class="session-form__field {{if this.isSessionTimeMissing 'session-form__field--error'}}">
-      <label for="session-time" class="label">
-        <abbr title={{t "common.forms.required"}} class="mandatory-mark" aria-hidden="true">*</abbr>
+      <PixLabel @requiredLabel={{t "common.forms.required"}} for="session-time">
         {{t "common.forms.session-labels.time-start"}}
-      </label>
+      </PixLabel>
       <EmberFlatpickr
         id="session-time"
         @onChange={{this.onTimePicked}}

diff --git a/certif/package-lock.json b/certif/package-lock.json
diff --git a/certif/package.json b/certif/package.json
@@ -53,7 +53,7 @@
     "@1024pix/ember-api-actions": "^1.1.0",
     "@1024pix/ember-testing-library": "^3.0.6",
     "@1024pix/eslint-config": "^1.3.8",
-    "@1024pix/pix-ui": "^48.6.0",
+    "@1024pix/pix-ui": "^48.7.0",
     "@1024pix/stylelint-config": "^5.1.22",
     "@babel/eslint-parser": "^7.22.15",
     "@babel/plugin-proposal-decorators": "^7.22.15",

diff --git a/certif/tests/acceptance/session-add-candidate-test.js b/certif/tests/acceptance/session-add-candidate-test.js
@@ -49,13 +49,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByLabelText('Certif complémentaire 2'));
       await click(screen.getByLabelText('Aucune'));
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
@@ -73,13 +73,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByLabelText('Certif complémentaire 2'));
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
 
@@ -105,13 +105,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByLabelText('Certification Pix'));
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
 
@@ -129,13 +129,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
 
       // then
@@ -151,13 +151,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByLabelText('Double Certification Pix-CléA Numérique'));
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
 
@@ -174,13 +174,13 @@ module('Acceptance | Session Add Candidate', function (hooks) {
 
       // when
       await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-      await fillIn(screen.getByLabelText('* Nom de naissance'), 'Quatorze');
-      await fillIn(screen.getByLabelText('* Prénom'), 'Louis');
+      await fillIn(screen.getByLabelText('Nom de naissance *'), 'Quatorze');
+      await fillIn(screen.getByLabelText('Prénom *'), 'Louis');
       await click(screen.getByLabelText('Homme'));
-      await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-      await click(screen.getByLabelText('* Pays de naissance'));
+      await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+      await click(screen.getByLabelText('Pays de naissance *'));
       await click(screen.getByText('Portugal'));
-      await fillIn(screen.getByLabelText('* Commune de naissance'), 'Paris');
+      await fillIn(screen.getByLabelText('Commune de naissance *'), 'Paris');
       await click(screen.getByLabelText('Certif complémentaire 2'));
       await click(screen.getByRole('button', { name: 'Inscrire le candidat' }));
 

diff --git a/certif/tests/acceptance/session-details-certification-candidates-test.js b/certif/tests/acceptance/session-details-certification-candidates-test.js
@@ -454,16 +454,16 @@ module('Acceptance | Session Details Certification Candidates', function (hooks)
 
           await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
           const modal = await screen.findByRole('dialog');
-          await fillIn(screen.getByLabelText('* Nom de naissance'), 'BackStreet');
-          await fillIn(screen.getByLabelText('* Prénom'), 'Boys');
+          await fillIn(screen.getByLabelText('Nom de naissance *'), 'BackStreet');
+          await fillIn(screen.getByLabelText('Prénom *'), 'Boys');
           await click(screen.getByLabelText('Homme'));
-          await fillIn(screen.getByLabelText('* Date de naissance'), '01/01/2000');
-          await fillIn(screen.getByLabelText('* Pays de naissance'), '99100');
+          await fillIn(screen.getByLabelText('Date de naissance *'), '01/01/2000');
+          await fillIn(screen.getByLabelText('Pays de naissance *'), '99100');
           await click(screen.getByLabelText('Code INSEE'));
           await fillIn(screen.getByLabelText('Identifiant externe'), '44AA3355');
-          await fillIn(screen.getByLabelText('* Code INSEE de naissance'), '75100');
+          await fillIn(screen.getByLabelText('Code INSEE de naissance *'), '75100');
           await fillIn(screen.getByLabelText('Temps majoré (%)'), '20');
-          await click(screen.getByLabelText('* Tarification part Pix'));
+          await click(screen.getByLabelText('Tarification part Pix *'));
           await click(
             await screen.findByRole('option', {
               name: 'Prépayée',
@@ -482,14 +482,14 @@ module('Acceptance | Session Details Certification Candidates', function (hooks)
           await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
           // then
 
-          assert.strictEqual(screen.getByLabelText('* Nom de naissance').value, '');
-          assert.strictEqual(screen.getByLabelText('* Prénom').value, '');
+          assert.strictEqual(screen.getByLabelText('Nom de naissance *').value, '');
+          assert.strictEqual(screen.getByLabelText('Prénom *').value, '');
           assert.false(screen.getByLabelText('Homme').checked);
-          assert.strictEqual(screen.getByLabelText('* Date de naissance').value, '');
+          assert.strictEqual(screen.getByLabelText('Date de naissance *').value, '');
           assert.strictEqual(screen.getByLabelText('Identifiant externe').value, '');
-          assert.strictEqual(screen.getByLabelText('* Code INSEE de naissance').value, '');
+          assert.strictEqual(screen.getByLabelText('Code INSEE de naissance *').value, '');
           assert.strictEqual(screen.getByLabelText('Temps majoré (%)').value, '');
-          assert.strictEqual(screen.getByLabelText('* Tarification part Pix').value, '');
+          assert.strictEqual(screen.getByLabelText('Tarification part Pix *').value, '');
           assert.dom(screen.queryByLabelText('Code de prépaiement')).doesNotExist();
           assert.strictEqual(
             screen.getByLabelText('E-mail du destinataire des résultats (formateur, enseignant...)').value,
@@ -639,15 +639,15 @@ module('Acceptance | Session Details Certification Candidates', function (hooks)
 
               const screen = await visit(`/sessions/${session.id}/candidats`);
               await click(screen.getByRole('button', { name: 'Inscrire un candidat' }));
-              await fillIn(screen.getByLabelText('* Prénom'), 'Guybrush');
-              await fillIn(screen.getByLabelText('* Nom de naissance'), 'Threepwood');
-              await fillIn(screen.getByLabelText('* Date de naissance'), '28/04/2019');
+              await fillIn(screen.getByLabelText('Prénom *'), 'Guybrush');
+              await fillIn(screen.getByLabelText('Nom de naissance *'), 'Threepwood');
+              await fillIn(screen.getByLabelText('Date de naissance *'), '28/04/2019');
               await click(screen.getByLabelText('Homme'));
-              await fillIn(screen.getByLabelText('* Pays de naissance'), '99100');
+              await fillIn(screen.getByLabelText('Pays de naissance *'), '99100');
               await click(screen.getByLabelText('Code INSEE'));
               await fillIn(screen.getByLabelText('Identifiant externe'), '44AA3355');
-              await fillIn(screen.getByLabelText('* Code INSEE de naissance'), '75100');
-              await click(screen.getByLabelText('* Tarification part Pix'));
+              await fillIn(screen.getByLabelText('Code INSEE de naissance *'), '75100');
+              await click(screen.getByLabelText('Tarification part Pix *'));
               await click(
                 await screen.findByRole('option', {
                   name: 'Prépayée',
@@ -673,16 +673,16 @@ module('Acceptance | Session Details Certification Candidates', function (hooks)
     });
   });
   async function _fillFormWithCorrectData(screen) {
-    await fillIn(screen.getByRole('textbox', { name: '* Prénom' }), 'Guybrush');
-    await fillIn(screen.getByRole('textbox', { name: '* Nom de naissance' }), 'Threepwood');
-    await fillIn(screen.getByRole('textbox', { name: '* Date de naissance' }), '28/04/2019');
+    await fillIn(screen.getByRole('textbox', { name: 'Prénom *' }), 'Guybrush');
+    await fillIn(screen.getByRole('textbox', { name: 'Nom de naissance *' }), 'Threepwood');
+    await fillIn(screen.getByRole('textbox', { name: 'Date de naissance *' }), '28/04/2019');
     await click(screen.getByRole('radio', { name: 'Homme' }));
-    await fillIn(screen.getByRole('button', { name: '* Pays de naissance' }), '99100');
+    await fillIn(screen.getByRole('button', { name: 'Pays de naissance *' }), '99100');
     await click(screen.getByRole('radio', { name: 'Code INSEE' }));
     await fillIn(screen.getByRole('textbox', { name: 'Identifiant externe' }), '44AA3355');
-    await fillIn(screen.getByRole('textbox', { name: '* Code INSEE de naissance' }), '75100');
+    await fillIn(screen.getByRole('textbox', { name: 'Code INSEE de naissance *' }), '75100');
     await fillIn(screen.getByRole('textbox', { name: 'Temps majoré (%)' }), '20');
-    await click(screen.getByRole('button', { name: '* Tarification part Pix' }));
+    await click(screen.getByRole('button', { name: 'Tarification part Pix *' }));
     await click(
       await screen.findByRole('option', {
         name: 'Gratuite',