Csfd 15 ungrey back button

RELEASE-NOTES.md

@@ -149,6 +149,9 @@ Taken by PR
 ### Version 7.0.20
 **EUI-1300** accessibility change
 
+### Version 7.0.18-event-flow-cancel-navigation-v2
+**CSFD-18** Ungrey back button - event flow cancel navigation
+
 ### Version 7.0.19
 **EUI-1067** No error message is displayed when entering incorrect postcode
 **EUI-1123** TextArea fields are not preloaded even the data is present in response intermittently

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hmcts/ccd-case-ui-toolkit",
-  "version": "7.1.32",
+  "version": "7.1.32-ungrey-back-button",
   "engines": {
     "node": ">=18.19.0"
   },

projects/ccd-case-ui-toolkit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hmcts/ccd-case-ui-toolkit",
-  "version": "7.1.32",
+  "version": "7.1.32-ungrey-back-button",
   "engines": {
     "node": ">=18.19.0"
   },

projects/ccd-case-ui-toolkit/src/lib/shared/components/case-editor/case-edit-page/case-edit-page.component.ts

@@ -9,7 +9,7 @@ import { CaseEventData } from '../../../domain/case-event-data.model';
 import { CaseEventTrigger } from '../../../domain/case-view/case-event-trigger.model';
 import { CaseField } from '../../../domain/definition';
 import { DRAFT_PREFIX } from '../../../domain/draft.model';
-import { AddressesService, LoadingService } from '../../../services';
+import { AddressesService, LoadingService, MultipageComponentStateService } from '../../../services';
 import { CaseFieldService } from '../../../services/case-fields/case-field.service';
 import { FieldsUtils } from '../../../services/fields';
 import { FormErrorService } from '../../../services/form/form-error.service';
@@ -22,13 +22,16 @@ import { WizardPage } from '../domain/wizard-page.model';
 import { Wizard } from '../domain/wizard.model';
 import { PageValidationService } from '../services/page-validation.service';
 import { ValidPageListCaseFieldsService } from '../services/valid-page-list-caseFields.service';
+import { JourneyInstigator } from '../../../domain/journey';
+import { LinkedCasesService } from '../../palette/linked-cases/services/linked-cases.service';
+import { CaseFlagStateService } from '../services/case-flag-state.service';
 
 @Component({
   selector: 'ccd-case-edit-page',
   templateUrl: 'case-edit-page.html',
   styleUrls: ['./case-edit-page.scss']
 })
-export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestroy {
+export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestroy, JourneyInstigator {
   public static readonly RESUMED_FORM_DISCARD = 'RESUMED_FORM_DISCARD';
   public static readonly NEW_FORM_DISCARD = 'NEW_FORM_DISCARD';
   public static readonly NEW_FORM_SAVE = 'NEW_FORM_CHANGED_SAVE';
@@ -85,8 +88,39 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
     private readonly caseEditDataService: CaseEditDataService,
     private readonly loadingService: LoadingService,
     private readonly validPageListCaseFieldsService: ValidPageListCaseFieldsService,
-    private readonly addressService: AddressesService
+    private readonly multipageComponentStateService: MultipageComponentStateService,
+    private readonly addressService: AddressesService,
+    private readonly linkedCasesService: LinkedCasesService,
+    private readonly caseFlagStateService: CaseFlagStateService
   ) {
+    this.multipageComponentStateService.setInstigator(this);
+  }
+
+  public onFinalNext(): void {
+    this.submit();
+  }
+
+  public onFinalPrevious(): void {
+    this.cancel();
+  }
+
+  public isAtStart(): boolean {
+    const pageNumberToUse = this.multipageComponentStateService.getJourneyCollection()[0]?.linkedCasesPage !== undefined ? this.multipageComponentStateService.getJourneyCollection()[0]?.linkedCasesPage : this.multipageComponentStateService.getJourneyCollection()[0]?.fieldState;
+    return pageNumberToUse === this.multipageComponentStateService.getJourneyCollection()[0]?.journeyStartPageNumber;
+  }
+
+  public isAtEnd(): boolean {
+    return this.multipageComponentStateService.getJourneyCollection()[0]?.fieldState === this.multipageComponentStateService.getJourneyCollection()[0]?.journeyEndPageNumber;
+  }
+
+  // This method will be triggered by the next button in the app component
+  public nextStep(): void {
+    this.multipageComponentStateService.next();
+  }
+
+  // This method will be triggered by the previous button in the app component
+  public previousStep(): void {
+    this.multipageComponentStateService.previous();
   }
 
   public ngOnInit(): void {
@@ -148,6 +182,7 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
     this.dialogRefAfterClosedSub?.unsubscribe();
     this.saveDraftSub?.unsubscribe();
     this.caseFormValidationErrorsSub?.unsubscribe();
+    this.multipageComponentStateService.reset();
   }
 
   public applyValuesChanged(valuesChanged: boolean): void {
@@ -159,6 +194,7 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
   }
 
   public currentPageIsNotValid(): boolean {
+    this.editForm.updateValueAndValidity();
     this.failingCaseFields = this.pageValidationService.getInvalidFields(this.currentPage, this.editForm);
     return this.failingCaseFields.length > 0 ||
       (this.isLinkedCasesJourney() && !this.isLinkedCasesJourneyAtFinalStep);
@@ -175,11 +211,11 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
    */
   public toPreviousPage(): void {
     this.caseEditDataService.clearFormValidationErrors();
-
     const caseEventData: CaseEventData = this.buildCaseEventData(true);
     caseEventData.data = caseEventData.event_data;
     this.updateFormData(caseEventData);
     this.previous();
+    this.previousStep();
     CaseEditPageComponent.setFocusToTop();
   }
 
@@ -289,8 +325,31 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
     }
   }
 
