npm - @hmcts/ccd-case-ui-toolkit - Versions diffs - 7.0.24-upload-timestamp → 7.0.25-disable-buttons-readonly - Mend

@hmcts/ccd-case-ui-toolkit 7.0.24-upload-timestamp → 7.0.25-disable-buttons-readonly

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (28) hide show

package/fesm2015/hmcts-ccd-case-ui-toolkit.mjs CHANGED Viewed

@@ -1333,6 +1333,11 @@ class HttpError {
     }
     static from(response) {
         const error = new HttpError();
+        if ((response === null || response === void 0 ? void 0 : response.status) === 429) {
+            error.error = HttpError.MESSAGE_ERROR_429;
+            error.status = response.status;
+            error.message = response.message;
+        }
         // Check that the HttpErrorResponse contains an "error" object before mapping the error properties
         if (!!(response && response.error)) {
             Object.keys(error).forEach((key) => {
@@ -1352,6 +1357,7 @@ class HttpError {
 HttpError.DEFAULT_ERROR = 'Unknown error';
 HttpError.DEFAULT_MESSAGE = 'Something unexpected happened, our technical staff have been automatically notified';
 HttpError.DEFAULT_STATUS = 500;
+HttpError.MESSAGE_ERROR_429 = 'Your request was rate limited. Please wait a few seconds before retrying your document upload';
 class AbstractAppConfig {
     /**
@@ -5034,8 +5040,9 @@ class FieldsPurger {
             }
         }
         else {
-            // Delete the field value
-            this.deleteFieldValue(form.get('data'), field);
+            // Delete the field from formGroup
+            const dataGroup = form.get('data');
+            dataGroup.removeControl(field.id);
         }
     }
     resetPage(form, wizardPage) {
@@ -8678,16 +8685,21 @@ class PageValidationService {
     constructor(caseFieldService) {
         this.caseFieldService = caseFieldService;
     }
-    isPageValid(page, editForm) {
-        return page.case_fields
+    getInvalidFields(page, editForm) {
+        const failingCaseFields = [];
+        page.case_fields
             .filter(caseField => !this.caseFieldService.isReadOnly(caseField))
             .filter(caseField => !this.isHidden(caseField, editForm))
-            .every(caseField => {
+            .map(caseField => {
             const theControl = FieldsUtils.isCaseFieldOfType(caseField, ['JudicialUser'])
                 ? editForm.controls['data'].get(`${caseField.id}_judicialUserControl`)
                 : editForm.controls['data'].get(caseField.id);
-            return this.checkDocumentField(caseField, theControl) && this.checkOptionalField(caseField, theControl);
+            if (!(this.checkDocumentField(caseField, theControl) && this.checkOptionalField(caseField, theControl))) {
+                failingCaseFields.push(caseField);
+            }
+            ;
         });
+        return failingCaseFields;
     }
     isHidden(caseField, editForm, path) {
         const formFields = editForm.getRawValue();
@@ -10112,7 +10124,8 @@ class CaseEditPageComponent {
         return this.caseEdit.first();
     }
     currentPageIsNotValid() {
-        return !this.pageValidationService.isPageValid(this.currentPage, this.editForm) ||
+        this.failingCaseFields = this.pageValidationService.getInvalidFields(this.currentPage, this.editForm);
+        return this.failingCaseFields.length > 0 ||
             (this.isLinkedCasesJourney() && !this.isLinkedCasesJourneyAtFinalStep);
     }
     isLinkedCasesJourney() {
@@ -10134,9 +10147,15 @@ class CaseEditPageComponent {
     // Adding validation message to show it as Error Summary
     generateErrorMessage(fields, container, path) {
         const group = container || this.editForm.controls['data'];
-        fields.filter(casefield => !this.caseFieldService.isReadOnly(casefield))
-            .filter(casefield => !this.pageValidationService.isHidden(casefield, this.editForm, path))
+        let validErrorFieldFound = false;
+        let validationErrorAmount = this.validationErrors.length;
+        const failingFields = fields.filter(casefield => !this.caseFieldService.isReadOnly(casefield))
+            .filter(casefield => !this.pageValidationService.isHidden(casefield, this.editForm, path));
+        // note that thougn these checks are on getinvalidfields they are needed for sub field checks
+        failingFields
             .forEach(casefield => {
+            let errorPresent = true;
+            validErrorFieldFound = true;
             const fieldElement = FieldsUtils.isCaseFieldOfType(casefield, ['JudicialUser'])
                 ? group.get(`${casefield.id}_judicialUserControl`)
                 : group.get(casefield.id);
@@ -10181,7 +10200,7 @@ class CaseEditPageComponent {
                 }
                 else if (fieldElement.invalid) {
                     if (casefield.isComplex()) {
-                        this.generateErrorMessage(casefield.field_type.complex_fields, fieldElement, id);
+                        errorPresent = this.generateErrorMessage(casefield.field_type.complex_fields, fieldElement, id);
                     }
                     else if (casefield.isCollection() && casefield.field_type.collection_field_type.type === 'Complex') {
                         const fieldArray = fieldElement;
@@ -10189,7 +10208,7 @@ class CaseEditPageComponent {
                             id = `${fieldArray['component']['collItems'][0].prefix}`;
                         }
                         fieldArray.controls.forEach((c) => {
-                            this.generateErrorMessage(casefield.field_type.collection_field_type.complex_fields, c.get('value'), id);
+                            errorPresent = this.generateErrorMessage(casefield.field_type.collection_field_type.complex_fields, c.get('value'), id);
                         });
                     }
                     else if (FieldsUtils.isCaseFieldOfType(casefield, ['FlagLauncher'])) {
@@ -10204,8 +10223,29 @@ class CaseEditPageComponent {
                     }
                 }
             }
+            else {
+                validErrorFieldFound = false;
+            }
+            if (!errorPresent && this.validationErrors.length === validationErrorAmount) {
+                // if no error messages have been added in internal field despite parent field failing
+                this.validationErrors.push({ id: casefield.id, message: `A field that is causing an error is ${casefield.id} but it is not producing a valid error message. Please ensure all details are correct` });
+            }
         });
+        if (!validErrorFieldFound) {
+            path ? this.validationErrors.push({ id: path, message: `There is an internal issue with ${path} fields. The field that is causing the error cannot be determined but there is an error present` })
+                : this.validationErrors.push({ id: null, message: `The field that is causing the error cannot be determined but there is an error present` });
+        }
+        else if (this.validationErrors.length === validationErrorAmount) {
+            // if no error messages have been generated
+            if (path) {
+                return false;
+            }
+            else {
+                this.validationErrors.push({ id: null, message: `The field that is causing the error cannot be determined but there is an error present. Please fill in more of the form` });
+            }
+        }
         CaseEditPageComponent.scrollToTop();
+        return true;
     }
     navigateToErrorElement(elementId) {
         /* istanbul ignore else */
@@ -10230,7 +10270,7 @@ class CaseEditPageComponent {
                 CaseEditPageComponent.scrollToTop();
             }
             else {
-                this.generateErrorMessage(this.currentPage.case_fields);
+                this.generateErrorMessage(this.failingCaseFields);
             }
         }
         if (!this.caseEdit.isSubmitting && !this.currentPageIsNotValid()) {
@@ -13040,7 +13080,7 @@ function WriteCollectionFieldComponent_div_9_div_1_Template(rf, ctx) {
         i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 14, ctx_r5.itemLabel(i_r7)));
         i0.ɵɵadvance(3);
         i0.ɵɵattributeInterpolate1("aria-label", "Remove ", ctx_r5.itemLabel(i_r7), "");
-        i0.ɵɵproperty("disabled", ctx_r5.isNotAuthorisedToDelete(i_r7));
+        i0.ɵɵproperty("disabled", ctx_r5.isNotAuthorisedToDelete(i_r7) || ctx_r5.allFieldsReadOnly);
         i0.ɵɵadvance(1);
         i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 16, "Remove"));
         i0.ɵɵadvance(2);
@@ -13071,7 +13111,7 @@ function WriteCollectionFieldComponent_button_10_Template(rf, ctx) {
     }
     if (rf & 2) {
         const ctx_r2 = i0.ɵɵnextContext();
-        i0.ɵɵproperty("disabled", ctx_r2.isNotAuthorisedToCreate() || ctx_r2.isSearchFilter());
+        i0.ɵɵproperty("disabled", ctx_r2.isNotAuthorisedToCreate() || ctx_r2.isSearchFilter() || ctx_r2.allFieldsReadOnly);
         i0.ɵɵadvance(1);
         i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 2, "Add new"));
     }
@@ -13085,6 +13125,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
         this.cdRef = cdRef;
         this.caseFields = [];
         this.collItems = [];
+        this.allFieldsReadOnly = false;
     }
     ngOnInit() {
         if (!this.isExpanded) { // meaning I am not rendered on the search/workbasket input filter
@@ -13102,6 +13143,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
             }
             this.collItems[index] = { caseField, item, prefix, index, container };
         });
