@hmcts/ccd-case-ui-toolkit 7.2.2 → 7.2.3-no-task-error

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

@@ -27,7 +27,7 @@ import { MatDialogConfig } from '@angular/material/dialog';
 import * as i2 from '@nicky-lenaers/ngx-scroll-to';
 import { ScrollToModule } from '@nicky-lenaers/ngx-scroll-to';
 import * as marked from 'marked';
-import * as i1$4 from 'ngx-markdown';
+import * as i2$1 from 'ngx-markdown';
 import { MarkdownModule } from 'ngx-markdown';
 import * as i6 from '@angular/material/legacy-autocomplete';
 import { MatLegacyAutocompleteModule } from '@angular/material/legacy-autocomplete';
@@ -36,7 +36,7 @@ import { MAT_LEGACY_DATE_LOCALE } from '@angular/material/legacy-core';
 import * as i3 from '@hmcts/ccpay-web-component';
 import { PaymentLibModule } from '@hmcts/ccpay-web-component';
 import { v4 } from 'uuid';
-import * as i2$1 from '@angular/cdk/overlay';
+import * as i2$2 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import * as i7$1 from '@angular/cdk/tree';
 import { NestedTreeControl, CdkTreeModule } from '@angular/cdk/tree';
@@ -53,7 +53,7 @@ import { MatLegacyInputModule } from '@angular/material/legacy-input';
 import * as i14 from '@hmcts/media-viewer';
 import { MediaViewerModule } from '@hmcts/media-viewer';
 import { PortalModule } from '@angular/cdk/portal';
-import * as i2$2 from 'ngx-pagination';
+import * as i2$3 from 'ngx-pagination';
 import { NgxPaginationModule, PaginatePipe } from 'ngx-pagination';
 import * as i10 from '@angular/material/legacy-tabs';
 import { MatLegacyTabsModule } from '@angular/material/legacy-tabs';
@@ -14370,17 +14370,16 @@ class RemoveDialogComponent {
 
 const _c0$S = ["collectionItem"];
 function WriteCollectionFieldComponent_h2_8_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 10)(1, "markdown");
-    i0.ɵɵtext(2);
-    i0.ɵɵpipe(3, "rpxTranslate");
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(0, "span", 10);
+    i0.ɵɵelement(1, "ccd-markdown", 11);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, ctx_r0.caseField.hint_text));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("content", ctx_r0.caseField.hint_text);
 } }
 function WriteCollectionFieldComponent_h2_8_span_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 11);
+    i0.ɵɵelementStart(0, "span", 12);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "ccdFirstError");
     i0.ɵɵelementEnd();
@@ -14391,7 +14390,7 @@ function WriteCollectionFieldComponent_h2_8_span_2_Template(rf, ctx) { if (rf &
 } }
 function WriteCollectionFieldComponent_h2_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "h2", 3);
-    i0.ɵɵtemplate(1, WriteCollectionFieldComponent_h2_8_span_1_Template, 4, 3, "span", 8)(2, WriteCollectionFieldComponent_h2_8_span_2_Template, 3, 4, "span", 9);
+    i0.ɵɵtemplate(1, WriteCollectionFieldComponent_h2_8_span_1_Template, 2, 1, "span", 8)(2, WriteCollectionFieldComponent_h2_8_span_2_Template, 3, 4, "span", 9);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -14402,16 +14401,16 @@ function WriteCollectionFieldComponent_h2_8_Template(rf, ctx) { if (rf & 1) {
 } }
 function WriteCollectionFieldComponent_div_9_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 1, 0)(2, "div", 15)(3, "div", 16)(4, "legend", 17)(5, "label", 18)(6, "h3", 19);
+    i0.ɵɵelementStart(0, "div", 1, 0)(2, "div", 16)(3, "div", 17)(4, "legend", 18)(5, "label", 19)(6, "h3", 20);
     i0.ɵɵtext(7);
     i0.ɵɵpipe(8, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(9, "div", 20)(10, "button", 21);
+    i0.ɵɵelementStart(9, "div", 21)(10, "button", 22);
     i0.ɵɵlistener("click", function WriteCollectionFieldComponent_div_9_div_2_Template_button_click_10_listener() { const i_r3 = i0.ɵɵrestoreView(_r2).index; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.openModal(i_r3)); });
     i0.ɵɵtext(11);
     i0.ɵɵpipe(12, "rpxTranslate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelement(13, "ccd-field-write", 22);
+    i0.ɵɵelement(13, "ccd-field-write", 23);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const item_r4 = ctx.$implicit;
@@ -14431,8 +14430,8 @@ function WriteCollectionFieldComponent_div_9_div_2_Template(rf, ctx) { if (rf &
     i0.ɵɵproperty("caseField", item_r4.caseField)("caseFields", ctx_r0.caseFields)("formGroup", ctx_r0.formGroup)("parent", item_r4.container)("idPrefix", item_r4.prefix)("hidden", item_r4.caseField.hidden)("isExpanded", ctx_r0.isExpanded)("isInSearchBlock", ctx_r0.isInSearchBlock);
 } }
 function WriteCollectionFieldComponent_div_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 12)(1, "fieldset", 13);
-    i0.ɵɵtemplate(2, WriteCollectionFieldComponent_div_9_div_2_Template, 14, 19, "div", 14);
+    i0.ɵɵelementStart(0, "div", 13)(1, "fieldset", 14);
+    i0.ɵɵtemplate(2, WriteCollectionFieldComponent_div_9_div_2_Template, 14, 19, "div", 15);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -14442,7 +14441,7 @@ function WriteCollectionFieldComponent_div_9_Template(rf, ctx) { if (rf & 1) {
 } }
 function WriteCollectionFieldComponent_button_10_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 23);
+    i0.ɵɵelementStart(0, "button", 24);
     i0.ɵɵlistener("click", function WriteCollectionFieldComponent_button_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.addItem(false)); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -14760,7 +14759,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.items = _t);
