@hmcts/ccd-case-ui-toolkit 7.1.30 → 7.1.31-event-spinner

package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs

@@ -8,10 +8,10 @@ import * as i1$1 from '@angular/router';
 import { RouterModule, NavigationStart, NavigationEnd } from '@angular/router';
 import * as i4 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormArray, FormGroup, FormControl, Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { throwError, Subject, EMPTY, Observable, BehaviorSubject, of, timer, fromEvent, forkJoin, Subscription, combineLatest } from 'rxjs';
+import { BehaviorSubject, throwError, Subject, EMPTY, Observable, of, timer, fromEvent, forkJoin, Subscription, combineLatest } from 'rxjs';
 import * as i1$2 from '@angular/common/http';
 import { HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
-import { catchError, map, publish, refCount, switchMap, debounceTime, delay, distinctUntilChanged, finalize, timeout, mergeMap, retryWhen, tap, delayWhen, publishReplay, take, first, takeUntil, filter } from 'rxjs/operators';
+import { distinctUntilChanged, catchError, map, publish, refCount, switchMap, debounceTime, delay, finalize, timeout, mergeMap, retryWhen, tap, delayWhen, publishReplay, take, first, takeUntil, filter } from 'rxjs/operators';
 import { polling } from 'rx-polling-hmcts';
 import { Type, Expose, plainToClassFromExist, plainToClass } from 'class-transformer';
 import moment from 'moment';
@@ -1400,10 +1400,70 @@ class AuthService {
                 args: [DOCUMENT]
             }] }], null); })();
 
+class LoadingService {
+    registered = new Map();
+    loading = new BehaviorSubject(false);
+    sharedSpinners = [];
+    get isLoading() {
+        return this.loading.pipe(distinctUntilChanged());
+    }
+    register() {
+        const token = this.generateToken();
+        this.registered.set(token, token);
+        this.loading.next(true);
+        return token;
+    }
+    unregister(token) {
+        this.registered.delete(token);
+        this.loading.next(this.registered.size > 0);
+    }
+    addSharedSpinner(spinnerId) {
+        this.sharedSpinners.push(spinnerId);
+    }
+    hasSharedSpinner() {
+        return this.sharedSpinners.length > 0;
+    }
+    unregisterSharedSpinner() {
+        this.registered.delete(this.sharedSpinners[0]);
+        this.sharedSpinners.shift();
+        this.loading.next(this.registered.size > 0);
+    }
+    generateToken() {
+        const timestamp = window.performance.now();
+        return `toolkit-loading-${timestamp}`; // format: [source-library]-[unique incrementing number]
+    }
+    static ɵfac = function LoadingService_Factory(t) { return new (t || LoadingService)(); };
+    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: LoadingService, factory: LoadingService.ɵfac });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LoadingService, [{
+        type: Injectable
+    }], null, null); })();
+
+class LoadingModule {
+    static ɵfac = function LoadingModule_Factory(t) { return new (t || LoadingModule)(); };
+    static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: LoadingModule });
+    static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
+            LoadingService
+        ] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LoadingModule, [{
+        type: NgModule,
+        args: [{
+                imports: [],
+                declarations: [],
+                exports: [],
+                providers: [
+                    LoadingService
+                ]
+            }]
+    }], null, null); })();
+
 class HttpErrorService {
     authService;
-    constructor(authService) {
+    loadingService;
+    constructor(authService, loadingService) {
         this.authService = authService;
+        this.loadingService = loadingService;
     }
     static CONTENT_TYPE = 'Content-Type';
     static JSON = 'json';
@@ -1447,18 +1507,21 @@ class HttpErrorService {
     handle(error, redirectIfNotAuthorised = true) {
         console.error('Handling error in http error service.');
         console.error(error);
+        if (this.loadingService.hasSharedSpinner()) {
+            this.loadingService.unregisterSharedSpinner();
+        }
         const httpError = HttpErrorService.convertToHttpError(error);
         if (redirectIfNotAuthorised && httpError.status === 401) {
             this.authService.signIn();
         }
         return throwError(httpError);
     }
-    static ɵfac = function HttpErrorService_Factory(t) { return new (t || HttpErrorService)(i0.ɵɵinject(AuthService)); };
+    static ɵfac = function HttpErrorService_Factory(t) { return new (t || HttpErrorService)(i0.ɵɵinject(AuthService), i0.ɵɵinject(LoadingService)); };
     static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: HttpErrorService, factory: HttpErrorService.ɵfac });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(HttpErrorService, [{
         type: Injectable
-    }], () => [{ type: AuthService }], null); })();
+    }], () => [{ type: AuthService }, { type: LoadingService }], null); })();
 
 class HttpService {
     httpclient;
@@ -7319,33 +7382,6 @@ class RequestOptionsBuilder {
         type: Injectable
     }], null, null); })();
 
-class LoadingService {
-    registered = new Map();
-    loading = new BehaviorSubject(false);
-    get isLoading() {
-        return this.loading.pipe(distinctUntilChanged());
-    }
-    register() {
-        const token = this.generateToken();
-        this.registered.set(token, token);
-        this.loading.next(true);
-        return token;
-    }
-    unregister(token) {
-        this.registered.delete(token);
-        this.loading.next(this.registered.size > 0);
-    }
-    generateToken() {
-        const timestamp = window.performance.now();
-        return `toolkit-loading-${timestamp}`; // format: [source-library]-[unique incrementing number]
-    }
-    static ɵfac = function LoadingService_Factory(t) { return new (t || LoadingService)(); };
-    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: LoadingService, factory: LoadingService.ɵfac });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LoadingService, [{
-        type: Injectable
-    }], null, null); })();
-
 class SearchService {
     appConfig;
     httpService;
@@ -7798,25 +7834,6 @@ class BrowserService {
         type: Injectable
     }], null, null); })();
 
-class LoadingModule {
-    static ɵfac = function LoadingModule_Factory(t) { return new (t || LoadingModule)(); };
-    static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: LoadingModule });
-    static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ providers: [
-            LoadingService
-        ] });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LoadingModule, [{
-        type: NgModule,
-        args: [{
-                imports: [],
-                declarations: [],
-                exports: [],
-                providers: [
-                    LoadingService
-                ]
-            }]
-    }], null, null); })();
-
 class CaseAccessUtils {
     // User role mapping
     static JUDGE_ROLE = 'judge';
@@ -16679,8 +16696,8 @@ class LinkCasesComponent {
         })), this.validatorsUtils.formArraySelectedValidator());
     }
     toggleLinkCaseReasonOtherComments(event) {
-        this.linkCaseReasons.find(reason => reason.value_en === event.target.value).selected = event.target.checked;
-        this.showComments = this.linkCaseReasons.find(reason => reason.value_en === 'Other').selected;
+        this.linkCaseReasons.find((reason) => reason.value_en === event.target.value).selected = event.target.checked;
+        this.showComments = this.linkCaseReasons.find((reason) => reason.value_en === 'Other')?.selected;
     }
     submitCaseInfo() {
         this.errorMessages = [];
@@ -16719,7 +16736,7 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-number',
                 description: LinkedCasesErrorMessages.CaseNumberError,
-                fieldId: 'caseNumber',
+                fieldId: 'caseNumber'
             });
         }
         if (this.linkCaseForm.controls.reasonType.invalid) {
@@ -16727,17 +16744,17 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-reason',
                 description: LinkedCasesErrorMessages.ReasonSelectionError,
-                fieldId: 'caseReason',
+                fieldId: 'caseReason'
             });
         }
         if (this.linkCaseForm.controls.reasonType.valid
-            && this.linkCaseReasons.find(reason => reason.value_en === 'Other').selected) {
+            && this.linkCaseReasons.find((reason) => reason.value_en === 'Other').selected) {
             if (this.linkCaseForm.controls.otherDescription.value.trim().length === 0) {
                 this.caseReasonCommentsError = LinkedCasesErrorMessages.otherDescriptionError;
                 this.errorMessages.push({
                     title: 'dummy-case-reason-comments',
                     description: LinkedCasesErrorMessages.otherDescriptionError,
-                    fieldId: 'otherDescription',
+                    fieldId: 'otherDescription'
                 });
             }
             if (this.linkCaseForm.controls.otherDescription.value.trim().length > 100) {
@@ -16745,7 +16762,7 @@ class LinkCasesComponent {
                 this.errorMessages.push({
                     title: 'dummy-case-reason-comments',
                     description: LinkedCasesErrorMessages.otherDescriptionMaxLengthError,
-                    fieldId: 'otherDescription',
+                    fieldId: 'otherDescription'
                 });
             }
         }
@@ -16754,7 +16771,7 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-number',
                 description: LinkedCasesErrorMessages.CaseProposedError,
-                fieldId: 'caseNumber',
+                fieldId: 'caseNumber'
             });
         }
         if (this.isCaseSelected(this.linkedCasesService.linkedCases)) {
@@ -16762,14 +16779,14 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-number',
                 description: LinkedCasesErrorMessages.CasesLinkedError,
-                fieldId: 'caseNumber',
+                fieldId: 'caseNumber'
             });
         }
         if (this.linkCaseForm.value.caseNumber.split('-').join('') === this.linkedCasesService.caseId.split('-').join('')) {
             this.errorMessages.push({
                 title: 'dummy-case-number',
                 description: LinkedCasesErrorMessages.ProposedCaseWithIn,
-                fieldId: 'caseNumber',
+                fieldId: 'caseNumber'
             });
         }
         window.scrollTo(0, 0);
