@hmcts/ccd-case-ui-toolkit 7.2.15 → 7.2.16-exui-2801-rc2

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

@@ -14281,7 +14281,7 @@ function ReadCollectionFieldComponent_table_0_tbody_2_Template(rf, ctx) { if (rf
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("caseField", i0.ɵɵpureFunction7(3, _c0$T, ctx_r0.caseField.label, ctx_r0.caseField.label, ctx_r0.caseField.field_type.collection_field_type, ctx_r0.caseField.display_context_parameter, ctx_r0.caseField.value, ctx_r0.caseField.hidden, ctx_r0.caseField))("context", ctx_r0.context)("topLevelFormGroup", ctx_r0.topLevelFormGroup);
+    i0.ɵɵproperty("caseField", i0.ɵɵpureFunction7(4, _c0$T, ctx_r0.caseField.label, ctx_r0.caseField.label, ctx_r0.caseField.field_type.collection_field_type, ctx_r0.caseField.display_context_parameter, ctx_r0.caseField.value, ctx_r0.caseField.hidden, ctx_r0.caseField))("context", ctx_r0.context)("caseFields", ctx_r0.caseFields)("topLevelFormGroup", ctx_r0.topLevelFormGroup);
 } }
 function ReadCollectionFieldComponent_table_0_tbody_3_tr_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr")(1, "td");
@@ -14292,11 +14292,11 @@ function ReadCollectionFieldComponent_table_0_tbody_3_tr_1_Template(rf, ctx) { i
     const i_r3 = ctx.index;
     const ctx_r0 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("caseField", i0.ɵɵpureFunction6(4, _c1$m, i_r3 + "", ctx_r0.caseField.label + " " + (i_r3 + 1), ctx_r0.caseField.field_type.collection_field_type, item_r2.value, ctx_r0.caseField.hidden, ctx_r0.caseField))("context", ctx_r0.context)("topLevelFormGroup", ctx_r0.topLevelFormGroup)("idPrefix", ctx_r0.buildIdPrefix(i_r3));
+    i0.ɵɵproperty("caseField", i0.ɵɵpureFunction6(5, _c1$m, i_r3 + "", ctx_r0.caseField.label + " " + (i_r3 + 1), ctx_r0.caseField.field_type.collection_field_type, item_r2.value, ctx_r0.caseField.hidden, ctx_r0.caseField))("context", ctx_r0.context)("caseFields", ctx_r0.caseFields)("topLevelFormGroup", ctx_r0.topLevelFormGroup)("idPrefix", ctx_r0.buildIdPrefix(i_r3));
 } }
 function ReadCollectionFieldComponent_table_0_tbody_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tbody");
-    i0.ɵɵtemplate(1, ReadCollectionFieldComponent_table_0_tbody_3_tr_1_Template, 3, 11, "tr", 6);
+    i0.ɵɵtemplate(1, ReadCollectionFieldComponent_table_0_tbody_3_tr_1_Template, 3, 12, "tr", 6);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
@@ -14306,7 +14306,7 @@ function ReadCollectionFieldComponent_table_0_tbody_3_Template(rf, ctx) { if (rf
 function ReadCollectionFieldComponent_table_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "table", 1);
     i0.ɵɵelementContainerStart(1, 2);
-    i0.ɵɵtemplate(2, ReadCollectionFieldComponent_table_0_tbody_2_Template, 5, 11, "tbody", 3)(3, ReadCollectionFieldComponent_table_0_tbody_3_Template, 2, 1, "tbody", 3);
+    i0.ɵɵtemplate(2, ReadCollectionFieldComponent_table_0_tbody_2_Template, 5, 12, "tbody", 3)(3, ReadCollectionFieldComponent_table_0_tbody_3_Template, 2, 1, "tbody", 3);
     i0.ɵɵelementContainerEnd();
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -14319,6 +14319,7 @@ function ReadCollectionFieldComponent_table_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngSwitchCase", false);
 } }
 class ReadCollectionFieldComponent extends AbstractFieldReadComponent {
+    caseFields = [];
     isDisplayContextParameterAvailable = false;
     ngOnInit() {
         if (this.caseField.display_context_parameter && this.caseField.display_context_parameter.trim().startsWith('#TABLE(')) {
@@ -14333,7 +14334,7 @@ class ReadCollectionFieldComponent extends AbstractFieldReadComponent {
         return prefix;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadCollectionFieldComponent_BaseFactory; return function ReadCollectionFieldComponent_Factory(__ngFactoryType__) { return (ɵReadCollectionFieldComponent_BaseFactory || (ɵReadCollectionFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadCollectionFieldComponent)))(__ngFactoryType__ || ReadCollectionFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadCollectionFieldComponent, selectors: [["ccd-read-collection-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "collection-field-table", "aria-describedby", "collection table", 4, "ngIf"], ["aria-describedby", "collection table", 1, "collection-field-table"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["id", "hiddenHeader", 2, "display", "none"], [3, "caseField", "context", "topLevelFormGroup"], [4, "ngFor", "ngForOf"], [3, "caseField", "context", "topLevelFormGroup", "idPrefix"]], template: function ReadCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadCollectionFieldComponent, selectors: [["ccd-read-collection-field"]], inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "collection-field-table", "aria-describedby", "collection table", 4, "ngIf"], ["aria-describedby", "collection table", 1, "collection-field-table"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["id", "hiddenHeader", 2, "display", "none"], [3, "caseField", "context", "caseFields", "topLevelFormGroup"], [4, "ngFor", "ngForOf"], [3, "caseField", "context", "caseFields", "topLevelFormGroup", "idPrefix"]], template: function ReadCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, ReadCollectionFieldComponent_table_0_Template, 4, 3, "table", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.caseField.value && ctx.caseField.value.length);
@@ -14341,9 +14342,11 @@ class ReadCollectionFieldComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadCollectionFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-collection-field', template: "<table *ngIf=\"caseField.value && caseField.value.length \" class=\"collection-field-table\" aria-describedby=\"collection table\">\n  <ng-container [ngSwitch]=\"isDisplayContextParameterAvailable\">\n    <tbody *ngSwitchCase=\"true\">\n    <tr>\n      <th id=\"hiddenHeader\" style=\"display: none;\"></th>\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: caseField.label,\n            label: caseField.label,\n            field_type: caseField.field_type.collection_field_type,\n            display_context_parameter: caseField.display_context_parameter,\n            value: caseField.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [topLevelFormGroup]=\"topLevelFormGroup\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n    <tbody *ngSwitchCase=\"false\">\n    <tr *ngFor=\"let item of caseField.value; let i = index\">\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: i + '',\n            label: caseField.label + ' ' + (i + 1),\n            field_type: caseField.field_type.collection_field_type,\n            value: item.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [topLevelFormGroup]=\"topLevelFormGroup\"\n          [idPrefix]=\"buildIdPrefix(i)\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n  </ng-container>\n</table>\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"] }]
-    }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadCollectionFieldComponent, { className: "ReadCollectionFieldComponent", filePath: "lib/shared/components/palette/collection/read-collection-field.component.ts", lineNumber: 10 }); })();
+        args: [{ selector: 'ccd-read-collection-field', template: "<table *ngIf=\"caseField.value && caseField.value.length \" class=\"collection-field-table\" aria-describedby=\"collection table\">\n  <ng-container [ngSwitch]=\"isDisplayContextParameterAvailable\">\n    <tbody *ngSwitchCase=\"true\">\n    <tr>\n      <th id=\"hiddenHeader\" style=\"display: none;\"></th>\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: caseField.label,\n            label: caseField.label,\n            field_type: caseField.field_type.collection_field_type,\n            display_context_parameter: caseField.display_context_parameter,\n            value: caseField.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n    <tbody *ngSwitchCase=\"false\">\n    <tr *ngFor=\"let item of caseField.value; let i = index\">\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: i + '',\n            label: caseField.label + ' ' + (i + 1),\n            field_type: caseField.field_type.collection_field_type,\n            value: item.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\"\n          [idPrefix]=\"buildIdPrefix(i)\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n  </ng-container>\n</table>\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"] }]
+    }], null, { caseFields: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadCollectionFieldComponent, { className: "ReadCollectionFieldComponent", filePath: "lib/shared/components/palette/collection/read-collection-field.component.ts", lineNumber: 11 }); })();
 
 class RemoveDialogComponent {
     matDialogRef;
@@ -15103,17 +15106,17 @@ class FileUploadStateService {
 const _c0$R = ["fileInput"];
 const _c1$l = a0 => ({ "form-group-error bottom-30": a0 });
 function WriteDocumentFieldComponent_span_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 12)(1, "markdown");
-    i0.ɵɵtext(2);
-    i0.ɵɵpipe(3, "rpxTranslate");
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(0, "span", 12);
+    i0.ɵɵelement(1, "markdown", 13);
+    i0.ɵɵpipe(2, "rpxTranslate");
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, ctx_r1.caseField.hint_text));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("data", i0.ɵɵpipeBind1(2, 1, ctx_r1.caseField.hint_text));
 } }
 function WriteDocumentFieldComponent_ccd_read_document_field_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ccd-read-document-field", 13);
+    i0.ɵɵelement(0, "ccd-read-document-field", 14);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("caseField", ctx_r1.caseField);
@@ -15383,31 +15386,36 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         this.uploadedDocument = this.registerControl(new FormGroup(documentFormGroup), true);
     }
     getErrorMessage(error) {
-        switch (error.status) {
-            case 0:
-            case 502:
-                return WriteDocumentFieldComponent.UPLOAD_ERROR_NOT_AVAILABLE;
-            case 422:
-            case 500:
-                {
-                    let errorMsg = WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
-                    if (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?.error) {
-                                errorMsg = obj.error;
-                            }
-                        }
-                    }
-                    return errorMsg;
-                }
-            case 429:
-                return error?.error;
-            default:
-                return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+        if (error.status === 0 || error.status === 502) {
+            return WriteDocumentFieldComponent.UPLOAD_ERROR_NOT_AVAILABLE;
+        }
+        if (error.status === 422 || error.status === 500) {
+            if (this.fileSecureModeOn) {
+                return this.extractSecureErrorMessage(error) || WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+            }
+            return error.error || WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+        }
+        if (error.status === 429) {
+            return error?.error;
+        }
+        return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+    }
+    extractSecureErrorMessage(error) {
+        if (!error?.error) {
+            return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+        }
+        const fullError = error.error;
+        const start = fullError.indexOf('{');
+        if (start < 0) {
+            return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
+        }
+        try {
+            const json = fullError.substring(start, fullError.length - 1).replace(/<EOL>/g, '');
+            const obj = JSON.parse(json);
+            return obj?.error;
+        }
+        catch {
+            return WriteDocumentFieldComponent.ERROR_UPLOADING_FILE;
         }
     }
     buildDocumentUploadData(selectedFile) {
@@ -15461,14 +15469,14 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.fileInput = _t.first);
-        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 20, vars: 23, consts: [["fileInput", ""], [1, "form-group", 3, "ngClass"], [3, "for"], [1, "form-label"], ["class", "form-hint", 4, "ngIf"], ["role", "alert", "tabindex", "0", 1, "error-message", 3, "hidden"], [3, "caseField", 4, "ngIf"], [2, "position", "relative"], [3, "click", "keyup", "id"], ["type", "file", 1, "form-control", "bottom-30", 3, "keydown.Tab", "change", "id", "accept"], [1, "form-group", "bottom-30"], ["type", "button", "aria-label", "Cancel upload", 1, "button", "button-secondary", 3, "click", "disabled"], [1, "form-hint"], [3, "caseField"]], template: function WriteDocumentFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 20, vars: 23, consts: [["fileInput", ""], [1, "form-group", 3, "ngClass"], [3, "for"], [1, "form-label"], ["class", "form-hint", 4, "ngIf"], ["role", "alert", "tabindex", "0", 1, "error-message", 3, "hidden"], [3, "caseField", 4, "ngIf"], [2, "position", "relative"], [3, "click", "keyup", "id"], ["type", "file", 1, "form-control", "bottom-30", 3, "keydown.Tab", "change", "id", "accept"], [1, "form-group", "bottom-30"], ["type", "button", "aria-label", "Cancel upload", 1, "button", "button-secondary", 3, "click", "disabled"], [1, "form-hint"], [3, "data"], [3, "caseField"]], template: function WriteDocumentFieldComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 1)(1, "label", 2)(2, "span", 3);
             i0.ɵɵpipe(3, "ccdFieldLabel");
             i0.ɵɵtext(4);
             i0.ɵɵpipe(5, "ccdFieldLabel");
             i0.ɵɵelementEnd()();
-            i0.ɵɵtemplate(6, WriteDocumentFieldComponent_span_6_Template, 4, 3, "span", 4);
+            i0.ɵɵtemplate(6, WriteDocumentFieldComponent_span_6_Template, 3, 3, "span", 4);
             i0.ɵɵelementStart(7, "span", 5);
             i0.ɵɵtext(8);
             i0.ɵɵpipe(9, "rpxTranslate");
@@ -15516,7 +15524,7 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteDocumentFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-document-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error bottom-30': !valid}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" attr.aria-label=\"{{caseField | ccdFieldLabel}}\">{{(caseField | ccdFieldLabel)}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">\n    <markdown>{{ caseField.hint_text | rpxTranslate }}</markdown>\n  </span>\n  <span class=\"error-message\"\n        role=\"alert\"\n        tabindex=\"0\"\n        [hidden]=\"!(fileUploadMessages && !valid)\">\n    {{ fileUploadMessages | rpxTranslate }}\n  </span>\n  <div>\n    <!--<span *ngIf=\"getUploadedFileName()\" class=\"text-16\">File name: {{getUploadedFileName()}}</span>-->\n    <ccd-read-document-field *ngIf=\"caseField\" [caseField]=\"caseField\"></ccd-read-document-field>\n  </div>\n\n  <div style='position:relative'>\n    <div [id]=\"createElementId('fileInputWrapper')\" (click)=\"fileSelectEvent()\" (keyup)=\"fileSelectEvent()\"></div>\n    <input class=\"form-control bottom-30\" [id]=\"id()\" type=\"file\" (keydown.Tab)=\"fileValidationsOnTab()\" (change)=\"fileChangeEvent($event, caseField.field_type.regular_expression)\"\n           accept=\"{{caseField.field_type.regular_expression}}\" #fileInput/>\n  </div>\n</div>\n<div class=\"form-group bottom-30\">\n  <button class=\"button button-secondary\" type=\"button\" aria-label=\"Cancel upload\" (click)=\"cancelUpload()\" [disabled]=\"!isUploadInProgress()\">{{'Cancel upload' | rpxTranslate}}</button>\n</div>\n" }]
+        args: [{ selector: 'ccd-write-document-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error bottom-30': !valid}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" attr.aria-label=\"{{caseField | ccdFieldLabel}}\">{{(caseField | ccdFieldLabel)}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">\n    <markdown [data]=\"caseField.hint_text | rpxTranslate\"></markdown>\n  </span>\n  <span class=\"error-message\"\n        role=\"alert\"\n        tabindex=\"0\"\n        [hidden]=\"!(fileUploadMessages && !valid)\">\n    {{ fileUploadMessages | rpxTranslate }}\n  </span>\n  <div>\n    <!--<span *ngIf=\"getUploadedFileName()\" class=\"text-16\">File name: {{getUploadedFileName()}}</span>-->\n    <ccd-read-document-field *ngIf=\"caseField\" [caseField]=\"caseField\"></ccd-read-document-field>\n  </div>\n\n  <div style='position:relative'>\n    <div [id]=\"createElementId('fileInputWrapper')\" (click)=\"fileSelectEvent()\" (keyup)=\"fileSelectEvent()\"></div>\n    <input class=\"form-control bottom-30\" [id]=\"id()\" type=\"file\" (keydown.Tab)=\"fileValidationsOnTab()\" (change)=\"fileChangeEvent($event, caseField.field_type.regular_expression)\"\n           accept=\"{{caseField.field_type.regular_expression}}\" #fileInput/>\n  </div>\n</div>\n<div class=\"form-group bottom-30\">\n  <button class=\"button button-secondary\" type=\"button\" aria-label=\"Cancel upload\" (click)=\"cancelUpload()\" [disabled]=\"!isUploadInProgress()\">{{'Cancel upload' | rpxTranslate}}</button>\n</div>\n" }]
     }], () => [{ type: AbstractAppConfig }, { type: CaseNotifier }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: FileUploadStateService }, { type: JurisdictionService }], { fileInput: [{
             type: ViewChild,
             args: ['fileInput', { static: false }]
@@ -19626,7 +19634,7 @@ class WriteNumberFieldComponent extends AbstractFieldWriteComponent {
         this.numberControl = this.registerControl(new FormControl(this.caseField.value));
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵWriteNumberFieldComponent_BaseFactory; return function WriteNumberFieldComponent_Factory(__ngFactoryType__) { return (ɵWriteNumberFieldComponent_BaseFactory || (ɵWriteNumberFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(WriteNumberFieldComponent)))(__ngFactoryType__ || WriteNumberFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: WriteNumberFieldComponent, selectors: [["ccd-write-number-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 6, vars: 12, consts: [[1, "form-group", 3, "ngClass"], [3, "for"], ["class", "form-label", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], ["type", "text", "inputmode", "numeric", "pattern", "[0-9]*", 1, "form-control", "bottom-30", 3, "ngClass", "id", "formControl"], [1, "form-label"], [1, "form-hint"], [1, "error-message"]], template: function WriteNumberFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: WriteNumberFieldComponent, selectors: [["ccd-write-number-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 6, vars: 12, consts: [[1, "form-group", 3, "ngClass"], [3, "for"], ["class", "form-label", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], ["type", "text", "inputmode", "decimal", "pattern", "^[-+]?[0-9]+(?:\\.?[0-9]+)?$", 1, "form-control", "bottom-30", 3, "ngClass", "id", "formControl"], [1, "form-label"], [1, "form-hint"], [1, "error-message"]], template: function WriteNumberFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "label", 1);
             i0.ɵɵtemplate(2, WriteNumberFieldComponent_span_2_Template, 3, 3, "span", 2);
             i0.ɵɵelementEnd();
@@ -19649,7 +19657,7 @@ class WriteNumberFieldComponent extends AbstractFieldWriteComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteNumberFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-number-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error': !numberControl.valid && numberControl.dirty}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" *ngIf=\"caseField.label\">{{caseField | ccdFieldLabel}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">{{caseField.hint_text | rpxTranslate}}</span>\n  <span class=\"error-message\" *ngIf=\"numberControl.errors && numberControl.dirty\">\n    {{numberControl.errors | ccdFirstError:caseField.label}}\n  </span>\n\n  <input class=\"form-control bottom-30\" [ngClass]=\"{'govuk-input--error': numberControl.errors && numberControl.dirty}\"\n   [id]=\"id()\" type=\"text\" inputmode=\"numeric\" pattern=\"[0-9]*\" [formControl]=\"numberControl\">\n</div>\n" }]
+        args: [{ selector: 'ccd-write-number-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error': !numberControl.valid && numberControl.dirty}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" *ngIf=\"caseField.label\">{{caseField | ccdFieldLabel}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">{{caseField.hint_text | rpxTranslate}}</span>\n  <span class=\"error-message\" *ngIf=\"numberControl.errors && numberControl.dirty\">\n    {{numberControl.errors | ccdFirstError:caseField.label}}\n  </span>\n\n  <input class=\"form-control bottom-30\" [ngClass]=\"{'govuk-input--error': numberControl.errors && numberControl.dirty}\"\n   [id]=\"id()\" type=\"text\" inputmode=\"decimal\" pattern=\"^[-+]?[0-9]+(?:\\.?[0-9]+)?$\" [formControl]=\"numberControl\">\n</div>\n" }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteNumberFieldComponent, { className: "WriteNumberFieldComponent", filePath: "lib/shared/components/palette/number/write-number-field.component.ts", lineNumber: 9 }); })();
 
@@ -20597,6 +20605,7 @@ var QueryItemResponseStatus;
     QueryItemResponseStatus["NEW"] = "New";
     QueryItemResponseStatus["RESPONDED"] = "Responded";
     QueryItemResponseStatus["AWAITING"] = "Awaiting Response";
+    QueryItemResponseStatus["CLOSED"] = "Closed";
 })(QueryItemResponseStatus || (QueryItemResponseStatus = {}));
 
 var RespondToQueryErrorMessages;
@@ -20851,11 +20860,11 @@ class QueryCaseDetailsHeaderComponent {
     caseFields;
     ngOnInit() {
         this.caseTitle = new CaseField();
-        this.caseTitle.label = this.caseDetails.state.title_display;
+        this.caseTitle.label = this.caseDetails?.state?.title_display;
         this.caseFields = this.getCaseFieldsInfo();
     }
     getCaseFieldsInfo() {
-        const caseDataFields = this.caseDetails.tabs.reduce((acc, tab) => {
+        const caseDataFields = this.caseDetails?.tabs?.reduce((acc, tab) => {
             return acc.concat(tab.fields);
         }, []);
         return caseDataFields.concat(this.caseDetails.metadataFields);
@@ -20897,6 +20906,7 @@ class QueryListItem {
     createdOn;
     createdBy;
     parentId;
+    isClosed;
     children = [];
     messageIndexInParent = null;
     get lastSubmittedMessage() {
@@ -20919,14 +20929,7 @@ class QueryListItem {
         if (childrenCount === 0) {
             return this.lastSubmittedMessage.name;
         }
-        let index;
-        if (childrenCount === 1) {
-            index = 0;
-        }
-        else {
-            index = childrenCount % 2 === 1 ? childrenCount - 1 : childrenCount - 2;
-        }
-        return this.children[index].name;
+        return this.children[childrenCount - 1].name;
     }
     get lastSubmittedDate() {
         const childrenCount = this.children.length;
@@ -20957,7 +20960,15 @@ class QueryListItem {
         return new Date(this.children[index].createdOn);
     }
     get responseStatus() {
-        // Child logic (position-based)
+        const isThreadClosed = (item) => {
+            if (item.isClosed === 'Yes') {
+                return true;
+            }
+            return item.children?.some(child => isThreadClosed(child)) || false;
+        };
+        if (isThreadClosed(this)) {
+            return QueryItemResponseStatus.CLOSED;
+        }
         if (this.messageIndexInParent !== null) {
             return this.messageIndexInParent % 2 === 0
                 ? QueryItemResponseStatus.RESPONDED
@@ -21055,6 +21066,7 @@ class QueryManagementUtils {
         const body = formGroup.get('body').value;
         const attachments = formGroup.get('attachments').value;
         const formDocument = attachments.map((document) => this.documentToCollectionFormDocument(document));
+        const isClosed = formGroup.get('closeQuery').value ? 'Yes' : 'No';
         return {
             id: v4(),
             subject: queryItem.subject,
@@ -21065,7 +21077,8 @@ class QueryManagementUtils {
             hearingDate: queryItem.hearingDate,
             createdOn: new Date(),
             createdBy: currentUserId,
-            parentId: queryItem.id
+            parentId: queryItem.id,
+            isClosed
         };
     }
     static isObject(elem) {
@@ -21303,6 +21316,31 @@ function QueryCheckYourAnswersComponent_div_0_dl_25_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 5, "Change"), " ");
 } }
+function QueryCheckYourAnswersComponent_div_0_dl_26_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "dl", 14)(1, "div", 15)(2, "dt", 16);
+    i0.ɵɵtext(3);
+    i0.ɵɵpipe(4, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "dd", 17);
+    i0.ɵɵtext(6);
+    i0.ɵɵpipe(7, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "dd", 18)(9, "a", 19);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_26_Template_a_click_9_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(10);
+    i0.ɵɵpipe(11, "rpxTranslate");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    let tmp_4_0;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 3, "Closing the query"), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", ((tmp_4_0 = ctx_r2.formGroup.get("closeQuery")) == null ? null : tmp_4_0.value) ? "I want to close this query" : i0.ɵɵpipeBind1(7, 5, "No answer"), " ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(11, 7, "Change"), " ");
+} }
 function QueryCheckYourAnswersComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 3)(1, "div", 4);
@@ -21328,23 +21366,23 @@ function QueryCheckYourAnswersComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(22);
     i0.ɵɵpipe(23, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵtemplate(24, QueryCheckYourAnswersComponent_div_0_dl_24_Template, 14, 9, "dl", 13)(25, QueryCheckYourAnswersComponent_div_0_dl_25_Template, 11, 7, "dl", 13);
-    i0.ɵɵelement(26, "br");
-    i0.ɵɵelementStart(27, "div")(28, "button", 20);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_28_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
-    i0.ɵɵtext(29);
-    i0.ɵɵpipe(30, "rpxTranslate");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(31, "button", 21);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_31_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.submit()); });
-    i0.ɵɵtext(32);
-    i0.ɵɵpipe(33, "rpxTranslate");
+    i0.ɵɵtemplate(24, QueryCheckYourAnswersComponent_div_0_dl_24_Template, 14, 9, "dl", 13)(25, QueryCheckYourAnswersComponent_div_0_dl_25_Template, 11, 7, "dl", 13)(26, QueryCheckYourAnswersComponent_div_0_dl_26_Template, 12, 9, "dl", 13);
+    i0.ɵɵelement(27, "br");
+    i0.ɵɵelementStart(28, "div")(29, "button", 20);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(30);
+    i0.ɵɵpipe(31, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(32, "button", 21);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_32_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.submit()); });
+    i0.ɵɵtext(33);
+    i0.ɵɵpipe(34, "rpxTranslate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelement(34, "ccd-query-event-completion", 22);
+    i0.ɵɵelement(35, "ccd-query-event-completion", 22);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_11_0;
-    const defaultCheckYourAnswersTitle_r10 = i0.ɵɵreference(9);
+    const defaultCheckYourAnswersTitle_r11 = i0.ɵɵreference(9);
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r2.errorMessages.length > 0);
@@ -21355,25 +21393,27 @@ function QueryCheckYourAnswersComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND)("ngIfElse", defaultCheckYourAnswersTitle_r10);
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND)("ngIfElse", defaultCheckYourAnswersTitle_r11);
     i0.ɵɵadvance(4);
     i0.ɵɵproperty("caseDetails", ctx_r2.caseDetails);
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext !== ctx_r2.queryCreateContextEnum.FOLLOWUP);
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? "Response detail" : i0.ɵɵpipeBind1(17, 16, "Query detail"), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? "Response detail" : i0.ɵɵpipeBind1(17, 17, "Query detail"), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", (tmp_11_0 = ctx_r2.formGroup.get("body")) == null ? null : tmp_11_0.value, " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(23, 18, "Change"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(23, 19, "Change"), " ");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", ctx_r2.formGroup.get("attachments").value.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND);
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(30, 20, "Previous"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(31, 21, "Previous"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(33, 22, "Submit"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(34, 23, "Submit"), " ");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("eventCompletionParams", ctx_r2.eventCompletionParams);
 } }
@@ -21730,14 +21770,14 @@ class QueryCheckYourAnswersComponent {
     }
     static ɵfac = function QueryCheckYourAnswersComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryCheckYourAnswersComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(CasesService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(QualifyingQuestionService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryCheckYourAnswersComponent, selectors: [["ccd-query-check-your-answers"]], inputs: { formGroup: "formGroup", queryItem: "queryItem", queryCreateContext: "queryCreateContext", eventData: "eventData" }, outputs: { backClicked: "backClicked", querySubmitted: "querySubmitted", callbackConfirmationMessage: "callbackConfirmationMessage" }, decls: 1, vars: 1, consts: [["defaultCheckYourAnswersTitle", ""], ["isHearingRelatedFalse", ""], ["class", "govuk-grid-row", 4, "ngIf"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds-from-desktop"], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsSubject"], [4, "ngIf"], [1, "govuk-heading-l"], [4, "ngIf", "ngIfElse"], [1, "govuk-!-margin-bottom-4"], [3, "caseDetails"], ["class", "govuk-summary-list govuk-!-margin-bottom-0", 4, "ngIf"], [1, "govuk-summary-list", "govuk-!-margin-bottom-0"], [1, "govuk-summary-list__row"], [1, "govuk-summary-list__key"], [1, "govuk-summary-list__value"], [1, "govuk-summary-list__actions"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", "govuk-!-margin-right-3", 3, "click"], ["data-module", "govuk-button", "type", "submit", 1, "govuk-button", 3, "click"], [3, "eventCompletionParams"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], [4, "ngFor", "ngForOf"], ["href", "javascript:void(0)", 1, "validation-error", 3, "id"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "event_error-summary-heading", 1, "heading-h3", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], ["class", "ccd-error-summary-li", 4, "ngFor", "ngForOf"], [1, "ccd-error-summary-li"], [1, "govuk-caption-l"], ["href", "javascript:void(0)", "class", "govuk-link", 3, "click", 4, "ngIf"], ["class", "govuk-summary-list__row", 4, "ngIf"], [1, "govuk-summary-list__value", "govuk-summary-list__value--documentAttached"], [3, "attachments", 4, "ngIf"], [3, "attachments"]], template: function QueryCheckYourAnswersComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, QueryCheckYourAnswersComponent_div_0_Template, 35, 24, "div", 2);
+            i0.ɵɵtemplate(0, QueryCheckYourAnswersComponent_div_0_Template, 36, 25, "div", 2);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.readyToSubmit);
         } }, styles: [".govuk-summary-list__value--documentAttached[_ngcontent-%COMP%]{vertical-align:middle}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryCheckYourAnswersComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-check-your-answers', template: "<div class=\"govuk-grid-row\" *ngIf=\"readyToSubmit\">\n  <div class=\"govuk-grid-column-two-thirds-from-desktop\">\n    <!-- Error message summary -->\n    <div *ngIf=\"errorMessages.length > 0\" class=\"govuk-error-summary\"\n      aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"govuk-error-summary\">\n     <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n       {{ 'There is a problem' | rpxTranslate }}\n     </h2>\n     <div class=\"govuk-error-summary__body\">\n       <ul class=\"govuk-list govuk-error-summary__list\">\n         <li *ngFor=\"let errorMessage of errorMessages\">\n           <a [id]=\"'error-' + errorMessage.fieldId\" href=\"javascript:void(0)\"\n             class=\"validation-error\">{{ errorMessage.description | rpxTranslate }}</a>\n         </li>\n       </ul>\n     </div>\n   </div>\n\n   <div *ngIf=\"error && (error.details || error.message)\" class=\"error-summary\" role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n    <h3 class=\"heading-h3 error-summary-heading\" id=\"event_error-summary-heading\">\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\n  <ccd-callback-errors [callbackErrorsSubject]=\"callbackErrorsSubject\"></ccd-callback-errors>\n\n    <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\">\n      <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    </ng-container>\n\n    <h1 class=\"govuk-heading-l\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND; else defaultCheckYourAnswersTitle\">\n        {{ 'Review query response details' | rpxTranslate }}\n      </ng-container>\n\n      <ng-template #defaultCheckYourAnswersTitle>\n        {{ 'Review query details' | rpxTranslate }}\n      </ng-template>\n    </h1>\n    <div class=\"govuk-!-margin-bottom-4\">\n      <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n    </div>\n\n    <dl *ngIf=\"queryCreateContext !== queryCreateContextEnum.FOLLOWUP\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Submitted query' : 'Query subject' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? queryItem.subject : formGroup.get('subject')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a  *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" \n            href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query detail' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('body')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <ng-container *ngIf=\"formGroup.get('isHearingRelated')?.value === true; else isHearingRelatedFalse\">\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n          </ng-container>\n          <ng-template #isHearingRelatedFalse>\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n          </ng-template>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n\n      <div *ngIf=\"formGroup.get('isHearingRelated')?.value\" class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY\n            ? 'What is the date of the hearing?'\n            : 'What is the date of the hearing your query is related to?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('hearingDate')?.value | date: 'dd MMM yyyy' }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\" *ngIf=\"this.formGroup.get('attachments').value.length > 0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY ? 'Upload a file to the query' : 'Document attached' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-summary-list__value--documentAttached\">\n          <ccd-query-attachments-read\n            *ngIf=\"this.formGroup.get('attachments').value\"\n            [attachments]=\"attachments\"\n          >\n          </ccd-query-attachments-read>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <br>\n\n    <div>\n      <button class=\"govuk-button govuk-button--secondary govuk-!-margin-right-3\" data-module=\"govuk-button\"\n        (click)=\"goBack()\">\n        {{ 'Previous' | rpxTranslate }}\n      </button>\n      <button class=\"govuk-button\" data-module=\"govuk-button\" type=\"submit\" (click)=\"submit()\">\n        {{ 'Submit' | rpxTranslate }}\n      </button>\n    </div>\n  </div>\n\n  <ccd-query-event-completion [eventCompletionParams]=\"eventCompletionParams\">    \n  </ccd-query-event-completion>\n</div>\n", styles: [".govuk-summary-list__value--documentAttached{vertical-align:middle}\n"] }]
+        args: [{ selector: 'ccd-query-check-your-answers', template: "<div class=\"govuk-grid-row\" *ngIf=\"readyToSubmit\">\n  <div class=\"govuk-grid-column-two-thirds-from-desktop\">\n    <!-- Error message summary -->\n    <div *ngIf=\"errorMessages.length > 0\" class=\"govuk-error-summary\"\n      aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"govuk-error-summary\">\n     <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n       {{ 'There is a problem' | rpxTranslate }}\n     </h2>\n     <div class=\"govuk-error-summary__body\">\n       <ul class=\"govuk-list govuk-error-summary__list\">\n         <li *ngFor=\"let errorMessage of errorMessages\">\n           <a [id]=\"'error-' + errorMessage.fieldId\" href=\"javascript:void(0)\"\n             class=\"validation-error\">{{ errorMessage.description | rpxTranslate }}</a>\n         </li>\n       </ul>\n     </div>\n   </div>\n\n   <div *ngIf=\"error && (error.details || error.message)\" class=\"error-summary\" role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n    <h3 class=\"heading-h3 error-summary-heading\" id=\"event_error-summary-heading\">\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\n  <ccd-callback-errors [callbackErrorsSubject]=\"callbackErrorsSubject\"></ccd-callback-errors>\n\n    <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\">\n      <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    </ng-container>\n\n    <h1 class=\"govuk-heading-l\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND; else defaultCheckYourAnswersTitle\">\n        {{ 'Review query response details' | rpxTranslate }}\n      </ng-container>\n\n      <ng-template #defaultCheckYourAnswersTitle>\n        {{ 'Review query details' | rpxTranslate }}\n      </ng-template>\n    </h1>\n    <div class=\"govuk-!-margin-bottom-4\">\n      <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n    </div>\n\n    <dl *ngIf=\"queryCreateContext !== queryCreateContextEnum.FOLLOWUP\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Submitted query' : 'Query subject' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? queryItem.subject : formGroup.get('subject')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a  *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" \n            href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query detail' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('body')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <ng-container *ngIf=\"formGroup.get('isHearingRelated')?.value === true; else isHearingRelatedFalse\">\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n          </ng-container>\n          <ng-template #isHearingRelatedFalse>\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n          </ng-template>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n\n      <div *ngIf=\"formGroup.get('isHearingRelated')?.value\" class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY\n            ? 'What is the date of the hearing?'\n            : 'What is the date of the hearing your query is related to?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('hearingDate')?.value | date: 'dd MMM yyyy' }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\" *ngIf=\"this.formGroup.get('attachments').value.length > 0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY ? 'Upload a file to the query' : 'Document attached' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-summary-list__value--documentAttached\">\n          <ccd-query-attachments-read\n            *ngIf=\"this.formGroup.get('attachments').value\"\n            [attachments]=\"attachments\"\n          >\n          </ccd-query-attachments-read>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ 'Closing the query' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('closeQuery')?.value ? 'I want to close this query' : 'No answer' | rpxTranslate }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <br>\n\n    <div>\n      <button class=\"govuk-button govuk-button--secondary govuk-!-margin-right-3\" data-module=\"govuk-button\"\n        (click)=\"goBack()\">\n        {{ 'Previous' | rpxTranslate }}\n      </button>\n      <button class=\"govuk-button\" data-module=\"govuk-button\" type=\"submit\" (click)=\"submit()\">\n        {{ 'Submit' | rpxTranslate }}\n      </button>\n    </div>\n  </div>\n\n  <ccd-query-event-completion [eventCompletionParams]=\"eventCompletionParams\">    \n  </ccd-query-event-completion>\n</div>\n", styles: [".govuk-summary-list__value--documentAttached{vertical-align:middle}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: CasesService }, { type: CaseNotifier }, { type: WorkAllocationService }, { type: SessionStorageService }, { type: QualifyingQuestionService }], { formGroup: [{
             type: Input
         }], queryItem: [{
@@ -21757,14 +21797,16 @@ class QueryCheckYourAnswersComponent {
 
 function QueryDetailsComponent_ng_container_0_p_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "p")(1, "a", 10);
-    i0.ɵɵlistener("click", function QueryDetailsComponent_ng_container_0_p_1_Template_a_click_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onBack()); });
-    i0.ɵɵtext(2);
-    i0.ɵɵpipe(3, "rpxTranslate");
+    i0.ɵɵelementStart(0, "p");
+    i0.ɵɵelement(1, "br");
+    i0.ɵɵelementStart(2, "a", 10);
+    i0.ɵɵlistener("click", function QueryDetailsComponent_ng_container_0_p_1_Template_a_click_2_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onBack()); });
+    i0.ɵɵtext(3);
+    i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, "Back to query list"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 1, "Back to query list"));
 } }
 function QueryDetailsComponent_ng_container_0_tr_42_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr", 11)(1, "th", 6);
@@ -21979,7 +22021,7 @@ function QueryDetailsComponent_ng_container_0_ng_container_44_Template(rf, ctx)
 } }
 function QueryDetailsComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, QueryDetailsComponent_ng_container_0_p_1_Template, 4, 3, "p", 1);
+    i0.ɵɵtemplate(1, QueryDetailsComponent_ng_container_0_p_1_Template, 5, 3, "p", 1);
     i0.ɵɵelementStart(2, "div")(3, "table", 2);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementStart(5, "caption", 3)(6, "div");
@@ -22102,6 +22144,10 @@ class QueryDetailsComponent {
     }
     hasRespondedToQuery() {
         const isAwaiting = this.queryResponseStatus === undefined || this.queryResponseStatus === QueryItemResponseStatus.AWAITING;
+        if (this.queryResponseStatus === QueryItemResponseStatus.CLOSED) {
+            this.hasResponded.emit(true);
+            return true;
+        }
         if (this.isInternalUser()) {
             if (isAwaiting) {
                 this.hasResponded.emit(false);
@@ -22126,7 +22172,7 @@ class QueryDetailsComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailsComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-details', template: "<ng-container *ngIf=\"query\">\n  <p *ngIf=\"showItem\">\n    <a class=\"govuk-link\" href=\"javascript:void(0)\" (click)=\"onBack()\">{{ 'Back to query list' | rpxTranslate }}</a>\n  </p>\n  <div>\n    <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Details of the query' | rpxTranslate\">\n      <caption class=\"govuk-table__caption govuk-table__caption--l\">\n        <div>{{ 'Query details' | rpxTranslate }}</div>\n      </caption>\n      <tbody class=\"govuk-table__body\">\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.lastSubmittedBy }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Submission date' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.createdOn | date: 'dd MMMM YYYY HH:mm' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query subject' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.subject }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query body' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.body }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\" [class.govuk-table__header--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </th>\n        <td class=\"govuk-table__cell\" [class.govuk-table__cell--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate: null : (query.isHearingRelated) }}</td>\n      </tr>\n      <tr class=\"govuk-table__row govuk-table__row--isHearingRelated\" *ngIf=\"query.isHearingRelated === 'Yes'\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'What is the date of the hearing?' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.hearingDate | date: 'dd MMM yyyy' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\" *ngIf=\"query.attachments.length > 0\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">\n          <ccd-query-attachments-read\n            *ngIf=\"query.attachments\"\n            [attachments]=\"query.attachments\"\n          >\n          </ccd-query-attachments-read>\n        </td>\n      </tr>\n      </tbody>\n    </table>\n  </div>\n  <ng-container *ngIf=\"query.children?.length > 0\">\n    <ng-container *ngFor=\"let child of query.children; let i = index;\">\n      <ng-container *ngIf=\"i % 2 === 0; else followUpMessage\">\n        <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Response of the query' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Response' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last response date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'  }}</td>\n          </tr>\n\n            <tr *ngIf=\"isInternalUser()\" class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Caseworker name' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.name }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Response detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n          <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">\n              <ccd-query-attachments-read\n                *ngIf=\"child.attachments\"\n                [attachments]=\"child.attachments\"\n              >\n              </ccd-query-attachments-read>\n            </td>\n          </tr>\n          </tbody>\n        </table>\n      </ng-container>\n\n      <ng-template #followUpMessage>\n        <!-- <div class=\"query_details_caption\">{{ 'Follow-up' | rpxTranslate }}</div> -->\n        <table class=\"govuk-table query-details-table\"\n               [attr.aria-describedby]=\"'Follow-up of the response' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Follow up query' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submission date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'}}</td>\n          </tr>\n\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.name }}</td>\n          </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">\n                <ccd-query-attachments-read\n                  *ngIf=\"child.attachments\"\n                  [attachments]=\"child.attachments\"\n                >\n                </ccd-query-attachments-read>\n              </td>\n            </tr>\n          </tbody>\n        </table>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n</ng-container>\n", styles: [".query-details-table .govuk-table__header{width:330px}\n"] }]
+        args: [{ selector: 'ccd-query-details', template: "<ng-container *ngIf=\"query\">\n  <p *ngIf=\"showItem\">\n    <br />\n    <a class=\"govuk-link\" href=\"javascript:void(0)\" (click)=\"onBack()\">{{ 'Back to query list' | rpxTranslate }}</a>\n  </p>\n  <div>\n    <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Details of the query' | rpxTranslate\">\n      <caption class=\"govuk-table__caption govuk-table__caption--l\">\n        <div>{{ 'Query details' | rpxTranslate }}</div>\n      </caption>\n      <tbody class=\"govuk-table__body\">\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.lastSubmittedBy }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Submission date' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.createdOn | date: 'dd MMMM YYYY HH:mm' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query subject' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.subject }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query body' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.body }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\" [class.govuk-table__header--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </th>\n        <td class=\"govuk-table__cell\" [class.govuk-table__cell--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate: null : (query.isHearingRelated) }}</td>\n      </tr>\n      <tr class=\"govuk-table__row govuk-table__row--isHearingRelated\" *ngIf=\"query.isHearingRelated === 'Yes'\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'What is the date of the hearing?' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.hearingDate | date: 'dd MMM yyyy' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\" *ngIf=\"query.attachments.length > 0\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">\n          <ccd-query-attachments-read\n            *ngIf=\"query.attachments\"\n            [attachments]=\"query.attachments\"\n          >\n          </ccd-query-attachments-read>\n        </td>\n      </tr>\n      </tbody>\n    </table>\n  </div>\n  <ng-container *ngIf=\"query.children?.length > 0\">\n    <ng-container *ngFor=\"let child of query.children; let i = index;\">\n      <ng-container *ngIf=\"i % 2 === 0; else followUpMessage\">\n        <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Response of the query' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Response' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last response date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'  }}</td>\n          </tr>\n\n            <tr *ngIf=\"isInternalUser()\" class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Caseworker name' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.name }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Response detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n          <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">\n              <ccd-query-attachments-read\n                *ngIf=\"child.attachments\"\n                [attachments]=\"child.attachments\"\n              >\n              </ccd-query-attachments-read>\n            </td>\n          </tr>\n          </tbody>\n        </table>\n      </ng-container>\n\n      <ng-template #followUpMessage>\n        <!-- <div class=\"query_details_caption\">{{ 'Follow-up' | rpxTranslate }}</div> -->\n        <table class=\"govuk-table query-details-table\"\n               [attr.aria-describedby]=\"'Follow-up of the response' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Follow up query' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submission date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'}}</td>\n          </tr>\n\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.name }}</td>\n          </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">\n                <ccd-query-attachments-read\n                  *ngIf=\"child.attachments\"\n                  [attachments]=\"child.attachments\"\n                >\n                </ccd-query-attachments-read>\n              </td>\n            </tr>\n          </tbody>\n        </table>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n</ng-container>\n", styles: [".query-details-table .govuk-table__header{width:330px}\n"] }]
     }], () => [{ type: SessionStorageService }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }], { query: [{
             type: Input
         }], caseId: [{
@@ -22517,8 +22563,14 @@ class QueryWriteDateInputComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryWriteDateInputComponent, { className: "QueryWriteDateInputComponent", filePath: "lib/shared/components/palette/query-management/components/query-write/query-write-date-input/query-write-date-input.component.ts", lineNumber: 15 }); })();
 
 const _c0$C = a0 => ({ "govuk-form-group--error": a0 });
+function QueryWriteRaiseQueryComponent_ccd_query_case_details_header_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-query-case-details-header", 5);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("caseDetails", ctx_r0.caseDetails);
+} }
 function QueryWriteRaiseQueryComponent_div_11_p_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 32)(1, "span", 10);
+    i0.ɵɵelementStart(0, "p", 33)(1, "span", 11);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -22526,14 +22578,14 @@ function QueryWriteRaiseQueryComponent_div_11_p_19_Template(rf, ctx) { if (rf &
     i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Error:"));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 4, ctx_r1.getSubjectErrorMessage()), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 4, ctx_r0.getSubjectErrorMessage()), " ");
 } }
 function QueryWriteRaiseQueryComponent_div_11_p_29_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 33)(1, "span", 10);
+    i0.ɵɵelementStart(0, "p", 34)(1, "span", 11);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -22541,14 +22593,14 @@ function QueryWriteRaiseQueryComponent_div_11_p_29_Template(rf, ctx) { if (rf &
     i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(3, 2, "Error:"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r1.raiseQueryErrorMessage.QUERY_BODY), " ");
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r0.raiseQueryErrorMessage.QUERY_BODY), " ");
 } }
 function QueryWriteRaiseQueryComponent_div_11_p_38_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 34)(1, "span", 10);
+    i0.ɵɵelementStart(0, "p", 35)(1, "span", 11);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -22556,14 +22608,14 @@ function QueryWriteRaiseQueryComponent_div_11_p_38_Template(rf, ctx) { if (rf &
     i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(3, 2, "Error:"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r1.raiseQueryErrorMessage.QUERY_HEARING_RELATED), " ");
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r0.raiseQueryErrorMessage.QUERY_HEARING_RELATED), " ");
 } }
 function QueryWriteRaiseQueryComponent_div_11_ng_container_50_p_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 40)(1, "span", 10);
+    i0.ɵɵelementStart(0, "p", 41)(1, "span", 11);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -22571,126 +22623,126 @@ function QueryWriteRaiseQueryComponent_div_11_ng_container_50_p_7_Template(rf, c
     i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
+    const ctx_r0 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(3, 2, "Error:"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r1.raiseQueryErrorMessage.QUERY_HEARING_DATE), " ");
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 4, ctx_r0.raiseQueryErrorMessage.QUERY_HEARING_DATE), " ");
 } }
 function QueryWriteRaiseQueryComponent_div_11_ng_container_50_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 35)(2, "fieldset", 36)(3, "legend")(4, "label", 37);
+    i0.ɵɵelementStart(1, "div", 36)(2, "fieldset", 37)(3, "legend")(4, "label", 38);
     i0.ɵɵtext(5);
     i0.ɵɵpipe(6, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(7, QueryWriteRaiseQueryComponent_div_11_ng_container_50_p_7_Template, 6, 6, "p", 38);
-    i0.ɵɵelement(8, "ccd-query-write-date-input", 39);
+    i0.ɵɵtemplate(7, QueryWriteRaiseQueryComponent_div_11_ng_container_50_p_7_Template, 6, 6, "p", 39);
+    i0.ɵɵelement(8, "ccd-query-write-date-input", 40);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(5, _c0$C, ctx_r1.submitted && ctx_r1.formGroup.get("isHearingRelated").value === true && ctx_r1.formGroup.get("hearingDate").value === null));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(5, _c0$C, ctx_r0.submitted && ctx_r0.formGroup.get("isHearingRelated").value === true && ctx_r0.formGroup.get("hearingDate").value === null));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(6, 3, "What is the date of the hearing?"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r1.submitted && ctx_r1.formGroup.get("isHearingRelated").value === true && ctx_r1.formGroup.get("hearingDate").value === null);
+    i0.ɵɵproperty("ngIf", ctx_r0.submitted && ctx_r0.formGroup.get("isHearingRelated").value === true && ctx_r0.formGroup.get("hearingDate").value === null);
 } }
 function QueryWriteRaiseQueryComponent_div_11_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 5)(1, "div", 6)(2, "div")(3, "div", 7)(4, "span", 8);
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 6)(1, "div", 7)(2, "div")(3, "div", 8)(4, "span", 9);
     i0.ɵɵtext(5, "!");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "strong", 9)(7, "span", 10);
+    i0.ɵɵelementStart(6, "strong", 10)(7, "span", 11);
     i0.ɵɵtext(8, "Warning");
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(9, "ccd-markdown", 11);
+    i0.ɵɵelement(9, "ccd-markdown", 12);
     i0.ɵɵpipe(10, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(11, "div", 12)(12, "div", 13)(13, "label", 14);
+    i0.ɵɵelementStart(11, "div", 13)(12, "div", 14)(13, "label", 15);
     i0.ɵɵtext(14);
     i0.ɵɵpipe(15, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(16, "div", 15);
+    i0.ɵɵelementStart(16, "div", 16);
     i0.ɵɵtext(17);
     i0.ɵɵpipe(18, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(19, QueryWriteRaiseQueryComponent_div_11_p_19_Template, 6, 6, "p", 16);
-    i0.ɵɵelementStart(20, "input", 17);
-    i0.ɵɵlistener("input", function QueryWriteRaiseQueryComponent_div_11_Template_input_input_20_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSubjectInput()); });
+    i0.ɵɵtemplate(19, QueryWriteRaiseQueryComponent_div_11_p_19_Template, 6, 6, "p", 17);
+    i0.ɵɵelementStart(20, "input", 18);
+    i0.ɵɵlistener("input", function QueryWriteRaiseQueryComponent_div_11_Template_input_input_20_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSubjectInput()); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(21, "div", 12)(22, "div", 13)(23, "label", 18);
+    i0.ɵɵelementStart(21, "div", 13)(22, "div", 14)(23, "label", 19);
     i0.ɵɵtext(24);
     i0.ɵɵpipe(25, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(26, "div", 19);
+    i0.ɵɵelementStart(26, "div", 20);
     i0.ɵɵtext(27);
     i0.ɵɵpipe(28, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(29, QueryWriteRaiseQueryComponent_div_11_p_29_Template, 6, 6, "p", 20);
-    i0.ɵɵelementStart(30, "textarea", 21);
+    i0.ɵɵtemplate(29, QueryWriteRaiseQueryComponent_div_11_p_29_Template, 6, 6, "p", 21);
+    i0.ɵɵelementStart(30, "textarea", 22);
     i0.ɵɵtext(31, "          ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(32, "div", 12)(33, "fieldset", 22)(34, "legend")(35, "label", 23);
+    i0.ɵɵelementStart(32, "div", 13)(33, "fieldset", 23)(34, "legend")(35, "label", 24);
     i0.ɵɵtext(36);
     i0.ɵɵpipe(37, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(38, QueryWriteRaiseQueryComponent_div_11_p_38_Template, 6, 6, "p", 24);
-    i0.ɵɵelementStart(39, "div", 25)(40, "div", 26);
-    i0.ɵɵelement(41, "input", 27);
-    i0.ɵɵelementStart(42, "label", 28);
+    i0.ɵɵtemplate(38, QueryWriteRaiseQueryComponent_div_11_p_38_Template, 6, 6, "p", 25);
+    i0.ɵɵelementStart(39, "div", 26)(40, "div", 27);
+    i0.ɵɵelement(41, "input", 28);
+    i0.ɵɵelementStart(42, "label", 29);
     i0.ɵɵtext(43);
     i0.ɵɵpipe(44, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(45, "div", 26);
-    i0.ɵɵelement(46, "input", 29);
-    i0.ɵɵelementStart(47, "label", 30);
+    i0.ɵɵelementStart(45, "div", 27);
+    i0.ɵɵelement(46, "input", 30);
+    i0.ɵɵelementStart(47, "label", 31);
     i0.ɵɵtext(48);
     i0.ɵɵpipe(49, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵtemplate(50, QueryWriteRaiseQueryComponent_div_11_ng_container_50_Template, 9, 7, "ng-container", 31);
+    i0.ɵɵtemplate(50, QueryWriteRaiseQueryComponent_div_11_ng_container_50_Template, 9, 7, "ng-container", 32);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("formGroup", ctx_r1.formGroup);
+    i0.ɵɵproperty("formGroup", ctx_r0.formGroup);
     i0.ɵɵadvance(8);
-    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(10, 23, ctx_r1.serviceMessage));
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(10, 23, ctx_r0.serviceMessage));
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(43, _c0$C, ctx_r1.submitted && ctx_r1.formGroup.get("subject").hasError("required")));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(43, _c0$C, ctx_r0.submitted && ctx_r0.formGroup.get("subject").hasError("required")));
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(15, 25, "Query subject"), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(18, 27, "The subject should be a summary of your query"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r1.submitted && (ctx_r1.formGroup.get("subject").hasError("required") || ctx_r1.formGroup.get("subject").hasError("maxlength")));
+    i0.ɵɵproperty("ngIf", ctx_r0.submitted && (ctx_r0.formGroup.get("subject").hasError("required") || ctx_r0.formGroup.get("subject").hasError("maxlength")));
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(45, _c0$C, ctx_r1.submitted && ctx_r1.formGroup.get("body").hasError("required")));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(45, _c0$C, ctx_r0.submitted && ctx_r0.formGroup.get("body").hasError("required")));
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(25, 29, "Query detail"), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(28, 31, "Include as many details as possible so case workers can respond to your query"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r1.submitted && ctx_r1.formGroup.get("body").hasError("required"));
+    i0.ɵɵproperty("ngIf", ctx_r0.submitted && ctx_r0.formGroup.get("body").hasError("required"));
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("govuk-textarea--error", ctx_r1.submitted && ctx_r1.formGroup.get("body").hasError("required"));
+    i0.ɵɵclassProp("govuk-textarea--error", ctx_r0.submitted && ctx_r0.formGroup.get("body").hasError("required"));
     i0.ɵɵproperty("formControlName", "body");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(47, _c0$C, ctx_r1.submitted && ctx_r1.formGroup.get("isHearingRelated").hasError("required")));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(47, _c0$C, ctx_r0.submitted && ctx_r0.formGroup.get("isHearingRelated").hasError("required")));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(37, 33, "Is the query hearing related?"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r1.submitted && ctx_r1.formGroup.get("isHearingRelated").hasError("required"));
+    i0.ɵɵproperty("ngIf", ctx_r0.submitted && ctx_r0.formGroup.get("isHearingRelated").hasError("required"));
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("checked", ctx_r1.formGroup.get("isHearingRelated").value === true)("value", true);
+    i0.ɵɵproperty("checked", ctx_r0.formGroup.get("isHearingRelated").value === true)("value", true);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(44, 35, "Is the query hearing related?", null, "Yes"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("checked", ctx_r1.formGroup.get("isHearingRelated").value === false)("value", false);
+    i0.ɵɵproperty("checked", ctx_r0.formGroup.get("isHearingRelated").value === false)("value", false);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(49, 39, "Is the query hearing related?", null, "No"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r1.formGroup.get("isHearingRelated").value);
+    i0.ɵɵproperty("ngIf", ctx_r0.formGroup.get("isHearingRelated").value);
 } }
 class QueryWriteRaiseQueryComponent {
     formGroup;
@@ -22717,7 +22769,7 @@ class QueryWriteRaiseQueryComponent {
         return '';
     }
     static ɵfac = function QueryWriteRaiseQueryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryWriteRaiseQueryComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryWriteRaiseQueryComponent, selectors: [["ccd-query-write-raise-query"]], inputs: { formGroup: "formGroup", submitted: "submitted", caseDetails: "caseDetails", showForm: "showForm", serviceMessage: "serviceMessage" }, decls: 12, vars: 8, consts: [[1, "govuk-!-margin-bottom-6"], [1, "govuk-caption-l"], [1, "govuk-heading-l", "govuk-!-margin-bottom-4"], [3, "caseDetails"], ["class", "govuk-!-margin-bottom-4", 4, "ngIf"], [1, "govuk-!-margin-bottom-4"], [3, "formGroup"], [1, "govuk-warning-text"], ["aria-hidden", "true", 1, "govuk-warning-text__icon"], [1, "govuk-warning-text__text"], [1, "govuk-visually-hidden"], [3, "content"], [1, "govuk-form-group", 3, "ngClass"], [1, "govuk-label-wrapper"], ["for", "subject", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "subject-hint", 1, "govuk-hint"], ["id", "subject-error", "class", "govuk-error-message", 4, "ngIf"], ["type", "text", "id", "subject", "formControlName", "subject", "maxlength", "200", "aria-describedby", "subject-error", 1, "govuk-input", 3, "input"], ["for", "body", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "body-hint", 1, "govuk-hint"], ["id", "body-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "body", "name", "body", "rows", "5", "aria-describedby", "body-hint body-error", 1, "govuk-textarea", 3, "formControlName"], [1, "govuk-fieldset"], [1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "isHearingRelated-error", "class", "govuk-error-message", 4, "ngIf"], ["data-module", "govuk-radios", 1, "govuk-radios", "govuk-radios--inline"], [1, "govuk-radios__item"], ["id", "isHearingRelated-yes", "name", "isHearingRelated", "type", "radio", "formControlName", "isHearingRelated", 1, "govuk-radios__input", 3, "checked", "value"], ["for", "isHearingRelated-yes", 1, "govuk-label", "govuk-radios__label"], ["id", "isHearingRelated-no", "name", "isHearingRelated", "type", "radio", "formControlName", "isHearingRelated", 1, "govuk-radios__input", 3, "checked", "value"], ["for", "isHearingRelated-no", 1, "govuk-label", "govuk-radios__label"], [4, "ngIf"], ["id", "subject-error", 1, "govuk-error-message"], ["id", "body-error", 1, "govuk-error-message"], ["id", "isHearingRelated-error", 1, "govuk-error-message"], [1, "govuk-radios__conditional", "govuk-!-margin-top-1", 3, "ngClass"], ["role", "group", 1, "govuk-fieldset"], [1, "govuk-label", "govuk-label--s"], ["id", "hearingDate-error", "class", "govuk-error-message", 4, "ngIf"], ["formControlName", "hearingDate"], ["id", "hearingDate-error", 1, "govuk-error-message"]], template: function QueryWriteRaiseQueryComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryWriteRaiseQueryComponent, selectors: [["ccd-query-write-raise-query"]], inputs: { formGroup: "formGroup", submitted: "submitted", caseDetails: "caseDetails", showForm: "showForm", serviceMessage: "serviceMessage" }, decls: 12, vars: 8, consts: [[1, "govuk-!-margin-bottom-6"], [1, "govuk-caption-l"], [1, "govuk-heading-l", "govuk-!-margin-bottom-4"], [3, "caseDetails", 4, "ngIf"], ["class", "govuk-!-margin-bottom-4", 4, "ngIf"], [3, "caseDetails"], [1, "govuk-!-margin-bottom-4"], [3, "formGroup"], [1, "govuk-warning-text"], ["aria-hidden", "true", 1, "govuk-warning-text__icon"], [1, "govuk-warning-text__text"], [1, "govuk-visually-hidden"], [3, "content"], [1, "govuk-form-group", 3, "ngClass"], [1, "govuk-label-wrapper"], ["for", "subject", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "subject-hint", 1, "govuk-hint"], ["id", "subject-error", "class", "govuk-error-message", 4, "ngIf"], ["type", "text", "id", "subject", "formControlName", "subject", "maxlength", "200", "aria-describedby", "subject-error", 1, "govuk-input", 3, "input"], ["for", "body", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "body-hint", 1, "govuk-hint"], ["id", "body-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "body", "name", "body", "rows", "5", "aria-describedby", "body-hint body-error", 1, "govuk-textarea", 3, "formControlName"], [1, "govuk-fieldset"], [1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "isHearingRelated-error", "class", "govuk-error-message", 4, "ngIf"], ["data-module", "govuk-radios", 1, "govuk-radios", "govuk-radios--inline"], [1, "govuk-radios__item"], ["id", "isHearingRelated-yes", "name", "isHearingRelated", "type", "radio", "formControlName", "isHearingRelated", 1, "govuk-radios__input", 3, "checked", "value"], ["for", "isHearingRelated-yes", 1, "govuk-label", "govuk-radios__label"], ["id", "isHearingRelated-no", "name", "isHearingRelated", "type", "radio", "formControlName", "isHearingRelated", 1, "govuk-radios__input", 3, "checked", "value"], ["for", "isHearingRelated-no", 1, "govuk-label", "govuk-radios__label"], [4, "ngIf"], ["id", "subject-error", 1, "govuk-error-message"], ["id", "body-error", 1, "govuk-error-message"], ["id", "isHearingRelated-error", 1, "govuk-error-message"], [1, "govuk-radios__conditional", "govuk-!-margin-top-1", 3, "ngClass"], ["role", "group", 1, "govuk-fieldset"], [1, "govuk-label", "govuk-label--s"], ["id", "hearingDate-error", "class", "govuk-error-message", 4, "ngIf"], ["formControlName", "hearingDate"], ["id", "hearingDate-error", 1, "govuk-error-message"]], template: function QueryWriteRaiseQueryComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div")(1, "div", 0)(2, "div", 1);
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "rpxTranslate");
@@ -22727,7 +22779,7 @@ class QueryWriteRaiseQueryComponent {
             i0.ɵɵpipe(7, "rpxTranslate");
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(8, "div");
-            i0.ɵɵelement(9, "ccd-query-case-details-header", 3);
+            i0.ɵɵtemplate(9, QueryWriteRaiseQueryComponent_ccd_query_case_details_header_9_Template, 1, 1, "ccd-query-case-details-header", 3);
             i0.ɵɵelementEnd();
             i0.ɵɵelement(10, "hr");
             i0.ɵɵtemplate(11, QueryWriteRaiseQueryComponent_div_11_Template, 51, 49, "div", 4);
@@ -22738,14 +22790,14 @@ class QueryWriteRaiseQueryComponent {
             i0.ɵɵadvance(3);
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 6, "Enter query details"));
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("caseDetails", ctx.caseDetails);
+            i0.ɵɵproperty("ngIf", ctx.caseDetails);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.showForm);
         } }, encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryWriteRaiseQueryComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-write-raise-query', template: "<div>\n  <div class=\"govuk-!-margin-bottom-6\">\n    <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    <h1 class=\"govuk-heading-l govuk-!-margin-bottom-4\">{{ 'Enter query details' | rpxTranslate }}</h1>\n  </div>\n\n  <div>\n    <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n  </div>\n\n  <hr>\n\n  <div class=\"govuk-!-margin-bottom-4\" *ngIf=\"showForm\">\n    <div [formGroup]=\"formGroup\">\n      <div>\n        <div class=\"govuk-warning-text\">\n          <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n          <strong class=\"govuk-warning-text__text\">\n            <span class=\"govuk-visually-hidden\">Warning</span>\n            <ccd-markdown\n              [content]=\"serviceMessage | rpxTranslate\">\n            </ccd-markdown>\n          </strong>\n        </div>\n        <div class=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('subject').hasError('required')}\">\n          <div class=\"govuk-label-wrapper\">\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"subject\">\n              {{ 'Query subject' | rpxTranslate }}\n            </label>\n          </div>\n          <div id=\"subject-hint\" class=\"govuk-hint\">\n            {{ 'The subject should be a summary of your query' | rpxTranslate }}\n          </div>\n          <p id=\"subject-error\" class=\"govuk-error-message\"\n            *ngIf=\"submitted && (formGroup.get('subject').hasError('required') || formGroup.get('subject').hasError('maxlength'))\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }}</span>\n            {{ getSubjectErrorMessage() | rpxTranslate }}\n          </p>\n\n          <input type=\"text\"\n            id=\"subject\"\n            class=\"govuk-input\"\n            formControlName=\"subject\"\n            maxlength=\"200\"\n            (input)=\"onSubjectInput()\"\n            aria-describedby=\"subject-error\" />\n      </div>\n\n        <div class=\"govuk-form-group\"\n             [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('body').hasError('required')}\">\n          <div class=\"govuk-label-wrapper\">\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"body\">\n              {{ 'Query detail' | rpxTranslate }}\n            </label>\n          </div>\n          <div id=\"body-hint\" class=\"govuk-hint\">\n            {{ 'Include as many details as possible so case workers can respond to your query' | rpxTranslate }}\n          </div>\n          <p id=\"body-error\" class=\"govuk-error-message\"\n              *ngIf=\"submitted && formGroup.get('body').hasError('required')\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_BODY | rpxTranslate }}\n          </p>\n          <textarea [formControlName]=\"'body'\"\n                    id=\"body\" name=\"body\" rows=\"5\"\n                    aria-describedby=\"body-hint body-error\"\n                    class=\"govuk-textarea\"\n                    [class.govuk-textarea--error]=\"submitted && formGroup.get('body').hasError('required')\"\n          >\n          </textarea>\n      </div>\n\n      <div class=\"govuk-form-group\"\n           [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('isHearingRelated').hasError('required')}\">\n        <fieldset class=\"govuk-fieldset\">\n          <legend>\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\">\n              {{ 'Is the query hearing related?' | rpxTranslate }}\n            </label>\n          </legend>\n          <p id=\"isHearingRelated-error\" class=\"govuk-error-message\"\n              *ngIf=\"submitted && formGroup.get('isHearingRelated').hasError('required')\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_HEARING_RELATED | rpxTranslate }}\n          </p>\n          <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n            <div class=\"govuk-radios__item\">\n              <input class=\"govuk-radios__input\" id=\"isHearingRelated-yes\" name=\"isHearingRelated\"\n                     type=\"radio\"\n                     formControlName=\"isHearingRelated\"\n                     [checked]=\"formGroup.get('isHearingRelated').value === true\" [value]=\"true\"\n              >\n              <label class=\"govuk-label govuk-radios__label\" for=\"isHearingRelated-yes\">\n                {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n              </label>\n            </div>\n            <div class=\"govuk-radios__item\">\n              <input class=\"govuk-radios__input\" id=\"isHearingRelated-no\" name=\"isHearingRelated\"\n                     type=\"radio\"\n                     formControlName=\"isHearingRelated\"\n                     [checked]=\"formGroup.get('isHearingRelated').value === false\" [value]=\"false\"\n              >\n              <label class=\"govuk-label govuk-radios__label\" for=\"isHearingRelated-no\">\n                {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n              </label>\n            </div>\n          </div>\n        </fieldset>\n\n        <ng-container *ngIf=\"formGroup.get('isHearingRelated').value\">\n          <div class=\"govuk-radios__conditional govuk-!-margin-top-1\"\n               [ngClass]=\"{'govuk-form-group--error': submitted &&\n               formGroup.get('isHearingRelated').value === true &&\n               formGroup.get('hearingDate').value === null}\">\n            <fieldset class=\"govuk-fieldset\" role=\"group\">\n              <legend>\n                <label class=\"govuk-label govuk-label--s\">\n                  {{ 'What is the date of the hearing?' | rpxTranslate }}\n                </label>\n              </legend>\n              <p id=\"hearingDate-error\" class=\"govuk-error-message\"\n                  *ngIf=\"submitted && formGroup.get('isHearingRelated').value === true && formGroup.get('hearingDate').value === null\">\n                <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_HEARING_DATE | rpxTranslate }}\n              </p>\n              <ccd-query-write-date-input formControlName=\"hearingDate\"></ccd-query-write-date-input>\n            </fieldset>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+        args: [{ selector: 'ccd-query-write-raise-query', template: "<div>\n  <div class=\"govuk-!-margin-bottom-6\">\n    <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    <h1 class=\"govuk-heading-l govuk-!-margin-bottom-4\">{{ 'Enter query details' | rpxTranslate }}</h1>\n  </div>\n\n  <div>\n    <ccd-query-case-details-header [caseDetails]=\"caseDetails\" *ngIf=\"caseDetails\"></ccd-query-case-details-header>\n  </div>\n\n  <hr>\n\n  <div class=\"govuk-!-margin-bottom-4\" *ngIf=\"showForm\">\n    <div [formGroup]=\"formGroup\">\n      <div>\n        <div class=\"govuk-warning-text\">\n          <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n          <strong class=\"govuk-warning-text__text\">\n            <span class=\"govuk-visually-hidden\">Warning</span>\n            <ccd-markdown\n              [content]=\"serviceMessage | rpxTranslate\">\n            </ccd-markdown>\n          </strong>\n        </div>\n        <div class=\"govuk-form-group\" [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('subject').hasError('required')}\">\n          <div class=\"govuk-label-wrapper\">\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"subject\">\n              {{ 'Query subject' | rpxTranslate }}\n            </label>\n          </div>\n          <div id=\"subject-hint\" class=\"govuk-hint\">\n            {{ 'The subject should be a summary of your query' | rpxTranslate }}\n          </div>\n          <p id=\"subject-error\" class=\"govuk-error-message\"\n            *ngIf=\"submitted && (formGroup.get('subject').hasError('required') || formGroup.get('subject').hasError('maxlength'))\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }}</span>\n            {{ getSubjectErrorMessage() | rpxTranslate }}\n          </p>\n\n          <input type=\"text\"\n            id=\"subject\"\n            class=\"govuk-input\"\n            formControlName=\"subject\"\n            maxlength=\"200\"\n            (input)=\"onSubjectInput()\"\n            aria-describedby=\"subject-error\" />\n      </div>\n\n        <div class=\"govuk-form-group\"\n             [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('body').hasError('required')}\">\n          <div class=\"govuk-label-wrapper\">\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"body\">\n              {{ 'Query detail' | rpxTranslate }}\n            </label>\n          </div>\n          <div id=\"body-hint\" class=\"govuk-hint\">\n            {{ 'Include as many details as possible so case workers can respond to your query' | rpxTranslate }}\n          </div>\n          <p id=\"body-error\" class=\"govuk-error-message\"\n              *ngIf=\"submitted && formGroup.get('body').hasError('required')\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_BODY | rpxTranslate }}\n          </p>\n          <textarea [formControlName]=\"'body'\"\n                    id=\"body\" name=\"body\" rows=\"5\"\n                    aria-describedby=\"body-hint body-error\"\n                    class=\"govuk-textarea\"\n                    [class.govuk-textarea--error]=\"submitted && formGroup.get('body').hasError('required')\"\n          >\n          </textarea>\n      </div>\n\n      <div class=\"govuk-form-group\"\n           [ngClass]=\"{'govuk-form-group--error': submitted && formGroup.get('isHearingRelated').hasError('required')}\">\n        <fieldset class=\"govuk-fieldset\">\n          <legend>\n            <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\">\n              {{ 'Is the query hearing related?' | rpxTranslate }}\n            </label>\n          </legend>\n          <p id=\"isHearingRelated-error\" class=\"govuk-error-message\"\n              *ngIf=\"submitted && formGroup.get('isHearingRelated').hasError('required')\">\n            <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_HEARING_RELATED | rpxTranslate }}\n          </p>\n          <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n            <div class=\"govuk-radios__item\">\n              <input class=\"govuk-radios__input\" id=\"isHearingRelated-yes\" name=\"isHearingRelated\"\n                     type=\"radio\"\n                     formControlName=\"isHearingRelated\"\n                     [checked]=\"formGroup.get('isHearingRelated').value === true\" [value]=\"true\"\n              >\n              <label class=\"govuk-label govuk-radios__label\" for=\"isHearingRelated-yes\">\n                {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n              </label>\n            </div>\n            <div class=\"govuk-radios__item\">\n              <input class=\"govuk-radios__input\" id=\"isHearingRelated-no\" name=\"isHearingRelated\"\n                     type=\"radio\"\n                     formControlName=\"isHearingRelated\"\n                     [checked]=\"formGroup.get('isHearingRelated').value === false\" [value]=\"false\"\n              >\n              <label class=\"govuk-label govuk-radios__label\" for=\"isHearingRelated-no\">\n                {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n              </label>\n            </div>\n          </div>\n        </fieldset>\n\n        <ng-container *ngIf=\"formGroup.get('isHearingRelated').value\">\n          <div class=\"govuk-radios__conditional govuk-!-margin-top-1\"\n               [ngClass]=\"{'govuk-form-group--error': submitted &&\n               formGroup.get('isHearingRelated').value === true &&\n               formGroup.get('hearingDate').value === null}\">\n            <fieldset class=\"govuk-fieldset\" role=\"group\">\n              <legend>\n                <label class=\"govuk-label govuk-label--s\">\n                  {{ 'What is the date of the hearing?' | rpxTranslate }}\n                </label>\n              </legend>\n              <p id=\"hearingDate-error\" class=\"govuk-error-message\"\n                  *ngIf=\"submitted && formGroup.get('isHearingRelated').value === true && formGroup.get('hearingDate').value === null\">\n                <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ raiseQueryErrorMessage.QUERY_HEARING_DATE | rpxTranslate }}\n              </p>\n              <ccd-query-write-date-input formControlName=\"hearingDate\"></ccd-query-write-date-input>\n            </fieldset>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
     }], null, { formGroup: [{
             type: Input
         }], submitted: [{
@@ -22759,8 +22811,14 @@ class QueryWriteRaiseQueryComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryWriteRaiseQueryComponent, { className: "QueryWriteRaiseQueryComponent", filePath: "lib/shared/components/palette/query-management/components/query-write/query-write-raise-query/query-write-raise-query.component.ts", lineNumber: 8 }); })();
 
+function QueryWriteRespondToQueryComponent_ccd_query_case_details_header_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-query-case-details-header", 8);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("caseDetails", ctx_r0.caseDetails);
+} }
 function QueryWriteRespondToQueryComponent_div_12_div_1_p_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 16)(1, "span", 17);
+    i0.ɵɵelementStart(0, "p", 17)(1, "span", 18);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -22775,16 +22833,16 @@ function QueryWriteRespondToQueryComponent_div_12_div_1_p_10_Template(rf, ctx) {
     i0.ɵɵtextInterpolate1("", ctx_r0.queryCreateContext === ctx_r0.queryCreateContextEnum.RESPOND ? ctx_r0.raiseQueryErrorMessages.RESPOND_QUERY_BODY : i0.ɵɵpipeBind1(5, 4, ctx_r0.raiseQueryErrorMessages.QUERY_BODY), " ");
 } }
 function QueryWriteRespondToQueryComponent_div_12_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div")(1, "h1", 9);
+    i0.ɵɵelementStart(0, "div")(1, "h1", 10);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 10)(5, "div", 11)(6, "div", 12)(7, "label", 13);
+    i0.ɵɵelementStart(4, "div", 11)(5, "div", 12)(6, "div", 13)(7, "label", 14);
     i0.ɵɵtext(8);
     i0.ɵɵpipe(9, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(10, QueryWriteRespondToQueryComponent_div_12_div_1_p_10_Template, 6, 6, "p", 14);
-    i0.ɵɵelementStart(11, "textarea", 15);
+    i0.ɵɵtemplate(10, QueryWriteRespondToQueryComponent_div_12_div_1_p_10_Template, 6, 6, "p", 15);
+    i0.ɵɵelementStart(11, "textarea", 16);
     i0.ɵɵtext(12, "      ");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -22807,14 +22865,29 @@ function QueryWriteRespondToQueryComponent_div_12_div_1_Template(rf, ctx) { if (
     i0.ɵɵproperty("formControlName", "body");
 } }
 function QueryWriteRespondToQueryComponent_div_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵtemplate(1, QueryWriteRespondToQueryComponent_div_12_div_1_Template, 13, 13, "div", 8);
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵtemplate(1, QueryWriteRespondToQueryComponent_div_12_div_1_Template, 13, 13, "div", 7);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", !ctx_r0.hasRespondedToQuery);
 } }
+function QueryWriteRespondToQueryComponent_ng_container_13_ccd_close_query_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-close-query", 11);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("formGroup", ctx_r0.formGroup);
+} }
+function QueryWriteRespondToQueryComponent_ng_container_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵtemplate(1, QueryWriteRespondToQueryComponent_ng_container_13_ccd_close_query_1_Template, 1, 1, "ccd-close-query", 19);
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", !ctx_r0.hasRespondedToQuery);
+} }
 class QueryWriteRespondToQueryComponent {
     caseNotifier;
     route;
@@ -22841,9 +22914,9 @@ class QueryWriteRespondToQueryComponent {
     }
     ngOnInit() {
         this.queryItemId = this.route.snapshot.params.qid;
-        this.caseNotifier.caseView.pipe(take(1)).subscribe({
+        this.caseId = this.route.snapshot.params.cid;
+        this.caseNotifier.fetchAndRefresh(this.caseId).pipe(take(1)).subscribe({
             next: (caseDetails) => {
-                this.caseId = caseDetails?.case_id ?? '';
                 this.caseDetails = caseDetails;
             },
             error: (err) => {
@@ -22877,7 +22950,7 @@ class QueryWriteRespondToQueryComponent {
         const targetId = this.queryItemId === QueryWriteRespondToQueryComponent.QUERY_ITEM_RESPOND
             ? (matchingMessage?.parentId || matchingMessage?.id)
             : matchingMessage?.id;
-        this.queryListData = queryWithChildren?.queries.find(query => query?.id === targetId);
+        this.queryListData = queryWithChildren?.queries.find((query) => query?.id === targetId);
         this.queryResponseStatus = this.queryListData?.responseStatus;
     }
     hasResponded(value) {
@@ -22885,7 +22958,7 @@ class QueryWriteRespondToQueryComponent {
         this.hasRespondedToQueryTask.emit(value);
     }
     static ɵfac = function QueryWriteRespondToQueryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryWriteRespondToQueryComponent)(i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryWriteRespondToQueryComponent, selectors: [["ccd-query-write-respond-to-query"]], inputs: { queryItem: "queryItem", formGroup: "formGroup", queryCreateContext: "queryCreateContext", submitted: "submitted", caseQueriesCollections: "caseQueriesCollections", showForm: "showForm" }, outputs: { hasRespondedToQueryTask: "hasRespondedToQueryTask" }, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 10, consts: [[1, "govuk-!-margin-bottom-6"], [1, "govuk-caption-l"], [1, "govuk-heading-l", "govuk-!-margin-bottom-0"], [1, "govuk-!-margin-bottom-4"], [3, "caseDetails"], [3, "hasResponded", "query", "queryResponseStatus"], ["class", "query-respond", 4, "ngIf"], [1, "query-respond"], [4, "ngIf"], [1, "govuk-heading-m"], [3, "formGroup"], [1, "govuk-form-group", "body-textarea"], [1, "govuk-label-wrapper"], ["for", "body", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "body-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "body", "name", "body", "rows", "5", "aria-describedby", "body-hint body-error", 1, "govuk-textarea", 3, "formControlName"], ["id", "body-error", 1, "govuk-error-message"], [1, "govuk-visually-hidden"]], template: function QueryWriteRespondToQueryComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryWriteRespondToQueryComponent, selectors: [["ccd-query-write-respond-to-query"]], inputs: { queryItem: "queryItem", formGroup: "formGroup", queryCreateContext: "queryCreateContext", submitted: "submitted", caseQueriesCollections: "caseQueriesCollections", showForm: "showForm" }, outputs: { hasRespondedToQueryTask: "hasRespondedToQueryTask" }, features: [i0.ɵɵNgOnChangesFeature], decls: 14, vars: 11, consts: [[1, "govuk-!-margin-bottom-6"], [1, "govuk-caption-l"], [1, "govuk-heading-l", "govuk-!-margin-bottom-0"], [1, "govuk-!-margin-bottom-4"], [3, "caseDetails", 4, "ngIf"], [3, "hasResponded", "query", "queryResponseStatus"], ["class", "query-respond", 4, "ngIf"], [4, "ngIf"], [3, "caseDetails"], [1, "query-respond"], [1, "govuk-heading-m"], [3, "formGroup"], [1, "govuk-form-group", "body-textarea"], [1, "govuk-label-wrapper"], ["for", "body", 1, "govuk-label", "govuk-label--m", "govuk-!-font-weight-bold"], ["id", "body-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "body", "name", "body", "rows", "5", "aria-describedby", "body-hint body-error", 1, "govuk-textarea", 3, "formControlName"], ["id", "body-error", 1, "govuk-error-message"], [1, "govuk-visually-hidden"], [3, "formGroup", 4, "ngIf"]], template: function QueryWriteRespondToQueryComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 0)(2, "div", 1);
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "rpxTranslate");
@@ -22895,28 +22968,30 @@ class QueryWriteRespondToQueryComponent {
             i0.ɵɵpipe(7, "rpxTranslate");
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(8, "div", 3);
-            i0.ɵɵelement(9, "ccd-query-case-details-header", 4);
+            i0.ɵɵtemplate(9, QueryWriteRespondToQueryComponent_ccd_query_case_details_header_9_Template, 1, 1, "ccd-query-case-details-header", 4);
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(10, "div")(11, "ccd-query-details", 5);
             i0.ɵɵlistener("hasResponded", function QueryWriteRespondToQueryComponent_Template_ccd_query_details_hasResponded_11_listener($event) { return ctx.hasResponded($event); });
             i0.ɵɵelementEnd()()();
-            i0.ɵɵtemplate(12, QueryWriteRespondToQueryComponent_div_12_Template, 2, 1, "div", 6);
+            i0.ɵɵtemplate(12, QueryWriteRespondToQueryComponent_div_12_Template, 2, 1, "div", 6)(13, QueryWriteRespondToQueryComponent_ng_container_13_Template, 2, 1, "ng-container", 7);
         } if (rf & 2) {
             i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 6, "Respond to a query"));
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 7, "Respond to a query"));
             i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 8, "Query details"));
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 9, "Query details"));
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("caseDetails", ctx.caseDetails);
+            i0.ɵɵproperty("ngIf", ctx.caseDetails);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("query", ctx.queryListData)("queryResponseStatus", ctx.queryResponseStatus);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.showForm);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.RESPOND);
         } }, styles: [".query-respond[_ngcontent-%COMP%]{width:100%;max-width:720px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryWriteRespondToQueryComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-write-respond-to-query', template: "<div class=\"govuk-!-margin-bottom-6\">\n  <div class=\"govuk-!-margin-bottom-6\">\n    <div class=\"govuk-caption-l\">{{ 'Respond to a query' | rpxTranslate }}</div>\n    <h1 class=\"govuk-heading-l govuk-!-margin-bottom-0\">{{ 'Query details' | rpxTranslate }}</h1>\n  </div>\n\n  <div class=\"govuk-!-margin-bottom-4\">\n    <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n  </div>\n\n  <div>\n    <ccd-query-details [query]=\"queryListData\"\n      [queryResponseStatus]=\"queryResponseStatus\"\n      (hasResponded)=\"hasResponded($event)\"></ccd-query-details>\n  </div>\n</div>\n<div class=\"query-respond\" *ngIf=\"showForm\">\n  <div *ngIf=\"!hasRespondedToQuery\">\n    <h1 class=\"govuk-heading-m\">\n      {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Respond to a query' : 'Ask a follow-up question' | rpxTranslate }}\n    </h1>\n\n    <div [formGroup]=\"formGroup\">\n      <div class=\"govuk-form-group body-textarea\"\n           [class.govuk-form-group--error]=\"submitted && formGroup.get('body')?.hasError('required')\">\n        <div class=\"govuk-label-wrapper\">\n          <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"body\">\n            {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query Body' | rpxTranslate }}\n          </label>\n        </div>\n        <p id=\"body-error\" class=\"govuk-error-message\"\n           *ngIf=\"submitted && formGroup.get('body')?.hasError('required')\">\n          <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ queryCreateContext === queryCreateContextEnum.RESPOND ? raiseQueryErrorMessages.RESPOND_QUERY_BODY : raiseQueryErrorMessages.QUERY_BODY | rpxTranslate }}\n        </p>\n        <textarea [formControlName]=\"'body'\" class=\"govuk-textarea\"\n                  [class.govuk-textarea--error]=\"submitted && formGroup.get('body')?.hasError('required')\" id=\"body\"\n                  name=\"body\" rows=\"5\" aria-describedby=\"body-hint body-error\">\n      </textarea>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".query-respond{width:100%;max-width:720px}\n"] }]
+        args: [{ selector: 'ccd-query-write-respond-to-query', template: "<div class=\"govuk-!-margin-bottom-6\">\n  <div class=\"govuk-!-margin-bottom-6\">\n    <div class=\"govuk-caption-l\">{{ 'Respond to a query' | rpxTranslate }}</div>\n    <h1 class=\"govuk-heading-l govuk-!-margin-bottom-0\">{{ 'Query details' | rpxTranslate }}</h1>\n  </div>\n\n  <div class=\"govuk-!-margin-bottom-4\">\n    <ccd-query-case-details-header [caseDetails]=\"caseDetails\" *ngIf=\"caseDetails\"></ccd-query-case-details-header>\n  </div>\n\n  <div>\n    <ccd-query-details [query]=\"queryListData\"\n      [queryResponseStatus]=\"queryResponseStatus\"\n      (hasResponded)=\"hasResponded($event)\"></ccd-query-details>\n  </div>\n</div>\n<div class=\"query-respond\" *ngIf=\"showForm\">\n  <div *ngIf=\"!hasRespondedToQuery\">\n    <h1 class=\"govuk-heading-m\">\n      {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Respond to a query' : 'Ask a follow-up question' | rpxTranslate }}\n    </h1>\n\n    <div [formGroup]=\"formGroup\">\n      <div class=\"govuk-form-group body-textarea\"\n           [class.govuk-form-group--error]=\"submitted && formGroup.get('body')?.hasError('required')\">\n        <div class=\"govuk-label-wrapper\">\n          <label class=\"govuk-label govuk-label--m govuk-!-font-weight-bold\" for=\"body\">\n            {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query Body' | rpxTranslate }}\n          </label>\n        </div>\n        <p id=\"body-error\" class=\"govuk-error-message\"\n           *ngIf=\"submitted && formGroup.get('body')?.hasError('required')\">\n          <span class=\"govuk-visually-hidden\">{{ 'Error:' | rpxTranslate }} </span>{{ queryCreateContext === queryCreateContextEnum.RESPOND ? raiseQueryErrorMessages.RESPOND_QUERY_BODY : raiseQueryErrorMessages.QUERY_BODY | rpxTranslate }}\n        </p>\n        <textarea [formControlName]=\"'body'\" class=\"govuk-textarea\"\n                  [class.govuk-textarea--error]=\"submitted && formGroup.get('body')?.hasError('required')\" id=\"body\"\n                  name=\"body\" rows=\"5\" aria-describedby=\"body-hint body-error\">\n      </textarea>\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\">\n  <ccd-close-query *ngIf=\"!hasRespondedToQuery\"\n    [formGroup]=\"formGroup\">\n  </ccd-close-query>\n</ng-container>", styles: [".query-respond{width:100%;max-width:720px}\n"] }]
     }], () => [{ type: CaseNotifier }, { type: i1$1.ActivatedRoute }], { queryItem: [{
             type: Input
         }], formGroup: [{
@@ -23061,6 +23136,50 @@ class QueryConfirmationComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryConfirmationComponent, { className: "QueryConfirmationComponent", filePath: "lib/shared/components/palette/query-management/components/query-confirmation/query-confirmation.component.ts", lineNumber: 9 }); })();
 
+class CloseQueryComponent {
+    formGroup;
+    static ɵfac = function CloseQueryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CloseQueryComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CloseQueryComponent, selectors: [["ccd-close-query"]], inputs: { formGroup: "formGroup" }, decls: 19, vars: 11, consts: [[3, "formGroup"], [1, "govuk-heading-m"], [1, "govuk-checkboxes__item"], ["formControlName", "closeQuery", "id", "closeQuery", "name", "closeQuery", "type", "checkbox", 1, "govuk-checkboxes__input"], ["for", "closeQuery", 1, "govuk-label", "govuk-checkboxes__label"], [1, "govuk-warning-text"], ["aria-hidden", "true", 1, "govuk-warning-text__icon"], [1, "govuk-warning-text__text"], [1, "govuk-visually-hidden"], [1, "qm-service-message"]], template: function CloseQueryComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "h2", 1);
+            i0.ɵɵtext(2);
+            i0.ɵɵpipe(3, "rpxTranslate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(4, "div", 2);
+            i0.ɵɵelement(5, "input", 3);
+            i0.ɵɵelementStart(6, "label", 4);
+            i0.ɵɵtext(7);
+            i0.ɵɵpipe(8, "rpxTranslate");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(9, "div", 5)(10, "span", 6);
+            i0.ɵɵtext(11, "!");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "strong", 7)(13, "span", 8);
+            i0.ɵɵtext(14, "Warning");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(15, "p", 9)(16, "strong");
+            i0.ɵɵtext(17);
+            i0.ɵɵpipe(18, "rpxTranslate");
+            i0.ɵɵelementEnd()()()()();
+        } if (rf & 2) {
+            i0.ɵɵproperty("formGroup", ctx.formGroup);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 5, "Closing the query"));
+            i0.ɵɵadvance(4);
+            i0.ɵɵattribute("aria-labelledby", "closeQuery");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(8, 7, "I want to close this query"), " ");
+            i0.ɵɵadvance(10);
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(18, 9, "Closing the query means the parties can no longer send message in this thread."), " ");
+        } }, dependencies: [i4.CheckboxControlValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormGroupDirective, i4.FormControlName, i1.RpxTranslatePipe], encapsulation: 2 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CloseQueryComponent, [{
+        type: Component,
+        args: [{ selector: 'ccd-close-query', template: "<div [formGroup]=\"formGroup\">\n    <h2 class=\"govuk-heading-m\">{{ 'Closing the query' | rpxTranslate }}</h2>\n    <div class=\"govuk-checkboxes__item\">\n        <input class=\"govuk-checkboxes__input\"\n            formControlName=\"closeQuery\" id=\"closeQuery\" name=\"closeQuery\" type=\"checkbox\" />\n        <label class=\"govuk-label govuk-checkboxes__label\" for=\"closeQuery\" [attr.aria-labelledby]=\"'closeQuery'\">\n        {{ 'I want to close this query' | rpxTranslate }}\n        </label>\n    </div>\n    <div class=\"govuk-warning-text\">\n        <span aria-hidden=\"true\" class=\"govuk-warning-text__icon\">!</span>\n        <strong class=\"govuk-warning-text__text\">\n        <span class=\"govuk-visually-hidden\">Warning</span>\n        <p class=\"qm-service-message\">\n            <strong>\n            {{ 'Closing the query means the parties can no longer send message in this thread.' | rpxTranslate }}\n            </strong>\n        </p>\n        </strong>\n    </div>\n</div>" }]
+    }], null, { formGroup: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CloseQueryComponent, { className: "CloseQueryComponent", filePath: "lib/shared/components/palette/query-management/components/close-query/close-query.component.ts", lineNumber: 8 }); })();
+
 const _c0$B = (a0, a1) => ["/query-management", "query", a0, "4", a1];
 function ReadQueryManagementFieldComponent_ng_container_0_ng_container_1_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -23129,17 +23248,36 @@ function ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_Template
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", (ctx_r1.query == null ? null : ctx_r1.query.children == null ? null : ctx_r1.query.children.length) > 0 && (ctx_r1.query == null ? null : ctx_r1.query.children == null ? null : ctx_r1.query.children.length) % 2 === 1)("ngIfElse", queryIsInReview_r5);
 } }
+function ReadQueryManagementFieldComponent_ng_template_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "div", 11)(2, "span", 12);
+    i0.ɵɵtext(3, "!");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "strong", 13)(5, "span", 14);
+    i0.ɵɵtext(6, "Warning");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "p", 15);
+    i0.ɵɵtext(8);
+    i0.ɵɵpipe(9, "rpxTranslate");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(9, 1, "This query has been closed by court staff."));
+} }
 function ReadQueryManagementFieldComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "ccd-query-details", 7);
     i0.ɵɵlistener("backClicked", function ReadQueryManagementFieldComponent_ng_template_1_Template_ccd_query_details_backClicked_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showQueryList = true); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(1, ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_Template, 4, 2, "ng-container", 8);
+    i0.ɵɵtemplate(1, ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_Template, 4, 2, "ng-container", 8)(2, ReadQueryManagementFieldComponent_ng_template_1_ng_container_2_Template, 10, 3, "ng-container", 8);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("query", ctx_r1.query)("caseId", ctx_r1.caseId);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.isInternalUser());
+    i0.ɵɵproperty("ngIf", !ctx_r1.isInternalUser() && !ctx_r1.isQueryClosed);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", !ctx_r1.isInternalUser() && ctx_r1.isQueryClosed);
 } }
 class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
     route;
@@ -23149,6 +23287,7 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
     query;
     showQueryList = true;
     caseId;
+    isQueryClosed = false;
     constructor(route, sessionStorageService, caseNotifier) {
         super();
         this.route = route;
@@ -23185,6 +23324,7 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
     setQuery(query) {
         this.showQueryList = false;
         this.query = query;
+        this.isQueryClosed = this.query?.children?.some((queryItem) => queryItem?.isClosed === 'Yes');
     }
     backToQueryListPage() {
         this.showQueryList = true;
@@ -23194,8 +23334,8 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
         return isInternalUser(this.sessionStorageService);
     }
     static ɵfac = function ReadQueryManagementFieldComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ReadQueryManagementFieldComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(CaseNotifier)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadQueryManagementFieldComponent, selectors: [["ccd-read-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 2, consts: [["singleQueryDetails", ""], ["queryIsInReview", ""], [4, "ngIf", "ngIfElse"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-margin-top-8 govuk-!-margin-bottom-8", 4, "ngIf"], [1, "govuk-!-margin-top-8", "govuk-!-margin-bottom-8"], [3, "selectedQuery", "caseQueriesCollection"], [3, "backClicked", "query", "caseId"], [4, "ngIf"], ["id", "ask-follow-up-question", "data-module", "govuk-button", 1, "govuk-button", 3, "routerLink"], [1, "govuk-!-font-weight-bold"]], template: function ReadQueryManagementFieldComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, ReadQueryManagementFieldComponent_ng_container_0_Template, 2, 1, "ng-container", 2)(1, ReadQueryManagementFieldComponent_ng_template_1_Template, 2, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadQueryManagementFieldComponent, selectors: [["ccd-read-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 2, consts: [["singleQueryDetails", ""], ["queryIsInReview", ""], [4, "ngIf", "ngIfElse"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-margin-top-8 govuk-!-margin-bottom-8", 4, "ngIf"], [1, "govuk-!-margin-top-8", "govuk-!-margin-bottom-8"], [3, "selectedQuery", "caseQueriesCollection"], [3, "backClicked", "query", "caseId"], [4, "ngIf"], ["id", "ask-follow-up-question", "data-module", "govuk-button", 1, "govuk-button", 3, "routerLink"], [1, "govuk-!-font-weight-bold"], [1, "govuk-warning-text"], ["aria-hidden", "true", 1, "govuk-warning-text__icon"], [1, "govuk-warning-text__text"], [1, "govuk-visually-hidden"], [1, "qm-service-message", "govuk-!-font-weight-bold"]], template: function ReadQueryManagementFieldComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, ReadQueryManagementFieldComponent_ng_container_0_Template, 2, 1, "ng-container", 2)(1, ReadQueryManagementFieldComponent_ng_template_1_Template, 3, 4, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
         } if (rf & 2) {
             const singleQueryDetails_r6 = i0.ɵɵreference(2);
             i0.ɵɵproperty("ngIf", ctx.showQueryList)("ngIfElse", singleQueryDetails_r6);
@@ -23203,7 +23343,7 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadQueryManagementFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-query-management-field', template: "<ng-container *ngIf=\"showQueryList; else singleQueryDetails\">\n  <ng-container *ngFor=\"let caseQueriesCollection of caseQueriesCollections\">\n    <div *ngIf=\"showQueryList\" class=\"govuk-!-margin-top-8 govuk-!-margin-bottom-8\">\n      <ccd-query-list (selectedQuery)=\"setQuery($event)\" [caseQueriesCollection]=\"caseQueriesCollection\"></ccd-query-list>\n    </div>\n  </ng-container>\n</ng-container>\n\n<ng-template #singleQueryDetails>\n  <ccd-query-details\n    [query]=\"query\"\n    (backClicked)=\"showQueryList = true\"\n    [caseId]=\"caseId\"\n  ></ccd-query-details>\n\n  <ng-container *ngIf=\"!isInternalUser()\">\n    <ng-container *ngIf=\"query?.children?.length > 0 && query?.children?.length % 2 === 1; else queryIsInReview\">\n      <button id=\"ask-follow-up-question\" class=\"govuk-button\" data-module=\"govuk-button\"\n              [routerLink]=\"['/query-management', 'query', caseId, '4', query.id]\">\n        {{ 'Ask a follow-up question' | rpxTranslate }}\n      </button>\n    </ng-container>\n\n    <ng-template #queryIsInReview>\n      <div>\n        <p class=\"govuk-!-font-weight-bold\">{{ 'Your query is under review' | rpxTranslate }}</p>\n        <p>{{ 'Our team will read your query and respond. Do not submit the same query more than once.' | rpxTranslate }}</p>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-template>\n" }]
+        args: [{ selector: 'ccd-read-query-management-field', template: "<ng-container *ngIf=\"showQueryList; else singleQueryDetails\">\n  <ng-container *ngFor=\"let caseQueriesCollection of caseQueriesCollections\">\n    <div *ngIf=\"showQueryList\" class=\"govuk-!-margin-top-8 govuk-!-margin-bottom-8\">\n      <ccd-query-list (selectedQuery)=\"setQuery($event)\" [caseQueriesCollection]=\"caseQueriesCollection\"></ccd-query-list>\n    </div>\n  </ng-container>\n</ng-container>\n\n<ng-template #singleQueryDetails>\n  <ccd-query-details\n    [query]=\"query\"\n    (backClicked)=\"showQueryList = true\"\n    [caseId]=\"caseId\"\n  ></ccd-query-details>\n\n  <ng-container *ngIf=\"!isInternalUser() && !isQueryClosed\">\n    <ng-container *ngIf=\"query?.children?.length > 0 && query?.children?.length % 2 === 1; else queryIsInReview\">\n      <button id=\"ask-follow-up-question\" class=\"govuk-button\" data-module=\"govuk-button\"\n              [routerLink]=\"['/query-management', 'query', caseId, '4', query.id]\">\n        {{ 'Ask a follow-up question' | rpxTranslate }}\n      </button>\n    </ng-container>\n\n    <ng-template #queryIsInReview>\n      <div>\n        <p class=\"govuk-!-font-weight-bold\">{{ 'Your query is under review' | rpxTranslate }}</p>\n        <p>{{ 'Our team will read your query and respond. Do not submit the same query more than once.' | rpxTranslate }}</p>\n      </div>\n    </ng-template>\n  </ng-container>\n  <ng-container *ngIf=\"!isInternalUser() && isQueryClosed\">\n    <div class=\"govuk-warning-text\">\n      <span aria-hidden=\"true\" class=\"govuk-warning-text__icon\">!</span>\n      <strong class=\"govuk-warning-text__text\">\n        <span class=\"govuk-visually-hidden\">Warning</span>\n        <p class=\"qm-service-message govuk-!-font-weight-bold\">{{ 'This query has been closed by court staff.' | rpxTranslate }}</p>\n      </strong>\n    </div>\n  </ng-container>\n</ng-template>\n" }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: SessionStorageService }, { type: CaseNotifier }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadQueryManagementFieldComponent, { className: "ReadQueryManagementFieldComponent", filePath: "lib/shared/components/palette/query-management/read-query-management-field.component.ts", lineNumber: 15 }); })();
 
@@ -28120,7 +28260,7 @@ function ReadComplexFieldTableComponent_ng_container_9_ng_container_1_Template(r
     i0.ɵɵadvance();
     i0.ɵɵproperty("hidden", field_r1.hidden);
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseField", field_r1)("context", ctx_r1.context);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseFields", ctx_r1.caseFields)("caseField", field_r1)("context", ctx_r1.context);
 } }
 function ReadComplexFieldTableComponent_ng_container_9_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr", 10)(1, "th", 11)(2, "span", 3);
@@ -28135,15 +28275,15 @@ function ReadComplexFieldTableComponent_ng_container_9_ng_template_3_Template(rf
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("hidden", field_r1.hidden);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 5, field_r1.label));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 6, field_r1.label));
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseField", field_r1)("context", ctx_r1.context);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseFields", ctx_r1.caseFields)("caseField", field_r1)("context", ctx_r1.context);
 } }
 function ReadComplexFieldTableComponent_ng_container_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, ReadComplexFieldTableComponent_ng_container_9_ng_container_1_Template, 5, 4, "ng-container", 6);
+    i0.ɵɵtemplate(1, ReadComplexFieldTableComponent_ng_container_9_ng_container_1_Template, 5, 5, "ng-container", 6);
     i0.ɵɵpipe(2, "ccdIsCompound");
-    i0.ɵɵtemplate(3, ReadComplexFieldTableComponent_ng_container_9_ng_template_3_Template, 8, 7, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(3, ReadComplexFieldTableComponent_ng_container_9_ng_template_3_Template, 8, 8, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const field_r1 = ctx.$implicit;
@@ -28170,7 +28310,7 @@ class ReadComplexFieldTableComponent extends AbstractFieldReadComponent {
         this.path = ReadComplexFieldTableComponent.DUMMY_STRING_PRE + this.idPrefix + ReadComplexFieldTableComponent.DUMMY_STRING_POST;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadComplexFieldTableComponent_BaseFactory; return function ReadComplexFieldTableComponent_Factory(__ngFactoryType__) { return (ɵReadComplexFieldTableComponent_BaseFactory || (ɵReadComplexFieldTableComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadComplexFieldTableComponent)))(__ngFactoryType__ || ReadComplexFieldTableComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldTableComponent, selectors: [["ccd-read-complex-field-table"]], inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 17, consts: [["SimpleRow", ""], [1, "complex-panel"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex field table", 1, "complex-panel-table"], [4, "ngFor", "ngForOf"], [4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], ["colspan", "2"], [3, "topLevelFormGroup", "caseField", "context"], [1, "complex-panel-simple-field", 3, "hidden"], ["id", "complex-panel-simple-field-label"]], template: function ReadComplexFieldTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldTableComponent, selectors: [["ccd-read-complex-field-table"]], inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 17, consts: [["SimpleRow", ""], [1, "complex-panel"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex field table", 1, "complex-panel-table"], [4, "ngFor", "ngForOf"], [4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], ["colspan", "2"], [3, "topLevelFormGroup", "caseFields", "caseField", "context"], [1, "complex-panel-simple-field", 3, "hidden"], ["id", "complex-panel-simple-field-label"]], template: function ReadComplexFieldTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1)(1, "dl", 2)(2, "dt")(3, "span", 3);
             i0.ɵɵtext(4);
             i0.ɵɵpipe(5, "rpxTranslate");
@@ -28190,7 +28330,7 @@ class ReadComplexFieldTableComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadComplexFieldTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-complex-field-table', template: "<div class=\"complex-panel\">\n  <dl class=\"complex-panel-title\"><dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt><dd></dd></dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex field table\">\n    <tbody>\n      <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :path :idPrefix\">\n        <ng-container *ngIf=\"(field | ccdIsCompound); else SimpleRow\">\n          <tr class=\"complex-panel-compound-field\" [hidden]=\"field.hidden\">\n            <td colspan=\"2\">\n              <span class=\"text-16\">\n                <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\"\n                  [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n              </span>\n            </td>\n          </tr>\n        </ng-container>\n        <ng-template #SimpleRow>\n          <tr class=\"complex-panel-simple-field\" [hidden]=\"field.hidden\">\n            <th id=\"complex-panel-simple-field-label\"><span class=\"text-16\">{{field.label | rpxTranslate}}</span></th>\n            <td>\n                <span class=\"text-16\">\n                  <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                </span>\n            </td>\n          </tr>\n        </ng-template>\n      </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".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}\n"] }]
+        args: [{ selector: 'ccd-read-complex-field-table', template: "<div class=\"complex-panel\">\n  <dl class=\"complex-panel-title\"><dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt><dd></dd></dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex field table\">\n    <tbody>\n      <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :path :idPrefix\">\n        <ng-container *ngIf=\"(field | ccdIsCompound); else SimpleRow\">\n          <tr class=\"complex-panel-compound-field\" [hidden]=\"field.hidden\">\n            <td colspan=\"2\">\n              <span class=\"text-16\">\n                <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                  [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n              </span>\n            </td>\n          </tr>\n        </ng-container>\n        <ng-template #SimpleRow>\n          <tr class=\"complex-panel-simple-field\" [hidden]=\"field.hidden\">\n            <th id=\"complex-panel-simple-field-label\"><span class=\"text-16\">{{field.label | rpxTranslate}}</span></th>\n            <td>\n                <span class=\"text-16\">\n                  <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                </span>\n            </td>\n          </tr>\n        </ng-template>\n      </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".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}\n"] }]
     }], null, { caseFields: [{
             type: Input
         }] }); })();
@@ -30447,6 +30587,7 @@ const PALETTE_COMPONENTS = [
     QueryAttachmentsReadComponent,
     QueryEventCompletionComponent,
     QueryConfirmationComponent,
+    CloseQueryComponent,
     // Case event completion
     CaseEventCompletionComponent,
     CaseEventCompletionTaskCancelledComponent,
@@ -30720,6 +30861,7 @@ class PaletteModule {
         QueryAttachmentsReadComponent,
         QueryEventCompletionComponent,
         QueryConfirmationComponent,
+        CloseQueryComponent,
         // Case event completion
         CaseEventCompletionComponent,
         CaseEventCompletionTaskCancelledComponent,
@@ -30878,6 +31020,7 @@ class PaletteModule {
         QueryAttachmentsReadComponent,
         QueryEventCompletionComponent,
         QueryConfirmationComponent,
+        CloseQueryComponent,
         // Case event completion
         CaseEventCompletionComponent,
         CaseEventCompletionTaskCancelledComponent,
@@ -30955,7 +31098,8 @@ ReadQueryManagementFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i1
     QueryListComponent]; }, function () { return [i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(QueryDetailsComponent, function () { return [i5.NgForOf, i5.NgIf, QueryAttachmentsReadComponent]; }, function () { return [i5.DatePipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(QueryWriteRespondToQueryComponent, function () { return [i5.NgIf, i4.DefaultValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormGroupDirective, i4.FormControlName, QueryDetailsComponent,
-    QueryCaseDetailsHeaderComponent]; }, function () { return [i1.RpxTranslatePipe]; });
+    QueryCaseDetailsHeaderComponent,
+    CloseQueryComponent]; }, function () { return [i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(QueryWriteRaiseQueryComponent, function () { return [i5.NgClass, i5.NgIf, i4.DefaultValueAccessor, i4.RadioControlValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.MaxLengthValidator, i4.FormGroupDirective, i4.FormControlName, MarkdownComponent, QueryCaseDetailsHeaderComponent,
     QueryWriteDateInputComponent]; }, function () { return [i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(QueryCheckYourAnswersComponent, function () { return [i5.NgForOf, i5.NgIf, CallbackErrorsComponent, QueryCaseDetailsHeaderComponent,
@@ -34856,7 +35000,7 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_
     i0.ɵɵadvance();
     i0.ɵɵproperty("id", "case-viewer-field-read--" + field_r7.id);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup == null ? null : ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup == null ? null : ctx_r1.formGroup.controls["data"])("caseFields", ctx_r1.caseFields)("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
 } }
 function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr", 40)(1, "th", 35)(2, "span", 36);
@@ -34868,14 +35012,14 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_
     i0.ɵɵadvance();
     i0.ɵɵproperty("id", "case-viewer-field-read--" + field_r7.id);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup.controls["data"])("caseFields", ctx_r1.caseFields)("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
 } }
 function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelementStart(1, "div", 30);
     i0.ɵɵelementContainerStart(2, 31);
     i0.ɵɵpipe(3, "ccdIsCompound");
-    i0.ɵɵtemplate(4, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_4_Template, 5, 5, "tr", 32)(5, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template, 4, 4, "tr", 33);
+    i0.ɵɵtemplate(4, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_4_Template, 5, 6, "tr", 32)(5, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template, 4, 5, "tr", 33);
     i0.ɵɵelementContainerEnd();
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
@@ -35371,7 +35515,7 @@ class CaseFullAccessViewComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabGroup = _t.first);
-        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], [3, "id", "label", "aria-label"], ["matTabContent", ""], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseField", "caseReference"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], [3, "id", "label", "aria-label"], ["matTabContent", ""], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseFields", "caseField", "caseReference"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseFullAccessViewComponent_div_0_Template, 14, 12, "div", 1)(1, CaseFullAccessViewComponent_div_1_Template, 8, 7, "div", 1);
             i0.ɵɵelementStart(2, "ccd-callback-errors", 2);
             i0.ɵɵlistener("callbackErrorsContext", function CaseFullAccessViewComponent_Template_ccd_callback_errors_callbackErrorsContext_2_listener($event) { return ctx.callbackErrorsNotify($event); });
@@ -35409,7 +35553,7 @@ class CaseFullAccessViewComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFullAccessViewComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | 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                          </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                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
+        args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | 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']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\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']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
     }], () => [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i5.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }, { type: LoadingService }, { type: LinkedCasesService }, { type: CaseFlagStateService }], { hasPrint: [{
             type: Input
         }], hasEventSelector: [{
@@ -39989,5 +40133,5 @@ class TestRouteSnapshotBuilder {
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, AbstractFieldWriteJourneyComponent, AbstractJourneyComponent, Activity, ActivityBannerComponent, ActivityComponent, ActivityIconComponent, ActivityInfo, ActivityModule, ActivityPollingService, ActivityService, AddCommentsComponent, AddCommentsErrorMessage, AddCommentsStep, AddressModel, AddressOption, AddressesService, Alert, AlertComponent, AlertIconClassPipe, AlertMessageType, AlertModule, AlertService, AuthService, Banner, BannersService, BeforeYouStartComponent, BodyComponent, BrowserService, CCDCaseLinkType, COMPONENT_PORTAL_INJECTION_TOKEN, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventCompletionComponent, CaseEventCompletionTaskCancelledComponent, CaseEventCompletionTaskReassignedComponent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewFolderToggleComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagCheckYourAnswersPageStep, CaseFlagDisplayContextParameter, CaseFlagErrorMessage, CaseFlagFieldState, CaseFlagFormFields, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, CaseFlagWizardStepTitle, CaseFullAccessViewComponent, CaseHeaderComponent, CaseHeaderModule, CaseHistoryViewerFieldComponent, CaseLink, CaseLinkResponse, CaseListComponent, CaseListFiltersComponent, CaseListFiltersModule, CaseListModule, CaseNotifier, CasePaymentHistoryViewerFieldComponent, CasePrintDocument, CasePrinterComponent, CaseProgressComponent, CaseReferencePipe, CaseResolver, CaseSpecificAccessRequestComponent, CaseSpecificAccessSuccessComponent, CaseState, CaseTab, CaseTimelineComponent, CaseTimelineDisplayMode, CaseTimelineModule, CaseType, CaseTypeLite, CaseView, CaseViewComponent, CaseViewEvent, CaseViewTrigger, CaseViewerComponent, CaseViewerModule, CasesService, CaseworkerService, CcdCYAPageLabelFilterPipe, CcdCaseTitlePipe, CcdCollectionTableCaseFieldsFilterPipe, CcdPageFieldsPipe, CcdTabFieldsPipe, CheckYourAnswersComponent, ConditionalShowFormDirective, ConditionalShowModule, ConditionalShowRegistrarService, ConfirmFlagStatusComponent, ConfirmStatusErrorMessage, ConfirmStatusStep, Confirmation, ConvertHrefToRouterService, CreateCaseFiltersComponent, CreateCaseFiltersModule, CreateCaseFiltersSelection, DRAFT_PREFIX, DRAFT_QUERY_PARAM, DashPipe, DateInputComponent, DatePipe, DateTimeFormatUtils, DatetimePickerComponent, DefinitionsModule, DefinitionsService, DeleteOrCancelDialogComponent, DialogsModule, DisplayMode, Document, DocumentData, DocumentDialogComponent, DocumentLinks, DocumentManagementService, DocumentUrlPipe, Draft, DraftService, DynamicListPipe, DynamicRadioListPipe, ESQueryType, Embedded, EnumDisplayDescriptionPipe, ErrorMessageComponent, ErrorNotifierService, EventCaseField, EventCompletionReturnStates, EventCompletionStateMachineService, EventCompletionStates, EventLogComponent, EventLogDetailsComponent, EventLogTableComponent, EventMessageModule, EventStartComponent, EventStartModule, EventStartStateMachineService, EventStatusService, EventTriggerResolver, EventTriggerService, Fee, FeeValue, Field, FieldLabelPipe, FieldReadComponent, FieldReadLabelComponent, FieldType, FieldTypeSanitiser, FieldWriteComponent, FieldsFilterPipe, FieldsPurger, FieldsUtils, FirstErrorPipe, FixedListItem, FixedListPipe, FixedRadioListPipe, FlagFieldDisplayPipe, FocusElementDirective, FocusElementModule, FooterComponent, FormDocument, FormErrorService, FormValidatorsService, FormValueService, FormatTranslatorService, GreyBarService, HRef, HeaderBarComponent, HeadersModule, HttpError, HttpErrorService, HttpService, IsCompoundPipe, IsMandatoryPipe, IsReadOnlyAndNotCollectionPipe, IsReadOnlyPipe, JudicialworkerService, Jurisdiction, JurisdictionService, LabelFieldComponent, LabelSubstitutorDirective, LabelSubstitutorModule, LanguageInterpreterDisplayPipe, LinkCaseReason, LinkCasesComponent, LinkCasesFromReasonValuePipe, LinkCasesReasonValuePipe, LinkDetails, LinkFromReason, LinkReason, LinkedCasesErrorMessages, LinkedCasesEventTriggers, LinkedCasesFromTableComponent, LinkedCasesPages, LinkedCasesResponse, LinkedCasesToTableComponent, LoadingModule, LoadingService, LoadingSpinnerComponent, LoadingSpinnerModule, MEDIA_VIEWER_LOCALSTORAGE_KEY, MULTIPLE_TASKS_FOUND, ManageCaseFlagsComponent, ManageCaseFlagsLabelDisplayPipe, MarkdownComponent, MarkdownComponentModule, MoneyGbpInputComponent, MultipageComponentStateService, MultipleTasksExistComponent, NavigationComponent, NavigationItemComponent, NavigationNotifierService, NavigationOrigin, NoLinkedCasesComponent, NoTasksAvailableComponent, NotificationBannerComponent, NotificationBannerHeaderClass, NotificationBannerType, OrderService, OrderSummary, OrganisationConverter, OrganisationService, PageValidationService, PaginationComponent, PaginationMetadata, PaginationModule, PaletteContext, PaletteModule, PaletteService, PaletteUtilsModule, Patterns, PaymentField, PhaseComponent, PipesModule, PlaceholderService, PrintUrlPipe, Profile, ProfileNotifier, ProfileService, QualifyingQuestionDetailComponent, QualifyingQuestionOptionsComponent, QualifyingQuestionService, QualifyingQuestionsErrorMessage, QueryAttachmentsReadComponent, QueryCaseDetailsHeaderComponent, QueryCheckYourAnswersComponent, QueryConfirmationComponent, QueryCreateContext, QueryDetailsComponent, QueryEventCompletionComponent, QueryItemResponseStatus, QueryListComponent, QueryListData, QueryListItem, QueryWriteAddDocumentsComponent, QueryWriteDateInputComponent, QueryWriteRaiseQueryComponent, QueryWriteRespondToQueryComponent, RaiseQueryErrorMessage, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadCookieService, ReadDateFieldComponent, ReadDocumentFieldComponent, ReadDynamicListFieldComponent, ReadDynamicMultiSelectListFieldComponent, ReadDynamicRadioListFieldComponent, ReadEmailFieldComponent, ReadFieldsFilterPipe, ReadFixedListFieldComponent, ReadFixedRadioListFieldComponent, ReadJudicialUserFieldComponent, ReadLinkedCasesFieldComponent, ReadMoneyGbpFieldComponent, ReadMultiSelectListFieldComponent, ReadNumberFieldComponent, ReadOrderSummaryFieldComponent, ReadOrderSummaryRowComponent, ReadOrganisationFieldComponent, ReadOrganisationFieldRawComponent, ReadOrganisationFieldTableComponent, ReadPhoneUKFieldComponent, ReadQueryManagementFieldComponent, ReadTextAreaFieldComponent, ReadTextFieldComponent, ReadYesNoFieldComponent, RefdataCaseFlagType, RemoveDialogComponent, RequestOptionsBuilder, RespondToQueryErrorMessages, RetryUtil, RouterHelperService, RouterLinkComponent, SaveOrDiscardDialogComponent, SearchFiltersComponent, SearchFiltersModule, SearchFiltersWrapperComponent, SearchInput, SearchLanguageInterpreterComponent, SearchLanguageInterpreterErrorMessage, SearchLanguageInterpreterStep, SearchResultComponent, SearchResultModule, SearchResultView, SearchResultViewColumn, SearchResultViewItem, SearchResultViewItemComparatorFactory, SearchService, SelectFlagErrorMessage, SelectFlagLocationComponent, SelectFlagLocationErrorMessage, SelectFlagTypeComponent, SelectFlagTypeErrorMessage, SessionStorageService, ShowCondition, SortOrder$1 as SortOrder, SortParameters, SortSearchResultPipe, TabComponent, TableColumnConfig, TableConfig, TabsComponent, TabsModule, TaskAssignedComponent, TaskCancelledComponent, TaskConflictComponent, TaskUnassignedComponent, Terms, TestRouteSnapshotBuilder, UnLinkCasesComponent, UnsupportedFieldComponent, UpdateFlagAddTranslationErrorMessage, UpdateFlagAddTranslationFormComponent, UpdateFlagAddTranslationStep, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, UpdateFlagTitleDisplayPipe, WaysToPayFieldComponent, WindowService, Wizard, WizardFactoryService, WizardPage, WizardPageField, WorkAllocationService, WorkbasketFiltersComponent, WorkbasketFiltersModule, WorkbasketInput, WorkbasketInputFilterService, WorkbasketInputModel, WriteAddressFieldComponent, WriteCaseFlagFieldComponent, WriteCaseLinkFieldComponent, WriteCollectionFieldComponent, WriteComplexFieldComponent, WriteDateContainerFieldComponent, WriteDateFieldComponent, WriteDocumentFieldComponent, WriteDynamicListFieldComponent, WriteDynamicMultiSelectListFieldComponent, WriteDynamicRadioListFieldComponent, WriteEmailFieldComponent, WriteFixedListFieldComponent, WriteFixedRadioListFieldComponent, WriteJudicialUserFieldComponent, WriteLinkedCasesFieldComponent, WriteMoneyGbpFieldComponent, WriteMultiSelectListFieldComponent, WriteNumberFieldComponent, WriteOrderSummaryFieldComponent, WriteOrganisationComplexFieldComponent, WriteOrganisationFieldComponent, WritePhoneUKFieldComponent, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, caseMessagesMockData, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, textFieldType, viewerRouting };
+export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, AbstractFieldWriteJourneyComponent, AbstractJourneyComponent, Activity, ActivityBannerComponent, ActivityComponent, ActivityIconComponent, ActivityInfo, ActivityModule, ActivityPollingService, ActivityService, AddCommentsComponent, AddCommentsErrorMessage, AddCommentsStep, AddressModel, AddressOption, AddressesService, Alert, AlertComponent, AlertIconClassPipe, AlertMessageType, AlertModule, AlertService, AuthService, Banner, BannersService, BeforeYouStartComponent, BodyComponent, BrowserService, CCDCaseLinkType, COMPONENT_PORTAL_INJECTION_TOKEN, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventCompletionComponent, CaseEventCompletionTaskCancelledComponent, CaseEventCompletionTaskReassignedComponent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewFolderToggleComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagCheckYourAnswersPageStep, CaseFlagDisplayContextParameter, CaseFlagErrorMessage, CaseFlagFieldState, CaseFlagFormFields, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, CaseFlagWizardStepTitle, CaseFullAccessViewComponent, CaseHeaderComponent, CaseHeaderModule, CaseHistoryViewerFieldComponent, CaseLink, CaseLinkResponse, CaseListComponent, CaseListFiltersComponent, CaseListFiltersModule, CaseListModule, CaseNotifier, CasePaymentHistoryViewerFieldComponent, CasePrintDocument, CasePrinterComponent, CaseProgressComponent, CaseReferencePipe, CaseResolver, CaseSpecificAccessRequestComponent, CaseSpecificAccessSuccessComponent, CaseState, CaseTab, CaseTimelineComponent, CaseTimelineDisplayMode, CaseTimelineModule, CaseType, CaseTypeLite, CaseView, CaseViewComponent, CaseViewEvent, CaseViewTrigger, CaseViewerComponent, CaseViewerModule, CasesService, CaseworkerService, CcdCYAPageLabelFilterPipe, CcdCaseTitlePipe, CcdCollectionTableCaseFieldsFilterPipe, CcdPageFieldsPipe, CcdTabFieldsPipe, CheckYourAnswersComponent, CloseQueryComponent, ConditionalShowFormDirective, ConditionalShowModule, ConditionalShowRegistrarService, ConfirmFlagStatusComponent, ConfirmStatusErrorMessage, ConfirmStatusStep, Confirmation, ConvertHrefToRouterService, CreateCaseFiltersComponent, CreateCaseFiltersModule, CreateCaseFiltersSelection, DRAFT_PREFIX, DRAFT_QUERY_PARAM, DashPipe, DateInputComponent, DatePipe, DateTimeFormatUtils, DatetimePickerComponent, DefinitionsModule, DefinitionsService, DeleteOrCancelDialogComponent, DialogsModule, DisplayMode, Document, DocumentData, DocumentDialogComponent, DocumentLinks, DocumentManagementService, DocumentUrlPipe, Draft, DraftService, DynamicListPipe, DynamicRadioListPipe, ESQueryType, Embedded, EnumDisplayDescriptionPipe, ErrorMessageComponent, ErrorNotifierService, EventCaseField, EventCompletionReturnStates, EventCompletionStateMachineService, EventCompletionStates, EventLogComponent, EventLogDetailsComponent, EventLogTableComponent, EventMessageModule, EventStartComponent, EventStartModule, EventStartStateMachineService, EventStatusService, EventTriggerResolver, EventTriggerService, Fee, FeeValue, Field, FieldLabelPipe, FieldReadComponent, FieldReadLabelComponent, FieldType, FieldTypeSanitiser, FieldWriteComponent, FieldsFilterPipe, FieldsPurger, FieldsUtils, FirstErrorPipe, FixedListItem, FixedListPipe, FixedRadioListPipe, FlagFieldDisplayPipe, FocusElementDirective, FocusElementModule, FooterComponent, FormDocument, FormErrorService, FormValidatorsService, FormValueService, FormatTranslatorService, GreyBarService, HRef, HeaderBarComponent, HeadersModule, HttpError, HttpErrorService, HttpService, IsCompoundPipe, IsMandatoryPipe, IsReadOnlyAndNotCollectionPipe, IsReadOnlyPipe, JudicialworkerService, Jurisdiction, JurisdictionService, LabelFieldComponent, LabelSubstitutorDirective, LabelSubstitutorModule, LanguageInterpreterDisplayPipe, LinkCaseReason, LinkCasesComponent, LinkCasesFromReasonValuePipe, LinkCasesReasonValuePipe, LinkDetails, LinkFromReason, LinkReason, LinkedCasesErrorMessages, LinkedCasesEventTriggers, LinkedCasesFromTableComponent, LinkedCasesPages, LinkedCasesResponse, LinkedCasesToTableComponent, LoadingModule, LoadingService, LoadingSpinnerComponent, LoadingSpinnerModule, MEDIA_VIEWER_LOCALSTORAGE_KEY, MULTIPLE_TASKS_FOUND, ManageCaseFlagsComponent, ManageCaseFlagsLabelDisplayPipe, MarkdownComponent, MarkdownComponentModule, MoneyGbpInputComponent, MultipageComponentStateService, MultipleTasksExistComponent, NavigationComponent, NavigationItemComponent, NavigationNotifierService, NavigationOrigin, NoLinkedCasesComponent, NoTasksAvailableComponent, NotificationBannerComponent, NotificationBannerHeaderClass, NotificationBannerType, OrderService, OrderSummary, OrganisationConverter, OrganisationService, PageValidationService, PaginationComponent, PaginationMetadata, PaginationModule, PaletteContext, PaletteModule, PaletteService, PaletteUtilsModule, Patterns, PaymentField, PhaseComponent, PipesModule, PlaceholderService, PrintUrlPipe, Profile, ProfileNotifier, ProfileService, QualifyingQuestionDetailComponent, QualifyingQuestionOptionsComponent, QualifyingQuestionService, QualifyingQuestionsErrorMessage, QueryAttachmentsReadComponent, QueryCaseDetailsHeaderComponent, QueryCheckYourAnswersComponent, QueryConfirmationComponent, QueryCreateContext, QueryDetailsComponent, QueryEventCompletionComponent, QueryItemResponseStatus, QueryListComponent, QueryListData, QueryListItem, QueryWriteAddDocumentsComponent, QueryWriteDateInputComponent, QueryWriteRaiseQueryComponent, QueryWriteRespondToQueryComponent, RaiseQueryErrorMessage, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadCookieService, ReadDateFieldComponent, ReadDocumentFieldComponent, ReadDynamicListFieldComponent, ReadDynamicMultiSelectListFieldComponent, ReadDynamicRadioListFieldComponent, ReadEmailFieldComponent, ReadFieldsFilterPipe, ReadFixedListFieldComponent, ReadFixedRadioListFieldComponent, ReadJudicialUserFieldComponent, ReadLinkedCasesFieldComponent, ReadMoneyGbpFieldComponent, ReadMultiSelectListFieldComponent, ReadNumberFieldComponent, ReadOrderSummaryFieldComponent, ReadOrderSummaryRowComponent, ReadOrganisationFieldComponent, ReadOrganisationFieldRawComponent, ReadOrganisationFieldTableComponent, ReadPhoneUKFieldComponent, ReadQueryManagementFieldComponent, ReadTextAreaFieldComponent, ReadTextFieldComponent, ReadYesNoFieldComponent, RefdataCaseFlagType, RemoveDialogComponent, RequestOptionsBuilder, RespondToQueryErrorMessages, RetryUtil, RouterHelperService, RouterLinkComponent, SaveOrDiscardDialogComponent, SearchFiltersComponent, SearchFiltersModule, SearchFiltersWrapperComponent, SearchInput, SearchLanguageInterpreterComponent, SearchLanguageInterpreterErrorMessage, SearchLanguageInterpreterStep, SearchResultComponent, SearchResultModule, SearchResultView, SearchResultViewColumn, SearchResultViewItem, SearchResultViewItemComparatorFactory, SearchService, SelectFlagErrorMessage, SelectFlagLocationComponent, SelectFlagLocationErrorMessage, SelectFlagTypeComponent, SelectFlagTypeErrorMessage, SessionStorageService, ShowCondition, SortOrder$1 as SortOrder, SortParameters, SortSearchResultPipe, TabComponent, TableColumnConfig, TableConfig, TabsComponent, TabsModule, TaskAssignedComponent, TaskCancelledComponent, TaskConflictComponent, TaskUnassignedComponent, Terms, TestRouteSnapshotBuilder, UnLinkCasesComponent, UnsupportedFieldComponent, UpdateFlagAddTranslationErrorMessage, UpdateFlagAddTranslationFormComponent, UpdateFlagAddTranslationStep, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, UpdateFlagTitleDisplayPipe, WaysToPayFieldComponent, WindowService, Wizard, WizardFactoryService, WizardPage, WizardPageField, WorkAllocationService, WorkbasketFiltersComponent, WorkbasketFiltersModule, WorkbasketInput, WorkbasketInputFilterService, WorkbasketInputModel, WriteAddressFieldComponent, WriteCaseFlagFieldComponent, WriteCaseLinkFieldComponent, WriteCollectionFieldComponent, WriteComplexFieldComponent, WriteDateContainerFieldComponent, WriteDateFieldComponent, WriteDocumentFieldComponent, WriteDynamicListFieldComponent, WriteDynamicMultiSelectListFieldComponent, WriteDynamicRadioListFieldComponent, WriteEmailFieldComponent, WriteFixedListFieldComponent, WriteFixedRadioListFieldComponent, WriteJudicialUserFieldComponent, WriteLinkedCasesFieldComponent, WriteMoneyGbpFieldComponent, WriteMultiSelectListFieldComponent, WriteNumberFieldComponent, WriteOrderSummaryFieldComponent, WriteOrganisationComplexFieldComponent, WriteOrganisationFieldComponent, WritePhoneUKFieldComponent, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, caseMessagesMockData, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, textFieldType, viewerRouting };
 //# sourceMappingURL=hmcts-ccd-case-ui-toolkit.mjs.map