-        } }, inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 11, consts: [["collectionItem", ""], [1, "form-group", 3, "id"], [1, "panel", "collection-indicator"], [1, "heading-h2", "error-spacing"], ["type", "button", 1, "button", "write-collection-add-item__top", 3, "click", "disabled"], ["class", "heading-h2 error-spacing", 4, "ngIf"], ["class", "form-group", 3, "hidden", 4, "ngIf"], ["class", "button write-collection-add-item__bottom", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], [1, "form-hint"], [1, "error-message"], [1, "form-group", 3, "hidden"], [1, "govuk-fieldset"], ["class", "form-group", 3, "id", 4, "ngFor", "ngForOf"], [1, "collection-title"], [1, "float-left"], [1, "govuk-fieldset__legend"], [3, "for"], [1, "heading-h3"], [1, "float-right"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "caseField", "caseFields", "formGroup", "parent", "idPrefix", "hidden", "isExpanded", "isInSearchBlock"], ["type", "button", 1, "button", "write-collection-add-item__bottom", 3, "click", "disabled"]], template: function WriteCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 11, consts: [["collectionItem", ""], [1, "form-group", 3, "id"], [1, "panel", "collection-indicator"], [1, "heading-h2", "error-spacing"], ["type", "button", 1, "button", "write-collection-add-item__top", 3, "click", "disabled"], ["class", "heading-h2 error-spacing", 4, "ngIf"], ["class", "form-group", 3, "hidden", 4, "ngIf"], ["class", "button write-collection-add-item__bottom", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], [1, "form-hint"], [3, "content"], [1, "error-message"], [1, "form-group", 3, "hidden"], [1, "govuk-fieldset"], ["class", "form-group", 3, "id", 4, "ngFor", "ngForOf"], [1, "collection-title"], [1, "float-left"], [1, "govuk-fieldset__legend"], [3, "for"], [1, "heading-h3"], [1, "float-right"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "caseField", "caseFields", "formGroup", "parent", "idPrefix", "hidden", "isExpanded", "isInSearchBlock"], ["type", "button", 1, "button", "write-collection-add-item__bottom", 3, "click", "disabled"]], template: function WriteCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1)(1, "div", 2)(2, "h2", 3);
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "ccdFieldLabel");
@@ -14790,7 +14789,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteCollectionFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">\n      <markdown>{{caseField.hint_text | rpxTranslate }}</markdown>\n      </span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <fieldset class=\"govuk-fieldset\">\n        <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n            [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n          <div class=\"collection-title\">\n            <div class=\"float-left\">\n              <legend class=\"govuk-fieldset__legend\">\n                <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n              </legend>\n            </div>\n            <div class=\"float-right\">\n              <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                      [disabled]=\"isNotAuthorisedToDelete(i)\"\n                      attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n            </div>\n          </div>\n          <ccd-field-write [caseField]=\"item.caseField\"\n                          [caseFields]=\"caseFields\"\n                          [formGroup]=\"formGroup\"\n                          [parent]=\"item.container\"\n                          [idPrefix]=\"item.prefix\"\n                          [hidden]=\"item.caseField.hidden\"\n                          [isExpanded]=\"isExpanded\"\n                          [isInSearchBlock]=\"isInSearchBlock\">\n          </ccd-field-write>\n        </div>\n      </fieldset>\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
+        args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">\n      <ccd-markdown [content]=\"caseField.hint_text\"></ccd-markdown>\n      </span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <fieldset class=\"govuk-fieldset\">\n        <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n            [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n          <div class=\"collection-title\">\n            <div class=\"float-left\">\n              <legend class=\"govuk-fieldset__legend\">\n                <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n              </legend>\n            </div>\n            <div class=\"float-right\">\n              <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                      [disabled]=\"isNotAuthorisedToDelete(i)\"\n                      attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n            </div>\n          </div>\n          <ccd-field-write [caseField]=\"item.caseField\"\n                          [caseFields]=\"caseFields\"\n                          [formGroup]=\"formGroup\"\n                          [parent]=\"item.container\"\n                          [idPrefix]=\"item.prefix\"\n                          [hidden]=\"item.caseField.hidden\"\n                          [isExpanded]=\"isExpanded\"\n                          [isInSearchBlock]=\"isInSearchBlock\">\n          </ccd-field-write>\n        </div>\n      </fieldset>\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
     }], () => [{ type: i1$3.MatLegacyDialog }, { type: i2.ScrollToService }, { type: ProfileNotifier }, { type: i0.ChangeDetectorRef }], { caseFields: [{
             type: Input
         }], items: [{
@@ -15734,7 +15733,7 @@ class MarkdownComponent {
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵproperty("data", i0.ɵɵpipeBind1(3, 3, i0.ɵɵpipeBind1(2, 1, ctx.content)));
-        } }, dependencies: [i1$4.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2, changeDetection: 0 });
+        } }, dependencies: [i2$1.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2, changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MarkdownComponent, [{
         type: Component,
@@ -20866,10 +20865,11 @@ class QueryListItem {
     createdBy;
     parentId;
     children = [];
+    messageIndexInParent = null;
     get lastSubmittedMessage() {
         const getLastSubmittedMessage = (item) => {
             let lastSubmittedMessage = item;
-            if (item.children && item.children.length > 0) {
+            if (item.children && item.children.length > 1) {
                 for (const child of item.children) {
                     const childLastSubmittedMessage = getLastSubmittedMessage(child);
                     if (childLastSubmittedMessage.createdOn > lastSubmittedMessage.createdOn) {
@@ -20885,20 +20885,47 @@ class QueryListItem {
         return this.lastSubmittedMessage.name;
     }
     get lastSubmittedDate() {
-        return new Date(this.lastSubmittedMessage.createdOn);
+        const childrenCount = this.children.length;
+        if (childrenCount <= 1) {
+            return new Date(this.lastSubmittedMessage.createdOn);
+        }
+        let index;
+        if (childrenCount > 1) {
+            index = childrenCount % 2 === 0 ? childrenCount - 1 : childrenCount - 2;
+        }
+        return new Date(this.children[index].createdOn);
     }
     get lastResponseBy() {
         return this.children?.length > 0 ? this.lastSubmittedMessage.name : '';
     }
     get lastResponseDate() {
-        return this.children?.length > 0 ? new Date(this.lastSubmittedMessage.createdOn) : null;
+        const childrenCount = this.children.length;
+        if (childrenCount === 0) {
+            return null;
+        }
+        let index;
+        if (childrenCount === 1) {
+            index = 0;
+        }
+        else {
+            index = childrenCount % 2 === 1 ? childrenCount - 1 : childrenCount - 2;
+        }
+        return new Date(this.children[index].createdOn);
     }
     get responseStatus() {
-        if (this.children?.length > 0) {
+        // Child logic (position-based)
+        if (this.messageIndexInParent !== null) {
+            return this.messageIndexInParent % 2 === 0
+                ? QueryItemResponseStatus.RESPONDED
+                : QueryItemResponseStatus.AWAITING;
+        }
+        // Parent logic (children count)
+        if (this.children && this.children.length > 0) {
             return this.children.length % 2 === 1
                 ? QueryItemResponseStatus.RESPONDED
                 : QueryItemResponseStatus.AWAITING;
         }
+        // No children — still awaiting
         return QueryItemResponseStatus.AWAITING;
     }
 }
@@ -20915,12 +20942,16 @@ class QueryListData {
         this.queries = parentMessages.map((message) => this.buildQueryListItem(message, caseQueriesCollection.caseMessages));
     }
     buildQueryListItem(message, allMessages) {
+        const childrenMessages = allMessages.filter((childMessage) => childMessage.value.parentId === message.value.id);
+        const children = childrenMessages.map((childMessage, index) => {
+            const childItem = this.buildQueryListItem(childMessage, allMessages);
+            childItem.messageIndexInParent = index; // Assign index for status logic
+            return childItem;
+        });
         const queryListItem = new QueryListItem();
         Object.assign(queryListItem, {
             ...message.value,
-            children: allMessages
-                .filter((childMessage) => childMessage.value.parentId === message.value.id)
-                .map((childMessage) => this.buildQueryListItem(childMessage, allMessages))
+            children
         });
         return queryListItem;
     }
@@ -21010,8 +21041,8 @@ class QueryManagementUtils {
         type: Injectable
     }], null, null); })();
 
-function QueryCheckYourAnswersComponent_div_2_li_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "li")(1, "a", 25);
+function QueryCheckYourAnswersComponent_div_0_div_2_li_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "li")(1, "a", 26);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd()();
@@ -21022,24 +21053,24 @@ function QueryCheckYourAnswersComponent_div_2_li_6_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, errorMessage_r2.description));
 } }