+  public checkForStagesCompleted() {
+    const dataControls = this.editForm.controls['data'];
+    if (dataControls) {
+      const flagLauncher = dataControls.get('flagLauncherInternal');
+      if (flagLauncher) {
+        if (flagLauncher.hasError('notAllCaseFlagStagesCompleted') && this.isAtEnd()) {
+          flagLauncher.setErrors(null);
+        }
+      }
+    }
+  }
+
   public submit(): void {
+    // in some scenarios the fieldstate can be set to 0 even though the user is at the end of a journey, check for this case and set vars
+    const journeyPageNumber = this.multipageComponentStateService.getJourneyCollection()[0]?.journeyPageNumber;
+    const fieldState = this.caseFlagStateService?.fieldStateToNavigate;
+    if (this.eventTrigger.id === 'c100ManageFlags'){
+      if ((fieldState === 0 || fieldState === undefined || journeyPageNumber > fieldState) && fieldState !== journeyPageNumber) {
+        this.caseFlagStateService.fieldStateToNavigate = journeyPageNumber;
+        this.caseFlagStateService.lastPageFieldState = journeyPageNumber;
+      }
+    }
+
     this.caseEditDataService.clearFormValidationErrors();
+    this.checkForStagesCompleted();
     if (this.currentPageIsNotValid()) {
       // The generateErrorMessage method filters out the hidden fields.
       // The error message for LinkedCases journey will never get displayed because the
@@ -434,6 +493,20 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
   }
 
   public cancel(): void {
+    if (this.isLinkedCasesJourney()){
+      // if the user cancels the journey we need to clean up the data
+      const linkedCasesTab = this.caseEdit.caseDetails.tabs.find((tab) =>
+        tab?.fields?.some((field) => field.id === 'caseLinks')
+      )?.fields?.[0] ?? null;
+      const initalLinks = this.linkedCasesService.initialCaseLinkRefs;
+      if (linkedCasesTab && linkedCasesTab?.value.length !== initalLinks.length){
+        const initialCaseRefs = this.linkedCasesService.initialCaseLinkRefs;
+        linkedCasesTab.value = linkedCasesTab.value.filter((item) =>
+          initialCaseRefs.includes(item.value.CaseReference)
+        );
+      }
+      this.linkedCasesService.resetLinkedCaseData();
+    }
     if (this.eventTrigger.can_save_draft) {
       if (this.formValuesChanged) {
         const dialogRef = this.dialog.open(SaveOrDiscardDialogComponent, this.dialogConfig);
@@ -457,6 +530,7 @@ export class CaseEditPageComponent implements OnInit, AfterViewChecked, OnDestro
     }
 
     this.caseEditDataService.clearFormValidationErrors();
+    this.multipageComponentStateService.reset();
   }
 
   public submitting(): boolean {

projects/ccd-case-ui-toolkit/src/lib/shared/components/case-editor/case-edit-page/case-edit-page.html

@@ -40,7 +40,7 @@ <h2 class="govuk-error-summary__title" id="error-summary-title">
   (callbackErrorsContext)="callbackErrorsNotify($event)">
 </ccd-callback-errors>
 <div class="width-50">
-  <form *ngIf="currentPage" class="form" [formGroup]="editForm" (submit)="submit()">
+  <form *ngIf="currentPage" class="form" [formGroup]="editForm" (submit)="nextStep()">
     <fieldset id="fieldset-case-data">
       <legend style="display: none;"></legend>
       <!-- single column -->
@@ -62,7 +62,7 @@ <h2 class="govuk-error-summary__title" id="error-summary-title">
     </fieldset>
 
     <div class="form-group form-group-related">
-      <button class="button button-secondary" type="button" [disabled]="!(hasPreviousPage$ | async)" (click)="toPreviousPage()">
+      <button class="button button-secondary" type="button" (click)="toPreviousPage()" *ngIf="!isAtStart()" [disabled]="isAtStart()">
         {{'Previous' | rpxTranslate}}
       </button>
       <button class="button" type="submit" [disabled]="submitting()">{{triggerText | rpxTranslate}}</button>