[BUGFIX] Pouvoir valider les écrans d'instructions uniquement sur la dernière page (PIX-14474)

 #10391

Author: pix-service-auto-merge

mon-pix/app/components/certification-instructions/step-five.gjs

@@ -1,37 +1,20 @@
-import PixCheckbox from '@1024pix/pix-ui/components/pix-checkbox';
-import { on } from '@ember/modifier';
-import { action } from '@ember/object';
-import Component from '@glimmer/component';
-import { tracked } from '@glimmer/tracking';
 import { t } from 'ember-intl';
 
-export default class StepFive extends Component {
-  @tracked checked = false;
+<template>
+  <div class="instructions-content" tabindex="0">
+    <span class="instructions-content__title">{{t "pages.certification-instructions.steps.5.text"}}</span>
+    <ul class="instructions-content__list">
+      <li>{{t "pages.certification-instructions.steps.5.list.1" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.2" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.3" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.4" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.5" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.6" htmlSafe=true}}</li>
+      <li>{{t "pages.certification-instructions.steps.5.list.7" htmlSafe=true}}</li>
+    </ul>
+    <p class="instructions-content__paragraph--light">
+      <em>{{t "pages.certification-instructions.steps.5.pix-companion"}}</em>
+    </p>
 
-  @action
-  onChange(event) {
-    this.checked = !!event.target.checked;
-    this.args.enableNextButton(this.checked);
-  }
-
-  <template>
-    <div class="instructions-content" tabindex="0">
-      <span class="instructions-content__title">{{t "pages.certification-instructions.steps.5.text"}}</span>
-      <ul class="instructions-content__list">
-        <li>{{t "pages.certification-instructions.steps.5.list.1" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.2" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.3" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.4" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.5" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.6" htmlSafe=true}}</li>
-        <li>{{t "pages.certification-instructions.steps.5.list.7" htmlSafe=true}}</li>
-      </ul>
-      <p class="instructions-content__paragraph--light">
-        <em>{{t "pages.certification-instructions.steps.5.pix-companion"}}</em>
-      </p>
-      <PixCheckbox {{on "change" this.onChange}}>
-        <:label>{{t "pages.certification-instructions.steps.5.checkbox-label"}}</:label>
-      </PixCheckbox>
-    </div>
-  </template>
-}
+  </div>
+</template>

mon-pix/app/components/certification-instructions/steps.gjs

@@ -1,4 +1,6 @@
 import PixButton from '@1024pix/pix-ui/components/pix-button';
+import PixCheckbox from '@1024pix/pix-ui/components/pix-checkbox';
+import { on } from '@ember/modifier';
 import { action } from '@ember/object';
 import { service } from '@ember/service';
 import Component from '@glimmer/component';
@@ -61,6 +63,7 @@ export default class Steps extends Component {
   @action
   previousStep() {
     this.pageId = this.pageId - 1;
+    this.isConfirmationCheckboxChecked = false;
   }
 
   @action
@@ -76,6 +79,11 @@ export default class Steps extends Component {
     }
   }
 
+  @action
+  onChange(event) {
+    this.isConfirmationCheckboxChecked = !!event.target.checked;
+  }
+
   @action
   async submit() {
     await this.args.candidate.save({
@@ -85,11 +93,6 @@ export default class Steps extends Component {
     });
   }
 
-  @action
-  enableNextButton(checked) {
-    this.isConfirmationCheckboxChecked = checked;
-  }
-
   <template>
     <h2 {{didInsert this.focus}} tabindex="0" class="instructions-step__title">{{this.title}}
       <span class="screen-reader-only">{{this.vocalStepIdentifier}}</span>
@@ -108,7 +111,10 @@ export default class Steps extends Component {
       <StepFour />
     {{/if}}
     {{#if (eq this.pageId 5)}}
-      <StepFive @enableNextButton={{this.enableNextButton}} />
+      <StepFive />
+      <PixCheckbox {{on "change" this.onChange}}>
+        <:label>{{t "pages.certification-instructions.steps.5.checkbox-label"}}</:label>
+      </PixCheckbox>
     {{/if}}
 
     <footer class="instructions-footer">