-function QueryCheckYourAnswersComponent_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 20)(1, "h2", 21);
+function QueryCheckYourAnswersComponent_div_0_div_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21)(1, "h2", 22);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 22)(5, "ul", 23);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_2_li_6_Template, 4, 4, "li", 24);
+    i0.ɵɵelementStart(4, "div", 23)(5, "ul", 24);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_div_2_li_6_Template, 4, 4, "li", 25);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 2, "There is a problem"), " ");
     i0.ɵɵadvance(4);
     i0.ɵɵproperty("ngForOf", ctx_r2.errorMessages);
 } }
-function QueryCheckYourAnswersComponent_ng_container_3_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 26);
+    i0.ɵɵelementStart(1, "div", 27);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -21048,7 +21079,7 @@ function QueryCheckYourAnswersComponent_ng_container_3_Template(rf, ctx) { if (r
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, "Raise a query"));
 } }
-function QueryCheckYourAnswersComponent_ng_container_5_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_container_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -21057,16 +21088,16 @@ function QueryCheckYourAnswersComponent_ng_container_5_Template(rf, ctx) { if (r
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, "Review query response details"), " ");
 } }
-function QueryCheckYourAnswersComponent_ng_template_6_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_template_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
     i0.ɵɵpipe(1, "rpxTranslate");
 } if (rf & 2) {
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(1, 1, "Review query details"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_10_a_8_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_10_a_8_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(0, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -21074,28 +21105,28 @@ function QueryCheckYourAnswersComponent_dl_10_a_8_Template(rf, ctx) { if (rf & 1
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, "Change"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+function QueryCheckYourAnswersComponent_div_0_dl_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 14);
+    i0.ɵɵelementStart(5, "dd", 15);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15);
-    i0.ɵɵtemplate(8, QueryCheckYourAnswersComponent_dl_10_a_8_Template, 3, 3, "a", 27);
+    i0.ɵɵelementStart(7, "dd", 16);
+    i0.ɵɵtemplate(8, QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template, 3, 3, "a", 28);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    let tmp_3_0;
-    const ctx_r2 = i0.ɵɵnextContext();
+    let tmp_4_0;
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? "Submitted query" : i0.ɵɵpipeBind1(4, 3, "Query subject"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? ctx_r2.queryItem.subject : (tmp_3_0 = ctx_r2.formGroup.get("subject")) == null ? null : tmp_3_0.value, " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? ctx_r2.queryItem.subject : (tmp_4_0 = ctx_r2.formGroup.get("subject")) == null ? null : tmp_4_0.value, " ");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
 } }
-function QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_ng_container_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -21104,89 +21135,89 @@ function QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template(rf, ctx) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(2, 1, "Is the query hearing related?", null, "Yes"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_ng_template_7_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_ng_template_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
     i0.ɵɵpipe(1, "rpxTranslate");
 } if (rf & 2) {
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(1, 1, "Is the query hearing related?", null, "No"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_div_13_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 12)(1, "dt", 13);
+    i0.ɵɵelementStart(0, "div", 13)(1, "dt", 14);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "dd", 14);
+    i0.ɵɵelementStart(4, "dd", 15);
     i0.ɵɵtext(5);
     i0.ɵɵpipe(6, "date");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15)(8, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_22_div_13_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(7, "dd", 16)(8, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    let tmp_5_0;
-    const ctx_r2 = i0.ɵɵnextContext(2);
+    let tmp_6_0;
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY ? "What is the date of the hearing?" : i0.ɵɵpipeBind1(3, 3, "What is the date of the hearing your query is related to?"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(6, 5, (tmp_5_0 = ctx_r2.formGroup.get("hearingDate")) == null ? null : tmp_5_0.value, "dd MMM yyyy"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(6, 5, (tmp_6_0 = ctx_r2.formGroup.get("hearingDate")) == null ? null : tmp_6_0.value, "dd MMM yyyy"), " ");
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 8, "Change"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 14);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template, 3, 5, "ng-container", 7)(7, QueryCheckYourAnswersComponent_dl_22_ng_template_7_Template, 2, 5, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵelementStart(5, "dd", 15);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_dl_22_ng_container_6_Template, 3, 5, "ng-container", 8)(7, QueryCheckYourAnswersComponent_div_0_dl_22_ng_template_7_Template, 2, 5, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "dd", 15)(10, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_22_Template_a_click_10_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(9, "dd", 16)(10, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_22_Template_a_click_10_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(11);
     i0.ɵɵpipe(12, "rpxTranslate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵtemplate(13, QueryCheckYourAnswersComponent_dl_22_div_13_Template, 11, 10, "div", 28);
+    i0.ɵɵtemplate(13, QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template, 11, 10, "div", 29);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_4_0;
-    let tmp_7_0;
+    let tmp_5_0;
+    let tmp_8_0;
     const isHearingRelatedFalse_r7 = i0.ɵɵreference(8);
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 5, "Is the query hearing related?"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ((tmp_4_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_4_0.value) === true)("ngIfElse", isHearingRelatedFalse_r7);
+    i0.ɵɵproperty("ngIf", ((tmp_5_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_5_0.value) === true)("ngIfElse", isHearingRelatedFalse_r7);
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(12, 7, "Change"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", (tmp_7_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_7_0.value);
+    i0.ɵɵproperty("ngIf", (tmp_8_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_8_0.value);
 } }
-function QueryCheckYourAnswersComponent_dl_23_ccd_query_attachments_read_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ccd-query-attachments-read", 31);
+function QueryCheckYourAnswersComponent_div_0_dl_23_ccd_query_attachments_read_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-query-attachments-read", 32);
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵproperty("attachments", ctx_r2.attachments);
 } }
-function QueryCheckYourAnswersComponent_dl_23_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_23_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 29);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_dl_23_ccd_query_attachments_read_6_Template, 1, 1, "ccd-query-attachments-read", 30);
+    i0.ɵɵelementStart(5, "dd", 30);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_dl_23_ccd_query_attachments_read_6_Template, 1, 1, "ccd-query-attachments-read", 31);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15)(8, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_23_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(7, "dd", 16)(8, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_23_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY ? "Upload a file to the query" : i0.ɵɵpipeBind1(4, 3, "Document attached"), " ");
     i0.ɵɵadvance(3);
@@ -21194,6 +21225,74 @@ function QueryCheckYourAnswersComponent_dl_23_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 5, "Change"), " ");
 } }