+        this.allFieldsReadOnly = this.checkComplexFieldReadOnly();
     }
     ngOnDestroy() {
         if (this.profileSubscription) {
@@ -13337,6 +13379,27 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
         const id = this.getControlIdAt(index);
         return !!id && !this.getCollectionPermission(this.caseField, 'allowDelete');
     }
+    checkComplexFieldReadOnly() {
+        return this.checkComplexFieldsReadOnly(this.caseField);
+    }
+    checkFieldType(caseField) {
+        var _a, _b, _c;
+        return ((_a = caseField === null || caseField === void 0 ? void 0 : caseField.field_type) === null || _a === void 0 ? void 0 : _a.type) === 'Collection'
+            ? ((_b = caseField.field_type.collection_field_type) === null || _b === void 0 ? void 0 : _b.complex_fields) || []
+            : ((_c = caseField === null || caseField === void 0 ? void 0 : caseField.field_type) === null || _c === void 0 ? void 0 : _c.complex_fields) || [];
+    }
+    checkComplexFieldsReadOnly(caseField) {
+        const children = this.checkFieldType(caseField);
+        if (children.length === 0) {
+            return caseField.display_context === 'READONLY';
+        }
+        return children.every((child) => {
+            if (!['Collection', 'Complex'].includes(child.field_type.type)) {
+                return child.display_context === 'READONLY';
+            }
+            return this.checkComplexFieldsReadOnly(child);
+        });
+    }
     openModal(i) {
         const dialogConfig = new MatDialogConfig();
         dialogConfig.disableClose = true;
@@ -13401,7 +13464,7 @@ WriteCollectionFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ typ
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 7, ctx.caseField), " ");
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("disabled", ctx.isNotAuthorisedToCreate() || ctx.isSearchFilter());
+            i0.ɵɵproperty("disabled", ctx.isNotAuthorisedToCreate() || ctx.isSearchFilter() || ctx.allFieldsReadOnly);
             i0.ɵɵadvance(1);
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 9, "Add new"));
             i0.ɵɵadvance(2);
@@ -13415,7 +13478,7 @@ WriteCollectionFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ typ
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteCollectionFieldComponent, [{
             type: Component,
-            args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">{{caseField.hint_text | rpxTranslate }}</span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n           [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n        <div class=\"collection-title\">\n          <div class=\"float-left\">\n            <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n          </div>\n          <div class=\"float-right\">\n            <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                    [disabled]=\"isNotAuthorisedToDelete(i)\"\n                    attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n          </div>\n        </div>\n        <ccd-field-write [caseField]=\"item.caseField\"\n                         [caseFields]=\"caseFields\"\n                         [formGroup]=\"formGroup\"\n                         [parent]=\"item.container\"\n                         [idPrefix]=\"item.prefix\"\n                         [hidden]=\"item.caseField.hidden\"\n                         [isExpanded]=\"isExpanded\"\n                         [isInSearchBlock]=\"isInSearchBlock\">\n        </ccd-field-write>\n      </div>\n\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
+            args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter() || allFieldsReadOnly\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">{{caseField.hint_text | rpxTranslate }}</span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n           [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n        <div class=\"collection-title\">\n          <div class=\"float-left\">\n            <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n          </div>\n          <div class=\"float-right\">\n            <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                    [disabled]=\"isNotAuthorisedToDelete(i) || allFieldsReadOnly\"\n                    attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n          </div>\n        </div>\n        <ccd-field-write [caseField]=\"item.caseField\"\n                         [caseFields]=\"caseFields\"\n                         [formGroup]=\"formGroup\"\n                         [parent]=\"item.container\"\n                         [idPrefix]=\"item.prefix\"\n                         [hidden]=\"item.caseField.hidden\"\n                         [isExpanded]=\"isExpanded\"\n                         [isInSearchBlock]=\"isInSearchBlock\">\n        </ccd-field-write>\n      </div>\n\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter() || allFieldsReadOnly\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
         }], function () { return [{ type: i1$3.MatLegacyDialog }, { type: i2.ScrollToService }, { type: ProfileNotifier }, { type: i0.ChangeDetectorRef }]; }, { caseFields: [{
                 type: Input
             }], formGroup: [{
@@ -13460,7 +13523,7 @@ class ReadComplexFieldComponent extends AbstractFieldReadComponent {
         this.paletteContext = PaletteContext;
     }
     ngOnInit() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         super.ngOnInit();
         if (this.caseField.display_context_parameter) {
             this.context = PaletteContext.TABLE_VIEW;
@@ -13471,18 +13534,20 @@ class ReadComplexFieldComponent extends AbstractFieldReadComponent {
                 this.context = PaletteContext.DEFAULT;
             }
         }
-        (_c = (_b = (_a = this.caseField) === null || _a === void 0 ? void 0 : _a.field_type) === null || _b === void 0 ? void 0 : _b.complex_fields) === null || _c === void 0 ? void 0 : _c.forEach((field) => {
-            var _a, _b, _c;
-            if (field === null || field === void 0 ? void 0 : field.isDynamic()) {
-                field.list_items = (_a = this.caseField.value[field.id]) === null || _a === void 0 ? void 0 : _a.list_items;
-                field.value = {
-                    list_items: field.list_items,
-                    value: ((_b = this.caseField.value[field.id]) === null || _b === void 0 ? void 0 : _b.value) && this.caseField.value[field.id].value.code ?
-                        this.caseField.value[field.id].value.code :
-                        (_c = this.caseField.value[field.id]) === null || _c === void 0 ? void 0 : _c.value
-                };
-            }
-        });
+        if (((_a = this.caseField) === null || _a === void 0 ? void 0 : _a.field_type) && this.caseField.field_type.complex_fields) {
+            (_d = (_c = (_b = this.caseField) === null || _b === void 0 ? void 0 : _b.field_type) === null || _c === void 0 ? void 0 : _c.complex_fields) === null || _d === void 0 ? void 0 : _d.forEach((field) => {
+                var _a, _b, _c;
+                if (field === null || field === void 0 ? void 0 : field.isDynamic()) {
+                    field.list_items = (_a = this.caseField.value[field.id]) === null || _a === void 0 ? void 0 : _a.list_items;
+                    field.value = {
+                        list_items: field.list_items,
+                        value: ((_b = this.caseField.value[field.id]) === null || _b === void 0 ? void 0 : _b.value) && this.caseField.value[field.id].value.code ?
+                            this.caseField.value[field.id].value.code :
+                            (_c = this.caseField.value[field.id]) === null || _c === void 0 ? void 0 : _c.value
+                    };
+                }
+            });
+        }
     }
 }
 ReadComplexFieldComponent.ɵfac = /*@__PURE__*/ function () { let ɵReadComplexFieldComponent_BaseFactory; return function ReadComplexFieldComponent_Factory(t) { return (ɵReadComplexFieldComponent_BaseFactory || (ɵReadComplexFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadComplexFieldComponent)))(t || ReadComplexFieldComponent); }; }();
@@ -14253,23 +14318,31 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         this.uploadedDocument = this.registerControl(new FormGroup(documentFormGroup), true);
     }
     getErrorMessage(error) {
-        // Document Management unavailable
-        if (0 === error.status || 502 === error.status) {
-            return WriteDocumentFieldComponent.UPLOAD_ERROR_NOT_AVAILABLE;
-        }
-        let errorMsg = 'Error uploading file';
-        if (error === null || error === void 0 ? void 0 : error.error) {
-            const fullError = error.error;
-            const start = fullError.indexOf('{');
-            if (start >= 0) {
-                const json = fullError.substring(start, fullError.length - 1).split('<EOL>').join('');
-                const obj = JSON.parse(json);
-                if (obj === null || obj === void 0 ? void 0 : obj.error) {
-                    errorMsg = obj.error;
+        switch (error.status) {
+            case 0:
+            case 502:
+                return WriteDocumentFieldComponent.UPLOAD_ERROR_NOT_AVAILABLE;
+            case 422:
+                {
+                    let errorMsg = WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+                    if (error === null || error === void 0 ? void 0 : error.error) {
+                        const fullError = error.error;
+                        const start = fullError.indexOf('{');
+                        if (start >= 0) {
+                            const json = fullError.substring(start, fullError.length - 1).split('<EOL>').join('');
+                            const obj = JSON.parse(json);
+                            if (obj === null || obj === void 0 ? void 0 : obj.error) {
+                                errorMsg = obj.error;
+                            }
+                        }
+                    }
+                    return errorMsg;
                 }
-            }
+            case 429:
+                return error === null || error === void 0 ? void 0 : error.error;
+            default:
+                return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
         }
-        return errorMsg;
     }
     buildDocumentUploadData(selectedFile) {
         const documentUpload = new FormData();
@@ -14325,6 +14398,7 @@ WriteDocumentFieldComponent.UPLOAD_TIMESTAMP = 'upload_timestamp';
 WriteDocumentFieldComponent.UPLOAD_ERROR_FILE_REQUIRED = 'File required';
 WriteDocumentFieldComponent.UPLOAD_ERROR_NOT_AVAILABLE = 'Document upload facility is not available at the moment';
 WriteDocumentFieldComponent.UPLOAD_WAITING_FILE_STATUS = 'Uploading...';
+WriteDocumentFieldComponent.ERROR_UPLOADING_FILE = 'Error Uploading File';
 WriteDocumentFieldComponent.ɵfac = function WriteDocumentFieldComponent_Factory(t) { return new (t || WriteDocumentFieldComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(DocumentManagementService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(FileUploadStateService), i0.ɵɵdirectiveInject(JurisdictionService)); };
 WriteDocumentFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: WriteDocumentFieldComponent, selectors: [["ccd-write-document-field"]], viewQuery: function WriteDocumentFieldComponent_Query(rf, ctx) {
         if (rf & 1) {
@@ -14395,7 +14469,7 @@ WriteDocumentFieldComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
 class DynamicListPipe {
     transform(value, items) {
-        const item = items.find(i => i.code === value);
+        const item = items === null || items === void 0 ? void 0 : items.find(i => i.code === value);
         return item ? item.label : DynamicListPipe.EMPTY;
     }
 }
@@ -23227,7 +23301,7 @@ CaseFileViewFolderComponent.UNCATEGORISED_DOCUMENTS_TITLE = 'Uncategorised docum
 CaseFileViewFolderComponent.DOCUMENT_SEARCH_FORM_CONTROL_NAME = 'documentSearchFormControl';
 CaseFileViewFolderComponent.MINIMUM_SEARCH_CHARACTERS = 1;
 CaseFileViewFolderComponent.ɵfac = function CaseFileViewFolderComponent_Factory(t) { return new (t || CaseFileViewFolderComponent)(i0.ɵɵdirectiveInject(WindowService), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(DocumentManagementService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(AbstractAppConfig)); };
-CaseFileViewFolderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewFolderComponent, selectors: [["ccd-case-file-view-folder"]], inputs: { categoriesAndDocuments: "categoriesAndDocuments", allowMoving: "allowMoving" }, outputs: { clickedDocument: "clickedDocument", moveDocument: "moveDocument" }, decls: 9, vars: 3, consts: [[1, "document-filter-container"], [1, "form-group", "document-filter", 3, "formGroup"], ["type", "search", "id", "document-search", "name", "documentSearchFormControl", "formControlName", "documentSearchFormControl", "placeholder", "Search by document name", 1, "form-control", "document-search"], [1, "document-folders-header"], [1, "document-folders-header__title"], [3, "sortAscending", "sortDescending"], ["class", "document-tree-container", 4, "ngIf"], [1, "document-tree-container"], [4, "ngIf"], [3, "dataSource", "treeControl"], ["class", "document-tree-container__node document-tree-container__node--document", 4, "cdkTreeNodeDef"], ["class", "document-tree-container__node document-tree-container__folder", 4, "cdkTreeNodeDef", "cdkTreeNodeDefWhen"], [1, "document-tree-container__node", "document-tree-container__node--document"], [1, "node", 3, "click"], ["disabled", "", 1, "node__icon"], ["src", "/assets/img/case-file-view/case-file-view-document.svg", "alt", "Document icon", 1, "node__iconImg"], [1, "node__name", "node-name-document"], [1, "node__document-upload-timestamp"], [1, "node__document-options"], [3, "allowMoving", "changeFolderAction", "openInANewTabAction", "downloadAction", "printAction"], [1, "document-tree-container__node", "document-tree-container__folder"], ["cdkTreeNodeToggle", "", 1, "node"], [1, "node__icon"], ["alt", "Folder icon", 1, "node__iconImg", 3, "src"], [1, "node__count"], [1, "node__name", "node__name--folder"], ["cdkTreeNodeOutlet", ""]], template: function CaseFileViewFolderComponent_Template(rf, ctx) {
+CaseFileViewFolderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewFolderComponent, selectors: [["ccd-case-file-view-folder"]], inputs: { categoriesAndDocuments: "categoriesAndDocuments", allowMoving: "allowMoving" }, outputs: { clickedDocument: "clickedDocument", moveDocument: "moveDocument" }, decls: 9, vars: 3, consts: [[1, "document-filter-container"], [1, "form-group", "document-filter", 3, "formGroup"], ["type", "search", "id", "document-search", "name", "documentSearchFormControl", "formControlName", "documentSearchFormControl", "placeholder", "Search by document name", "aria-label", "Search by document name", 1, "form-control", "document-search"], [1, "document-folders-header"], [1, "document-folders-header__title"], [3, "sortAscending", "sortDescending"], ["class", "document-tree-container", 4, "ngIf"], [1, "document-tree-container"], [4, "ngIf"], [3, "dataSource", "treeControl"], ["class", "document-tree-container__node document-tree-container__node--document", 4, "cdkTreeNodeDef"], ["class", "document-tree-container__node document-tree-container__folder", 4, "cdkTreeNodeDef", "cdkTreeNodeDefWhen"], [1, "document-tree-container__node", "document-tree-container__node--document"], [1, "node", 3, "click"], ["disabled", "", 1, "node__icon"], ["src", "/assets/img/case-file-view/case-file-view-document.svg", "alt", "Document icon", 1, "node__iconImg"], [1, "node__name", "node-name-document"], [1, "node__document-upload-timestamp"], [1, "node__document-options"], [3, "allowMoving", "changeFolderAction", "openInANewTabAction", "downloadAction", "printAction"], [1, "document-tree-container__node", "document-tree-container__folder"], ["cdkTreeNodeToggle", "", 1, "node"], [1, "node__icon"], ["alt", "Folder icon", 1, "node__iconImg", 3, "src"], [1, "node__count"], [1, "node__name", "node__name--folder"], ["cdkTreeNodeOutlet", ""]], template: function CaseFileViewFolderComponent_Template(rf, ctx) {
         if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
             i0.ɵɵelement(2, "input", 2);
@@ -23252,7 +23326,7 @@ CaseFileViewFolderComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderComponent, [{
             type: Component,
-            args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n  <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n    <input class=\"form-control document-search\"\n      type=\"search\"\n      id=\"document-search\"\n      name=\"documentSearchFormControl\"\n      formControlName=\"documentSearchFormControl\"\n      placeholder=\"Search by document name\">\n  </div>\n</div>\n\n<div class=\"document-folders-header\">\n  <div class=\"document-folders-header__title\">Documents ({{ documentCount }})</div>\n  <div>\n    <ccd-case-file-view-folder-sort\n      (sortAscending)=\"sortDataSourceAscending($event)\"\n      (sortDescending)=\"sortDataSourceDescending($event)\"\n    ></ccd-case-file-view-folder-sort>\n  </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n  <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n    No results found\n  </div>\n  <div>\n    <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n      <!-- document -->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n        <button class=\"node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n                [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n          <div class=\"node__icon\" disabled>\n            <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" class=\"node__iconImg\" alt=\"Document icon\">\n          </div>\n          <span class=\"node__name node-name-document\">\n            {{node.name}}\n            <br>\n            <span class=\"node__document-upload-timestamp\">{{node.upload_timestamp | date:\"dd MMM YYYY\"}}</span>\n          </span>\n          <div class=\"node__document-options\">\n            <ccd-case-file-view-folder-document-actions\n              (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n              (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n              (downloadAction)=\"triggerDocumentAction('download', node)\"\n              (printAction)=\"triggerDocumentAction('print', node)\"\n              [allowMoving]=\"allowMoving\"\n            >\n            </ccd-case-file-view-folder-document-actions>\n          </div>\n        </button>\n      </cdk-nested-tree-node>\n      <!-- folder-->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n        <button class=\"node\" cdkTreeNodeToggle>\n          <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\" >\n            <img class=\"node__iconImg\"\n                 [src]=\"nestedTreeControl.isExpanded(node) ? '/assets/images/folder-open.png' : '/assets/images/folder.png'\" alt=\"Folder icon\">\n            <span class=\"node__count\">{{node.childDocumentCount}}</span>\n          </div>\n          <span class=\"node__name node__name--folder\">{{node.name}}</span>\n        </button>\n\n        <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n          <ng-container cdkTreeNodeOutlet></ng-container>\n        </div>\n      </cdk-nested-tree-node>\n    </cdk-tree>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #FFF;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#EEE}.document-tree-container::-webkit-scrollbar-thumb{background:#CCC}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}\n"] }]
+            args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n  <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n    <input class=\"form-control document-search\"\n      type=\"search\"\n      id=\"document-search\"\n      name=\"documentSearchFormControl\"\n      formControlName=\"documentSearchFormControl\"\n      placeholder=\"Search by document name\"\n      aria-label=\"Search by document name\">\n  </div>\n</div>\n\n<div class=\"document-folders-header\">\n  <div class=\"document-folders-header__title\">Documents ({{ documentCount }})</div>\n  <div>\n    <ccd-case-file-view-folder-sort\n      (sortAscending)=\"sortDataSourceAscending($event)\"\n      (sortDescending)=\"sortDataSourceDescending($event)\"\n    ></ccd-case-file-view-folder-sort>\n  </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n  <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n    No results found\n  </div>\n  <div>\n    <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n      <!-- document -->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n        <button class=\"node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n                [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n          <div class=\"node__icon\" disabled>\n            <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" class=\"node__iconImg\" alt=\"Document icon\">\n          </div>\n          <span class=\"node__name node-name-document\">\n            {{node.name}}\n            <br>\n            <span class=\"node__document-upload-timestamp\">{{node.upload_timestamp | date:\"dd MMM YYYY\"}}</span>\n          </span>\n          <div class=\"node__document-options\">\n            <ccd-case-file-view-folder-document-actions\n              (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n              (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n              (downloadAction)=\"triggerDocumentAction('download', node)\"\n              (printAction)=\"triggerDocumentAction('print', node)\"\n              [allowMoving]=\"allowMoving\"\n            >\n            </ccd-case-file-view-folder-document-actions>\n          </div>\n        </button>\n      </cdk-nested-tree-node>\n      <!-- folder-->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n        <button class=\"node\" cdkTreeNodeToggle>\n          <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\" >\n            <img class=\"node__iconImg\"\n                 [src]=\"nestedTreeControl.isExpanded(node) ? '/assets/images/folder-open.png' : '/assets/images/folder.png'\" alt=\"Folder icon\">\n            <span class=\"node__count\">{{node.childDocumentCount}}</span>\n          </div>\n          <span class=\"node__name node__name--folder\">{{node.name}}</span>\n        </button>\n\n        <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n          <ng-container cdkTreeNodeOutlet></ng-container>\n        </div>\n      </cdk-nested-tree-node>\n    </cdk-tree>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #FFF;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#EEE}.document-tree-container::-webkit-scrollbar-thumb{background:#CCC}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}\n"] }]
         }], function () { return [{ type: WindowService }, { type: i1$1.Router }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: AbstractAppConfig }]; }, { categoriesAndDocuments: [{
                 type: Input
             }], allowMoving: [{
@@ -32226,29 +32300,29 @@ function CaseHistoryComponent_div_0_Template(rf, ctx) {
         i0.ɵɵadvance(6);
         i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(15, 19, "Date"));
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(18, 21, ctx_r0.caseHistory.event.timestamp));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(18, 21, ctx_r0.caseHistory.event.timestamp, "local"));
         i0.ɵɵadvance(4);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 23, "Author"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 24, "Author"));
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind1(25, 25, ctx_r0.caseHistory.event.user_first_name), " ", i0.ɵɵpipeBind1(26, 27, ctx_r0.caseHistory.event.user_last_name), "");
+        i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind1(25, 26, ctx_r0.caseHistory.event.user_first_name), " ", i0.ɵɵpipeBind1(26, 28, ctx_r0.caseHistory.event.user_last_name), "");
         i0.ɵɵadvance(5);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(30, 29, "End state"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(30, 30, "End state"));
         i0.ɵɵadvance(3);
         i0.ɵɵtextInterpolate(ctx_r0.caseHistory.event.state_name);
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(36, 31, "Event"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(36, 32, "Event"));
         i0.ɵɵadvance(3);
         i0.ɵɵtextInterpolate(ctx_r0.caseHistory.event.event_name);
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(42, 33, "Summary"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(42, 34, "Summary"));
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(45, 35, ctx_r0.caseHistory.event.summary));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(45, 36, ctx_r0.caseHistory.event.summary));
         i0.ɵɵadvance(4);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(49, 37, "Comment"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(49, 38, "Comment"));
         i0.ɵɵadvance(3);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(52, 39, ctx_r0.caseHistory.event.comment));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(52, 40, ctx_r0.caseHistory.event.comment));
         i0.ɵɵadvance(4);
-        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(56, 41, "Case Details"));
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(56, 42, "Case Details"));
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngForOf", ctx_r0.tabs);
     }
@@ -32304,7 +32378,7 @@ CaseHistoryComponent.ERROR_MESSAGE = 'No case history to show';
 CaseHistoryComponent.ɵfac = function CaseHistoryComponent_Factory(t) { return new (t || CaseHistoryComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(OrderService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(CaseHistoryService)); };
 CaseHistoryComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseHistoryComponent, selectors: [["ccd-case-history"]], inputs: { event: "event" }, decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "grid-row"], [1, "column-full"], [3, "caseDetails"], [1, "heading-h2"], ["aria-describedby", "event details table", 1, "EventDetails"], [4, "ngFor", "ngForOf"], [1, "caseHistorySection"], [1, "heading-h3"], [1, "CaseHistory", 3, "id"], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-label-header"], [1, "case-viewer-label"], [3, "caseField", "caseReference"], [1, "compound-field"], ["colspan", "2"]], template: function CaseHistoryComponent_Template(rf, ctx) {
         if (rf & 1) {
-            i0.ɵɵtemplate(0, CaseHistoryComponent_div_0_Template, 58, 43, "div", 0);
+            i0.ɵɵtemplate(0, CaseHistoryComponent_div_0_Template, 58, 44, "div", 0);
         }
         if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.isDataLoaded());
@@ -32313,7 +32387,7 @@ CaseHistoryComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseHi
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseHistoryComponent, [{
             type: Component,
-            args: [{ selector: 'ccd-case-history', template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-describedby=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <td colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{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}\n"] }]
+            args: [{ selector: 'ccd-case-history', template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-describedby=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate : 'local'}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <td colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{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}\n"] }]
         }], function () { return [{ type: i1$1.ActivatedRoute }, { type: AlertService }, { type: OrderService }, { type: CaseNotifier }, { type: CaseHistoryService }]; }, { event: [{
                 type: Input
             }] });
@@ -33515,7 +33589,7 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_2_Tem
         const tab_r20 = i0.ɵɵnextContext().$implicit;
         const ctx_r22 = i0.ɵɵnextContext(2);
         i0.ɵɵclassMap(tab_r20.id);
-        i0.ɵɵattribute("aria-describedby", i0.ɵɵpipeBind1(1, 4, "case viewer table"));
+        i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 4, "case viewer table"));
         i0.ɵɵadvance(3);
         i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBindV(4, 6, i0.ɵɵpureFunction2(14, _c1$3, i0.ɵɵpipeBind1(5, 12, tab_r20), ctx_r22.formGroup.controls["data"])));
     }
@@ -33999,7 +34073,7 @@ CaseFullAccessViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
 (function () {
     (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\" (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-describedby]=\"'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}\n"] }]
+            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\" (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}\n"] }]
         }], function () { return [{ 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: i4.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }]; }, { hasPrint: [{
                 type: Input
             }], hasEventSelector: [{