@@ -16790,7 +16807,7 @@ class LinkCasesComponent {
                 caseState: caseView.state.name || '',
                 caseStateDescription: caseView.state.description || '',
                 caseService: caseView.case_type && caseView.case_type.jurisdiction && caseView.case_type.jurisdiction.description || '',
-                caseName: this.linkedCasesService.getCaseName(caseView),
+                caseName: this.linkedCasesService.getCaseName(caseView)
             };
             const ccdApiCaseLinkData = {
                 CaseReference: caseView.case_id,
@@ -16803,7 +16820,7 @@ class LinkCasesComponent {
             }
             this.linkedCasesService.caseFieldValue.push({ id: caseView.case_id.toString(), value: ccdApiCaseLinkData });
             this.selectedCases.push(caseLink);
-            this.linkCaseReasons.forEach(reason => reason.selected = false);
+            this.linkCaseReasons.forEach((reason) => reason.selected = false);
             this.initForm();
             this.emitLinkedCasesState(false);
         }, (error) => {
@@ -16811,7 +16828,7 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-number',
                 description: LinkedCasesErrorMessages.CaseCheckAgainError,
-                fieldId: 'caseNumber',
+                fieldId: 'caseNumber'
             });
             this.emitLinkedCasesState(false);
             window.scrollTo(0, 0);
@@ -16823,7 +16840,7 @@ class LinkCasesComponent {
         this.linkedCasesStateEmitter.emit({
             currentLinkedCasesPage: LinkedCasesPages.LINK_CASE,
             errorMessages: this.errorMessages,
-            navigateToNextPage: isNavigateToNextPage,
+            navigateToNextPage: isNavigateToNextPage
         });
     }
     getSelectedCaseReasons() {
@@ -16858,7 +16875,7 @@ class LinkCasesComponent {
     }
     onSelectedLinkedCaseRemove(pos, selectedCaseReference) {
         const caseFieldValue = this.linkedCasesService.caseFieldValue || [];
-        const updatedItems = caseFieldValue.filter(item => item.value && item.value.CaseReference !== selectedCaseReference);
+        const updatedItems = caseFieldValue.filter((item) => item.value && item.value.CaseReference !== selectedCaseReference);
         if (updatedItems) {
             this.linkedCasesService.caseFieldValue = updatedItems;
         }
@@ -16879,7 +16896,7 @@ class LinkCasesComponent {
             this.errorMessages.push({
                 title: 'dummy-case-selection',
                 description: LinkedCasesErrorMessages.CaseSelectionError,
-                fieldId: 'caseReason',
+                fieldId: 'caseReason'
             });
             navigateToNextPage = false;
         }
@@ -17614,7 +17631,7 @@ class UnLinkCasesComponent {
         }
         else {
             this.casesService.getCaseViewV2(this.caseId).subscribe((caseView) => {
-                const linkedCasesTab = caseView.tabs.find(tab => tab.id === UnLinkCasesComponent.LINKED_CASES_TAB_ID);
+                const linkedCasesTab = caseView.tabs.find((tab) => tab.id === UnLinkCasesComponent.LINKED_CASES_TAB_ID);
                 if (linkedCasesTab) {
                     const linkedCases = linkedCasesTab.fields[0].value;
                     this.linkedCases = linkedCases;
@@ -17626,22 +17643,22 @@ class UnLinkCasesComponent {
     }
     getAllLinkedCaseInformation() {
         const searchCasesResponse = [];
-        this.linkedCases.forEach(linkedCase => {
+        this.linkedCases.forEach((linkedCase) => {
             searchCasesResponse.push(this.casesService.getCaseViewV2(linkedCase.caseReference));
         });
         if (searchCasesResponse.length) {
             this.searchCasesByCaseIds(searchCasesResponse).subscribe((searchCases) => {
                 searchCases.forEach((response) => {
-                    const linkedCaseFromList = this.linkedCases.find(linkedCase => linkedCase.caseReference === response.case_id);
+                    const linkedCaseFromList = this.linkedCases.find((linkedCase) => linkedCase.caseReference === response.case_id);
                     if (linkedCaseFromList) {
                         const caseName = this.linkedCasesService.getCaseName(response);
-                        this.linkedCases.find(linkedCase => linkedCase.caseReference === response.case_id).caseName = caseName;
+                        this.linkedCases.find((linkedCase) => linkedCase.caseReference === response.case_id).caseName = caseName;
                     }
                 });
                 this.initForm();
                 this.linkedCasesService.linkedCases = this.linkedCases;
                 this.isServerError = false;
-            }, err => {
+            }, (err) => {
                 this.isServerError = true;
                 this.notifyAPIFailure.emit(true);
             });
@@ -17656,7 +17673,7 @@ class UnLinkCasesComponent {
         });
     }
     get getLinkedCasesFormArray() {
-        const formFieldArray = this.linkedCases.map(val => this.fb.group({
+        const formFieldArray = this.linkedCases.map((val) => this.fb.group({
             caseReference: val.caseReference,
             reasons: val.reasons,
             createdDateTime: val.createdDateTime,
@@ -17670,7 +17687,7 @@ class UnLinkCasesComponent {
     }
     onChange(caseSelected) {
         this.resetErrorMessages();
-        const selectedCase = this.linkedCases.find(linkedCase => linkedCase.caseReference === caseSelected.value);
+        const selectedCase = this.linkedCases.find((linkedCase) => linkedCase.caseReference === caseSelected.value);
         if (selectedCase) {
             selectedCase.unlink = caseSelected.checked ? true : false;
         }
@@ -17678,7 +17695,7 @@ class UnLinkCasesComponent {
     onNext() {
         this.resetErrorMessages();
         let navigateToNextPage = true;
-        const casesMarkedToUnlink = this.linkedCases.find(linkedCase => linkedCase.unlink && linkedCase.unlink === true);
+        const casesMarkedToUnlink = this.linkedCases.find((linkedCase) => linkedCase.unlink && linkedCase.unlink === true);
         if (!casesMarkedToUnlink) {
             this.errorMessages.push({
                 title: 'case-selection',
@@ -17696,7 +17713,7 @@ class UnLinkCasesComponent {
         this.linkedCasesStateEmitter.emit({
             currentLinkedCasesPage: LinkedCasesPages.UNLINK_CASE,
             errorMessages: this.errorMessages,
-            navigateToNextPage: isNavigateToNextPage,
+            navigateToNextPage: isNavigateToNextPage
         });
     }
     resetErrorMessages() {
@@ -18039,14 +18056,16 @@ class WriteLinkedCasesFieldComponent extends AbstractFieldWriteComponent {
         // Get linked case reasons from ref data
         this.linkedCasesService.editMode = false;
         this.subscriptions.add(this.caseEditDataService.caseDetails$.subscribe({
-            next: caseDetails => { this.initialiseCaseDetails(caseDetails); }
+            next: (caseDetails) => {
+                this.initialiseCaseDetails(caseDetails);
+            }
         }));
         this.getOrgService();
         this.subscriptions.add(this.caseEditDataService.caseEventTriggerName$.subscribe({
-            next: name => this.linkedCasesService.isLinkedCasesEventTrigger = (name === LinkedCasesEventTriggers.LINK_CASES)
+            next: (name) => this.linkedCasesService.isLinkedCasesEventTrigger = (name === LinkedCasesEventTriggers.LINK_CASES)
         }));
         this.subscriptions.add(this.caseEditDataService.caseEditForm$.subscribe({
-            next: editForm => this.caseEditForm = editForm
+            next: (editForm) => this.caseEditForm = editForm
         }));
     }
     initialiseCaseDetails(caseDetails) {
@@ -18122,13 +18141,28 @@ class WriteLinkedCasesFieldComponent extends AbstractFieldWriteComponent {
         }
     }
     submitLinkedCases() {
+        let caseFieldValue = [...(this.linkedCasesService.caseFieldValue || [])];
         if (!this.linkedCasesService.isLinkedCasesEventTrigger) {
-            const unlinkedCaseRefereneIds = this.linkedCasesService.linkedCases.filter(item => item.unlink).map(item => item.caseReference);
-            const caseFieldValue = this.linkedCasesService.caseFieldValue;
-            this.linkedCasesService.caseFieldValue = caseFieldValue.filter(item => unlinkedCaseRefereneIds.indexOf(item.id) === -1);
+            const unlinkedCaseReferenceIds = this.linkedCasesService.linkedCases
+                .filter((item) => item.unlink)
+                .map((item) => item.caseReference);
+            caseFieldValue = caseFieldValue.filter((item) => !unlinkedCaseReferenceIds.includes(item.id));
+        }
+        // Replace the caseLinks value in this.formGroup
+        this.formGroup.patchValue({
+            caseLinks: caseFieldValue
+        });
+        // Replace the caseLinks control in caseEditForm.controls.data
+        const dataFormGroup = this.caseEditForm.controls.data;
+        if (dataFormGroup) {
+            // Remove the existing caseLinks control (if it exists)
+            if (dataFormGroup.contains('caseLinks')) {
+                dataFormGroup.removeControl('caseLinks');
+            }
+            // Add the new control with the replacement value
+            dataFormGroup.addControl('caseLinks', new FormControl(caseFieldValue || []));
         }
-        this.formGroup.value.caseLinks = this.linkedCasesService.caseFieldValue;
-        this.caseEditForm.controls['data'] = new FormGroup({ caseLinks: new FormControl(this.linkedCasesService.caseFieldValue || []) });
+        // Set the updated form in the caseEditDataService
         this.caseEditDataService.setCaseEditForm(this.caseEditForm);
     }
     isAtFinalPage() {
@@ -18145,11 +18179,11 @@ class WriteLinkedCasesFieldComponent extends AbstractFieldWriteComponent {
     }
     getLinkedCases() {
         this.casesService.getCaseViewV2(this.linkedCasesService.caseId).subscribe((caseView) => {
-            const caseViewFiltered = caseView.tabs.filter(tab => {
+            const caseViewFiltered = caseView.tabs.filter((tab) => {
                 return tab.fields.some(({ field_type }) => field_type && field_type.collection_field_type && field_type.collection_field_type.id === 'CaseLink');
             });
             if (caseViewFiltered) {
-                const caseLinkFieldValue = caseViewFiltered.map(filtered => filtered.fields?.length > 0 && filtered.fields.filter(field => field.id === 'caseLinks')[0].value);
+                const caseLinkFieldValue = caseViewFiltered.map((filtered) => filtered.fields?.length > 0 && filtered.fields.filter((field) => field.id === 'caseLinks')[0].value);
                 this.linkedCasesService.caseFieldValue = caseLinkFieldValue.length ? caseLinkFieldValue[0] : [];
                 this.linkedCasesService.getAllLinkedCaseInformation();
             }
@@ -18189,7 +18223,7 @@ class WriteLinkedCasesFieldComponent extends AbstractFieldWriteComponent {
         type: Component,
         args: [{ selector: 'ccd-write-linked-cases-field', template: "<div class=\"form-group govuk-!-margin-bottom-2\" [formGroup]=\"formGroup\">\n  <div class=\"govuk-form-group\" [ngSwitch]=\"linkedCasesPage\">\n    <ng-container *ngSwitchCase=\"linkedCasesPages.BEFORE_YOU_START\">\n      <ccd-linked-cases-before-you-start\n        (linkedCasesStateEmitter)=\"onLinkedCasesStateEmitted($event)\"></ccd-linked-cases-before-you-start>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"linkedCasesPages.NO_LINKED_CASES\">\n      <ccd-no-linked-cases\n        (linkedCasesStateEmitter)=\"onLinkedCasesStateEmitted($event)\"></ccd-no-linked-cases>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"linkedCasesPages.LINK_CASE\">\n      <ccd-link-cases\n        (linkedCasesStateEmitter)=\"onLinkedCasesStateEmitted($event)\"></ccd-link-cases>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"linkedCasesPages.UNLINK_CASE\">\n      <ccd-unlink-cases\n        (linkedCasesStateEmitter)=\"onLinkedCasesStateEmitted($event)\"></ccd-unlink-cases>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"linkedCasesPages.CHECK_YOUR_ANSWERS\">\n      <ccd-linked-cases-check-your-answers\n        (linkedCasesStateEmitter)=\"onLinkedCasesStateEmitted($event)\"></ccd-linked-cases-check-your-answers>\n    </ng-container>\n  </div>\n</div>\n" }]
     }], () => [{ type: AbstractAppConfig }, { type: CommonDataService }, { type: CasesService }, { type: LinkedCasesService }, { type: CaseEditDataService }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteLinkedCasesFieldComponent, { className: "WriteLinkedCasesFieldComponent", filePath: "lib/shared/components/palette/linked-cases/write-linked-cases-field.component.ts", lineNumber: 19 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteLinkedCasesFieldComponent, { className: "WriteLinkedCasesFieldComponent", filePath: "lib/shared/components/palette/linked-cases/write-linked-cases-field.component.ts", lineNumber: 18 }); })();
 
 function ReadMoneyGbpFieldComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -32262,13 +32296,14 @@ class EventTriggerResolver {
     router;
     appConfig;
     errorNotifier;
+    loadingService;
     static PARAM_CASE_ID = 'cid';
     static PARAM_EVENT_ID = 'eid';
     static IGNORE_WARNING = 'ignoreWarning';
     static IGNORE_WARNING_VALUES = ['true', 'false'];
     cachedEventTrigger;
     cachedProfile;
-    constructor(casesService, alertService, profileService, profileNotifier, router, appConfig, errorNotifier) {
+    constructor(casesService, alertService, profileService, profileNotifier, router, appConfig, errorNotifier, loadingService) {
         this.casesService = casesService;
         this.alertService = alertService;
         this.profileService = profileService;
@@ -32276,6 +32311,7 @@ class EventTriggerResolver {
         this.router = router;
         this.appConfig = appConfig;
         this.errorNotifier = errorNotifier;
+        this.loadingService = loadingService;
     }
     resolve(route) {
         return this.isRootTriggerEventRoute(route) ? this.getAndCacheEventTrigger(route)
@@ -32306,7 +32342,7 @@ class EventTriggerResolver {
         }
         return this.casesService
             .getEventTrigger(caseTypeId, eventTriggerId, cid, ignoreWarning)
-            .pipe(map(eventTrigger => this.cachedEventTrigger = eventTrigger), catchError(error => {
+            .pipe(map((eventTrigger) => this.cachedEventTrigger = eventTrigger), catchError((error) => {
             error.details = { eventId: eventTriggerId, ...error.details };
             this.alertService.setPreserveAlerts(true);
             this.alertService.error(error.message);
@@ -32315,12 +32351,12 @@ class EventTriggerResolver {
             return throwError(error);
         })).toPromise();
     }
-    static ɵfac = function EventTriggerResolver_Factory(t) { return new (t || EventTriggerResolver)(i0.ɵɵinject(CasesService), i0.ɵɵinject(AlertService), i0.ɵɵinject(ProfileService), i0.ɵɵinject(ProfileNotifier), i0.ɵɵinject(i1$1.Router), i0.ɵɵinject(AbstractAppConfig), i0.ɵɵinject(ErrorNotifierService)); };
+    static ɵfac = function EventTriggerResolver_Factory(t) { return new (t || EventTriggerResolver)(i0.ɵɵinject(CasesService), i0.ɵɵinject(AlertService), i0.ɵɵinject(ProfileService), i0.ɵɵinject(ProfileNotifier), i0.ɵɵinject(i1$1.Router), i0.ɵɵinject(AbstractAppConfig), i0.ɵɵinject(ErrorNotifierService), i0.ɵɵinject(LoadingService)); };
     static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: EventTriggerResolver, factory: EventTriggerResolver.ɵfac });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EventTriggerResolver, [{
         type: Injectable
-    }], () => [{ type: CasesService }, { type: AlertService }, { type: ProfileService }, { type: ProfileNotifier }, { type: i1$1.Router }, { type: AbstractAppConfig }, { type: ErrorNotifierService }], null); })();
+    }], () => [{ type: CasesService }, { type: AlertService }, { type: ProfileService }, { type: ProfileNotifier }, { type: i1$1.Router }, { type: AbstractAppConfig }, { type: ErrorNotifierService }, { type: LoadingService }], null); })();
 
 function CaseEventTriggerComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -32346,6 +32382,7 @@ class CaseEventTriggerComponent {
     caseReferencePipe;
     activityPollingService;
     sessionStorageService;
+    loadingService;
     static EVENT_COMPLETION_MESSAGE = `Case #%CASEREFERENCE% has been updated with event: %NAME%`;
     static CALLBACK_FAILED_MESSAGE = ' but the callback service cannot be completed';
     BANNER = DisplayMode.BANNER;
@@ -32354,7 +32391,7 @@ class CaseEventTriggerComponent {
     activitySubscription;
     caseSubscription;
     parentUrl;
-    constructor(ngZone, casesService, caseNotifier, router, alertService, route, caseReferencePipe, activityPollingService, sessionStorageService) {
+    constructor(ngZone, casesService, caseNotifier, router, alertService, route, caseReferencePipe, activityPollingService, sessionStorageService, loadingService) {
         this.ngZone = ngZone;
         this.casesService = casesService;
         this.caseNotifier = caseNotifier;
@@ -32364,8 +32401,12 @@ class CaseEventTriggerComponent {
         this.caseReferencePipe = caseReferencePipe;
         this.activityPollingService = activityPollingService;
         this.sessionStorageService = sessionStorageService;
+        this.loadingService = loadingService;
     }
     ngOnInit() {
+        if (this.loadingService.hasSharedSpinner()) {
+            this.loadingService.unregisterSharedSpinner();
+        }
         if (this.route.snapshot.data.case) {
             this.caseDetails = this.route.snapshot.data.case;
         }
@@ -32452,7 +32493,7 @@ class CaseEventTriggerComponent {
     isDataLoaded() {
         return !!(this.eventTrigger && this.caseDetails);
     }
-    static ɵfac = function CaseEventTriggerComponent_Factory(t) { return new (t || CaseEventTriggerComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(CasesService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(CaseReferencePipe), i0.ɵɵdirectiveInject(ActivityPollingService), i0.ɵɵdirectiveInject(SessionStorageService)); };
+    static ɵfac = function CaseEventTriggerComponent_Factory(t) { return new (t || CaseEventTriggerComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(CasesService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(CaseReferencePipe), i0.ɵɵdirectiveInject(ActivityPollingService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(LoadingService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventTriggerComponent, selectors: [["ccd-case-event-trigger"]], decls: 1, vars: 1, consts: [["class", "screen-990", 4, "ngIf"], [1, "screen-990"], [3, "caseId", "displayMode"], [3, "cancelled", "submitted", "caseDetails", "submit", "validate", "eventTrigger"]], template: function CaseEventTriggerComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseEventTriggerComponent_div_0_Template, 3, 6, "div", 0);
         } if (rf & 2) {
@@ -32462,7 +32503,7 @@ class CaseEventTriggerComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEventTriggerComponent, [{
         type: Component,
         args: [{ selector: 'ccd-case-event-trigger', template: "<div *ngIf=\"isDataLoaded()\" class=\"screen-990\">\n  <ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n  <ccd-case-edit [caseDetails]=\"caseDetails\"\n                 [submit]=\"submit()\"\n                 [validate]=\"validate()\"\n                 [eventTrigger]=\"eventTrigger\"\n                 (cancelled)=\"cancel()\"\n                 (submitted)=\"submitted($event)\"></ccd-case-edit>\n</div>\n" }]
-    }], () => [{ type: i0.NgZone }, { type: CasesService }, { type: CaseNotifier }, { type: i1$1.Router }, { type: AlertService }, { type: i1$1.ActivatedRoute }, { type: CaseReferencePipe }, { type: ActivityPollingService }, { type: SessionStorageService }], null); })();
+    }], () => [{ type: i0.NgZone }, { type: CasesService }, { type: CaseNotifier }, { type: i1$1.Router }, { type: AlertService }, { type: i1$1.ActivatedRoute }, { type: CaseReferencePipe }, { type: ActivityPollingService }, { type: SessionStorageService }, { type: LoadingService }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventTriggerComponent, { className: "CaseEventTriggerComponent", filePath: "lib/shared/components/case-viewer/case-event-trigger/case-event-trigger.component.ts", lineNumber: 14 }); })();
 
 function CaseViewComponent_div_0_Template(rf, ctx) { if (rf & 1) {
@@ -33126,6 +33167,7 @@ class CaseFullAccessViewComponent {
     crf;
     sessionStorageService;
     rpxTranslationPipe;
+    loadingService;
     static ORIGIN_QUERY_PARAM = 'origin';
     static TRIGGER_TEXT_START = 'Go';
     static TRIGGER_TEXT_CONTINUE = 'Ignore Warning and Go';
@@ -33162,7 +33204,7 @@ class CaseFullAccessViewComponent {
     eventId;
     callbackErrorsSubject;
     tabGroup;
-    constructor(ngZone, route, router, navigationNotifierService, orderService, activityPollingService, dialog, alertService, draftService, errorNotifierService, convertHrefToRouterService, location, crf, sessionStorageService, rpxTranslationPipe) {
+    constructor(ngZone, route, router, navigationNotifierService, orderService, activityPollingService, dialog, alertService, draftService, errorNotifierService, convertHrefToRouterService, location, crf, sessionStorageService, rpxTranslationPipe, loadingService) {
         this.ngZone = ngZone;
         this.route = route;
         this.router = router;
@@ -33178,6 +33220,7 @@ class CaseFullAccessViewComponent {
         this.crf = crf;
         this.sessionStorageService = sessionStorageService;
         this.rpxTranslationPipe = rpxTranslationPipe;
+        this.loadingService = loadingService;
     }
     ngOnInit() {
         this.callbackErrorsSubject = this.errorNotifierService.errorSource.pipe(filter((x) => {
@@ -33259,6 +33302,8 @@ class CaseFullAccessViewComponent {
         this.triggerText = CaseFullAccessViewComponent.TRIGGER_TEXT_START;
     }
     async applyTrigger(trigger) {
+        const spinner = this.loadingService.register();
+        this.loadingService.addSharedSpinner(spinner);
         this.errorNotifierService.announceError(null);
         const theQueryParams = {};
         if (this.ignoreWarning) {
@@ -33509,7 +33554,7 @@ class CaseFullAccessViewComponent {
         this.errorNotifierService.announceError(null);
         this.alertService.clear();
     }
-    static ɵfac = function CaseFullAccessViewComponent_Factory(t) { return new (t || CaseFullAccessViewComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(NavigationNotifierService), i0.ɵɵdirectiveInject(OrderService), i0.ɵɵdirectiveInject(ActivityPollingService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(DraftService), i0.ɵɵdirectiveInject(ErrorNotifierService), i0.ɵɵdirectiveInject(ConvertHrefToRouterService), i0.ɵɵdirectiveInject(i5.Location), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(i1.RpxTranslatePipe)); };
+    static ɵfac = function CaseFullAccessViewComponent_Factory(t) { return new (t || CaseFullAccessViewComponent)(i0.ɵɵdirectiveInject(i0.NgZone), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(NavigationNotifierService), i0.ɵɵdirectiveInject(OrderService), i0.ɵɵdirectiveInject(ActivityPollingService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(DraftService), i0.ɵɵdirectiveInject(ErrorNotifierService), i0.ɵɵdirectiveInject(ConvertHrefToRouterService), i0.ɵɵdirectiveInject(i5.Location), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(i1.RpxTranslatePipe), i0.ɵɵdirectiveInject(LoadingService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFullAccessViewComponent, selectors: [["ccd-case-full-access-view"]], viewQuery: function CaseFullAccessViewComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0$b, 5);
         } if (rf & 2) {
@@ -33554,7 +33599,7 @@ class CaseFullAccessViewComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFullAccessViewComponent, [{
         type: Component,
         args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup?.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup?.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
-    }], () => [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i5.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }], { hasPrint: [{
+    }], () => [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i5.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }, { type: LoadingService }], { hasPrint: [{
             type: Input
         }], hasEventSelector: [{
             type: Input
@@ -33568,7 +33613,7 @@ class CaseFullAccessViewComponent {
             type: ViewChild,
             args: ['tabGroup', { static: false }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFullAccessViewComponent, { className: "CaseFullAccessViewComponent", filePath: "lib/shared/components/case-viewer/case-full-access-view/case-full-access-view.component.ts", lineNumber: 43 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFullAccessViewComponent, { className: "CaseFullAccessViewComponent", filePath: "lib/shared/components/case-viewer/case-full-access-view/case-full-access-view.component.ts", lineNumber: 44 }); })();
 
 class PrintUrlPipe {
     appConfig;