+function QueryCheckYourAnswersComponent_div_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 3)(1, "div", 4);
+    i0.ɵɵtemplate(2, QueryCheckYourAnswersComponent_div_0_div_2_Template, 7, 4, "div", 5)(3, QueryCheckYourAnswersComponent_div_0_ng_container_3_Template, 4, 3, "ng-container", 6);
+    i0.ɵɵelementStart(4, "h1", 7);
+    i0.ɵɵtemplate(5, QueryCheckYourAnswersComponent_div_0_ng_container_5_Template, 3, 3, "ng-container", 8)(6, QueryCheckYourAnswersComponent_div_0_ng_template_6_Template, 2, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 9);
+    i0.ɵɵelement(9, "ccd-query-case-details-header", 10);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(10, QueryCheckYourAnswersComponent_div_0_dl_10_Template, 9, 5, "dl", 11);
+    i0.ɵɵelementStart(11, "dl", 12)(12, "div", 13)(13, "dt", 14);
+    i0.ɵɵtext(14);
+    i0.ɵɵpipe(15, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "dd", 15);
+    i0.ɵɵtext(17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(18, "dd", 16)(19, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_a_click_19_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(20);
+    i0.ɵɵpipe(21, "rpxTranslate");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵtemplate(22, QueryCheckYourAnswersComponent_div_0_dl_22_Template, 14, 9, "dl", 11)(23, QueryCheckYourAnswersComponent_div_0_dl_23_Template, 11, 7, "dl", 11);
+    i0.ɵɵelement(24, "br");
+    i0.ɵɵelementStart(25, "div")(26, "button", 18);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(27);
+    i0.ɵɵpipe(28, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(29, "button", 19);
+    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.submit()); });
+    i0.ɵɵtext(30);
+    i0.ɵɵpipe(31, "rpxTranslate");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelement(32, "ccd-query-event-completion", 20);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_9_0;
+    const defaultCheckYourAnswersTitle_r9 = i0.ɵɵreference(7);
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", ctx_r2.errorMessages.length > 0);
+    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_r9);
+    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(15, 14, "Query detail"), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", (tmp_9_0 = ctx_r2.formGroup.get("body")) == null ? null : tmp_9_0.value, " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(21, 16, "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(4);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(28, 18, "Previous"), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(31, 20, "Submit"), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("eventCompletionParams", ctx_r2.eventCompletionParams);
+} }
 class QueryCheckYourAnswersComponent {
     route;
     router;
@@ -21216,6 +21315,7 @@ class QueryCheckYourAnswersComponent {
     eventData = null;
     backClicked = new EventEmitter();
     querySubmitted = new EventEmitter();
+    callbackConfirmationMessage = new EventEmitter();
     caseViewTrigger;
     caseDetails;
     queryId;
@@ -21229,6 +21329,7 @@ class QueryCheckYourAnswersComponent {
     attachments;
     errorMessages = [];
     filteredTasks = [];
+    readyToSubmit;
     constructor(route, router, casesService, caseNotifier, workAllocationService, sessionStorageService, qualifyingQuestionService) {
         this.route = route;
         this.router = router;
@@ -21265,6 +21366,7 @@ class QueryCheckYourAnswersComponent {
                         else {
                             this.filteredTasks = response.tasks;
                         }
+                        this.readyToSubmit = true;
                     }
                 },
                 error: (error) => {
@@ -21272,6 +21374,9 @@ class QueryCheckYourAnswersComponent {
                 }
             });
         }
+        else {
+            this.readyToSubmit = true;
+        }
     }
     ngOnDestroy() {
         this.createEventSubscription?.unsubscribe();
@@ -21291,13 +21396,19 @@ class QueryCheckYourAnswersComponent {
                     fieldId: 'field-id'
                 }
             ];
+            window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
             return;
         }
         const data = this.generateCaseQueriesCollectionData();
         const createEvent$ = this.createEvent(data);
         if (this.queryCreateContext === QueryCreateContext.RESPOND) {
             if (this.filteredTasks?.length > 0) {
-                this.createEventSubscription = createEvent$.pipe(switchMap((createEventResponse) => this.workAllocationService.completeTask(this.filteredTasks[0].id, this.caseViewTrigger.name))).subscribe({
+                this.createEventSubscription = createEvent$.pipe(switchMap((createEventResponse) => {
+                    const confirmationBody = createEventResponse?.after_submit_callback_response?.confirmation_body;
+                    const confirmationHeader = createEventResponse?.after_submit_callback_response?.confirmation_header;
+                    this.callbackConfirmationMessage.emit({ body: confirmationBody, header: confirmationHeader });
+                    return this.workAllocationService.completeTask(this.filteredTasks[0].id, this.caseViewTrigger.name);
+                })).subscribe({
                     next: () => this.finaliseSubmission(),
                     error: (error) => this.handleError(error)
                 });
@@ -21311,11 +21422,17 @@ class QueryCheckYourAnswersComponent {
                         fieldId: 'field-id'
                     }
                 ];
+                window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
             }
         }
         else {
             this.createEventSubscription = createEvent$.subscribe({
-                next: () => this.finaliseSubmission(),
+                next: (callbackResponse) => {
+                    this.finaliseSubmission();
+                    const confirmationBody = callbackResponse?.after_submit_callback_response?.confirmation_body;
+                    const confirmationHeader = callbackResponse?.after_submit_callback_response?.confirmation_header;
+                    this.callbackConfirmationMessage.emit({ body: confirmationBody, header: confirmationHeader });
+                },
                 error: (error) => this.handleError(error)
             });
         }
@@ -21476,14 +21593,16 @@ class QueryCheckYourAnswersComponent {
         const candidateFields = this.eventData?.case_fields?.filter((field) => field.field_type.id === this.CASE_QUERIES_COLLECTION_ID &&
             field.field_type.type === this.FIELD_TYPE_COMPLEX &&
             field.display_context !== this.DISPLAY_CONTEXT_READONLY);
-        if (!candidateFields?.length)
+        if (!candidateFields?.length) {
             return undefined;
+        }
         const firstPageFields = this.eventData?.wizard_pages?.[0]?.wizard_page_fields;
-        if (!firstPageFields)
+        if (!firstPageFields) {
             return undefined;
+        }
         return candidateFields
             .map((field) => {
-            const wizardField = firstPageFields.find(f => f.case_field_id === field.id);
+            const wizardField = firstPageFields.find((f) => f.case_field_id === field.id);
             return { field, order: wizardField?.order ?? Number.MAX_SAFE_INTEGER };
         })
             .sort((a, b) => a.order - b.order)[0]?.field;
@@ -21499,77 +21618,15 @@ 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" }, decls: 33, vars: 22, consts: [["defaultCheckYourAnswersTitle", ""], ["isHearingRelatedFalse", ""], [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"], [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"], [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) {
-            const _r1 = i0.ɵɵgetCurrentView();
-            i0.ɵɵelementStart(0, "div", 2)(1, "div", 3);
-            i0.ɵɵtemplate(2, QueryCheckYourAnswersComponent_div_2_Template, 7, 4, "div", 4)(3, QueryCheckYourAnswersComponent_ng_container_3_Template, 4, 3, "ng-container", 5);
-            i0.ɵɵelementStart(4, "h1", 6);
-            i0.ɵɵtemplate(5, QueryCheckYourAnswersComponent_ng_container_5_Template, 3, 3, "ng-container", 7)(6, QueryCheckYourAnswersComponent_ng_template_6_Template, 2, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(8, "div", 8);
-            i0.ɵɵelement(9, "ccd-query-case-details-header", 9);
-            i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(10, QueryCheckYourAnswersComponent_dl_10_Template, 9, 5, "dl", 10);
-            i0.ɵɵelementStart(11, "dl", 11)(12, "div", 12)(13, "dt", 13);
-            i0.ɵɵtext(14);
-            i0.ɵɵpipe(15, "rpxTranslate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(16, "dd", 14);
-            i0.ɵɵtext(17);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(18, "dd", 15)(19, "a", 16);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_a_click_19_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.goBack()); });
-            i0.ɵɵtext(20);
-            i0.ɵɵpipe(21, "rpxTranslate");
-            i0.ɵɵelementEnd()()()();
-            i0.ɵɵtemplate(22, QueryCheckYourAnswersComponent_dl_22_Template, 14, 9, "dl", 10)(23, QueryCheckYourAnswersComponent_dl_23_Template, 11, 7, "dl", 10);
-            i0.ɵɵelement(24, "br");
-            i0.ɵɵelementStart(25, "div")(26, "button", 17);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.goBack()); });
-            i0.ɵɵtext(27);
-            i0.ɵɵpipe(28, "rpxTranslate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(29, "button", 18);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.submit()); });
-            i0.ɵɵtext(30);
-            i0.ɵɵpipe(31, "rpxTranslate");
-            i0.ɵɵelementEnd()()();
-            i0.ɵɵelement(32, "ccd-query-event-completion", 19);
-            i0.ɵɵelementEnd();
+    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"], [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"], [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, 33, 22, "div", 2);
         } if (rf & 2) {
-            let tmp_8_0;
-            const defaultCheckYourAnswersTitle_r9 = i0.ɵɵreference(7);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.errorMessages.length > 0);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.NEW_QUERY);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.RESPOND)("ngIfElse", defaultCheckYourAnswersTitle_r9);
-            i0.ɵɵadvance(4);
-            i0.ɵɵproperty("caseDetails", ctx.caseDetails);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext !== ctx.queryCreateContextEnum.FOLLOWUP);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1(" ", ctx.queryCreateContext === ctx.queryCreateContextEnum.RESPOND ? "Response detail" : i0.ɵɵpipeBind1(15, 14, "Query detail"), " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", (tmp_8_0 = ctx.formGroup.get("body")) == null ? null : tmp_8_0.value, " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(21, 16, "Change"), " ");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.NEW_QUERY);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.formGroup.get("attachments").value.length > 0);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(28, 18, "Previous"), " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(31, 20, "Submit"), " ");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("eventCompletionParams", ctx.eventCompletionParams);
+            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\">\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    <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    <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"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: CasesService }, { type: CaseNotifier }, { type: WorkAllocationService }, { type: SessionStorageService }, { type: QualifyingQuestionService }], { formGroup: [{
             type: Input
         }], queryItem: [{
@@ -21582,6 +21639,8 @@ class QueryCheckYourAnswersComponent {
             type: Output
         }], querySubmitted: [{
             type: Output
+        }], callbackConfirmationMessage: [{
+            type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryCheckYourAnswersComponent, { className: "QueryCheckYourAnswersComponent", filePath: "lib/shared/components/palette/query-management/components/query-check-your-answers/query-check-your-answers.component.ts", lineNumber: 28 }); })();
 
@@ -21717,7 +21776,7 @@ function QueryDetailsComponent_ng_container_0_ng_container_46_ng_container_1_ng_
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 12, "Last response date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(14, 14, child_r3.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(14, 14, child_r3.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r0.isInternalUser());
     i0.ɵɵadvance(3);
@@ -21787,7 +21846,7 @@ function QueryDetailsComponent_ng_container_0_ng_container_46_ng_container_1_ng_
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 13, "Last submission date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(13, 15, child_r3.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(13, 15, child_r3.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(17, 18, "Last submitted by"));
     i0.ɵɵadvance(3);
@@ -21887,7 +21946,7 @@ function QueryDetailsComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(21, 27, "Submission date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(24, 29, ctx_r0.query.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(24, 29, ctx_r0.query.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(28, 32, "Query subject"));
     i0.ɵɵadvance(3);
@@ -21973,7 +22032,7 @@ class QueryDetailsComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailsComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-details', template: "<ng-container *ngIf=\"query\">\n  <cut-alert type=\"error\" *ngIf=\"hasRespondedToQuery() && !showItem\">\n    <ng-container>{{message}}</ng-container>\n  </cut-alert>\n\n  <br/>\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 MMM yyyy' }}</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 MMM yyyy' }}</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 MMM yyyy' }}</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  <cut-alert type=\"error\" *ngIf=\"hasRespondedToQuery() && !showItem\">\n    <ng-container>{{message}}</ng-container>\n  </cut-alert>\n\n  <br/>\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"] }]
     }], () => [{ type: SessionStorageService }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }], { query: [{
             type: Input
         }], caseId: [{
@@ -22061,9 +22120,9 @@ function QueryListComponent_ng_container_0_tr_9_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(message_r6.lastSubmittedBy);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY"));
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY HH:mm"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY"));
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY HH:mm"), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(14, 11, message_r6.responseStatus));
 } }
@@ -22167,7 +22226,7 @@ class QueryListComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryListComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-list', template: "<ng-container *ngIf=\"queryListData\">\n  <table class=\"govuk-table query-list__table\">\n    <caption class=\"govuk-table__caption govuk-table__caption--l query-list__caption\">\n      <div class=\"query-list__caption-text\">{{ queryListData.partyName }}</div>\n    </caption>\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row query-list__row\">\n        <th scope=\"col\" class=\"govuk-table__header\" [attr.aria-sort]=\"getAriaSortHeaderValue(col)\"\n            *ngFor=\"let col of displayedColumns; let i = index;\">\n          <button type=\"button\" [attr.data-index]=\"i\" aria-sort=\"none\" (click)=\"sortTable(col)\" href=\"javascript:void(0)\">\n            {{ col.displayName | rpxTranslate }}\n          </button>\n        </th>\n      </tr>\n    </thead>\n\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row query-list__row\"\n        *ngFor=\"let message of queryListData.queries\"\n    >\n      <td class=\"govuk-table__cell query-list__cell query-list__cell--first\">\n        <a href=\"javascript:void(0)\" (click)=\"showDetails(message)\">{{ message.subject }}</a>\n      </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedBy }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedDate | date: 'dd MMM YYYY' }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastResponseDate | date: 'dd MMM YYYY' }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.responseStatus | rpxTranslate }}</td>\n    </tr>\n    </tbody>\n  </table>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.query-list__row>*:first-child{padding-left:10px}.query-list__row>*:last-child{padding-right:10px}.query-list__cell--first{width:33%}.query-list__table{border:1px solid #b1b4b6;border-top:none}.query-list__caption{background-color:#dee0e2;border:1px solid #b1b4b6;border-bottom:none;font-weight:700;margin-bottom:0;padding:10px}.query-list__caption{font-size:18px}[aria-sort] button,[aria-sort] button:hover,[aria-sort] button:hover:hover{background-color:transparent;border-width:0;-webkit-box-shadow:0 0 0 0;-moz-box-shadow:0 0 0 0;box-shadow:0 0;color:#000;cursor:pointer;font-family:inherit;font-weight:inherit;padding:0 10px 0 0;position:relative;text-align:inherit;font-size:1em;margin:0}[aria-sort] button:focus,[aria-sort] button:hover:focus{background-color:#fd0;color:#000;box-shadow:0 -2px #fd0,0 4px #000;outline:none}[aria-sort]:first-child button{right:auto}[aria-sort] button:before{content:\" \\25bc\";position:absolute;right:-1px;top:9px;font-size:.5em}[aria-sort] button:after{content:\" \\25b2\";position:absolute;right:-1px;top:1px;font-size:.5em}[aria-sort=ascending] button:before,[aria-sort=descending] button:before{content:none}[aria-sort=ascending] button:after{content:\" \\25b2\";font-size:.8em;position:absolute;right:-5px;top:2px}[aria-sort=descending] button:after{content:\" \\25bc\";font-size:.8em;position:absolute;right:-5px;top:2px}\n"] }]
+        args: [{ selector: 'ccd-query-list', template: "<ng-container *ngIf=\"queryListData\">\n  <table class=\"govuk-table query-list__table\">\n    <caption class=\"govuk-table__caption govuk-table__caption--l query-list__caption\">\n      <div class=\"query-list__caption-text\">{{ queryListData.partyName }}</div>\n    </caption>\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row query-list__row\">\n        <th scope=\"col\" class=\"govuk-table__header\" [attr.aria-sort]=\"getAriaSortHeaderValue(col)\"\n            *ngFor=\"let col of displayedColumns; let i = index;\">\n          <button type=\"button\" [attr.data-index]=\"i\" aria-sort=\"none\" (click)=\"sortTable(col)\" href=\"javascript:void(0)\">\n            {{ col.displayName | rpxTranslate }}\n          </button>\n        </th>\n      </tr>\n    </thead>\n\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row query-list__row\"\n        *ngFor=\"let message of queryListData.queries\"\n    >\n      <td class=\"govuk-table__cell query-list__cell query-list__cell--first\">\n        <a href=\"javascript:void(0)\" (click)=\"showDetails(message)\">{{ message.subject }}</a>\n      </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedBy }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedDate | date: 'dd MMM YYYY HH:mm' }} </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastResponseDate | date: 'dd MMM YYYY HH:mm' }} </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.responseStatus | rpxTranslate }}</td>\n    </tr>\n    </tbody>\n  </table>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.query-list__row>*:first-child{padding-left:10px}.query-list__row>*:last-child{padding-right:10px}.query-list__cell--first{width:33%}.query-list__table{border:1px solid #b1b4b6;border-top:none}.query-list__caption{background-color:#dee0e2;border:1px solid #b1b4b6;border-bottom:none;font-weight:700;margin-bottom:0;padding:10px}.query-list__caption{font-size:18px}[aria-sort] button,[aria-sort] button:hover,[aria-sort] button:hover:hover{background-color:transparent;border-width:0;-webkit-box-shadow:0 0 0 0;-moz-box-shadow:0 0 0 0;box-shadow:0 0;color:#000;cursor:pointer;font-family:inherit;font-weight:inherit;padding:0 10px 0 0;position:relative;text-align:inherit;font-size:1em;margin:0}[aria-sort] button:focus,[aria-sort] button:hover:focus{background-color:#fd0;color:#000;box-shadow:0 -2px #fd0,0 4px #000;outline:none}[aria-sort]:first-child button{right:auto}[aria-sort] button:before{content:\" \\25bc\";position:absolute;right:-1px;top:9px;font-size:.5em}[aria-sort] button:after{content:\" \\25b2\";position:absolute;right:-1px;top:1px;font-size:.5em}[aria-sort=ascending] button:before,[aria-sort=descending] button:before{content:none}[aria-sort=ascending] button:after{content:\" \\25b2\";font-size:.8em;position:absolute;right:-5px;top:2px}[aria-sort=descending] button:after{content:\" \\25bc\";font-size:.8em;position:absolute;right:-5px;top:2px}\n"] }]
     }], null, { caseQueriesCollection: [{
             type: Input
         }], selectedQuery: [{
@@ -22718,7 +22777,7 @@ class QueryWriteRespondToQueryComponent {
                 const matchingMessage = filteredMessages[0]?.value;
                 let filteredQuery = [];
                 if (this.queryItemId === QueryWriteRespondToQueryComponent.QUERY_ITEM_RESPOND) {
-                    filteredQuery = queryWithChildren?.queries.filter((message) => filteredMessages[0]?.value?.parentId === message?.id);
+                    filteredQuery = queryWithChildren?.queries.filter((message) => filteredMessages[0]?.value?.id === message?.id);
                     if (matchingMessage) {
                         this.queryItemDisplay = new QueryListItem();
                         Object.assign(this.queryItemDisplay, matchingMessage);
@@ -22793,27 +22852,25 @@ function QueryConfirmationComponent_main_0_ng_container_3_Template(rf, ctx) { if
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(5, "div", 7);
-    i0.ɵɵtext(6);
+    i0.ɵɵelement(6, "ccd-markdown", 8);
     i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 8)(9, "h3", 9);
+    i0.ɵɵelementStart(8, "div", 9)(9, "h3", 10);
     i0.ɵɵtext(10);
     i0.ɵɵpipe(11, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "p");
-    i0.ɵɵtext(13);
-    i0.ɵɵpipe(14, "rpxTranslate");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "p");
-    i0.ɵɵtext(16);
-    i0.ɵɵpipe(17, "rpxTranslate");
+    i0.ɵɵelement(12, "ccd-markdown", 8);
+    i0.ɵɵpipe(13, "rpxTranslate");
+    i0.ɵɵelementStart(14, "p");
+    i0.ɵɵtext(15);
+    i0.ɵɵpipe(16, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(18, "p");
-    i0.ɵɵtext(19);
-    i0.ɵɵpipe(20, "rpxTranslate");
-    i0.ɵɵelementStart(21, "a", 10);
-    i0.ɵɵtext(22);
-    i0.ɵɵpipe(23, "rpxTranslate");
+    i0.ɵɵelementStart(17, "p");
+    i0.ɵɵtext(18);
+    i0.ɵɵpipe(19, "rpxTranslate");
+    i0.ɵɵelementStart(20, "a", 11);
+    i0.ɵɵtext(21);
+    i0.ɵɵpipe(22, "rpxTranslate");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -22821,19 +22878,19 @@ function QueryConfirmationComponent_main_0_ng_container_3_Template(rf, ctx) { if
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 9, "Query submitted"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 11, "Your query has been sent to HMCTS"));
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(7, 11, ctx_r0.callbackConfirmationMessageText == null ? null : ctx_r0.callbackConfirmationMessageText.header));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 13, "What happens next"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(13, 15, ctx_r0.callbackConfirmationMessageText == null ? null : ctx_r0.callbackConfirmationMessageText.body));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(14, 15, "Our team will read your query and will respond"));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(17, 17, "When the response is available it will be added to the 'Queries' section."));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(16, 17, "When the response is available it will be added to the 'Queries' section."));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(20, 19, "You can"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(19, 19, "You can"), " ");
     i0.ɵɵadvance(2);
     i0.ɵɵpropertyInterpolate1("routerLink", "/cases/case-details/", ctx_r0.caseId, "");
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(23, 21, "Go back to the case"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 21, "Go back to the case"));
 } }
 function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -22841,19 +22898,19 @@ function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 7);
+    i0.ɵɵelementStart(5, "div", 12);
     i0.ɵɵtext(6);
     i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 8);
+    i0.ɵɵelementStart(8, "div", 9);
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
-    i0.ɵɵelementStart(11, "a", 11);
+    i0.ɵɵelementStart(11, "a", 13);
     i0.ɵɵtext(12);
     i0.ɵɵpipe(13, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(14, " or ");
-    i0.ɵɵelementStart(15, "a", 12);
+    i0.ɵɵelementStart(15, "a", 14);
     i0.ɵɵtext(16);
     i0.ɵɵpipe(17, "rpxTranslate");
     i0.ɵɵelementEnd()();
@@ -22877,7 +22934,7 @@ function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if
 } }
 function QueryConfirmationComponent_main_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "main", 1)(1, "div", 2)(2, "div", 3);
-    i0.ɵɵtemplate(3, QueryConfirmationComponent_main_0_ng_container_3_Template, 24, 23, "ng-container", 4)(4, QueryConfirmationComponent_main_0_ng_container_4_Template, 18, 19, "ng-container", 4);
+    i0.ɵɵtemplate(3, QueryConfirmationComponent_main_0_ng_container_3_Template, 23, 23, "ng-container", 4)(4, QueryConfirmationComponent_main_0_ng_container_4_Template, 18, 19, "ng-container", 4);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -22889,6 +22946,7 @@ function QueryConfirmationComponent_main_0_Template(rf, ctx) { if (rf & 1) {
 class QueryConfirmationComponent {
     route;
     queryCreateContext;
+    callbackConfirmationMessageText = {};
     caseId = '';
     queryCreateContextEnum = QueryCreateContext;
     constructor(route) {
@@ -22898,17 +22956,19 @@ class QueryConfirmationComponent {
         this.caseId = this.route.snapshot.params.cid;
     }
     static ɵfac = function QueryConfirmationComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryConfirmationComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryConfirmationComponent, selectors: [["ccd-query-confirmation"]], inputs: { queryCreateContext: "queryCreateContext" }, decls: 1, vars: 1, consts: [["class", "govuk-main-wrapper", 4, "ngIf"], [1, "govuk-main-wrapper"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds"], [4, "ngIf"], [1, "govuk-panel", "govuk-panel--confirmation"], [1, "govuk-panel__title"], [1, "govuk-panel__body"], [1, "govuk-body"], [1, "govuk-heading-s"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "tasks-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "case-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"]], template: function QueryConfirmationComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryConfirmationComponent, selectors: [["ccd-query-confirmation"]], inputs: { queryCreateContext: "queryCreateContext", callbackConfirmationMessageText: "callbackConfirmationMessageText" }, decls: 1, vars: 1, consts: [["class", "govuk-main-wrapper", 4, "ngIf"], [1, "govuk-main-wrapper"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds"], [4, "ngIf"], [1, "govuk-panel", "govuk-panel--confirmation"], [1, "govuk-panel__title"], [1, "qm-confirmation", "govuk-panel__body"], [3, "content"], [1, "govuk-body"], [1, "govuk-heading-s"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], [1, "govuk-panel__body"], ["id", "tasks-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "case-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"]], template: function QueryConfirmationComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, QueryConfirmationComponent_main_0_Template, 5, 2, "main", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.queryCreateContext);
-        } }, dependencies: [i5.NgIf, i1$1.RouterLink, i1.RpxTranslatePipe], encapsulation: 2 });
+        } }, dependencies: [i5.NgIf, i1$1.RouterLink, MarkdownComponent, i1.RpxTranslatePipe], encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryConfirmationComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-confirmation', template: "<main class=\"govuk-main-wrapper\" *ngIf=\"queryCreateContext\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY || queryCreateContext === queryCreateContextEnum.FOLLOWUP\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'Your query has been sent to HMCTS' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          <h3 class=\"govuk-heading-s\">{{'What happens next' | rpxTranslate}}</h3>\n          <p>{{'Our team will read your query and will respond' | rpxTranslate}}</p>\n          <p>{{'When the response is available it will be added to the \\'Queries\\' section.' | rpxTranslate}}</p>\n          <p>\n            {{'You can' | rpxTranslate}}\n            <a class=\"govuk-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n          </p>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query response submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'This query response has been added to the case' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          {{'You can' | rpxTranslate}}\n          <a class=\"govuk-link\" id=\"tasks-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}/tasks\">{{'return to tasks' | rpxTranslate}}</a> or\n          <a class=\"govuk-link\" id=\"case-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</main>\n" }]
+        args: [{ selector: 'ccd-query-confirmation', template: "<main class=\"govuk-main-wrapper\" *ngIf=\"queryCreateContext\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY || queryCreateContext === queryCreateContextEnum.FOLLOWUP\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query submitted' | rpxTranslate}}</h1>\n          <div class=\"qm-confirmation govuk-panel__body\">\n            <ccd-markdown [content]=\"callbackConfirmationMessageText?.header | rpxTranslate\"></ccd-markdown>\n          </div>\n        </div>\n        <div class=\"govuk-body\">\n          <h3 class=\"govuk-heading-s\">{{'What happens next' | rpxTranslate}}</h3>\n          <ccd-markdown [content]=\"callbackConfirmationMessageText?.body | rpxTranslate\"></ccd-markdown>\n          <p>{{'When the response is available it will be added to the \\'Queries\\' section.' | rpxTranslate}}</p>\n          <p>\n            {{'You can' | rpxTranslate}}\n            <a class=\"govuk-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n          </p>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query response submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'This query response has been added to the case' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          {{'You can' | rpxTranslate}}\n          <a class=\"govuk-link\" id=\"tasks-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}/tasks\">{{'return to tasks' | rpxTranslate}}</a> or\n          <a class=\"govuk-link\" id=\"case-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</main>\n" }]
     }], () => [{ type: i1$1.ActivatedRoute }], { queryCreateContext: [{
             type: Input
+        }], callbackConfirmationMessageText: [{
+            type: Input
         }] }); })();
 (() => { (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 }); })();
 
@@ -22968,7 +23028,7 @@ function ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_ng_templ
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Your query is under review"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, "Our team will read your query and will respond. Do not submit the same query more than once."));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, "Our team will read your query and respond. Do not submit the same query more than once."));
 } }
 function ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -23054,7 +23114,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 will 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()\">\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" }]
     }], () => [{ 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 }); })();
 
@@ -24019,7 +24079,7 @@ class CaseFileViewOverlayMenuComponent {
             const trigger_r5 = i0.ɵɵreference(2);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("cdkConnectedOverlayOrigin", trigger_r5)("cdkConnectedOverlayOpen", ctx.isOpen)("cdkConnectedOverlayHasBackdrop", true)("cdkConnectedOverlayBackdropClass", "cdk-overlay-transparent-backdrop");
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$1.CdkConnectedOverlay, i2$1.CdkOverlayOrigin], styles: [".overlay-toggle[_ngcontent-%COMP%]{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu[_ngcontent-%COMP%]{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title[_ngcontent-%COMP%], .overlay-menu__item[_ngcontent-%COMP%]{padding:10px;border-bottom:1px solid grey}.overlay-menu__title[_ngcontent-%COMP%]:last-child, .overlay-menu__item[_ngcontent-%COMP%]:last-child{border:none}.overlay-menu__title[_ngcontent-%COMP%]{padding-left:6px;padding-right:6px}.overlay-menu__item[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item[_ngcontent-%COMP%]:hover{background-color:#fff2cc}.overlay-menu__item[_ngcontent-%COMP%]:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon[_ngcontent-%COMP%]{height:1.25em;width:1.25em;margin-right:6px}"] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$2.CdkConnectedOverlay, i2$2.CdkOverlayOrigin], styles: [".overlay-toggle[_ngcontent-%COMP%]{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu[_ngcontent-%COMP%]{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title[_ngcontent-%COMP%], .overlay-menu__item[_ngcontent-%COMP%]{padding:10px;border-bottom:1px solid grey}.overlay-menu__title[_ngcontent-%COMP%]:last-child, .overlay-menu__item[_ngcontent-%COMP%]:last-child{border:none}.overlay-menu__title[_ngcontent-%COMP%]{padding-left:6px;padding-right:6px}.overlay-menu__item[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item[_ngcontent-%COMP%]:hover{background-color:#fff2cc}.overlay-menu__item[_ngcontent-%COMP%]:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon[_ngcontent-%COMP%]{height:1.25em;width:1.25em;margin-right:6px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewOverlayMenuComponent, [{
         type: Component,
@@ -29738,7 +29798,7 @@ class MarkdownComponentModule {
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MarkdownComponentModule, { declarations: [MarkdownComponent,
         RouterLinkComponent], imports: [CommonModule,
-        ReactiveFormsModule, i1.RpxTranslationModule, PipesModule, i1$4.MarkdownModule, RouterModule], exports: [MarkdownComponent,
+        ReactiveFormsModule, i1.RpxTranslationModule, PipesModule, i2$1.MarkdownModule, RouterModule], exports: [MarkdownComponent,
         RouterLinkComponent] }); })();
 
 class FeeValue {
@@ -30559,7 +30619,7 @@ class PaletteModule {
         BodyModule,
         FormModule,
         TabsModule,
-        LabelSubstitutorModule, i1$4.MarkdownModule, NgxMatDatetimePickerModule,
+        LabelSubstitutorModule, i2$1.MarkdownModule, NgxMatDatetimePickerModule,
         NgxMatTimepickerModule,
         NgxMatNativeDateModule,
         MatLegacyFormFieldModule,
@@ -30733,7 +30793,7 @@ i0.ɵɵsetComponentScope(ReadLinkedCasesFieldComponent, function () { return [i5
 i0.ɵɵsetComponentScope(WriteAddressFieldComponent, function () { return [i5.NgClass, i5.NgForOf, i5.NgIf, i4.NgSelectOption, i4.ɵNgSelectMultipleOption, i4.DefaultValueAccessor, i4.SelectControlValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormControlDirective, i4.FormGroupDirective, WriteComplexFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(WriteComplexFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i4.NgControlStatusGroup, i4.FormGroupDirective, LabelSubstitutorDirective, FieldReadComponent,
     FieldWriteComponent]; }, function () { return [FieldLabelPipe, IsReadOnlyPipe]; });
-i0.ɵɵsetComponentScope(WriteDocumentFieldComponent, function () { return [i5.NgClass, i5.NgIf, i1$4.MarkdownComponent, ReadDocumentFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(WriteDocumentFieldComponent, function () { return [i5.NgClass, i5.NgIf, i2$1.MarkdownComponent, ReadDocumentFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(WriteDateContainerFieldComponent, function () { return [i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, DatetimePickerComponent,
     WriteDateFieldComponent]; }, []);
 i0.ɵɵsetComponentScope(WriteCaseFlagFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i4.NgControlStatusGroup, i4.FormGroupDirective, SelectFlagTypeComponent,
@@ -30753,7 +30813,7 @@ i0.ɵɵsetComponentScope(WriteOrganisationFieldComponent, function () { return [
 i0.ɵɵsetComponentScope(WriteOrderSummaryFieldComponent, function () { return [ReadOrderSummaryFieldComponent]; }, []);
 i0.ɵɵsetComponentScope(WriteDateContainerFieldComponent, function () { return [i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, DatetimePickerComponent,
     WriteDateFieldComponent]; }, []);
-i0.ɵɵsetComponentScope(WriteCollectionFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, i1$4.MarkdownComponent, FieldWriteComponent]; }, function () { return [FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(WriteCollectionFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, MarkdownComponent, FieldWriteComponent]; }, function () { return [FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(
 // ComponentLauncher web components
 CaseFileViewFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i14.MediaViewerComponent, CaseFileViewFolderComponent]; }, []);
@@ -32154,7 +32214,7 @@ class PaginationComponent {
             i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 4, "Pagination"));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", !(ctx.autoHide && p_r3.pages.length <= 1));
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$2.PaginationControlsDirective, i5.DecimalPipe, i1.RpxTranslatePipe], styles: [".ngx-pagination[_ngcontent-%COMP%]{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.ngx-pagination[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]:after{content:\" \";display:table}.ngx-pagination[_ngcontent-%COMP%]:after{clear:both}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;margin-right:.0625rem;border-radius:0}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover, .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background:#e6e6e6}.ngx-pagination[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%]{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900;text-decoration:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]{display:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]:hover{background:transparent}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{cursor:pointer}.ngx-pagination[_ngcontent-%COMP%]   .pagination-previous[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]   .pagination-previous.disabled[_ngcontent-%COMP%]:before{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination[_ngcontent-%COMP%]   .pagination-next[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:after, .ngx-pagination[_ngcontent-%COMP%]   .pagination-next.disabled[_ngcontent-%COMP%]:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.ngx-pagination[_ngcontent-%COMP%]   .show-for-sr[_ngcontent-%COMP%]{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.ngx-pagination[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:none}@media screen and (max-width: 601px){.ngx-pagination.responsive[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination.responsive[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.small-screen):not(.pagination-previous):not(.pagination-next){display:none}}"] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$3.PaginationControlsDirective, i5.DecimalPipe, i1.RpxTranslatePipe], styles: [".ngx-pagination[_ngcontent-%COMP%]{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.ngx-pagination[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]:after{content:\" \";display:table}.ngx-pagination[_ngcontent-%COMP%]:after{clear:both}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;margin-right:.0625rem;border-radius:0}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover, .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background:#e6e6e6}.ngx-pagination[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%]{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900;text-decoration:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]{display:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]:hover{background:transparent}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{cursor:pointer}.ngx-pagination[_ngcontent-%COMP%]   .pagination-previous[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]   .pagination-previous.disabled[_ngcontent-%COMP%]:before{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination[_ngcontent-%COMP%]   .pagination-next[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:after, .ngx-pagination[_ngcontent-%COMP%]   .pagination-next.disabled[_ngcontent-%COMP%]:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.ngx-pagination[_ngcontent-%COMP%]   .show-for-sr[_ngcontent-%COMP%]{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.ngx-pagination[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:none}@media screen and (max-width: 601px){.ngx-pagination.responsive[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination.responsive[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.small-screen):not(.pagination-previous):not(.pagination-next){display:none}}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PaginationComponent, [{
         type: Component,
@@ -32500,7 +32560,7 @@ class CaseListComponent {
             i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind2(10, 10, ctx.cases, i0.ɵɵpureFunction3(13, _c0$c, ctx.pageSize, ctx.currentPageNo, ctx.totalResultsCount)));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.totalResultsCount > ctx.pageSize);
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i5.NgSwitchDefault, i1$1.RouterLink, PaginationComponent, i5.CurrencyPipe, i2$2.PaginatePipe, i1.RpxTranslatePipe] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i5.NgSwitchDefault, i1$1.RouterLink, PaginationComponent, i5.CurrencyPipe, i2$3.PaginatePipe, i1.RpxTranslatePipe] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseListComponent, [{
         type: Component,
@@ -39575,7 +39635,7 @@ class SearchResultModule {
         PipesModule,
         ActivityModule,
         PaginationModule, i1.RpxTranslationModule, PaletteModule], exports: [SearchResultComponent] }); })();
-i0.ɵɵsetComponentScope(SearchResultComponent, function () { return [i5.NgForOf, i5.NgIf, i1$1.RouterLink, LabelSubstitutorDirective, ActivityComponent, PaginationComponent, FieldReadComponent]; }, function () { return [i5.DecimalPipe, i2$2.PaginatePipe, CaseReferencePipe, SortSearchResultPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(SearchResultComponent, function () { return [i5.NgForOf, i5.NgIf, i1$1.RouterLink, LabelSubstitutorDirective, ActivityComponent, PaginationComponent, FieldReadComponent]; }, function () { return [i5.DecimalPipe, i2$3.PaginatePipe, CaseReferencePipe, SortSearchResultPipe, i1.RpxTranslatePipe]; });
 
 // tslint:disable:variable-name
 class ComplexFieldOverride {