@hmcts/ccd-case-ui-toolkit 4.7.0-EUI-4452-wrong-document-collection → 4.7.0-EUI-4567-nested-fields-collection

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 /**
  * @hmcts/ccd-case-ui-toolkit - Case UI Toolkit
- * @version v4.7.0-EUI-4452-wrong-document-collection
+ * @version v4.7.0-EUI-4567-nested-fields-collection
  * @link undefined
  * @license MIT
  */
@@ -10754,6 +10754,9 @@ var AbstractAppConfig = /** @class */ (function () {
     AbstractAppConfig.prototype.getLocationRefApiUrl = function () {
         return undefined;
     };
+    AbstractAppConfig.prototype.getCamRoleAssignmentsApiUrl = function () {
+        return undefined;
+    };
     return AbstractAppConfig;
 }());
 exports.AbstractAppConfig = AbstractAppConfig;
@@ -12379,6 +12382,82 @@ __export(__webpack_require__(41580));
 __export(__webpack_require__(4765));
 
 
+/***/ }),
+
+/***/ 25919:
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+var CaseAccessUtils = /** @class */ (function () {
+    function CaseAccessUtils() {
+    }
+    CaseAccessUtils.prototype.getMappedRoleCategory = function (roles, roleCategories) {
+        var roleKeywords = roles.join().split('-').join().split(',');
+        if (this.roleOrCategoryExists(CaseAccessUtils.JUDGE_ROLE, CaseAccessUtils.JUDGE_ROLE_CATEGORY, roleKeywords, roleCategories)) {
+            return CaseAccessUtils.JUDGE_ROLE_CATEGORY;
+        }
+        else if (this.roleOrCategoryExists(CaseAccessUtils.PROFESSIONAL_ROLE, CaseAccessUtils.PROFESSIONAL_ROLE_CATEGORY, roleKeywords, roleCategories)) {
+            return CaseAccessUtils.PROFESSIONAL_ROLE_CATEGORY;
+        }
+        else if (this.roleOrCategoryExists(CaseAccessUtils.CITIZEN_ROLE, CaseAccessUtils.CITIZEN_ROLE_CATEGORY, roleKeywords, roleCategories)) {
+            return CaseAccessUtils.CITIZEN_ROLE_CATEGORY;
+        }
+        else if (this.roleOrCategoryExists(CaseAccessUtils.ADMIN_ROLE, CaseAccessUtils.ADMIN_ROLE_CATEGORY, roleKeywords, roleCategories)) {
+            return CaseAccessUtils.ADMIN_ROLE_CATEGORY;
+        }
+        else {
+            return CaseAccessUtils.LEGAL_OPERATIONS_ROLE_CATEGORY;
+        }
+    };
+    CaseAccessUtils.prototype.roleOrCategoryExists = function (roleKeyword, roleCategory, roleKeywords, roleCategories) {
+        var categoryExists = roleCategories.indexOf(roleCategory) > -1;
+        var keywordExists = roleKeywords.indexOf(roleKeyword) > -1;
+        return categoryExists ? categoryExists : keywordExists;
+    };
+    CaseAccessUtils.prototype.getAMRoleName = function (accessType, aMRole) {
+        var roleName = '';
+        switch (aMRole) {
+            case CaseAccessUtils.JUDGE_ROLE_CATEGORY:
+                roleName = accessType + "-access-" + CaseAccessUtils.JUDGE_ROLE_NAME;
+                break;
+            case CaseAccessUtils.PROFESSIONAL_ROLE_CATEGORY:
+                roleName = accessType + "-access-" + CaseAccessUtils.PROFESSIONAL_ROLE_NAME;
+                break;
+            case CaseAccessUtils.CITIZEN_ROLE_CATEGORY:
+                roleName = accessType + "-access-" + CaseAccessUtils.CITIZEN_ROLE_NAME;
+                break;
+            case CaseAccessUtils.ADMIN_ROLE_CATEGORY:
+                roleName = accessType + "-access-" + CaseAccessUtils.ADMIN_ROLE_NAME;
+                break;
+            default:
+                roleName = accessType + "-access-" + CaseAccessUtils.LEGAL_OPERATIONS_ROLE_NAME;
+                break;
+        }
+        return roleName;
+    };
+    // User role mapping
+    CaseAccessUtils.JUDGE_ROLE = 'judge';
+    CaseAccessUtils.JUDGE_ROLE_CATEGORY = 'JUDICIAL';
+    CaseAccessUtils.JUDGE_ROLE_NAME = 'judicial';
+    CaseAccessUtils.ADMIN_ROLE = 'admin';
+    CaseAccessUtils.ADMIN_ROLE_CATEGORY = 'ADMIN';
+    CaseAccessUtils.ADMIN_ROLE_NAME = 'admin';
+    CaseAccessUtils.PROFESSIONAL_ROLE = 'solicitor';
+    CaseAccessUtils.PROFESSIONAL_ROLE_CATEGORY = 'PROFESSIONAL';
+    CaseAccessUtils.PROFESSIONAL_ROLE_NAME = 'professional';
+    CaseAccessUtils.LEGAL_OPERATIONS_ROLE = 'caseworker';
+    CaseAccessUtils.LEGAL_OPERATIONS_ROLE_CATEGORY = 'LEGAL_OPERATIONS';
+    CaseAccessUtils.LEGAL_OPERATIONS_ROLE_NAME = 'legal-operations';
+    CaseAccessUtils.CITIZEN_ROLE = 'citizen';
+    CaseAccessUtils.CITIZEN_ROLE_CATEGORY = 'CITIZEN';
+    CaseAccessUtils.CITIZEN_ROLE_NAME = 'citizen';
+    return CaseAccessUtils;
+}());
+exports.CaseAccessUtils = CaseAccessUtils;
+
+
 /***/ }),
 
 /***/ 19119:
@@ -12870,6 +12949,7 @@ var CaseEditPageComponent = /** @class */ (function () {
         if (this.currentPageIsNotValid()) {
             this.generateErrorMessage(this.currentPage.case_fields);
         }
+        this.showSpinner = true;
         if (!this.isSubmitting && !this.currentPageIsNotValid()) {
             this.isSubmitting = true;
             this.error = null;
@@ -12880,8 +12960,12 @@ var CaseEditPageComponent = /** @class */ (function () {
                     _this.updateFormData(jsonData);
                 }
                 _this.saveDraft();
+                _this.showSpinner = false;
                 _this.next();
-            }, function (error) { return _this.handleError(error); });
+            }, function (error) {
+                _this.showSpinner = false;
+                _this.handleError(error);
+            });
             CaseEditPageComponent_1.scrollToTop();
         }
         CaseEditPageComponent_1.setFocusToTop();
@@ -12912,8 +12996,7 @@ var CaseEditPageComponent = /** @class */ (function () {
             if (Array.isArray(theControl.value) && Array.isArray(value)
                 && theControl.value.length > value.length && theControl['caseField']
                 && theControl['caseField']['display_context'] && theControl['caseField']['display_context'] === 'OPTIONAL'
-                && theControl['caseField']['field_type'] && theControl['caseField']['field_type']['type'] === 'Collection'
-                && theControl['caseField']['field_type']['collection_field_type']['type'] === 'Document') {
+                && theControl['caseField']['field_type'] && theControl['caseField']['field_type']['type'] === 'Collection') {
                 // do nothing
             }
             else {
@@ -13715,6 +13798,7 @@ var profile_1 = __webpack_require__(59412);
 var profile_service_1 = __webpack_require__(25925);
 var router_2 = __webpack_require__(71724);
 var errors_module_1 = __webpack_require__(61386);
+var loading_spinner_component_1 = __webpack_require__(41617);
 var palette_1 = __webpack_require__(22212);
 var case_create_component_1 = __webpack_require__(19119);
 var case_edit_confirm_component_1 = __webpack_require__(26329);
@@ -13753,7 +13837,8 @@ var CaseEditorModule = /** @class */ (function () {
                 case_edit_form_component_1.CaseEditFormComponent,
                 case_edit_submit_component_1.CaseEditSubmitComponent,
                 case_create_component_1.CaseCreateComponent,
-                case_progress_component_1.CaseProgressComponent
+                case_progress_component_1.CaseProgressComponent,
+                loading_spinner_component_1.LoadingSpinnerComponent
             ],
             exports: [
                 case_edit_confirm_component_1.CaseEditConfirmComponent,
@@ -13764,6 +13849,7 @@ var CaseEditorModule = /** @class */ (function () {
                 case_create_component_1.CaseCreateComponent,
                 case_progress_component_1.CaseProgressComponent,
                 error_1.CallbackErrorsComponent,
+                loading_spinner_component_1.LoadingSpinnerComponent,
             ],
             providers: [
                 fields_utils_1.FieldsUtils,
@@ -14056,7 +14142,7 @@ var Wizard = /** @class */ (function () {
         return canShow(foundPage) ? foundPage : undefined;
     };
     Wizard.prototype.findWizardPage = function (caseFieldId, pageId) {
-        return this.pages.find(function (wizardPage) { return wizardPage.id === pageId && wizardPage.case_fields &&
+        return this.pages.find(function (wizardPage) { return wizardPage.id === pageId || wizardPage.case_fields &&
             wizardPage.case_fields.filter(function (caseField) { return caseField.id === caseFieldId; }).length > 0; });
     };
     Wizard.prototype.nextPage = function (pageId, canShow) {
@@ -14158,6 +14244,7 @@ __export(__webpack_require__(29808));
 __export(__webpack_require__(25961));
 __export(__webpack_require__(20039));
 __export(__webpack_require__(41473));
+__export(__webpack_require__(25919));
 
 
 /***/ }),
@@ -14330,6 +14417,7 @@ var app_config_1 = __webpack_require__(35185);
 var directives_1 = __webpack_require__(66395);
 var domain_1 = __webpack_require__(59346);
 var services_1 = __webpack_require__(65010);
+var case_access_utils_1 = __webpack_require__(25919);
 var wizard_page_field_to_case_field_mapper_1 = __webpack_require__(12393);
 var work_allocation_service_1 = __webpack_require__(93603);
 var CasesService = /** @class */ (function () {
@@ -14599,56 +14687,41 @@ var CasesService = /** @class */ (function () {
         return this.http.get(this.appConfig.getLocationRefApiUrl() + "/building-locations?epimms_id=" + locationId);
     };
     CasesService.prototype.createChallengedAccessRequest = function (caseId, car) {
-        // Dummy implementation for now; the real one will make a call to the Node layer, which will call the appropriate Role
         // Assignment API endpoint
-        var roleAssignmentResponse = {
+        var userInfoStr = this.sessionStorageService.getItem('userDetails');
+        var camUtils = new case_access_utils_1.CaseAccessUtils();
+        var userInfo;
+        if (userInfoStr) {
+            userInfo = JSON.parse(userInfoStr);
+        }
+        var roleCategory = camUtils.getMappedRoleCategory(userInfo.roles, userInfo.roleCategories);
+        var roleName = camUtils.getAMRoleName('challenged', roleCategory);
+        var payload = {
             roleRequest: {
-                id: '0c6f56f5-4457-485e-a0de-828e6dfa1e33',
-                authenticatedUserId: '37d4eab7-e14c-404e-8cd1-55cd06b2fc06',
-                correlationId: '003352d0-e699-48bc-b6f5-5810411e60af',
-                assignerId: '37d4eab7-e14c-404e-8cd1-55cd06b2fc06',
-                requestType: 'CREATE',
-                process: 'businessProcess1',
-                reference: 'cf07ea33-31c0-4442-b2df-e2032d21b496',
-                replaceExisting: true,
-                status: 'APPROVED',
-                created: new Date('2021-01-28T18:16:49.100121Z'),
-                log: 'Request has been approved'
+                assignerId: userInfo.id
             },
             requestedRoles: [{
-                    id: '3ccabbf2-71fa-4c5d-af39-5675d25e9fcc',
                     actorIdType: 'IDAM',
-                    actorId: 'cf07ea33-31c0-4442-b2df-e2032d21b496',
-                    roleType: 'ORGANISATION',
-                    roleName: 'judge',
+                    actorId: userInfo.id,
+                    roleType: 'CASE',
+                    roleName: roleName,
                     classification: 'PUBLIC',
+                    roleCategory: roleCategory,
                     grantType: 'CHALLENGED',
-                    roleCategory: 'JUDICIAL',
-                    readOnly: false,
-                    beginTime: new Date('2021-01-01T00:00:00Z'),
-                    endTime: new Date('2023-01-01T00:00:00Z'),
-                    process: 'businessProcess1',
-                    reference: 'cf07ea33-31c0-4442-b2df-e2032d21b496',
-                    status: 'LIVE',
-                    created: new Date('2021-01-28T18:16:49.100155Z'),
-                    log: 'Create requested with replace: true\nCreate approved : judicial_organisational_role_mapping_service_create',
+                    beginTime: new Date(),
+                    endTime: new Date(new Date().setUTCHours(23, 59, 59, 999)),
                     attributes: {
-                        jurisdiction: 'divorce',
-                        region: 'south-east',
-                        contractType: 'SALARIED'
+                        caseId: caseId
                     },
                     notes: [{
-                            userId: '003352d0-e699-48bc-b6f5-5810411e60ag',
-                            time: new Date('2020-01-01T00:00Z'),
-                            comment: 'Need Access to case number 1234567890123456 for a month'
-                        }, {
-                            userId: '52aa3810-af1f-11ea-b3de-0242ac130004',
-                            time: new Date('2020-01-02T00:00Z'),
-                            comment: 'Access granted till end of day'
-                        }]
+                            userId: userInfo.id,
+                            time: new Date(),
+                            comment: JSON.stringify(car)
+                        }
+                    ]
                 }]
         };
-        return rxjs_1.of(roleAssignmentResponse);
+        return this.http.post("" + this.appConfig.getCamRoleAssignmentsApiUrl(), payload);
     };
     var CasesService_1;
     // Internal (UI) API
@@ -16065,6 +16138,9 @@ var CaseBasicAccessViewComponent = /** @class */ (function () {
         // Navigate to the previous page
         window.history.go(-1);
     };
+    CaseBasicAccessViewComponent.prototype.getRequestUrl = function (accessType) {
+        return accessType === 'CHALLENGED' ? 'challenged-access-request' : 'specific-access-request';
+    };
     __decorate([
         core_1.Input(),
         __metadata("design:type", domain_1.CaseView)
@@ -17119,7 +17195,6 @@ var CaseViewerModule = /** @class */ (function () {
                 palette_1.EventLogModule,
                 material_1.MatTabsModule,
                 palette_1.ComplexModule,
-                forms_1.FormsModule,
                 forms_1.ReactiveFormsModule,
                 alert_1.AlertModule
             ],
@@ -17605,7 +17680,7 @@ exports.viewerRouting = [
         component: case_history_1.CaseHistoryComponent,
     },
     {
-        path: 'access-request',
+        path: 'challenged-access-request',
         children: [
             {
                 path: '',
@@ -18657,6 +18732,45 @@ __export(__webpack_require__(13370));
 __export(__webpack_require__(62240));
 
 
+/***/ }),
+
+/***/ 41617:
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+var core_1 = __webpack_require__(57208);
+var LoadingSpinnerComponent = /** @class */ (function () {
+    function LoadingSpinnerComponent() {
+        this.loadingText = 'Loading';
+    }
+    __decorate([
+        core_1.Input(),
+        __metadata("design:type", Object)
+    ], LoadingSpinnerComponent.prototype, "loadingText", void 0);
+    LoadingSpinnerComponent = __decorate([
+        core_1.Component({
+            selector: 'ccd-loading-spinner',
+            template: __webpack_require__(31851),
+            styles: [__webpack_require__(6431)],
+            encapsulation: core_1.ViewEncapsulation.None
+        })
+    ], LoadingSpinnerComponent);
+    return LoadingSpinnerComponent;
+}());
+exports.LoadingSpinnerComponent = LoadingSpinnerComponent;
+
+
 /***/ }),
 
 /***/ 47174:
@@ -19258,7 +19372,7 @@ var AbstractFieldReadComponent = /** @class */ (function (_super) {
     ], AbstractFieldReadComponent.prototype, "caseReference", void 0);
     __decorate([
         core_1.Input(),
-        __metadata("design:type", forms_1.FormGroup)
+        __metadata("design:type", Object)
     ], AbstractFieldReadComponent.prototype, "topLevelFormGroup", void 0);
     __decorate([
         core_1.Input(),
@@ -20538,7 +20652,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 var core_1 = __webpack_require__(57208);
 var directives_1 = __webpack_require__(66395);
+var domain_1 = __webpack_require__(59346);
 var fields_1 = __webpack_require__(64906);
+var class_transformer_1 = __webpack_require__(86631);
 var ReadFieldsFilterPipe = /** @class */ (function () {
     function ReadFieldsFilterPipe() {
     }
@@ -20555,10 +20671,26 @@ var ReadFieldsFilterPipe = /** @class */ (function () {
         var type = field.field_type;
         var value = ReadFieldsFilterPipe_1.getValue(field, values);
         var hasChildrenWithValue = type.complex_fields.find(function (f) {
-            return ReadFieldsFilterPipe_1.keepField(f, value);
+            var willKeep = ReadFieldsFilterPipe_1.keepField(f, value, true);
+            return willKeep && ReadFieldsFilterPipe_1.evaluateConditionalShow(f, value).hidden !== true;
         });
         return !!hasChildrenWithValue;
     };
+    ReadFieldsFilterPipe.isValidCollection = function (field, values) {
+        var isNotEmpty = Array.isArray(field.value) && field.value.length > 0;
+        if (isNotEmpty && field.field_type.collection_field_type.type === 'Complex') {
+            return !!field.value.find(function (item) {
+                var complexField = class_transformer_1.plainToClassFromExist(new domain_1.CaseField(), {
+                    id: field.field_type.collection_field_type.id,
+                    field_type: field.field_type.collection_field_type,
+                    value: item.value,
+                    label: null,
+                });
+                return ReadFieldsFilterPipe_1.isValidComplex(complexField);
+            });
+        }
+        return isNotEmpty;
+    };
     ReadFieldsFilterPipe.isEmpty = function (value) {
         return ReadFieldsFilterPipe_1.EMPTY_VALUES.indexOf(value) !== -1
             || value.length === 0;
@@ -20570,9 +20702,10 @@ var ReadFieldsFilterPipe = /** @class */ (function () {
         return ReadFieldsFilterPipe_1.isCompound(field)
             && ReadFieldsFilterPipe_1.NESTED_TYPES[field.field_type.type](field, value);
     };
-    ReadFieldsFilterPipe.keepField = function (field, value) {
+    ReadFieldsFilterPipe.keepField = function (field, value, ignoreLabels) {
+        if (ignoreLabels === void 0) { ignoreLabels = false; }
         // We shouldn't ditch labels.
-        if (field.field_type.type === 'Label' && (field.label || '').length > 0) {
+        if (!ignoreLabels && field.field_type.type === 'Label' && (field.label || '').length > 0) {
             return true;
         }
         // We also shouldn't ditch CasePaymentHistoryViewer fields.
@@ -20659,7 +20792,8 @@ var ReadFieldsFilterPipe = /** @class */ (function () {
         {}
     ];
     ReadFieldsFilterPipe.NESTED_TYPES = {
-        'Complex': ReadFieldsFilterPipe_1.isValidComplex
+        'Complex': ReadFieldsFilterPipe_1.isValidComplex,
+        'Collection': ReadFieldsFilterPipe_1.isValidCollection
     };
     ReadFieldsFilterPipe = ReadFieldsFilterPipe_1 = __decorate([
         core_1.Pipe({
@@ -24535,6 +24669,14 @@ var WriteMultiSelectListFieldComponent = /** @class */ (function (_super) {
             });
         }
         this.registerControl(this.checkboxes, true);
+        if (this.caseField.display_context && this.caseField.display_context === 'MANDATORY' && this.caseField.field_type
+            && this.caseField.field_type.type === 'MultiSelectList' && this.caseField.field_type.fixed_list_items.length > 0
+            && this.checkboxes.controls.length === 0) {
+            if (this.caseField.field_type.fixed_list_items[0].code) {
+                this.checkboxes.push(new forms_1.FormControl(this.caseField.field_type.fixed_list_items[0].code));
+                this.checkboxes.removeAt(0);
+            }
+        }
     };
     WriteMultiSelectListFieldComponent.prototype.onCheckChange = function (event) {
         var _this = this;
@@ -29056,7 +29198,27 @@ var ShowCondition = /** @class */ (function () {
         if (!this.condition) {
             return true;
         }
-        return this.matchAndConditions(fields, path);
+        return this.matchAndConditions(fields, this.updatePathName(path));
+    };
+    /**
+     * Path Name gets updated for complex sub fields
+     * @param path Path name.
+     */
+    ShowCondition.prototype.updatePathName = function (path) {
+        if (path && path.split(/[_]+/g).length > 0) {
+            var _a = path.split(/[_]+/g), pathName_1 = _a[0], pathTail = _a.slice(1);
+            var pathFinalIndex_1 = pathTail.pop();
+            var pathTailString = pathTail.toString();
+            pathTail = pathTail.map(function (value) {
+                return Number(pathFinalIndex_1) === Number(value) ? pathName_1 : value;
+            });
+            return pathTailString !== pathTail.toString()
+                ? pathName_1 + "_" + pathTail.join('_') + "_" + pathFinalIndex_1
+                : path;
+        }
+        else {
+            return path;
+        }
     };
     ShowCondition.prototype.matchByContextFields = function (contextFields) {
         return this.match(fields_utils_1.FieldsUtils.toValuesMap(contextFields));
@@ -35160,7 +35322,7 @@ var LoadingService = /** @class */ (function () {
     }
     Object.defineProperty(LoadingService.prototype, "isLoading", {
         get: function () {
-            return this.loading.asObservable().pipe(operators_1.distinctUntilChanged());
+            return this.loading.pipe(operators_1.distinctUntilChanged());
         },
         enumerable: true,
         configurable: true
@@ -37382,6 +37544,21 @@ exports.push([module.id, ".event-trigger{width:auto;margin-top:40px;margin-botto
 // exports
 
 
+/***/ }),
+
+/***/ 68929:
+/***/ ((module, exports, __webpack_require__) => {
+
+exports = module.exports = __webpack_require__(9252)(false);
+// imports
+
+
+// module
+exports.push([module.id, ".spinner-container{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,0.5);z-index:99}.spinner-container .spinner-inner-container p{text-align:center}.spinner-container .spinner-inner-container .spinner{border:10px solid #dddddd;border-top:10px solid #000000;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}\n", ""]);
+
+// exports
+
+
 /***/ }),
 
 /***/ 47029:
@@ -63469,7 +63646,7 @@ module.exports = "<ng-container ccdConditionalShowForm [formGroup]=\"formGroup\"
 /***/ 61865:
 /***/ ((module) => {
 
-module.exports = "<ng-container *ngIf=\"currentPage\">\n  <h1 *ngIf=\"!currentPage.label\" class=\"govuk-heading-l\">{{eventTrigger.name}}</h1>\n  <ng-container *ngIf=\"currentPage.label\">\n    <span class=\"govuk-caption-l\">{{ eventTrigger.name}}</span>\n    <h1 class=\"govuk-heading-l\">{{currentPage.label}}</h1>\n  </ng-container>\n</ng-container>\n\n<!--Case ID or Title -->\n<div *ngIf=\"getCaseTitle(); then titleBlock; else idBlock\"></div>\n<ng-template #titleBlock>\n  <ccd-markdown [content]=\"getCaseTitle() | ccdCaseTitle: caseFields : editForm.controls['data']\"></ccd-markdown>\n</ng-template>\n<ng-template #idBlock>\n  <h2 *ngIf=\"getCaseId()\" class=\"heading-h2\">#{{ getCaseId() | ccdCaseReference }}</h2>\n</ng-template>\n\n<!-- Error message summary -->\n<div *ngIf=\"validationErrors.length > 0\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div *ngFor=\"let validationError of validationErrors\" class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li>\n        <a (click)=\"navigateToErrorElement(validationError.id)\" class=\"validation-error\">{{validationError.message}}</a>\n      </li>\n    </ul>\n  </div>\n</div>\n\n<!-- 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=\"status\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    Something went wrong\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.</p>\n    <p><a href=\"get-help\" target=\"_blank\">Contact us</a> if you're still having problems.</p>\n  </div>\n</div>\n<!-- Event error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"status\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h3 class=\"heading-h3 error-summary-heading\" id=\"edit-case-event_error-summary-heading-3\">\n    The event could not be created\n  </h3>\n  <p>{{error.message}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\" class=\"ccd-error-summary-li\">{{fieldError.message}}</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<div class=\"width-50\">\n  <form *ngIf=\"currentPage\" class=\"form\" [formGroup]=\"editForm\" (submit)=\"submit()\">\n    <fieldset id=\"fieldset-case-data\">\n      <!-- single column -->\n      <ccd-case-edit-form id='caseEditForm' *ngIf=\"!currentPage.isMultiColumn()\" [fields]=\"currentPage.getCol1Fields()\"\n                          [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"\n                          [pageChangeSubject]=\"pageChangeSubject\"\n                          (valuesChanged)=\"applyValuesChanged($event)\"></ccd-case-edit-form>\n      <!-- two columns -->\n      <div *ngIf=\"currentPage.isMultiColumn()\" class=\"grid-row\">\n        <div class=\"column-two-thirds rightBorderSeparator\">\n          <ccd-case-edit-form id='caseEditForm1' [fields]=\"currentPage.getCol1Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n        <div class=\"column-one-third\">\n          <ccd-case-edit-form id='caseEditForm2' [fields]=\"currentPage.getCol2Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n      </div>\n    </fieldset>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" [disabled]=\"!(hasPreviousPage$ | async)\" (click)=\"toPreviousPage()\">\n        Previous\n      </button>\n      <button class=\"button\" type=\"submit\" [disabled]=\"submitting()\">{{triggerText}}</button>\n    </div>\n\n    <p class=\"cancel\"><a (click)=\"cancel()\" href=\"javascript:void(0)\">{{getCancelText()}}</a></p>\n\n  </form>\n</div>\n"
+module.exports = "<ccd-loading-spinner  *ngIf=\"showSpinner\"></ccd-loading-spinner>\n<ng-container *ngIf=\"currentPage\">\n  <h1 *ngIf=\"!currentPage.label\" class=\"govuk-heading-l\">{{eventTrigger.name}}</h1>\n  <ng-container *ngIf=\"currentPage.label\">\n    <span class=\"govuk-caption-l\">{{ eventTrigger.name}}</span>\n    <h1 class=\"govuk-heading-l\">{{currentPage.label}}</h1>\n  </ng-container>\n</ng-container>\n\n<!--Case ID or Title -->\n<div *ngIf=\"getCaseTitle(); then titleBlock; else idBlock\"></div>\n<ng-template #titleBlock>\n  <ccd-markdown [content]=\"getCaseTitle() | ccdCaseTitle: caseFields : editForm.controls['data']\"></ccd-markdown>\n</ng-template>\n<ng-template #idBlock>\n  <h2 *ngIf=\"getCaseId()\" class=\"heading-h2\">#{{ getCaseId() | ccdCaseReference }}</h2>\n</ng-template>\n\n<!-- Error message summary -->\n<div *ngIf=\"validationErrors.length > 0\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    There is a problem\n  </h2>\n  <div *ngFor=\"let validationError of validationErrors\" class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li>\n        <a (click)=\"navigateToErrorElement(validationError.id)\" class=\"validation-error\">{{validationError.message}}</a>\n      </li>\n    </ul>\n  </div>\n</div>\n\n<!-- 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=\"status\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    Something went wrong\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.</p>\n    <p><a href=\"get-help\" target=\"_blank\">Contact us</a> if you're still having problems.</p>\n  </div>\n</div>\n<!-- Event error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"status\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h3 class=\"heading-h3 error-summary-heading\" id=\"edit-case-event_error-summary-heading-3\">\n    The event could not be created\n  </h3>\n  <p>{{error.message}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\" class=\"ccd-error-summary-li\">{{fieldError.message}}</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<div class=\"width-50\">\n  <form *ngIf=\"currentPage\" class=\"form\" [formGroup]=\"editForm\" (submit)=\"submit()\">\n    <fieldset id=\"fieldset-case-data\">\n      <!-- single column -->\n      <ccd-case-edit-form id='caseEditForm' *ngIf=\"!currentPage.isMultiColumn()\" [fields]=\"currentPage.getCol1Fields()\"\n                          [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"\n                          [pageChangeSubject]=\"pageChangeSubject\"\n                          (valuesChanged)=\"applyValuesChanged($event)\"></ccd-case-edit-form>\n      <!-- two columns -->\n      <div *ngIf=\"currentPage.isMultiColumn()\" class=\"grid-row\">\n        <div class=\"column-two-thirds rightBorderSeparator\">\n          <ccd-case-edit-form id='caseEditForm1' [fields]=\"currentPage.getCol1Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n        <div class=\"column-one-third\">\n          <ccd-case-edit-form id='caseEditForm2' [fields]=\"currentPage.getCol2Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n      </div>\n    </fieldset>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" [disabled]=\"!(hasPreviousPage$ | async)\" (click)=\"toPreviousPage()\">\n        Previous\n      </button>\n      <button class=\"button\" type=\"submit\" [disabled]=\"submitting()\">{{triggerText}}</button>\n    </div>\n\n    <p class=\"cancel\"><a (click)=\"cancel()\" href=\"javascript:void(0)\">{{getCancelText()}}</a></p>\n\n  </form>\n</div>\n"
 
 /***/ }),
 
@@ -63532,7 +63709,7 @@ module.exports = "<div *ngIf=\"isDataLoaded()\">\n    <ng-container [ngSwitch]=\
 /***/ 80734:
 /***/ ((module) => {
 
-module.exports = "<form>\n  <div>\n    <cut-alert type=\"information\">This case requires {{accessType | lowercase}} access.<br />\n      <ng-container *ngIf=\"accessType === 'CHALLENGED'\">This is because the case is outside your work area. If you request access to the case, it will be logged for auditing purposes.</ng-container>\n      <ng-container *ngIf=\"accessType === 'SPECIFIC'\">This means it's outside your jurisdiction and requires authorisation. If you request access to the case, it will be logged for auditing purposes.</ng-container>\n    </cut-alert>\n    <h1 class=\"heading-h1\">#{{ caseDetails.case_id | ccdCaseReference}}</h1>\n    <h2 class=\"govuk-heading-m\">Case details</h2>\n    <dl class=\"govuk-summary-list\">\n      <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.basicFields?.caseNameHmctsInternal\">\n        <dt class=\"govuk-summary-list__key summary-key\">Case name</dt>\n        <dd class=\"govuk-summary-list__value\">{{caseDetails.basicFields.caseNameHmctsInternal}}</dd>\n      </div>\n      <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.case_type?.jurisdiction?.name\">\n        <dt class=\"govuk-summary-list__key summary-key\">Service</dt>\n        <dd class=\"govuk-summary-list__value\">{{caseDetails.case_type.jurisdiction.name}}</dd>\n      </div>\n      <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.state?.description\">\n        <dt class=\"govuk-summary-list__key summary-key\">State</dt>\n        <dd class=\"govuk-summary-list__value\">{{caseDetails.state.description}}</dd>\n      </div>\n      <div class=\"govuk-summary-list__row\" *ngIf=\"courtOrHearingCentre\">\n        <dt class=\"govuk-summary-list__key summary-key\">Court or hearing centre</dt>\n        <dd class=\"govuk-summary-list__value\">{{courtOrHearingCentre | titlecase}}</dd>\n      </div>\n\n      <div class=\"govuk-summary-list__row\" *ngIf=\"accessType\">\n        <dt class=\"govuk-summary-list__key summary-key\">Access</dt>\n        <dd class=\"govuk-summary-list__value\">{{accessType | titlecase}}</dd>\n      </div>\n    </dl>\n  </div>\n\n  <button class=\"govuk-button govuk-!-margin-right-3\">Request access</button>\n</form>\n<a class=\"govuk-body\" (click)=\"onCancel()\" href=\"javascript:void(0)\">Cancel</a>\n"
+module.exports = "<div>\n  <cut-alert type=\"information\">This case requires {{accessType | lowercase}} access.<br />\n    <ng-container *ngIf=\"accessType === 'CHALLENGED'\">This is because the case is outside your work area. If you request access to the case, it will be logged for auditing purposes.</ng-container>\n    <ng-container *ngIf=\"accessType === 'SPECIFIC'\">This means it's outside your jurisdiction and requires authorisation. If you request access to the case, it will be logged for auditing purposes.</ng-container>\n  </cut-alert>\n  <h1 class=\"heading-h1\">#{{ caseDetails.case_id | ccdCaseReference}}</h1>\n  <h2 class=\"govuk-heading-m\">Case details</h2>\n  <dl class=\"govuk-summary-list\">\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.basicFields?.caseNameHmctsInternal\">\n      <dt class=\"govuk-summary-list__key summary-key\">Case name</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.basicFields.caseNameHmctsInternal}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.case_type?.jurisdiction?.name\">\n      <dt class=\"govuk-summary-list__key summary-key\">Service</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.case_type.jurisdiction.name}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.state?.description\">\n      <dt class=\"govuk-summary-list__key summary-key\">State</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.state.description}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"courtOrHearingCentre\">\n      <dt class=\"govuk-summary-list__key summary-key\">Court or hearing centre</dt>\n      <dd class=\"govuk-summary-list__value\">{{courtOrHearingCentre | titlecase}}</dd>\n    </div>\n\n    <div class=\"govuk-summary-list__row\" *ngIf=\"accessType\">\n      <dt class=\"govuk-summary-list__key summary-key\">Access</dt>\n      <dd class=\"govuk-summary-list__value\">{{accessType | titlecase}}</dd>\n    </div>\n  </dl>\n</div>\n<div class=\"govuk-button-group\">\n  <button class=\"govuk-button govuk-!-margin-right-3\" [routerLink]=\"getRequestUrl(accessType)\"> Request access </button>\n  <div class=\"govuk-grid-column-full govuk-!-padding-left-0\">\n    <p>\n      <a class=\"govuk-body\" (click)=\"onCancel()\" href=\"javascript:void(0)\"> Cancel </a>\n    </p>\n  </div>\n</div>\n"
 
 /***/ }),
 
@@ -63641,6 +63818,13 @@ module.exports = "<form *ngIf=\"triggers && triggers.length\" class=\"event-trig
 
 /***/ }),
 
+/***/ 31851:
+/***/ ((module) => {
+
+module.exports = "<div class=\"spinner-container\">\n    <div class=\"spinner-inner-container\">\n        <p>{{loadingText}}</p>\n        <div class=\"spinner\" style=\"margin: auto;\"></div>\n    </div>\n</div>"
+
+/***/ }),
+
 /***/ 6961:
 /***/ ((module) => {
 
@@ -64316,6 +64500,21 @@ function getStrategyDelay(consecutiveErrorsCount, options) {
         }
     
 
+/***/ }),
+
+/***/ 6431:
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+
+        var result = __webpack_require__(68929);
+
+        if (typeof result === "string") {
+            module.exports = result;
+        } else {
+            module.exports = result.toString();
+        }
+    
+
 /***/ }),
 
 /***/ 5047: