@hmcts/ccd-case-ui-toolkit 7.1.56 → 7.1.57

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, Input, EventEmitter, Output, NgModule, ViewEncapsulation, forwardRef, Pipe, ViewChildren, ContentChildren, Injectable, Inject, ChangeDetectorRef, Directive, InjectionToken, ViewChild, HostListener, Injector, ViewContainerRef, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { Component, Input, EventEmitter, Output, NgModule, ViewEncapsulation, forwardRef, Pipe, ViewChildren, ContentChildren, Injectable, Inject, ChangeDetectorRef, Directive, InjectionToken, ViewChild, ChangeDetectionStrategy, Injector, ViewContainerRef, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i5 from '@angular/common';
 import { CommonModule, DOCUMENT, AsyncPipe, CurrencyPipe, formatDate } from '@angular/common';
 import * as i1 from 'rpx-xui-translation';
@@ -170,11 +170,10 @@ function HeaderBarComponent_div_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div")(1, "a", 12);
     i0.ɵɵelement(2, "img", 13);
     i0.ɵɵtext(3);
-    i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 1, "GOV.UK"), " ");
+    i0.ɵɵtextInterpolate1(" ", "GOV.UK", " ");
 } }
 function HeaderBarComponent_div_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 14)(1, "div", 15)(2, "span");
@@ -210,7 +209,7 @@ class HeaderBarComponent {
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: HeaderBarComponent, selectors: [["cut-header-bar"]], inputs: { title: "title", isSolicitor: "isSolicitor", username: "username" }, outputs: { signOutRequest: "signOutRequest" }, ngContentSelectors: _c1$t, decls: 17, vars: 14, consts: [["role", "banner", "id", "global-header", 1, "with-proposition"], [1, "header-wrapper"], [1, "header-global"], [4, "ngIf"], ["class", "global-header", 4, "ngIf"], [1, "header-proposition"], [1, "content"], ["href", "#proposition-links", 1, "js-header-toggle", "menu"], ["id", "proposition-menu", 4, "ngIf"], [1, "proposition-right"], ["id", "user-name"], ["id", "sign-out", "href", "javascript:void(0)", 3, "click"], ["href", "https://www.gov.uk", "title", "Go to the GOV.UK homepage", "id", "logo", 1, "content", 2, "margin-left", "0px"], ["src", "/img/gov.uk_logotype_crown_invert_trans.png?0.23.0", "width", "36", "height", "32", "alt", ""], [1, "global-header"], [1, "title"], ["id", "proposition-menu"], [1, "title-solicitor"], ["id", "proposition-name"]], template: function HeaderBarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c0$15);
             i0.ɵɵelementStart(0, "header", 0)(1, "div", 1)(2, "div", 2);
-            i0.ɵɵtemplate(3, HeaderBarComponent_div_3_Template, 5, 3, "div", 3)(4, HeaderBarComponent_div_4_Template, 5, 3, "div", 4);
+            i0.ɵɵtemplate(3, HeaderBarComponent_div_3_Template, 4, 1, "div", 3)(4, HeaderBarComponent_div_4_Template, 5, 3, "div", 4);
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(5, "div", 5)(6, "div", 6)(7, "a", 7);
             i0.ɵɵtext(8);
@@ -246,7 +245,7 @@ class HeaderBarComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(HeaderBarComponent, [{
         type: Component,
-        args: [{ selector: 'cut-header-bar', template: "<header role=\"banner\" id=\"global-header\" class=\"with-proposition\">\n  <div [class.full-screen]=\"!isSolicitor\" class=\"header-wrapper\">\n\n    <div class=\"header-global\" [class.header-logo]=\"isSolicitor\">\n      <div *ngIf=\"isSolicitor\">\n        <a href=\"https://www.gov.uk\" title=\"Go to the GOV.UK homepage\" id=\"logo\" class=\"content\" style=\"margin-left: 0px;\">\n          <img src=\"/img/gov.uk_logotype_crown_invert_trans.png?0.23.0\" width=\"36\" height=\"32\" alt=\"\"> {{'GOV.UK' | rpxTranslate}}\n        </a>\n      </div>\n      <div class=\"global-header\" *ngIf=\"!isSolicitor\">\n        <div class=\"title\">\n          <span>{{title | rpxTranslate}}</span>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"header-proposition\">\n      <div class=\"content\">\n        <a href=\"#proposition-links\" class=\"js-header-toggle menu\">{{'Menu' | rpxTranslate}}</a>\n        <div *ngIf=\"isSolicitor\" id=\"proposition-menu\">\n          <div class=\"title-solicitor\">\n            <span id=\"proposition-name\">{{title | rpxTranslate}}</span>\n            <ng-content select=\"[headerNavigation]\"></ng-content>\n          </div>\n        </div>\n\n        <div class=\"proposition-right\">\n          <span id=\"user-name\">{{username}}</span>\n          <a (click)=\"signOut()\" id=\"sign-out\" href=\"javascript:void(0)\">{{'Sign Out' | rpxTranslate}}</a>\n        </div>\n      </div>\n    </div>\n\n  </div>\n</header>\n", styles: [".title:after,.global-header .header-username:after,.global-header .header-title:after,.global-header:after{content:\"\";display:block;clear:both}.global-header{background-color:#000;width:100%}.global-header .header-title{font-family:nta,Arial,sans-serif;text-transform:none;font-size:16pt;line-height:1.25;float:left;font-weight:700;color:#fff;position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 641px){.global-header .header-title{font-size:20pt;line-height:1.3}}@media (min-width: 769px){.global-header .header-title{width:50%}}@media screen and (max-width: 379px){.global-header .header-title{width:auto;float:none}}.global-header .header-title .header-title-span{padding-left:22px}.global-header .header-username{font-family:nta,Arial,sans-serif;font-weight:400;text-transform:none;font-size:12pt;line-height:1.25;float:right;text-align:right;color:#fff;position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 641px){.global-header .header-username{font-size:14pt;line-height:1.4285714286}}@media (min-width: 769px){.global-header .header-username{width:50%}}.global-header .header-username .header-username-span{padding-right:15px}#global-header .full-screen{max-width:100%}.title{font-weight:700;color:#fff;font-size:24px}.title-solicitor{float:left}.proposition-right{float:right;padding-top:5px}#global-header.with-proposition .header-wrapper .header-logo{width:27%}#global-header.with-proposition .header-wrapper .header-proposition{width:100%;float:none}#global-header.with-proposition .header-wrapper .header-proposition .content{margin:0}#user-name,#sign-out{font-size:16px;font-weight:700;border:none;color:#fff;margin:0 0 0 9px;text-decoration:none;background-color:#000}#user-name:focus,#sign-out:focus{color:#fff}#sign-out:hover{text-decoration:underline}\n"] }]
+        args: [{ selector: 'cut-header-bar', template: "<header role=\"banner\" id=\"global-header\" class=\"with-proposition\">\n  <div [class.full-screen]=\"!isSolicitor\" class=\"header-wrapper\">\n\n    <div class=\"header-global\" [class.header-logo]=\"isSolicitor\">\n      <div *ngIf=\"isSolicitor\">\n        <a href=\"https://www.gov.uk\" title=\"Go to the GOV.UK homepage\" id=\"logo\" class=\"content\" style=\"margin-left: 0px;\">\n          <img src=\"/img/gov.uk_logotype_crown_invert_trans.png?0.23.0\" width=\"36\" height=\"32\" alt=\"\"> {{'GOV.UK'}}\n        </a>\n      </div>\n      <div class=\"global-header\" *ngIf=\"!isSolicitor\">\n        <div class=\"title\">\n          <span>{{title | rpxTranslate}}</span>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"header-proposition\">\n      <div class=\"content\">\n        <a href=\"#proposition-links\" class=\"js-header-toggle menu\">{{'Menu' | rpxTranslate}}</a>\n        <div *ngIf=\"isSolicitor\" id=\"proposition-menu\">\n          <div class=\"title-solicitor\">\n            <span id=\"proposition-name\">{{title | rpxTranslate}}</span>\n            <ng-content select=\"[headerNavigation]\"></ng-content>\n          </div>\n        </div>\n\n        <div class=\"proposition-right\">\n          <span id=\"user-name\">{{username}}</span>\n          <a (click)=\"signOut()\" id=\"sign-out\" href=\"javascript:void(0)\">{{'Sign Out' | rpxTranslate}}</a>\n        </div>\n      </div>\n    </div>\n\n  </div>\n</header>\n", styles: [".title:after,.global-header .header-username:after,.global-header .header-title:after,.global-header:after{content:\"\";display:block;clear:both}.global-header{background-color:#000;width:100%}.global-header .header-title{font-family:nta,Arial,sans-serif;text-transform:none;font-size:16pt;line-height:1.25;float:left;font-weight:700;color:#fff;position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 641px){.global-header .header-title{font-size:20pt;line-height:1.3}}@media (min-width: 769px){.global-header .header-title{width:50%}}@media screen and (max-width: 379px){.global-header .header-title{width:auto;float:none}}.global-header .header-title .header-title-span{padding-left:22px}.global-header .header-username{font-family:nta,Arial,sans-serif;font-weight:400;text-transform:none;font-size:12pt;line-height:1.25;float:right;text-align:right;color:#fff;position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}@media (min-width: 641px){.global-header .header-username{font-size:14pt;line-height:1.4285714286}}@media (min-width: 769px){.global-header .header-username{width:50%}}.global-header .header-username .header-username-span{padding-right:15px}#global-header .full-screen{max-width:100%}.title{font-weight:700;color:#fff;font-size:24px}.title-solicitor{float:left}.proposition-right{float:right;padding-top:5px}#global-header.with-proposition .header-wrapper .header-logo{width:27%}#global-header.with-proposition .header-wrapper .header-proposition{width:100%;float:none}#global-header.with-proposition .header-wrapper .header-proposition .content{margin:0}#user-name,#sign-out{font-size:16px;font-weight:700;border:none;color:#fff;margin:0 0 0 9px;text-decoration:none;background-color:#000}#user-name:focus,#sign-out:focus{color:#fff}#sign-out:hover{text-decoration:underline}\n"] }]
     }], null, { title: [{
             type: Input
         }], isSolicitor: [{
@@ -1275,6 +1274,7 @@ class CaseEditorConfig {
     document_management_url_v2;
     hrs_url;
     document_management_secure_enabled;
+    documentSecureModeCaseTypeExclusions;
     login_url;
     oauth2_client_id;
     postcode_lookup_url;
@@ -3278,6 +3278,7 @@ class CaseField {
     wizardProps;
     _value;
     _list_items = [];
+    isTranslatedFlag = false;
     get value() {
         if (this.field_type && (this.field_type.type === 'DynamicList' || this.field_type.type === 'DynamicRadioList')) {
             return this._value && this._value.value ? this._value.value.code : this._value;
@@ -3383,6 +3384,12 @@ class CaseField {
         }
         return null;
     }
+    set isTranslated(val) {
+        this.isTranslatedFlag = val;
+    }
+    get isTranslated() {
+        return this.isTranslatedFlag;
+    }
 }
 __decorate([
     Type(() => FieldType),
@@ -3860,6 +3867,11 @@ class FieldsUtils {
             || ctx === 'OPTIONAL' || ctx === 'HIDDEN'
             || ctx === 'COMPLEX');
     }
+    static isTranslatable(fieldType) {
+        if (fieldType.type === 'Label' || fieldType.type === 'FixedList') {
+            return true;
+        }
+    }
     static convertToCaseField(obj) {
         if (!(obj instanceof CaseField)) {
             return plainToClassFromExist(new CaseField(), obj);
@@ -5053,6 +5065,9 @@ class AbstractFormFieldComponent {
     id() {
         return this.idPrefix + this.caseField.id;
     }
+    isTranslatable(field) {
+        return FieldsUtils.isTranslatable(field.field_type);
+    }
     registerControl(control, replace = false) {
         const container = this.parent || this.formGroup;
         if (!container) {
@@ -6324,6 +6339,7 @@ class FormValueService {
         type: Injectable
     }], () => [{ type: FieldTypeSanitiser }], null); })();
 
+// This class implements ccd Field Interpolation
 // @dynamic
 class PlaceholderService {
     resolvePlaceholders(pageFormFields, stringToResolve) {
@@ -6535,15 +6551,17 @@ ___
 class LabelSubstitutorDirective {
     fieldsUtils;
     placeholderService;
+    rpxTranslationPipe;
     caseField;
     contextFields = [];
     formGroup;
     elementsToSubstitute = ['label', 'hint_text'];
     initialLabel;
     initialHintText;
-    constructor(fieldsUtils, placeholderService) {
+    constructor(fieldsUtils, placeholderService, rpxTranslationPipe) {
         this.fieldsUtils = fieldsUtils;
         this.placeholderService = placeholderService;
+        this.rpxTranslationPipe = rpxTranslationPipe;
     }
     ngOnInit() {
         this.initialLabel = this.caseField.label;
@@ -6551,7 +6569,23 @@ class LabelSubstitutorDirective {
         this.formGroup = this.formGroup || new FormGroup({});
         const fields = this.getReadOnlyAndFormFields();
         if (this.shouldSubstitute('label')) {
-            this.caseField.label = this.resolvePlaceholders(fields, this.caseField.label);
+            const oldLabel = this.caseField.label;
+            const substitutedLabel = this.resolvePlaceholders(fields, this.caseField.label);
+            if (oldLabel && oldLabel !== substitutedLabel) {
+                console.log(`placeholders present: ${oldLabel} -> ${substitutedLabel}`);
+                // we need to translate the uninterpolated data then substitute the values in translated string
+                const translated = this.rpxTranslationPipe.transform(oldLabel);
+                console.log(`translated: ${translated}`);
+                const transSubstitutedLabel = this.resolvePlaceholders(fields, translated);
+                console.log(`translated and substituted: ${transSubstitutedLabel}`);
+                this.caseField.label = transSubstitutedLabel;
+                this.caseField.isTranslated = true;
+            }
+            else {
+                console.log(`no placeholders present: ${oldLabel}`);
+                this.caseField.label = substitutedLabel;
+                this.caseField.isTranslated = false;
+            }
         }
         if (this.shouldSubstitute('hint_text')) {
             this.caseField.hint_text = this.resolvePlaceholders(fields, this.caseField.hint_text);
@@ -6593,13 +6627,13 @@ class LabelSubstitutorDirective {
     resolvePlaceholders(fields, stringToResolve) {
         return this.placeholderService.resolvePlaceholders(fields, stringToResolve);
     }
-    static ɵfac = function LabelSubstitutorDirective_Factory(t) { return new (t || LabelSubstitutorDirective)(i0.ɵɵdirectiveInject(FieldsUtils), i0.ɵɵdirectiveInject(PlaceholderService)); };
+    static ɵfac = function LabelSubstitutorDirective_Factory(t) { return new (t || LabelSubstitutorDirective)(i0.ɵɵdirectiveInject(FieldsUtils), i0.ɵɵdirectiveInject(PlaceholderService), i0.ɵɵdirectiveInject(i1.RpxTranslatePipe)); };
     static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: LabelSubstitutorDirective, selectors: [["", "ccdLabelSubstitutor", ""]], inputs: { caseField: "caseField", contextFields: "contextFields", formGroup: "formGroup", elementsToSubstitute: "elementsToSubstitute" } });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LabelSubstitutorDirective, [{
         type: Directive,
         args: [{ selector: '[ccdLabelSubstitutor]' }]
-    }], () => [{ type: FieldsUtils }, { type: PlaceholderService }], { caseField: [{
+    }], () => [{ type: FieldsUtils }, { type: PlaceholderService }, { type: i1.RpxTranslatePipe }], { caseField: [{
             type: Input
         }], contextFields: [{
             type: Input
@@ -6990,9 +7024,55 @@ class ReadCookieService {
                 args: [DOCUMENT]
             }] }], null); })();
 
+class CaseNotifier {
+    casesService;
+    static CASE_NAME = 'caseNameHmctsInternal';
+    static CASE_LOCATION = 'caseManagementLocation';
+    caseViewSource = new BehaviorSubject(new CaseView());
+    caseView = this.caseViewSource.asObservable();
+    cachedCaseView;
+    constructor(casesService) {
+        this.casesService = casesService;
+    }
+    removeCachedCase() {
+        this.cachedCaseView = null;
+    }
+    announceCase(c) {
+        this.caseViewSource.next(c);
+    }
+    fetchAndRefresh(cid) {
+        return this.casesService
+            .getCaseViewV2(cid)
+            .pipe(map(caseView => {
+            this.cachedCaseView = plainToClassFromExist(new CaseView(), caseView);
+            this.setBasicFields(this.cachedCaseView.tabs);
+            this.announceCase(this.cachedCaseView);
+            return this.cachedCaseView;
+        }));
+    }
+    setBasicFields(tabs) {
+        tabs.forEach((t) => {
+            const caseName = t.fields.find(f => f.id === CaseNotifier.CASE_NAME);
+            const caseLocation = t.fields.find(f => f.id === CaseNotifier.CASE_LOCATION);
+            if (caseName || caseLocation) {
+                this.cachedCaseView.basicFields = {
+                    caseNameHmctsInternal: caseName ? caseName.value : null,
+                    caseManagementLocation: caseLocation ? caseLocation.value : null
+                };
+            }
+        });
+    }
+    static ɵfac = function CaseNotifier_Factory(t) { return new (t || CaseNotifier)(i0.ɵɵinject(CasesService)); };
+    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: CaseNotifier, factory: CaseNotifier.ɵfac });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseNotifier, [{
+        type: Injectable
+    }], () => [{ type: CasesService }], null); })();
+
 class DocumentManagementService {
     http;
     appConfig;
+    caseNotifierService;
     static PDF = 'pdf';
     static IMAGE = 'image';
     static WORD = 'word';
@@ -7007,9 +7087,10 @@ class DocumentManagementService {
     static wordList = ['DOC', 'DOCX', 'doc', 'docx'];
     static excelList = ['XLS', 'XLSX', 'xls', 'xlsx'];
     static powerpointList = ['PPT', 'PPTX', 'ppt', 'pptx'];
-    constructor(http, appConfig) {
+    constructor(http, appConfig, caseNotifierService) {
         this.http = http;
         this.appConfig = appConfig;
+        this.caseNotifierService = caseNotifierService;
     }
     uploadFile(formData) {
         const url = this.getDocStoreUrl();
@@ -7087,14 +7168,22 @@ class DocumentManagementService {
         return documentBinaryUrl.replace(remoteDocumentManagementPattern, this.getDocStoreUrl());
     }
     getDocStoreUrl() {
-        return this.appConfig.getDocumentSecureMode() ? this.appConfig.getDocumentManagementUrlV2() : this.appConfig.getDocumentManagementUrl();
-    }
-    static ɵfac = function DocumentManagementService_Factory(t) { return new (t || DocumentManagementService)(i0.ɵɵinject(HttpService), i0.ɵɵinject(AbstractAppConfig)); };
+        let docStoreUrl = '';
+        this.caseNotifierService.caseView.subscribe((caseDetails) => {
+            const caseType = caseDetails?.case_type?.id;
+            const documentSecureModeCaseTypeExclusions = this.appConfig.getDocumentSecureModeCaseTypeExclusions()?.split(',');
+            const isDocumentOnExclusionList = documentSecureModeCaseTypeExclusions?.includes(caseType);
+            const documentSecureModeEnabled = this.appConfig.getDocumentSecureMode();
+            docStoreUrl = (documentSecureModeEnabled && !isDocumentOnExclusionList) ? this.appConfig.getDocumentManagementUrlV2() : this.appConfig.getDocumentManagementUrl();
+        }).unsubscribe();
+        return docStoreUrl;
+    }
+    static ɵfac = function DocumentManagementService_Factory(t) { return new (t || DocumentManagementService)(i0.ɵɵinject(HttpService), i0.ɵɵinject(AbstractAppConfig), i0.ɵɵinject(CaseNotifier)); };
     static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: DocumentManagementService, factory: DocumentManagementService.ɵfac });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DocumentManagementService, [{
         type: Injectable
-    }], () => [{ type: HttpService }, { type: AbstractAppConfig }], null); })();
+    }], () => [{ type: HttpService }, { type: AbstractAppConfig }, { type: CaseNotifier }], null); })();
 
 class ErrorNotifierService {
     errorSource = new BehaviorSubject(null);
@@ -8435,51 +8524,6 @@ class CaseworkerService {
         type: Injectable
     }], () => [{ type: HttpService }, { type: AbstractAppConfig }, { type: HttpErrorService }], null); })();
 
-class CaseNotifier {
-    casesService;
-    static CASE_NAME = 'caseNameHmctsInternal';
-    static CASE_LOCATION = 'caseManagementLocation';
-    caseViewSource = new BehaviorSubject(new CaseView());
-    caseView = this.caseViewSource.asObservable();
-    cachedCaseView;
-    constructor(casesService) {
-        this.casesService = casesService;
-    }
-    removeCachedCase() {
-        this.cachedCaseView = null;
-    }
-    announceCase(c) {
-        this.caseViewSource.next(c);
-    }
-    fetchAndRefresh(cid) {
-        return this.casesService
-            .getCaseViewV2(cid)
-            .pipe(map(caseView => {
-            this.cachedCaseView = plainToClassFromExist(new CaseView(), caseView);
-            this.setBasicFields(this.cachedCaseView.tabs);
-            this.announceCase(this.cachedCaseView);
-            return this.cachedCaseView;
-        }));
-    }
-    setBasicFields(tabs) {
-        tabs.forEach((t) => {
-            const caseName = t.fields.find(f => f.id === CaseNotifier.CASE_NAME);
-            const caseLocation = t.fields.find(f => f.id === CaseNotifier.CASE_LOCATION);
-            if (caseName || caseLocation) {
-                this.cachedCaseView.basicFields = {
-                    caseNameHmctsInternal: caseName ? caseName.value : null,
-                    caseManagementLocation: caseLocation ? caseLocation.value : null
-                };
-            }
-        });
-    }
-    static ɵfac = function CaseNotifier_Factory(t) { return new (t || CaseNotifier)(i0.ɵɵinject(CasesService)); };
-    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: CaseNotifier, factory: CaseNotifier.ɵfac });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseNotifier, [{
-        type: Injectable
-    }], () => [{ type: CasesService }], null); })();
-
 var Permissions;
 (function (Permissions) {
     Permissions["Own"] = "OWN";
@@ -11476,12 +11520,11 @@ class CallbackErrorsContext {
 function CallbackErrorsComponent_div_0_ng_container_2_li_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "li");
     i0.ɵɵtext(1);
-    i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const errorMsg_r1 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, errorMsg_r1), " ");
+    i0.ɵɵtextInterpolate1(" ", errorMsg_r1, " ");
 } }
 function CallbackErrorsComponent_div_0_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -11490,7 +11533,7 @@ function CallbackErrorsComponent_div_0_ng_container_2_Template(rf, ctx) { if (rf
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "ul", 4);
-    i0.ɵɵtemplate(5, CallbackErrorsComponent_div_0_ng_container_2_li_5_Template, 3, 3, "li", 5);
+    i0.ɵɵtemplate(5, CallbackErrorsComponent_div_0_ng_container_2_li_5_Template, 2, 1, "li", 5);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -11506,12 +11549,11 @@ function CallbackErrorsComponent_div_0_br_3_Template(rf, ctx) { if (rf & 1) {
 function CallbackErrorsComponent_div_0_ng_container_4_li_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "li");
     i0.ɵɵtext(1);
-    i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const warningMsg_r3 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, warningMsg_r3), " ");
+    i0.ɵɵtextInterpolate1(" ", warningMsg_r3, " ");
 } }
 function CallbackErrorsComponent_div_0_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -11520,7 +11562,7 @@ function CallbackErrorsComponent_div_0_ng_container_4_Template(rf, ctx) { if (rf
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "ul", 6);
-    i0.ɵɵtemplate(5, CallbackErrorsComponent_div_0_ng_container_4_li_5_Template, 3, 3, "li", 5);
+    i0.ɵɵtemplate(5, CallbackErrorsComponent_div_0_ng_container_4_li_5_Template, 2, 1, "li", 5);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -11594,7 +11636,7 @@ class CallbackErrorsComponent {
             && this.error.details.field_errors.length;
     }
     static ɵfac = function CallbackErrorsComponent_Factory(t) { return new (t || CallbackErrorsComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CallbackErrorsComponent, selectors: [["ccd-callback-errors"]], inputs: { triggerTextIgnore: "triggerTextIgnore", triggerTextContinue: "triggerTextContinue", callbackErrorsSubject: "callbackErrorsSubject" }, outputs: { callbackErrorsContext: "callbackErrorsContext" }, decls: 1, vars: 1, consts: [["class", "error-summary", "role", "group", "tabindex", "-1", 4, "ngIf"], ["role", "group", "tabindex", "-1", 1, "error-summary"], [4, "ngIf"], [1, "heading-h3", "error-summary-heading"], ["id", "errors", 1, "error-summary-list"], [4, "ngFor", "ngForOf"], ["id", "warnings", 1, "error-summary-list"]], template: function CallbackErrorsComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CallbackErrorsComponent, selectors: [["ccd-callback-errors"]], inputs: { triggerTextIgnore: "triggerTextIgnore", triggerTextContinue: "triggerTextContinue", callbackErrorsSubject: "callbackErrorsSubject" }, outputs: { callbackErrorsContext: "callbackErrorsContext" }, decls: 1, vars: 1, consts: [["class", "error-summary", "tabindex", "-1", 4, "ngIf"], ["tabindex", "-1", 1, "error-summary"], [4, "ngIf"], [1, "heading-h3", "error-summary-heading"], ["id", "errors", 1, "error-summary-list"], [4, "ngFor", "ngForOf"], ["id", "warnings", 1, "error-summary-list"]], template: function CallbackErrorsComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CallbackErrorsComponent_div_0_Template, 5, 6, "div", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.hasErrors() || ctx.hasWarnings());
@@ -11602,7 +11644,7 @@ class CallbackErrorsComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CallbackErrorsComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-callback-errors', template: "<div *ngIf=\"hasErrors() || hasWarnings()\" class=\"error-summary\" role=\"group\"\n     [attr.aria-label]=\"'Cannot continue because the service reported one or more errors or warnings' | rpxTranslate\"\n     tabindex=\"-1\">\n  <ng-container *ngIf=\"hasErrors()\">\n    <h3 class=\"heading-h3 error-summary-heading\">\n      {{'Errors' | rpxTranslate}}\n    </h3>\n    <ul id=\"errors\" class=\"error-summary-list\">\n      <li *ngFor=\"let errorMsg of error.callbackErrors\">\n        {{errorMsg | rpxTranslate}}\n      </li>\n    </ul>\n  </ng-container>\n  <!-- Add a break for spacing if there are both errors and warnings -->\n  <br *ngIf=\"hasErrors() && hasWarnings()\">\n  <ng-container *ngIf=\"hasWarnings()\">\n    <h3 class=\"heading-h3 error-summary-heading\">\n      {{'Warnings' | rpxTranslate}}\n    </h3>\n    <ul id=\"warnings\" class=\"error-summary-list\">\n      <li *ngFor=\"let warningMsg of error.callbackWarnings\">\n        {{warningMsg | rpxTranslate}}\n      </li>\n    </ul>\n  </ng-container>\n</div>\n" }]
+        args: [{ selector: 'ccd-callback-errors', template: "<div *ngIf=\"hasErrors() || hasWarnings()\" class=\"error-summary\"\n     [attr.aria-label]=\"'Cannot continue because the service reported one or more errors or warnings' | rpxTranslate\"\n     tabindex=\"-1\">\n  <ng-container *ngIf=\"hasErrors()\">\n    <h3 class=\"heading-h3 error-summary-heading\">\n      {{'Errors' | rpxTranslate}}\n    </h3>\n    <ul id=\"errors\" class=\"error-summary-list\">\n      <li *ngFor=\"let errorMsg of error.callbackErrors\">\n        {{errorMsg}}\n      </li>\n    </ul>\n  </ng-container>\n  <!-- Add a break for spacing if there are both errors and warnings -->\n  <br *ngIf=\"hasErrors() && hasWarnings()\">\n  <ng-container *ngIf=\"hasWarnings()\">\n    <h3 class=\"heading-h3 error-summary-heading\">\n      {{'Warnings' | rpxTranslate}}\n    </h3>\n    <ul id=\"warnings\" class=\"error-summary-list\">\n      <li *ngFor=\"let warningMsg of error.callbackWarnings\">\n        {{warningMsg}}\n      </li>\n    </ul>\n  </ng-container>\n</div>\n" }]
     }], null, { triggerTextIgnore: [{
             type: Input
         }], triggerTextContinue: [{
@@ -15555,12 +15597,13 @@ class WriteDynamicListFieldComponent extends AbstractFieldWriteComponent {
 class MarkdownComponent {
     router;
     renderer;
+    ngZone;
     content;
-    markdownUseHrefAsRouterLink;
     renderUrlToTextFeature = true;
-    constructor(router, renderer) {
+    constructor(router, renderer, ngZone) {
         this.router = router;
         this.renderer = renderer;
+        this.ngZone = ngZone;
     }
     ngOnInit() {
         this.content = this.content.replace(/  \n/g, '<br>');
@@ -15568,12 +15611,28 @@ class MarkdownComponent {
             this.renderUrlToText();
         }
     }
-    onMarkdownClick(event) {
-        // If we don't have an anchor tag, we don't need to do anything.
-        if (event.target instanceof HTMLAnchorElement === false) {
-            return;
-        }
-        return true;
+    interceptClick(event) {
+        this.ngZone.runOutsideAngular(() => {
+            const target = event.target;
+            if (target.tagName.toLowerCase() === 'a') {
+                const href = target.getAttribute('href');
+                if (href && href.startsWith('/') && !href.startsWith('//')) {
+                    const currentUrl = window.location.href;
+                    if (currentUrl.includes('trigger')) {
+                        // if we are already in an event and there is a markdown we should reload the page as without the components will not reinitialise
+                        this.ngZone.run(() => {
+                            this.router.navigateByUrl(href);
+                        });
+                    }
+                    else {
+                        event.preventDefault();
+                        this.ngZone.run(() => {
+                            this.router.navigateByUrl(href);
+                        });
+                    }
+                }
+            }
+        });
     }
     renderUrlToText() {
         const renderer = new marked.Renderer();
@@ -15596,34 +15655,27 @@ class MarkdownComponent {
         const markdownLinkRegex = /\[([^\]]+)\]\(?([^ )]+)\)/g;
         return markdownLinkRegex.test(inputString);
     }
-    static ɵfac = function MarkdownComponent_Factory(t) { return new (t || MarkdownComponent)(i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i0.Renderer2)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MarkdownComponent, selectors: [["ccd-markdown"]], hostBindings: function MarkdownComponent_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("click", function MarkdownComponent_click_HostBindingHandler($event) { return ctx.onMarkdownClick($event); });
-        } }, inputs: { content: "content", markdownUseHrefAsRouterLink: "markdownUseHrefAsRouterLink", renderUrlToTextFeature: "renderUrlToTextFeature" }, decls: 4, vars: 5, consts: [[1, "markdown", 3, "data"]], template: function MarkdownComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div");
-            i0.ɵɵelement(1, "markdown", 0);
+    static ɵfac = function MarkdownComponent_Factory(t) { return new (t || MarkdownComponent)(i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.NgZone)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MarkdownComponent, selectors: [["ccd-markdown"]], inputs: { content: "content", renderUrlToTextFeature: "renderUrlToTextFeature" }, decls: 4, vars: 5, consts: [[1, "markdown", 3, "click", "data"]], template: function MarkdownComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div")(1, "markdown", 0);
             i0.ɵɵpipe(2, "ccdCaseReference");
             i0.ɵɵpipe(3, "rpxTranslate");
-            i0.ɵɵelementEnd();
+            i0.ɵɵlistener("click", function MarkdownComponent_Template_markdown_click_1_listener($event) { return ctx.interceptClick($event); });
+            i0.ɵɵelementEnd()();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵproperty("data", i0.ɵɵpipeBind1(3, 3, i0.ɵɵpipeBind1(2, 1, ctx.content)));
-        } }, dependencies: [i2$1.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2 });
+        } }, dependencies: [i2$1.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2, changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MarkdownComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-markdown', template: "<div><markdown class=\"markdown\" [data]=\"content | ccdCaseReference | rpxTranslate\"></markdown></div>\n" }]
-    }], () => [{ type: i1$1.Router }, { type: i0.Renderer2 }], { content: [{
-            type: Input
-        }], markdownUseHrefAsRouterLink: [{
+        args: [{ selector: 'ccd-markdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div><markdown class=\"markdown\" (click)=\"interceptClick($event)\" [data]=\"content | ccdCaseReference | rpxTranslate\"></markdown></div>\n" }]
+    }], () => [{ type: i1$1.Router }, { type: i0.Renderer2 }, { type: i0.NgZone }], { content: [{
             type: Input
         }], renderUrlToTextFeature: [{
             type: Input
-        }], onMarkdownClick: [{
-            type: HostListener,
-            args: ['click', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MarkdownComponent, { className: "MarkdownComponent", filePath: "lib/shared/components/palette/markdown/markdown.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MarkdownComponent, { className: "MarkdownComponent", filePath: "lib/shared/components/palette/markdown/markdown.component.ts", lineNumber: 10 }); })();
 
 class FixedListPipe {
     static EMPTY = '';
@@ -16639,45 +16691,50 @@ function LabelFieldComponent_ccd_markdown_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵpipe(1, "rpxTranslate");
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(1, 2, ctx_r0.caseField.label))("markdownUseHrefAsRouterLink", ctx_r0.markdownUseHrefAsRouterLink);
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(1, 1, ctx_r0.caseField.label));
 } }
 function LabelFieldComponent_ccd_markdown_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "ccd-markdown", 2);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("content", ctx_r0.caseField.value || ctx_r0.caseField.label)("markdownUseHrefAsRouterLink", ctx_r0.markdownUseHrefAsRouterLink);
+    i0.ɵɵproperty("content", ctx_r0.caseField.label);
+} }
+function LabelFieldComponent_ccd_markdown_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-markdown", 2);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("content", ctx_r0.caseField.value || ctx_r0.caseField.label);
 } }
 class LabelFieldComponent {
     caseField;
     caseFields = [];
     labelCanBeTranslated = false;
-    markdownUseHrefAsRouterLink;
     static ɵfac = function LabelFieldComponent_Factory(t) { return new (t || LabelFieldComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LabelFieldComponent, selectors: [["ccd-label-field"]], inputs: { caseField: "caseField", caseFields: "caseFields", labelCanBeTranslated: "labelCanBeTranslated", markdownUseHrefAsRouterLink: "markdownUseHrefAsRouterLink" }, decls: 5, vars: 6, consts: [["ccdLabelSubstitutor", "", 1, "case-field", 3, "hidden", "caseField", "contextFields", "id"], [3, "content", "markdownUseHrefAsRouterLink", 4, "ngIf"], [3, "content", "markdownUseHrefAsRouterLink"]], template: function LabelFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LabelFieldComponent, selectors: [["ccd-label-field"]], inputs: { caseField: "caseField", caseFields: "caseFields", labelCanBeTranslated: "labelCanBeTranslated" }, decls: 6, vars: 7, consts: [["ccdLabelSubstitutor", "", 1, "case-field", 3, "hidden", "caseField", "contextFields", "id"], [3, "content", 4, "ngIf"], [3, "content"]], template: function LabelFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "dl", 0)(1, "dt");
-            i0.ɵɵtemplate(2, LabelFieldComponent_ccd_markdown_2_Template, 2, 4, "ccd-markdown", 1)(3, LabelFieldComponent_ccd_markdown_3_Template, 1, 2, "ccd-markdown", 1);
+            i0.ɵɵtemplate(2, LabelFieldComponent_ccd_markdown_2_Template, 2, 3, "ccd-markdown", 1)(3, LabelFieldComponent_ccd_markdown_3_Template, 1, 1, "ccd-markdown", 1)(4, LabelFieldComponent_ccd_markdown_4_Template, 1, 1, "ccd-markdown", 1);
             i0.ɵɵelementEnd();
-            i0.ɵɵelement(4, "dd");
+            i0.ɵɵelement(5, "dd");
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵproperty("hidden", ctx.caseField.hidden)("caseField", ctx.caseField)("contextFields", ctx.caseFields)("id", ctx.caseField.id);
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.labelCanBeTranslated);
+            i0.ɵɵproperty("ngIf", ctx.labelCanBeTranslated && !ctx.caseField.isTranslated);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.labelCanBeTranslated && ctx.caseField.isTranslated);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", !ctx.labelCanBeTranslated);
         } }, encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LabelFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-label-field', template: "<dl [hidden]=\"caseField.hidden\" class=\"case-field\" ccdLabelSubstitutor [caseField]=\"caseField\" [contextFields]=\"caseFields\" [id]=\"caseField.id\">\n  <dt>\n    <ccd-markdown *ngIf=\"labelCanBeTranslated\" [content]=\"caseField.label | rpxTranslate\" [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n    </ccd-markdown>\n\n    <ccd-markdown *ngIf=\"!labelCanBeTranslated\" [content]=\"caseField.value || caseField.label\" [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n    </ccd-markdown>\n  </dt>\n  <dd></dd>\n</dl>\n" }]
+        args: [{ selector: 'ccd-label-field', template: "<dl [hidden]=\"caseField.hidden\" class=\"case-field\" ccdLabelSubstitutor [caseField]=\"caseField\" [contextFields]=\"caseFields\" [id]=\"caseField.id\">\n  <dt>\n    <ccd-markdown *ngIf=\"labelCanBeTranslated && !caseField.isTranslated\" [content]=\"caseField.label | rpxTranslate\">\n    </ccd-markdown>\n\n    <ccd-markdown *ngIf=\"labelCanBeTranslated && caseField.isTranslated\" [content]=\"caseField.label\">\n    </ccd-markdown>\n\n    <ccd-markdown *ngIf=\"!labelCanBeTranslated\" [content]=\"caseField.value || caseField.label\">\n    </ccd-markdown>\n  </dt>\n  <dd></dd>\n</dl>\n" }]
     }], null, { caseField: [{
             type: Input
         }], caseFields: [{
             type: Input
         }], labelCanBeTranslated: [{
             type: Input
-        }], markdownUseHrefAsRouterLink: [{
-            type: Input
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LabelFieldComponent, { className: "LabelFieldComponent", filePath: "lib/shared/components/palette/label/label-field.component.ts", lineNumber: 8 }); })();
 
@@ -22823,21 +22880,20 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
 
 class ReadTextAreaFieldComponent extends AbstractFieldReadComponent {
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadTextAreaFieldComponent_BaseFactory; return function ReadTextAreaFieldComponent_Factory(t) { return (ɵReadTextAreaFieldComponent_BaseFactory || (ɵReadTextAreaFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadTextAreaFieldComponent)))(t || ReadTextAreaFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadTextAreaFieldComponent, selectors: [["ccd-read-text-area-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 3, consts: [[2, "white-space", "pre-wrap"]], template: function ReadTextAreaFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadTextAreaFieldComponent, selectors: [["ccd-read-text-area-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 1, consts: [[2, "white-space", "pre-wrap"]], template: function ReadTextAreaFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "span", 0);
             i0.ɵɵtext(1);
-            i0.ɵɵpipe(2, "rpxTranslate");
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx.caseField.value));
-        } }, dependencies: [i1.RpxTranslatePipe], encapsulation: 2 });
+            i0.ɵɵtextInterpolate(ctx.caseField.value);
+        } }, encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadTextAreaFieldComponent, [{
         type: Component,
         args: [{
                 selector: 'ccd-read-text-area-field',
-                template: `<span style="white-space: pre-wrap">{{caseField.value | rpxTranslate}}</span>`
+                template: `<span style="white-space: pre-wrap">{{ caseField.value }}</span>`
             }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadTextAreaFieldComponent, { className: "ReadTextAreaFieldComponent", filePath: "lib/shared/components/palette/text-area/read-text-area-field.component.ts", lineNumber: 8 }); })();
@@ -22922,21 +22978,20 @@ class WriteTextAreaFieldComponent extends AbstractFieldWriteComponent {
 
 class ReadTextFieldComponent extends AbstractFieldReadComponent {
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadTextFieldComponent_BaseFactory; return function ReadTextFieldComponent_Factory(t) { return (ɵReadTextFieldComponent_BaseFactory || (ɵReadTextFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadTextFieldComponent)))(t || ReadTextFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadTextFieldComponent, selectors: [["ccd-read-text-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 3, consts: [[1, "text-16"]], template: function ReadTextFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadTextFieldComponent, selectors: [["ccd-read-text-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 1, consts: [[1, "text-16"]], template: function ReadTextFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "span", 0);
             i0.ɵɵtext(1);
-            i0.ɵɵpipe(2, "rpxTranslate");
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx.caseField.value));
-        } }, dependencies: [i1.RpxTranslatePipe], encapsulation: 2 });
+            i0.ɵɵtextInterpolate(ctx.caseField.value);
+        } }, encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadTextFieldComponent, [{
         type: Component,
         args: [{
                 selector: 'ccd-read-text-field',
-                template: `<span class="text-16">{{caseField.value | rpxTranslate}}</span>`
+                template: `<span class="text-16">{{ caseField.value }}</span>`
             }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadTextFieldComponent, { className: "ReadTextFieldComponent", filePath: "lib/shared/components/palette/text/read-text-field.component.ts", lineNumber: 8 }); })();
@@ -23329,7 +23384,6 @@ class FieldReadComponent extends AbstractFieldReadComponent {
     withLabel = false;
     formGroup = new FormGroup({});
     caseFields = [];
-    markdownUseHrefAsRouterLink;
     fieldContainer;
     constructor(resolver, paletteService) {
         super();
@@ -23362,7 +23416,6 @@ class FieldReadComponent extends AbstractFieldReadComponent {
             component.instance['parent'] = this.parent;
             component.instance['caseReference'] = this.caseReference;
             component.instance['context'] = this.context;
-            component.instance['markdownUseHrefAsRouterLink'] = this.markdownUseHrefAsRouterLink;
             component.instance['labelCanBeTranslated'] = this.labelCanBeTranslated(this.caseField);
             this.fieldContainer.insert(component.hostView);
         });
@@ -23376,27 +23429,25 @@ class FieldReadComponent extends AbstractFieldReadComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.fieldContainer = _t.first);
-        } }, inputs: { withLabel: "withLabel", formGroup: "formGroup", caseFields: "caseFields", markdownUseHrefAsRouterLink: "markdownUseHrefAsRouterLink" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 6, consts: [["fieldContainer", ""], [3, "hidden"], [3, "formGroup", "topLevelFormGroup", "caseField", "withLabel", "markdownUseHrefAsRouterLink"]], template: function FieldReadComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { withLabel: "withLabel", formGroup: "formGroup", caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 5, consts: [["fieldContainer", ""], [3, "hidden"], [3, "formGroup", "topLevelFormGroup", "caseField", "withLabel"]], template: function FieldReadComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1)(1, "ccd-field-read-label", 2);
             i0.ɵɵelementContainer(2, null, 0);
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
             i0.ɵɵproperty("hidden", ctx.caseField.hidden);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("formGroup", ctx.formGroup)("topLevelFormGroup", ctx.topLevelFormGroup)("caseField", ctx.caseField)("withLabel", ctx.withLabel)("markdownUseHrefAsRouterLink", ctx.markdownUseHrefAsRouterLink);
+            i0.ɵɵproperty("formGroup", ctx.formGroup)("topLevelFormGroup", ctx.topLevelFormGroup)("caseField", ctx.caseField)("withLabel", ctx.withLabel);
         } }, encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FieldReadComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-field-read', template: "<div [hidden]=\"caseField.hidden\">\n  <ccd-field-read-label [formGroup]=\"formGroup\" [topLevelFormGroup]=\"topLevelFormGroup\" [caseField]=\"caseField\" [withLabel]=\"withLabel\" [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n    <ng-container #fieldContainer></ng-container>\n  </ccd-field-read-label>\n</div>\n" }]
+        args: [{ selector: 'ccd-field-read', template: "<div [hidden]=\"caseField.hidden\">\n  <ccd-field-read-label [formGroup]=\"formGroup\" [topLevelFormGroup]=\"topLevelFormGroup\" [caseField]=\"caseField\" [withLabel]=\"withLabel\">\n    <ng-container #fieldContainer></ng-container>\n  </ccd-field-read-label>\n</div>\n" }]
     }], () => [{ type: i0.ComponentFactoryResolver }, { type: PaletteService }], { withLabel: [{
             type: Input
         }], formGroup: [{
             type: Input
         }], caseFields: [{
             type: Input
-        }], markdownUseHrefAsRouterLink: [{
-            type: Input
         }], fieldContainer: [{
             type: ViewChild,
             args: ['fieldContainer', { static: false, read: ViewContainerRef }]
@@ -23500,7 +23551,6 @@ class FieldReadLabelComponent extends AbstractFieldReadComponent {
     // EUI-3267. Flag for whether or not this can have a grey bar.
     canHaveGreyBar = false;
     withLabel;
-    markdownUseHrefAsRouterLink;
     isLabel() {
         return this.caseField.field_type && this.caseField.field_type.type === 'Label';
     }
@@ -23528,7 +23578,7 @@ class FieldReadLabelComponent extends AbstractFieldReadComponent {
         }
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵFieldReadLabelComponent_BaseFactory; return function FieldReadLabelComponent_Factory(t) { return (ɵFieldReadLabelComponent_BaseFactory || (ɵFieldReadLabelComponent_BaseFactory = i0.ɵɵgetInheritedFactory(FieldReadLabelComponent)))(t || FieldReadLabelComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FieldReadLabelComponent, selectors: [["ccd-field-read-label"]], inputs: { withLabel: "withLabel", markdownUseHrefAsRouterLink: "markdownUseHrefAsRouterLink" }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0$v, decls: 4, vars: 5, consts: [["caseFieldValue", ""], [3, "hidden"], ["class", "case-field", 4, "ngIf", "ngIfElse"], [1, "case-field"], [1, "case-field__label"], [1, "case-field__value"], [4, "ngTemplateOutlet"]], template: function FieldReadLabelComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FieldReadLabelComponent, selectors: [["ccd-field-read-label"]], inputs: { withLabel: "withLabel" }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0$v, decls: 4, vars: 5, consts: [["caseFieldValue", ""], [3, "hidden"], ["class", "case-field", 4, "ngIf", "ngIfElse"], [1, "case-field"], [1, "case-field__label"], [1, "case-field__value"], [4, "ngTemplateOutlet"]], template: function FieldReadLabelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 1);
             i0.ɵɵtemplate(1, FieldReadLabelComponent_dl_1_Template, 6, 4, "dl", 2)(2, FieldReadLabelComponent_ng_template_2_Template, 1, 0, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
@@ -23546,8 +23596,6 @@ class FieldReadLabelComponent extends AbstractFieldReadComponent {
         args: [{ selector: 'ccd-field-read-label', template: "<div [hidden]=\"caseField.hidden\" [class.grey-bar]=\"canHaveGreyBar && !caseField.hiddenCannotChange\">\n  <dl class=\"case-field\" *ngIf=\"withLabel && !isLabel() && (!isComplex() || isCaseLink()); else caseFieldValue\">\n    <dt class=\"case-field__label\">{{caseField.label | rpxTranslate}}</dt>\n    <dd class=\"case-field__value\">\n      <ng-container *ngTemplateOutlet=\"caseFieldValue\"></ng-container>\n    </dd>\n  </dl>\n  <ng-template #caseFieldValue>\n    <ng-content></ng-content>\n  </ng-template>\n</div>\n", styles: [".case-field:after{content:\"\";display:block;clear:both}.case-field{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-bottom:15px}@media (min-width: 641px){.case-field{margin-bottom:30px}}.case-field .case-field__label{display:block;color:#0b0c0c;padding-bottom:2px;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.case-field .case-field__label{font-size:19px;line-height:1.3157894737}}.case-field .case-field__value{font-family:nta,Arial,sans-serif;font-weight:400;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.case-field .case-field__value{font-size:19px;line-height:1.3157894737}}.form :host::ng-deep .grey-bar>*>.form-group,.form :host::ng-deep .grey-bar>*>*>.form-group,.form :host::ng-deep .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form :host::ng-deep .grey-bar>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form :host::ng-deep .grey-bar>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field input:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field select:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}\n"] }]
     }], null, { withLabel: [{
             type: Input
-        }], markdownUseHrefAsRouterLink: [{
-            type: Input
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FieldReadLabelComponent, { className: "FieldReadLabelComponent", filePath: "lib/shared/components/palette/base-field/field-read-label.component.ts", lineNumber: 14 }); })();
 
@@ -24572,7 +24620,7 @@ class AddCommentsComponent extends AbstractJourneyComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AddCommentsComponent, { className: "AddCommentsComponent", filePath: "lib/shared/components/palette/case-flag/components/add-comments/add-comments.component.ts", lineNumber: 12 }); })();
 
-function CaseFlagSummaryListComponent_dl_0_div_28_Template(rf, ctx) { if (rf & 1) {
+function CaseFlagSummaryListComponent_dl_0_div_27_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2)(1, "dt", 3);
     i0.ɵɵtext(2);
@@ -24582,7 +24630,7 @@ function CaseFlagSummaryListComponent_dl_0_div_28_Template(rf, ctx) { if (rf & 1
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(6, "dd", 5)(7, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_28_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : ctx_r1.caseFlagFieldState.FLAG_TYPE)); });
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_27_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : ctx_r1.caseFlagFieldState.FLAG_TYPE)); });
     i0.ɵɵtext(8);
     i0.ɵɵpipe(9, "rpxTranslate");
     i0.ɵɵelementStart(10, "span", 7);
@@ -24600,7 +24648,7 @@ function CaseFlagSummaryListComponent_dl_0_div_28_Template(rf, ctx) { if (rf & 1
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(12, 8, "other description (Welsh)"), "");
 } }
-function CaseFlagSummaryListComponent_dl_0_div_29_Template(rf, ctx) { if (rf & 1) {
+function CaseFlagSummaryListComponent_dl_0_div_28_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2)(1, "dt", 3);
     i0.ɵɵtext(2);
@@ -24610,7 +24658,7 @@ function CaseFlagSummaryListComponent_dl_0_div_29_Template(rf, ctx) { if (rf & 1
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(6, "dd", 5)(7, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_29_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_COMMENTS)); });
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_28_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_COMMENTS)); });
     i0.ɵɵtext(8);
     i0.ɵɵpipe(9, "rpxTranslate");
     i0.ɵɵelementStart(10, "span", 7);
@@ -24628,7 +24676,7 @@ function CaseFlagSummaryListComponent_dl_0_div_29_Template(rf, ctx) { if (rf & 1
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(12, 8, "comments"), "");
 } }
-function CaseFlagSummaryListComponent_dl_0_div_30_Template(rf, ctx) { if (rf & 1) {
+function CaseFlagSummaryListComponent_dl_0_div_29_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2)(1, "dt", 3);
     i0.ɵɵtext(2);
@@ -24638,7 +24686,7 @@ function CaseFlagSummaryListComponent_dl_0_div_30_Template(rf, ctx) { if (rf & 1
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(6, "dd", 5)(7, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_30_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : ctx_r1.caseFlagFieldState.FLAG_COMMENTS)); });
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_div_29_Template_a_click_7_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : ctx_r1.caseFlagFieldState.FLAG_COMMENTS)); });
     i0.ɵɵtext(8);
     i0.ɵɵpipe(9, "rpxTranslate");
     i0.ɵɵelementStart(10, "span", 7);
@@ -24656,10 +24704,10 @@ function CaseFlagSummaryListComponent_dl_0_div_30_Template(rf, ctx) { if (rf & 1
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(12, 8, "comments (Welsh)"), "");
 } }
-function CaseFlagSummaryListComponent_dl_0_a_39_Template(rf, ctx) { if (rf & 1) {
+function CaseFlagSummaryListComponent_dl_0_a_38_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_a_39_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_STATUS)); });
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_a_38_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_STATUS)); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementStart(3, "span", 7);
@@ -24680,61 +24728,60 @@ function CaseFlagSummaryListComponent_dl_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(5, "dd", 4);
     i0.ɵɵtext(6);
-    i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "dd", 5)(9, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_Template_a_click_9_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : ctx_r1.caseFlagFieldState.FLAG_LOCATION)); });
-    i0.ɵɵtext(10);
-    i0.ɵɵpipe(11, "rpxTranslate");
-    i0.ɵɵelementStart(12, "span", 7);
-    i0.ɵɵtext(13);
-    i0.ɵɵpipe(14, "rpxTranslate");
+    i0.ɵɵelementStart(7, "dd", 5)(8, "a", 6);
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : ctx_r1.caseFlagFieldState.FLAG_LOCATION)); });
+    i0.ɵɵtext(9);
+    i0.ɵɵpipe(10, "rpxTranslate");
+    i0.ɵɵelementStart(11, "span", 7);
+    i0.ɵɵtext(12);
+    i0.ɵɵpipe(13, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(15, "div", 2)(16, "dt", 3);
-    i0.ɵɵtext(17);
-    i0.ɵɵpipe(18, "rpxTranslate");
+    i0.ɵɵelementStart(14, "div", 2)(15, "dt", 3);
+    i0.ɵɵtext(16);
+    i0.ɵɵpipe(17, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(19, "dd", 4);
-    i0.ɵɵtext(20);
+    i0.ɵɵelementStart(18, "dd", 4);
+    i0.ɵɵtext(19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(21, "dd", 5)(22, "a", 6);
-    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_Template_a_click_22_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_TYPE)); });
-    i0.ɵɵtext(23);
-    i0.ɵɵpipe(24, "rpxTranslate");
-    i0.ɵɵelementStart(25, "span", 7);
-    i0.ɵɵtext(26);
-    i0.ɵɵpipe(27, "rpxTranslate");
+    i0.ɵɵelementStart(20, "dd", 5)(21, "a", 6);
+    i0.ɵɵlistener("click", function CaseFlagSummaryListComponent_dl_0_Template_a_click_21_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.changeButtonEmitter.emit(ctx_r1.summaryListDisplayMode === ctx_r1.displayMode.MANAGE ? ctx_r1.caseFlagFieldState.FLAG_UPDATE : ctx_r1.caseFlagFieldState.FLAG_TYPE)); });
+    i0.ɵɵtext(22);
+    i0.ɵɵpipe(23, "rpxTranslate");
+    i0.ɵɵelementStart(24, "span", 7);
+    i0.ɵɵtext(25);
+    i0.ɵɵpipe(26, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵtemplate(28, CaseFlagSummaryListComponent_dl_0_div_28_Template, 13, 10, "div", 8)(29, CaseFlagSummaryListComponent_dl_0_div_29_Template, 13, 10, "div", 8)(30, CaseFlagSummaryListComponent_dl_0_div_30_Template, 13, 10, "div", 8);
-    i0.ɵɵelementStart(31, "div", 2)(32, "dt", 3);
-    i0.ɵɵtext(33);
-    i0.ɵɵpipe(34, "rpxTranslate");
+    i0.ɵɵtemplate(27, CaseFlagSummaryListComponent_dl_0_div_27_Template, 13, 10, "div", 8)(28, CaseFlagSummaryListComponent_dl_0_div_28_Template, 13, 10, "div", 8)(29, CaseFlagSummaryListComponent_dl_0_div_29_Template, 13, 10, "div", 8);
+    i0.ɵɵelementStart(30, "div", 2)(31, "dt", 3);
+    i0.ɵɵtext(32);
+    i0.ɵɵpipe(33, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(35, "dd", 4);
-    i0.ɵɵtext(36);
-    i0.ɵɵpipe(37, "rpxTranslate");
+    i0.ɵɵelementStart(34, "dd", 4);
+    i0.ɵɵtext(35);
+    i0.ɵɵpipe(36, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(38, "dd", 5);
-    i0.ɵɵtemplate(39, CaseFlagSummaryListComponent_dl_0_a_39_Template, 6, 6, "a", 9);
+    i0.ɵɵelementStart(37, "dd", 5);
+    i0.ɵɵtemplate(38, CaseFlagSummaryListComponent_dl_0_a_38_Template, 6, 6, "a", 9);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 14, ctx_r1.addUpdateFlagHeaderText), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(7, 16, ctx_r1.flagForSummaryDisplay.partyName || ctx_r1.caseFlagCheckYourAnswersPageStep.CASE_LEVEL_LOCATION), " ");
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(11, 18, "Change"), "");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.flagForSummaryDisplay.partyName || ctx_r1.caseFlagCheckYourAnswersPageStep.CASE_LEVEL_LOCATION, " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 16, "Change"), "");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(14, 20, "party name"), "");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(13, 18, "party name"), "");
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(18, 22, ctx_r1.flagTypeHeaderText), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(17, 20, ctx_r1.flagTypeHeaderText), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r1.flagDescription, " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(24, 24, "Change"), "");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(23, 22, "Change"), "");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(27, 26, "flag type"), "");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(26, 24, "flag type"), "");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", (ctx_r1.flagDescriptionWelsh == null ? null : ctx_r1.flagDescriptionWelsh.length) > 0 && !ctx_r1.externalUserUpdate);
     i0.ɵɵadvance();
@@ -24742,9 +24789,9 @@ function CaseFlagSummaryListComponent_dl_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", (ctx_r1.flagCommentsWelsh == null ? null : ctx_r1.flagCommentsWelsh.length) > 0 && !ctx_r1.externalUserUpdate);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(34, 28, "Status"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(33, 26, "Status"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(37, 30, ctx_r1.flagStatus), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(36, 28, ctx_r1.flagStatus), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("ngIf", ctx_r1.is2Point1Enabled);
 } }
@@ -24850,14 +24897,14 @@ class CaseFlagSummaryListComponent {
     }
     static ɵfac = function CaseFlagSummaryListComponent_Factory(t) { return new (t || CaseFlagSummaryListComponent)(i0.ɵɵdirectiveInject(i1.RpxTranslationService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFlagSummaryListComponent, selectors: [["ccd-case-flag-summary-list"]], inputs: { flagForSummaryDisplay: "flagForSummaryDisplay", displayContextParameter: "displayContextParameter" }, outputs: { changeButtonEmitter: "changeButtonEmitter" }, decls: 1, vars: 1, consts: [["class", "govuk-summary-list", 4, "ngIf"], [1, "govuk-summary-list"], [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"], [1, "govuk-visually-hidden"], ["class", "govuk-summary-list__row", 4, "ngIf"], ["class", "govuk-link", "href", "javascript:void(0)", 3, "click", 4, "ngIf"]], template: function CaseFlagSummaryListComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, CaseFlagSummaryListComponent_dl_0_Template, 40, 32, "dl", 0);
+            i0.ɵɵtemplate(0, CaseFlagSummaryListComponent_dl_0_Template, 39, 30, "dl", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.flagForSummaryDisplay);
         } }, dependencies: [i5.NgIf, i1.RpxTranslatePipe], encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFlagSummaryListComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-flag-summary-list', template: "<dl class=\"govuk-summary-list\" *ngIf=\"flagForSummaryDisplay\">\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{addUpdateFlagHeaderText | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagForSummaryDisplay.partyName || caseFlagCheckYourAnswersPageStep.CASE_LEVEL_LOCATION | rpxTranslate}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : caseFlagFieldState.FLAG_LOCATION)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'party name' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{flagTypeHeaderText | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagDescription}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_TYPE)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'flag type' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagDescriptionWelsh?.length > 0 && !externalUserUpdate\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Other description (Welsh)' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagDescriptionWelsh}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : caseFlagFieldState.FLAG_TYPE)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'other description (Welsh)' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagComments?.length > 0\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Comments' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{externalUserUpdate ? flagUpdateComments : flagComments}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_COMMENTS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'comments' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagCommentsWelsh?.length > 0 && !externalUserUpdate\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Comments (Welsh)' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagCommentsWelsh}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : caseFlagFieldState.FLAG_COMMENTS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'comments (Welsh)' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Status' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagStatus | rpxTranslate}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a *ngIf=\"is2Point1Enabled\" class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_STATUS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'status' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n</dl>\n" }]
+        args: [{ selector: 'ccd-case-flag-summary-list', template: "<dl class=\"govuk-summary-list\" *ngIf=\"flagForSummaryDisplay\">\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{addUpdateFlagHeaderText | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagForSummaryDisplay.partyName || caseFlagCheckYourAnswersPageStep.CASE_LEVEL_LOCATION }}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_MANAGE_CASE_FLAGS : caseFlagFieldState.FLAG_LOCATION)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'party name' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{flagTypeHeaderText | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagDescription}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_TYPE)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'flag type' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagDescriptionWelsh?.length > 0 && !externalUserUpdate\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Other description (Welsh)' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagDescriptionWelsh}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : caseFlagFieldState.FLAG_TYPE)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'other description (Welsh)' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagComments?.length > 0\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Comments' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{externalUserUpdate ? flagUpdateComments : flagComments}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_COMMENTS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'comments' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\" *ngIf=\"flagCommentsWelsh?.length > 0 && !externalUserUpdate\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Comments (Welsh)' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagCommentsWelsh}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE_WELSH_TRANSLATION : caseFlagFieldState.FLAG_COMMENTS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'comments (Welsh)' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n  <div class=\"govuk-summary-list__row\">\n    <dt class=\"govuk-summary-list__key\">\n      {{'Status' | rpxTranslate}}\n    </dt>\n    <dd class=\"govuk-summary-list__value\">\n      {{flagStatus | rpxTranslate}}\n    </dd>\n    <dd class=\"govuk-summary-list__actions\">\n      <a *ngIf=\"is2Point1Enabled\" class=\"govuk-link\" href=\"javascript:void(0)\"\n        (click)=\"changeButtonEmitter.emit(this.summaryListDisplayMode === displayMode.MANAGE ? caseFlagFieldState.FLAG_UPDATE : caseFlagFieldState.FLAG_STATUS)\">\n        {{'Change' | rpxTranslate}}<span class=\"govuk-visually-hidden\"> {{'status' | rpxTranslate}}</span>\n      </a>\n    </dd>\n  </div>\n</dl>\n" }]
     }], () => [{ type: i1.RpxTranslationService }], { flagForSummaryDisplay: [{
             type: Input
         }], displayContextParameter: [{
@@ -27633,7 +27680,7 @@ function ReadComplexFieldRawComponent_ng_container_1_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵproperty("hidden", field_r1.hidden || field_r1.field_type.type === "Label");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 8, field_r1.label));
+    i0.ɵɵtextInterpolate(ctx_r1.isTranslatable(field_r1) ? i0.ɵɵpipeBind1(4, 8, field_r1.label) : field_r1.label);
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("hidden", field_r1.hidden);
     i0.ɵɵadvance();
@@ -27658,7 +27705,7 @@ class ReadComplexFieldRawComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadComplexFieldRawComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-complex-field-raw', template: "<dl class=\"complex-raw\">\n  <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :id()\">\n    <dt [hidden]=\"field.hidden || field.field_type.type === 'Label'\"><span class=\"text-16\">{{field.label | rpxTranslate}}</span></dt>\n    <dd [hidden]=\"field.hidden\">\n      <ccd-field-read [caseField]=\"field\" [context]=\"context\" [caseFields]=\"caseFields\" [topLevelFormGroup]=\"topLevelFormGroup\" [idPrefix]=\"idPrefix\"></ccd-field-read>\n    </dd>\n  </ng-container>\n</dl>\n", styles: ["dl.complex-raw{list-style-type:none;margin:5px 0 10px}dl.complex-raw dl.complex-raw{padding-left:2ch}dl.complex-raw dt{font-weight:700}\n"] }]
+        args: [{ selector: 'ccd-read-complex-field-raw', template: "<dl class=\"complex-raw\">\n  <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :id()\">\n    <dt [hidden]=\"field.hidden || field.field_type.type === 'Label'\"><span class=\"text-16\">{{isTranslatable(field) ? (field.label | rpxTranslate) : field.label}}</span></dt>\n    <dd [hidden]=\"field.hidden\">\n      <ccd-field-read [caseField]=\"field\" [context]=\"context\" [caseFields]=\"caseFields\" [topLevelFormGroup]=\"topLevelFormGroup\" [idPrefix]=\"idPrefix\"></ccd-field-read>\n    </dd>\n  </ng-container>\n</dl>\n", styles: ["dl.complex-raw{list-style-type:none;margin:5px 0 10px}dl.complex-raw dl.complex-raw{padding-left:2ch}dl.complex-raw dt{font-weight:700}\n"] }]
     }], null, { caseFields: [{
             type: Input
         }] }); })();
@@ -28096,7 +28143,7 @@ class ReadComplexFieldCollectionTableComponent extends AbstractFieldReadComponen
         return result;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadComplexFieldCollectionTableComponent_BaseFactory; return function ReadComplexFieldCollectionTableComponent_Factory(t) { return (ɵReadComplexFieldCollectionTableComponent_BaseFactory || (ɵReadComplexFieldCollectionTableComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadComplexFieldCollectionTableComponent)))(t || ReadComplexFieldCollectionTableComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldCollectionTableComponent, selectors: [["ccd-read-complex-field-collection-table"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 13, vars: 6, consts: [["showEmptyTd", ""], ["SimpleRow", ""], [1, "complex-panel", 3, "hidden"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex panel table", 1, "complex-panel-table"], ["scope", "col", 4, "ngFor", "ngForOf"], [4, "ngFor", "ngForOf"], ["scope", "col"], ["href", "javascript:void(0)", 1, "sort-widget", 3, "click", "innerHTML"], [1, "new-table-row", "accordion-heading", 3, "click"], [2, "float", "right"], ["href", "javascript:void(0)"], ["alt", "image", 1, "accordion-image", 3, "src"], [3, "hidden"], [3, "colSpan"], ["aria-describedby", "complex panel table expanded", 1, "complex-panel-table"], [4, "ngIf", "ngIfElse"], [3, "caseField", "context"], ["class", "complex-panel-simple-field accordion-body", 3, "hidden", 4, "ngIf"], [3, "hidden", 4, "ngIf"], [1, "complex-panel-simple-field", "accordion-body", 3, "hidden"], ["class", "text-16", 4, "ngIf"], ["colspan", "2"], ["class", "complex-panel-compound-field", 3, "hidden", 4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], [1, "complex-panel-nested-field", 3, "hidden"], [4, "ngIf"]], template: function ReadComplexFieldCollectionTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldCollectionTableComponent, selectors: [["ccd-read-complex-field-collection-table"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 13, vars: 6, consts: [["showEmptyTd", ""], ["SimpleRow", ""], [1, "complex-panel", 3, "hidden"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex panel table", 1, "complex-panel-table"], ["scope", "col", 4, "ngFor", "ngForOf"], [4, "ngFor", "ngForOf"], ["scope", "col"], ["href", "javascript:void(0)", 1, "sort-widget", 3, "click", "innerHTML"], [1, "new-table-row", "accordion-heading", 3, "click"], [2, "float", "right"], ["href", "javascript:void(0)"], ["alt", "accordion-img", 1, "accordion-image", 3, "src"], [3, "hidden"], [3, "colSpan"], ["aria-describedby", "complex panel table expanded", 1, "complex-panel-table"], [4, "ngIf", "ngIfElse"], [3, "caseField", "context"], ["class", "complex-panel-simple-field accordion-body", 3, "hidden", 4, "ngIf"], [3, "hidden", 4, "ngIf"], [1, "complex-panel-simple-field", "accordion-body", 3, "hidden"], ["class", "text-16", 4, "ngIf"], ["colspan", "2"], ["class", "complex-panel-compound-field", 3, "hidden", 4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], [1, "complex-panel-nested-field", 3, "hidden"], [4, "ngIf"]], template: function ReadComplexFieldCollectionTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2)(1, "dl", 3)(2, "dt")(3, "span", 4);
             i0.ɵɵtext(4);
             i0.ɵɵpipe(5, "rpxTranslate");
@@ -28121,7 +28168,7 @@ class ReadComplexFieldCollectionTableComponent extends AbstractFieldReadComponen
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadComplexFieldCollectionTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-complex-field-collection-table', template: "<div class=\"complex-panel\" [hidden]=\"caseField.hidden\">\n  <dl class=\"complex-panel-title\">\n    <dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt>\n    <dd></dd>\n  </dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex panel table\">\n    <tbody>\n    <!-- <COMPLEX table field header>-->\n    <tr>\n      <th *ngFor=\"let heading of columns\" scope=\"col\">\n        <span class=\"text-16\">{{columnsAllLabels[heading].label | rpxTranslate}}</span>\n        <a href=\"javascript:void(0)\"\n           (click)=\"sortRowsByColumns(heading)\"\n           class=\"sort-widget\"\n           [innerHTML]=\"sortWidget(columnsAllLabels[heading])\"></a>\n      </th>\n      <th></th>\n    </tr>\n    <!-- </COMPLEX table field header>-->\n    <ng-container *ngFor=\"let item of rows; let i = index;\">\n      <!-- <COMPLEX table collapsed view>-->\n      <tr class=\"new-table-row accordion-heading\" (click)=\"isHidden[i] = !isHidden[i]\"\n          [class.last-accordion]=\"isHidden[i]\">\n        <ng-container *ngFor=\"let heading of columns\">\n          <td class=\"text-16\">\n            <div *ngIf=\"item[heading]; else showEmptyTd\">\n              <ccd-field-read\n                [caseField]=\"toCaseField(heading, item[heading].label, columnsHorizontalLabel[heading].type, item[heading])\"\n                [context]=\"context\"></ccd-field-read>\n            </div>\n            <ng-template #showEmptyTd>\n              <div>&nbsp;</div>\n            </ng-template>\n          </td>\n        </ng-container>\n        <td>\n          <div style=\"float: right;\">\n            <a href=\"javascript:void(0)\"> <img src=\"{{ getImage(i) }}\" alt=\"image\" class=\"accordion-image\"/></a>\n          </div>\n        </td>\n      </tr>\n      <!-- </COMPLEX table collapsed view>-->\n      <!-- <COMPLEX table expanded view>-->\n      <tr [hidden]=\"isHidden[i]\">\n        <td [colSpan]=\"columns.length + 1\">\n          <table class=\"complex-panel-table\" aria-describedby=\"complex panel table expanded\">\n            <tbody>\n            <ng-container\n              *ngFor=\"let vLabel of columnsVerticalLabel | keyvalue: keepOriginalOrder | ccdCollectionTableCaseFieldsFilter: caseField: rows[i] | ccdReadFieldsFilter:true :undefined :true\">\n              <!-- <COMPLEX table expandable body simple field>-->\n              <tr class=\"complex-panel-simple-field accordion-body\" *ngIf=\"item[vLabel.id]\" [hidden]=\"vLabel.hidden\">\n                <th scope=\"col\"><span class=\"text-16\">{{vLabel.label | rpxTranslate}}</span></th>\n                <td *ngIf=\"vLabel['type'] !== 'Complex'\" class=\"text-16\">\n                  <ccd-field-read [caseField]=\"toCaseField('', vLabel.label, vLabel.field_type, item[vLabel.id])\"\n                                  [context]=\"context\"></ccd-field-read>\n                </td>\n              </tr>\n              <!-- </COMPLEX table expandable body simple field>-->\n\n              <!-- <COMPLEX table expandable body complex field>-->\n              <tr *ngIf=\"vLabel['type'] === 'Complex' && addCaseFieldValue(vLabel, item[vLabel.id])\" [hidden]=\"vLabel.hidden\">\n                <td colspan=\"2\">\n                  <ng-container *ngFor=\"let caseField of vLabel | ccdReadFieldsFilter:true :undefined :true\">\n                      <tr class=\"complex-panel-compound-field\" *ngIf=\"(caseField | ccdIsCompound); else SimpleRow\" [hidden]=\"caseField\">\n                        <td colspan=\"2\">\n                          <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                        </td>\n                      </tr>\n                      <ng-template #SimpleRow>\n                        <tr class=\"complex-panel-nested-field\" [hidden]=\"caseField.hidden\">\n                          <th scope=\"col\"><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></th>\n                          <td *ngIf=\"!item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                          </td>\n                          <td *ngIf=\"item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <ccd-read-case-link-field [caseField]=\"addCaseReferenceValue(caseField, item[vLabel.id].CaseReference)\" [context]=\"context\"></ccd-read-case-link-field>\n                          </td>\n                        </tr>\n                      </ng-template>\n                  </ng-container>\n                </td>\n              </tr>\n              <!-- <COMPLEX table expandable body complex field>-->\n            </ng-container>\n            </tbody>\n          </table>\n        </td>\n      </tr>\n      <!-- </COMPLEX table expanded view>-->\n    </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th{border-bottom:none}.complex-panel .complex-panel-table th{padding-left:5px;font-weight:700;border-bottom:none}.complex-panel .complex-panel-table td{padding-left:5px;padding-top:0;padding-bottom:0;border-bottom:none}.complex-panel .new-table-row{border-top:1px solid #bfc1c3}.complex-panel .complex-panel-simple-field th{padding-left:5px;padding-top:0;padding-bottom:0;width:295px}.complex-panel .complex-panel-nested-field th{padding-left:33px;padding-top:0;padding-bottom:0;width:200px}.complex-panel .complex-panel-compound-field td{padding:5px;border-bottom:none}.sort-widget{cursor:pointer;text-decoration:none;color:#0b0c0c}.accordion-wrapper{margin-bottom:20px}.accordion-wrapper .heading-medium{margin:0}.accordion-wrapper .accordion-heading{border-top:1px solid #bfc1c3;padding-top:20px;padding-bottom:10px;height:20px;cursor:pointer}.accordion-wrapper .accordion-heading .accordion-image{width:25px;margin-right:20px}.accordion-wrapper .accordion-body{margin-top:20px;margin-right:20px}.accordion-wrapper .last-accordion{border-bottom:1px solid #bfc1c3;padding-bottom:30px}\n"] }]
+        args: [{ selector: 'ccd-read-complex-field-collection-table', template: "<div class=\"complex-panel\" [hidden]=\"caseField.hidden\">\n  <dl class=\"complex-panel-title\">\n    <dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt>\n    <dd></dd>\n  </dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex panel table\">\n    <tbody>\n    <!-- <COMPLEX table field header>-->\n    <tr>\n      <th *ngFor=\"let heading of columns\" scope=\"col\">\n        <span class=\"text-16\">{{columnsAllLabels[heading].label | rpxTranslate}}</span>\n        <a href=\"javascript:void(0)\"\n           (click)=\"sortRowsByColumns(heading)\"\n           class=\"sort-widget\"\n           [innerHTML]=\"sortWidget(columnsAllLabels[heading])\"></a>\n      </th>\n      <th></th>\n    </tr>\n    <!-- </COMPLEX table field header>-->\n    <ng-container *ngFor=\"let item of rows; let i = index;\">\n      <!-- <COMPLEX table collapsed view>-->\n      <tr class=\"new-table-row accordion-heading\" (click)=\"isHidden[i] = !isHidden[i]\"\n          [class.last-accordion]=\"isHidden[i]\">\n        <ng-container *ngFor=\"let heading of columns\">\n          <td class=\"text-16\">\n            <div *ngIf=\"item[heading]; else showEmptyTd\">\n              <ccd-field-read\n                [caseField]=\"toCaseField(heading, item[heading].label, columnsHorizontalLabel[heading].type, item[heading])\"\n                [context]=\"context\"></ccd-field-read>\n            </div>\n            <ng-template #showEmptyTd>\n              <div>&nbsp;</div>\n            </ng-template>\n          </td>\n        </ng-container>\n        <td>\n          <div style=\"float: right;\">\n            <a href=\"javascript:void(0)\"> <img src=\"{{ getImage(i) }}\" alt=\"accordion-img\" class=\"accordion-image\"/></a>\n          </div>\n        </td>\n      </tr>\n      <!-- </COMPLEX table collapsed view>-->\n      <!-- <COMPLEX table expanded view>-->\n      <tr [hidden]=\"isHidden[i]\">\n        <td [colSpan]=\"columns.length + 1\">\n          <table class=\"complex-panel-table\" aria-describedby=\"complex panel table expanded\">\n            <tbody>\n            <ng-container\n              *ngFor=\"let vLabel of columnsVerticalLabel | keyvalue: keepOriginalOrder | ccdCollectionTableCaseFieldsFilter: caseField: rows[i] | ccdReadFieldsFilter:true :undefined :true\">\n              <!-- <COMPLEX table expandable body simple field>-->\n              <tr class=\"complex-panel-simple-field accordion-body\" *ngIf=\"item[vLabel.id]\" [hidden]=\"vLabel.hidden\">\n                <th scope=\"col\"><span class=\"text-16\">{{ vLabel.label | rpxTranslate }}</span></th>\n                <td *ngIf=\"vLabel['type'] !== 'Complex'\" class=\"text-16\">\n                  <ccd-field-read [caseField]=\"toCaseField('', vLabel.label, vLabel.field_type, item[vLabel.id])\"\n                                  [context]=\"context\"></ccd-field-read>\n                </td>\n              </tr>\n              <!-- </COMPLEX table expandable body simple field>-->\n\n              <!-- <COMPLEX table expandable body complex field>-->\n              <tr *ngIf=\"vLabel['type'] === 'Complex' && addCaseFieldValue(vLabel, item[vLabel.id])\" [hidden]=\"vLabel.hidden\">\n                <td colspan=\"2\">\n                  <ng-container *ngFor=\"let caseField of vLabel | ccdReadFieldsFilter:true :undefined :true\">\n                      <tr class=\"complex-panel-compound-field\" *ngIf=\"(caseField | ccdIsCompound); else SimpleRow\" [hidden]=\"caseField\">\n                        <td colspan=\"2\">\n                          <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                        </td>\n                      </tr>\n                      <ng-template #SimpleRow>\n                        <tr class=\"complex-panel-nested-field\" [hidden]=\"caseField.hidden\">\n                          <th scope=\"col\"><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></th>\n                          <td *ngIf=\"!item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                          </td>\n                          <td *ngIf=\"item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <ccd-read-case-link-field [caseField]=\"addCaseReferenceValue(caseField, item[vLabel.id].CaseReference)\" [context]=\"context\"></ccd-read-case-link-field>\n                          </td>\n                        </tr>\n                      </ng-template>\n                  </ng-container>\n                </td>\n              </tr>\n              <!-- <COMPLEX table expandable body complex field>-->\n            </ng-container>\n            </tbody>\n          </table>\n        </td>\n      </tr>\n      <!-- </COMPLEX table expanded view>-->\n    </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th{border-bottom:none}.complex-panel .complex-panel-table th{padding-left:5px;font-weight:700;border-bottom:none}.complex-panel .complex-panel-table td{padding-left:5px;padding-top:0;padding-bottom:0;border-bottom:none}.complex-panel .new-table-row{border-top:1px solid #bfc1c3}.complex-panel .complex-panel-simple-field th{padding-left:5px;padding-top:0;padding-bottom:0;width:295px}.complex-panel .complex-panel-nested-field th{padding-left:33px;padding-top:0;padding-bottom:0;width:200px}.complex-panel .complex-panel-compound-field td{padding:5px;border-bottom:none}.sort-widget{cursor:pointer;text-decoration:none;color:#0b0c0c}.accordion-wrapper{margin-bottom:20px}.accordion-wrapper .heading-medium{margin:0}.accordion-wrapper .accordion-heading{border-top:1px solid #bfc1c3;padding-top:20px;padding-bottom:10px;height:20px;cursor:pointer}.accordion-wrapper .accordion-heading .accordion-image{width:25px;margin-right:20px}.accordion-wrapper .accordion-body{margin-top:20px;margin-right:20px}.accordion-wrapper .last-accordion{border-bottom:1px solid #bfc1c3;padding-bottom:30px}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadComplexFieldCollectionTableComponent, { className: "ReadComplexFieldCollectionTableComponent", filePath: "lib/shared/components/palette/complex/read-complex-field-collection-table.component.ts", lineNumber: 12 }); })();
 
@@ -33022,7 +33069,7 @@ function CaseHistoryComponent_div_0_ng_container_57_ng_container_6_tr_4_Template
     i0.ɵɵproperty("caseField", field_r1)("caseReference", ctx_r1.caseHistory.case_id);
 } }
 function CaseHistoryComponent_div_0_ng_container_57_ng_container_6_tr_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 17)(1, "td", 18);
+    i0.ɵɵelementStart(0, "tr", 17)(1, "th", 18);
     i0.ɵɵelement(2, "ccd-field-read", 16);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -33236,7 +33283,7 @@ class CaseHistoryComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseHistoryComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-history', template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-describedby=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate : 'local'}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <td colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}\n"] }]
+        args: [{ selector: 'ccd-case-history', template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-describedby=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate : 'local'}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: AlertService }, { type: OrderService }, { type: CaseNotifier }, { type: CaseHistoryService }], { event: [{
             type: Input
         }] }); })();
@@ -33580,9 +33627,13 @@ class EventTriggerResolver {
         this.loadingService = loadingService;
     }
     resolve(route) {
-        return this.isRootTriggerEventRoute(route) ? this.getAndCacheEventTrigger(route)
-            : this.cachedEventTrigger ? Promise.resolve(this.cachedEventTrigger)
-                : this.getAndCacheEventTrigger(route);
+        if (this.isRootTriggerEventRoute(route)) {
+            return this.getAndCacheEventTrigger(route);
+        }
+        if (this.cachedEventTrigger && (route.params?.eid === this.cachedEventTrigger?.id)) {
+            return Promise.resolve(this.cachedEventTrigger);
+        }
+        return this.getAndCacheEventTrigger(route);
     }
     isRootTriggerEventRoute(route) {
         // if route is 'trigger/:eid'
@@ -33970,15 +34021,14 @@ function CaseBasicAccessViewComponent_div_18_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "dd", 12);
     i0.ɵɵtext(5);
-    i0.ɵɵpipe(6, "rpxTranslate");
-    i0.ɵɵpipe(7, "titlecase");
+    i0.ɵɵpipe(6, "titlecase");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Court or hearing centre"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 6, i0.ɵɵpipeBind1(6, 4, ctx_r0.courtOrHearingCentre)));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, ctx_r0.courtOrHearingCentre));
 } }
 function CaseBasicAccessViewComponent_div_19_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 10)(1, "dt", 11);
@@ -34053,7 +34103,7 @@ class CaseBasicAccessViewComponent {
             i0.ɵɵpipe(13, "rpxTranslate");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(14, "dl", 4);
-            i0.ɵɵtemplate(15, CaseBasicAccessViewComponent_div_15_Template, 7, 6, "div", 5)(16, CaseBasicAccessViewComponent_div_16_Template, 7, 6, "div", 5)(17, CaseBasicAccessViewComponent_div_17_Template, 7, 6, "div", 5)(18, CaseBasicAccessViewComponent_div_18_Template, 8, 8, "div", 5)(19, CaseBasicAccessViewComponent_div_19_Template, 8, 8, "div", 5);
+            i0.ɵɵtemplate(15, CaseBasicAccessViewComponent_div_15_Template, 7, 6, "div", 5)(16, CaseBasicAccessViewComponent_div_16_Template, 7, 6, "div", 5)(17, CaseBasicAccessViewComponent_div_17_Template, 7, 6, "div", 5)(18, CaseBasicAccessViewComponent_div_18_Template, 7, 6, "div", 5)(19, CaseBasicAccessViewComponent_div_19_Template, 8, 8, "div", 5);
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(20, "div", 6)(21, "button", 7);
             i0.ɵɵtext(22);
@@ -34098,7 +34148,7 @@ class CaseBasicAccessViewComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseBasicAccessViewComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-basic-access-view', template: "<ccd-loading-spinner  *ngIf=\"showSpinner\"></ccd-loading-spinner>\n<div>\n  <cut-alert type=\"information\">\n    <ng-container *ngIf=\"accessType === 'CHALLENGED'\">{{'This case requires' | rpxTranslate}} {{accessType | rpxTranslate | lowercase}} {{'access' | rpxTranslate}}.</ng-container>\n    <ng-container *ngIf=\"accessType === 'SPECIFIC'\">{{'Authorisation is needed to access this case' | rpxTranslate}}</ng-container>\n    <br />\n    <ng-container *ngIf=\"accessType === 'CHALLENGED'\">{{'This is because the case is outside your work area. If you request access to the case, it will be logged for auditing purposes' | rpxTranslate}}.</ng-container>\n    <ng-container *ngIf=\"accessType === 'SPECIFIC'\">{{\"This could be because it's outside your jurisdiction, or you may be excluded from the case. If you request access to this case, it will be logged for auditing purposes\" | rpxTranslate }}.</ng-container>\n  </cut-alert>\n  <h1 class=\"heading-h1\">#{{ caseDetails.case_id | ccdCaseReference}}</h1>\n  <h2 class=\"govuk-heading-m\">{{'Case details' | rpxTranslate}}</h2>\n  <dl class=\"govuk-summary-list\">\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.basicFields?.caseNameHmctsInternal\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Case name' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.basicFields.caseNameHmctsInternal | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.case_type?.jurisdiction?.name\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Service' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.case_type.jurisdiction.name | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.state?.description\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'State' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.state.description | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"courtOrHearingCentre\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Court or hearing centre' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{courtOrHearingCentre | rpxTranslate | titlecase}}</dd>\n    </div>\n\n    <div class=\"govuk-summary-list__row\" *ngIf=\"accessType\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Access' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{accessType | titlecase | rpxTranslate}}</dd>\n    </div>\n  </dl>\n</div>\n<div class=\"govuk-button-group\">\n  <button class=\"govuk-button govuk-!-margin-right-3\" [routerLink]=\"getRequestUrl(accessType)\">\n    {{'Request access' | rpxTranslate}}\n  </button>\n  <div class=\"govuk-grid-column-full govuk-!-padding-left-0\">\n    <p>\n      <a class=\"govuk-body\" (click)=\"onCancel()\" href=\"javascript:void(0)\">\n        {{'Cancel' | rpxTranslate}}\n      </a>\n    </p>\n  </div>\n</div>\n" }]
+        args: [{ selector: 'ccd-case-basic-access-view', template: "<ccd-loading-spinner  *ngIf=\"showSpinner\"></ccd-loading-spinner>\n<div>\n  <cut-alert type=\"information\">\n    <ng-container *ngIf=\"accessType === 'CHALLENGED'\">{{'This case requires' | rpxTranslate}} {{accessType | rpxTranslate | lowercase}} {{'access' | rpxTranslate}}.</ng-container>\n    <ng-container *ngIf=\"accessType === 'SPECIFIC'\">{{'Authorisation is needed to access this case' | rpxTranslate}}</ng-container>\n    <br />\n    <ng-container *ngIf=\"accessType === 'CHALLENGED'\">{{'This is because the case is outside your work area. If you request access to the case, it will be logged for auditing purposes' | rpxTranslate}}.</ng-container>\n    <ng-container *ngIf=\"accessType === 'SPECIFIC'\">{{\"This could be because it's outside your jurisdiction, or you may be excluded from the case. If you request access to this case, it will be logged for auditing purposes\" | rpxTranslate }}.</ng-container>\n  </cut-alert>\n  <h1 class=\"heading-h1\">#{{ caseDetails.case_id | ccdCaseReference}}</h1>\n  <h2 class=\"govuk-heading-m\">{{'Case details' | rpxTranslate}}</h2>\n  <dl class=\"govuk-summary-list\">\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.basicFields?.caseNameHmctsInternal\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Case name' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.basicFields.caseNameHmctsInternal | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.case_type?.jurisdiction?.name\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Service' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.case_type.jurisdiction.name | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"caseDetails.state?.description\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'State' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{caseDetails.state.description | rpxTranslate}}</dd>\n    </div>\n    <div class=\"govuk-summary-list__row\" *ngIf=\"courtOrHearingCentre\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Court or hearing centre' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{courtOrHearingCentre | titlecase}}</dd>\n    </div>\n\n    <div class=\"govuk-summary-list__row\" *ngIf=\"accessType\">\n      <dt class=\"govuk-summary-list__key summary-key\">{{'Access' | rpxTranslate}}</dt>\n      <dd class=\"govuk-summary-list__value\">{{accessType | titlecase | rpxTranslate}}</dd>\n    </div>\n  </dl>\n</div>\n<div class=\"govuk-button-group\">\n  <button class=\"govuk-button govuk-!-margin-right-3\" [routerLink]=\"getRequestUrl(accessType)\">\n    {{'Request access' | rpxTranslate}}\n  </button>\n  <div class=\"govuk-grid-column-full govuk-!-padding-left-0\">\n    <p>\n      <a class=\"govuk-body\" (click)=\"onCancel()\" href=\"javascript:void(0)\">\n        {{'Cancel' | rpxTranslate}}\n      </a>\n    </p>\n  </div>\n</div>\n" }]
     }], () => [{ type: CasesService }, { type: i1$1.Router }], { caseDetails: [{
             type: Input
         }], accessType: [{
@@ -34335,7 +34385,7 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_
     i0.ɵɵadvance();
     i0.ɵɵproperty("id", "case-viewer-field-read--" + field_r7.id);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup == null ? null : ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id)("markdownUseHrefAsRouterLink", ctx_r1.markdownUseHrefAsRouterLink);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup == null ? null : ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
 } }
 function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr", 40)(1, "th", 35)(2, "span", 36);
@@ -34347,14 +34397,14 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_
     i0.ɵɵadvance();
     i0.ɵɵproperty("id", "case-viewer-field-read--" + field_r7.id);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id)("markdownUseHrefAsRouterLink", ctx_r1.markdownUseHrefAsRouterLink);
+    i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup.controls["data"])("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
 } }
 function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelementStart(1, "div", 30);
     i0.ɵɵelementContainerStart(2, 31);
     i0.ɵɵpipe(3, "ccdIsCompound");
-    i0.ɵɵtemplate(4, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_4_Template, 5, 6, "tr", 32)(5, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template, 4, 5, "tr", 33);
+    i0.ɵɵtemplate(4, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_4_Template, 5, 5, "tr", 32)(5, CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template, 4, 4, "tr", 33);
     i0.ɵɵelementContainerEnd();
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
@@ -34472,7 +34522,6 @@ class CaseFullAccessViewComponent {
     caseSubscription;
     errorSubscription;
     dialogConfig;
-    markdownUseHrefAsRouterLink;
     message;
     subscription;
     notificationBannerConfig;
@@ -34516,7 +34565,6 @@ class CaseFullAccessViewComponent {
         }));
         initDialog();
         this.init();
-        this.markdownUseHrefAsRouterLink = true;
         this.sessionStorageService?.removeItem('eventUrl');
         this.subscription = this.convertHrefToRouterService?.getHrefMarkdownLinkContent().subscribe((hrefMarkdownLinkContent) => {
             // do not convert router with initial default value; convert to router only on updated link content
@@ -34851,7 +34899,7 @@ class CaseFullAccessViewComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabGroup = _t.first);
-        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], [3, "id", "label", "aria-label"], ["matTabContent", ""], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseField", "caseReference", "markdownUseHrefAsRouterLink"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], [3, "id", "label", "aria-label"], ["matTabContent", ""], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseField", "caseReference"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseFullAccessViewComponent_div_0_Template, 14, 12, "div", 1)(1, CaseFullAccessViewComponent_div_1_Template, 8, 7, "div", 1);
             i0.ɵɵelementStart(2, "ccd-callback-errors", 2);
             i0.ɵɵlistener("callbackErrorsContext", function CaseFullAccessViewComponent_Template_ccd_callback_errors_callbackErrorsContext_2_listener($event) { return ctx.callbackErrorsNotify($event); });
@@ -34889,7 +34937,7 @@ class CaseFullAccessViewComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFullAccessViewComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup?.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup?.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
+        args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup?.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup?.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
     }], () => [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i5.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }, { type: LoadingService }, { type: LinkedCasesService }, { type: CaseFlagStateService }], { hasPrint: [{
             type: Input
         }], hasEventSelector: [{
@@ -34967,20 +35015,19 @@ function CasePrinterComponent_div_0_tr_16_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "tr")(1, "td", 4)(2, "a", 5);
     i0.ɵɵpipe(3, "ccdPrintUrl");
     i0.ɵɵtext(4);
-    i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "td", 6);
-    i0.ɵɵtext(7);
-    i0.ɵɵpipe(8, "rpxTranslate");
+    i0.ɵɵelementStart(5, "td", 6);
+    i0.ɵɵtext(6);
+    i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const document_r1 = ctx.$implicit;
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("href", i0.ɵɵpipeBind1(3, 3, document_r1.url), i0.ɵɵsanitizeUrl);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 5, document_r1.name), " ");
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(8, 7, document_r1.type));
+    i0.ɵɵtextInterpolate1(" ", document_r1.name, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 5, document_r1.type));
 } }
 function CasePrinterComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
@@ -35000,7 +35047,7 @@ function CasePrinterComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵpipe(14, "rpxTranslate");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(15, "tbody");
-    i0.ɵɵtemplate(16, CasePrinterComponent_div_0_tr_16_Template, 9, 9, "tr", 3);
+    i0.ɵɵtemplate(16, CasePrinterComponent_div_0_tr_16_Template, 8, 7, "tr", 3);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -35065,7 +35112,7 @@ class CasePrinterComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CasePrinterComponent, [{
         type: Component,
-        args: [{ template: "<div *ngIf=\"isDataLoaded()\">\n  <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n  <h2 class=\"heading-h2\">{{'Print' | rpxTranslate}}</h2>\n  <table [attr.aria-describedby]=\"'case print table' | rpxTranslate\">\n    <thead>\n      <tr>\n        <th>{{'Name' | rpxTranslate}}</th>\n        <th>{{'Type' | rpxTranslate}}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let document of documents\">\n        <td class=\"document-name\"><a [href]=\"document.url | ccdPrintUrl\" target=\"_blank\" rel=\"external\">\n          {{document.name | rpxTranslate}}\n        </a></td>\n        <td class=\"document-type\">{{document.type | rpxTranslate}}</td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n" }]
+        args: [{ template: "<div *ngIf=\"isDataLoaded()\">\n  <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n  <h2 class=\"heading-h2\">{{'Print' | rpxTranslate}}</h2>\n  <table [attr.aria-describedby]=\"'case print table' | rpxTranslate\">\n    <thead>\n      <tr>\n        <th>{{'Name' | rpxTranslate}}</th>\n        <th>{{'Type' | rpxTranslate}}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let document of documents\">\n        <td class=\"document-name\"><a [href]=\"document.url | ccdPrintUrl\" target=\"_blank\" rel=\"external\">\n          {{document.name}}\n        </a></td>\n        <td class=\"document-type\">{{document.type | rpxTranslate}}</td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n" }]
     }], () => [{ type: CaseNotifier }, { type: CasesService }, { type: AlertService }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CasePrinterComponent, { className: "CasePrinterComponent", filePath: "lib/shared/components/case-viewer/printer/case-printer.component.ts", lineNumber: 14 }); })();
 
@@ -38363,7 +38410,7 @@ function SearchResultComponent_table_0_div_6_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(2, 8, ctx_r0.getTotalResults() + " results have been found"));
+    i0.ɵɵattribute("aria-label", ctx_r0.getTotalResults() + " " + i0.ɵɵpipeBind1(2, 8, "results have been found"));
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(5, 10, "Showing"), " ");
     i0.ɵɵadvance(3);
@@ -38432,7 +38479,7 @@ function SearchResultComponent_table_0_th_11_Template(rf, ctx) { if (rf & 1) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵattribute("aria-sort", ctx_r0.isSortAscending(col_r5) === null ? null : ctx_r0.isSortAscending(col_r5) ? "ascending" : "descending");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 3, col_r5.label), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r0.isTranslatable(col_r5) ? i0.ɵɵpipeBind1(4, 3, col_r5.label) : col_r5.label, " ");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r0.comparator(col_r5));
 } }
@@ -38806,6 +38853,9 @@ class SearchResultComponent {
             this.selected.page = (changes['page']).currentValue;
         }
     }
+    isTranslatable(col) {
+        return FieldsUtils.isTranslatable(col.case_field_type);
+    }
     get resultTotal() {
         const total = this.paginationMetadata.totalResultsCount;
         const maximumResultReached = total >= this.PAGINATION_MAX_ITEM_RESULT;
@@ -39081,7 +39131,7 @@ class SearchResultComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SearchResultComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-search-result', template: "<table *ngIf=\"hasResults() || hasDrafts()\">\n  <caption>\n    <h2 class=\"heading-h2\" id=\"search-result-heading__text\" tabindex=\"-1\">{{ (caseState ? 'Your cases' : 'Search result') | rpxTranslate}}</h2>\n\n    <div class=\"govuk-warning-text pagination-limit-warning\" *ngIf=\"paginationLimitEnforced\">\n      <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n      <strong class=\"govuk-warning-text__text\">\n        <span class=\"govuk-warning-text__assistive\">{{'Warning' | rpxTranslate}}</span>\n        {{'The total size of the result set is' | rpxTranslate}} {{paginationMetadata.totalResultsCount | number}}. {{'Only the first 10,000 records are available for display.' | rpxTranslate}}\n      </strong>\n    </div>\n\n    <div *ngIf=\"(hasResults() || hasDrafts())\" class=\"pagination-top\">\n      <output [attr.aria-label]=\"getTotalResults() + ' results have been found' | rpxTranslate\"></output>\n          <span class=\"text-16\" id=\"search-result-summary__text\">{{'Showing' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getFirstResult() }}</span>\n        {{'to' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getLastResult() }}</span>\n        {{'of' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getTotalResults() }}</span> {{'results' | rpxTranslate}}</span>\n    </div>\n    <div *ngIf=\"(hasResults() || hasDrafts()) && selectionEnabled\" class=\"reset-selection\"\n    [attr.aria-label]=\"'Reset selection' | rpxTranslate\">\n      <span><a class=\"search-result-reset-link\" href=\"javascript:void(0)\" (click)=\"clearSelection()\">{{'Reset case selection' | rpxTranslate}}</a></span>\n    </div>\n  </caption>\n  <thead>\n    <tr scope=\"row\">\n      <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\">\n        <div class=\"govuk-checkboxes__item\">\n          <input class=\"govuk-checkboxes__input\" id=\"select-all\" name=\"select-all\" type=\"checkbox\" (change)=\"selectAll()\" [checked]=\"allOnPageSelected()\" [disabled]=\"!canAnyBeShared()\" />\n          <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-all\" [attr.aria-labelledby]=\"'select-all'\">\n          </label>\n        </div>\n      </td>\n      <th *ngFor=\"let col of resultView.columns\" class=\"search-result-column-header\"\n        [attr.aria-sort]=\"isSortAscending(col) === null ? null : (isSortAscending(col) ? 'ascending' : 'descending')\" scope=\"col\">\n        <div>\n          <div class=\"search-result-column-label\" (click)=\"sort(col)\" (keyup)=\"noop()\">\n            {{col.label | rpxTranslate}}\n          </div>\n          <div *ngIf=\"comparator(col)\" class=\"search-result-column-sort\">\n            <a (click)=\"sort(col)\" class=\"sort-widget\" [innerHTML]=\"sortWidget(col)\" href=\"javascript:void(0)\"></a>\n          </div>\n        </div>\n      </th>\n      <th *ngIf=\"activityEnabled()\" style=\"width: 110px;\" scope=\"col\">&ZeroWidthSpace;</th>\n    </tr>\n  </thead>\n\n  <tbody>\n    <!-- sorted by consumer -->\n    <ng-container *ngIf=\"consumerSortingEnabled\">\n      <tr *ngFor=\"let result of resultView.results | paginate: { itemsPerPage: paginationPageSize, currentPage: selected.page, totalItems: resultTotal }\">\n        <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\" scope=\"col\">\n          <div class=\"govuk-checkboxes__item\">\n            <input class=\"govuk-checkboxes__input\" id=\"select-{{ result.case_id }}\" name=\"select-{{ result.case_id }}\"\n              type=\"checkbox\" (change)=\"changeSelection(result)\" [checked]=\"isSelected(result)\" [disabled]=\"!canBeShared(result)\" />\n            <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-{{ result.case_id }}\" [attr.aria-labelledby]=\"'select-' + result.case_id\">\n            </label>\n          </div>\n        </td>\n        <td class=\"search-result-column-cell\" *ngFor=\"let col of resultView.columns; let colIndex = index\" scope=\"row\">\n          <a *ngIf=\"colIndex == 0\" [routerLink]=\"prepareCaseLinkUrl(result.case_id)\"\n            attr.aria-label=\"go to case with Case reference:{{ result.case_id | ccdCaseReference }}\" class=\"govuk-link\">\n            <ng-container class=\"text-16\" *ngIf=\"!hideRows\">\n              <ccd-field-read *ngIf=\"draftPrefixOrGet(col, result); else case_reference\"\n                              ccdLabelSubstitutor [caseField]=\"getColumnsWithPrefix(result.columns[col.case_field_id], result)\"\n                              [contextFields]=\"result.hydrated_case_fields\"\n                              [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n              <ng-template #case_reference>{{result.case_id | ccdCaseReference}}</ng-template>\n            </ng-container>\n          </a>\n          <div *ngIf=\"colIndex != 0\" class=\"text-16\" [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-field-read ccdLabelSubstitutor\n                            [caseField]=\"result.columns[col.case_field_id]\"\n                            [contextFields]=\"result.hydrated_case_fields\"\n                            [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n          </div>\n        </td>\n        <td *ngIf=\"activityEnabled()\">\n          <div [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-activity [caseId]=\"result.case_id\" [displayMode]=\"ICON\"></ccd-activity>\n          </div>\n        </td>\n      </tr>\n    </ng-container>\n    <!-- sorted by toolkit -->\n    <ng-container *ngIf=\"!consumerSortingEnabled\">\n      <tr *ngFor=\"let result of resultView.results | ccdSortSearchResult : sortParameters | paginate: { itemsPerPage: paginationPageSize, currentPage: selected.page, totalItems: resultTotal }\">\n        <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\" scope=\"col\">\n          <div class=\"govuk-checkboxes__item\">\n            <input class=\"govuk-checkboxes__input\" id=\"select-{{ result.case_id }}\" name=\"select-{{ result.case_id }}\"\n              type=\"checkbox\" (change)=\"changeSelection(result)\" [checked]=\"isSelected(result)\" [disabled]=\"!canBeShared(result)\" (keyup)=\"onKeyUp($event, result)\" />\n            <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-{{ result.case_id }}\" [attr.aria-labelledby]=\"'select-' + result.case_id\">\n            </label>\n          </div>\n        </td>\n        <td class=\"search-result-column-cell\" *ngFor=\"let col of resultView.columns; let colIndex = index\" scope=\"row\">\n\n          <a *ngIf=\"colIndex == 0\" [routerLink]=\"prepareCaseLinkUrl(result.case_id)\"\n            attr.aria-label=\"go to case with Case reference:{{ result.case_id | ccdCaseReference }}\" class=\"govuk-link\">\n            <ng-container class=\"text-16\" *ngIf=\"!hideRows\">\n              <ccd-field-read *ngIf=\"draftPrefixOrGet(col, result); else case_reference\"\n                              ccdLabelSubstitutor [caseField]=\"getColumnsWithPrefix(result.columns[col.case_field_id], result)\"\n                              [contextFields]=\"result.hydrated_case_fields\"\n                              [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n              <ng-template #case_reference>{{result.case_id | ccdCaseReference}}</ng-template>\n            </ng-container>\n          </a>\n          <div *ngIf=\"colIndex != 0\" class=\"text-16\" [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-field-read ccdLabelSubstitutor\n                            [caseField]=\"result.columns[col.case_field_id]\"\n                            [contextFields]=\"result.hydrated_case_fields\"\n                            [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n          </div>\n        </td>\n        <td *ngIf=\"activityEnabled()\">\n          <div [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-activity [caseId]=\"result.case_id\" [displayMode]=\"ICON\"></ccd-activity>\n          </div>\n        </td>\n      </tr>\n    </ng-container>\n\n  </tbody>\n</table>\n\n<ccd-pagination\n  *ngIf=\"hasResults()\"\n  (pageChange)=\"goToPage($event)\"\n  [visibilityLabel]=\"hideRows ? 'hidden' : 'visible'\"\n  [autoHide]=\"true\"\n  [maxSize]=\"8\"\n  [screenReaderPaginationLabel]=\"'Pagination'\"\n  [screenReaderPageLabel]=\"page\"\n  [screenReaderCurrentLabel]=\"'You\\'re on page'\"></ccd-pagination>\n\n<div *ngIf=\"!(hasResults() || hasDrafts())\" class=\"notification\"\n[attr.aria-describedby]=\"'No cases found. Try using different filters.' | rpxTranslate\">\n{{'No cases found. Try using different filters.' | rpxTranslate}}\n</div>\n", styles: ["table thead tr th{vertical-align:top}table tbody tr td{font-size:16px;word-wrap:break-word}table tbody tr td a{float:left}table .caseid-col{white-space:nowrap}.notification{text-align:center;padding:30px 0;margin-top:75px}a:hover{color:#005ea5}.search-result-reset-link{padding-right:15px;padding-left:15px}.search-result-column-header{width:unset;table-layout:normal}.search-result-column-header div{display:table-cell;width:auto}@media screen and (max-width: 379px){.search-result-column-header div{display:block;float:right}}.search-result-column-label{font-size:16px;font-weight:700;word-wrap:break-word;cursor:pointer;padding-right:15px}.search-result-column-sort{font-size:16px}.sort-widget{cursor:pointer;text-decoration:none;color:#231f20}span.heading-medium{margin-top:-20px}.govuk-table__checkbox{vertical-align:middle;padding-left:3px}#search-result-heading__text:focus{outline:none}\n"] }]
+        args: [{ selector: 'ccd-search-result', template: "<table *ngIf=\"hasResults() || hasDrafts()\">\n  <caption>\n    <h2 class=\"heading-h2\" id=\"search-result-heading__text\" tabindex=\"-1\">{{ (caseState ? 'Your cases' : 'Search result') | rpxTranslate}}</h2>\n\n    <div class=\"govuk-warning-text pagination-limit-warning\" *ngIf=\"paginationLimitEnforced\">\n      <span class=\"govuk-warning-text__icon\" aria-hidden=\"true\">!</span>\n      <strong class=\"govuk-warning-text__text\">\n        <span class=\"govuk-warning-text__assistive\">{{'Warning' | rpxTranslate}}</span>\n        {{'The total size of the result set is' | rpxTranslate}} {{paginationMetadata.totalResultsCount | number}}. {{'Only the first 10,000 records are available for display.' | rpxTranslate}}\n      </strong>\n    </div>\n\n    <div *ngIf=\"(hasResults() || hasDrafts())\" class=\"pagination-top\">\n      <output [attr.aria-label]=\"getTotalResults() + ' ' + ('results have been found' | rpxTranslate)\"></output>\n          <span class=\"text-16\" id=\"search-result-summary__text\">{{'Showing' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getFirstResult() }}</span>\n        {{'to' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getLastResult() }}</span>\n        {{'of' | rpxTranslate}}\n        <span class=\"govuk-!-font-weight-bold\">{{ getTotalResults() }}</span> {{'results' | rpxTranslate}}</span>\n    </div>\n    <div *ngIf=\"(hasResults() || hasDrafts()) && selectionEnabled\" class=\"reset-selection\"\n    [attr.aria-label]=\"'Reset selection' | rpxTranslate\">\n      <span><a class=\"search-result-reset-link\" href=\"javascript:void(0)\" (click)=\"clearSelection()\">{{'Reset case selection' | rpxTranslate}}</a></span>\n    </div>\n  </caption>\n  <thead>\n    <tr scope=\"row\">\n      <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\">\n        <div class=\"govuk-checkboxes__item\">\n          <input class=\"govuk-checkboxes__input\" id=\"select-all\" name=\"select-all\" type=\"checkbox\" (change)=\"selectAll()\" [checked]=\"allOnPageSelected()\" [disabled]=\"!canAnyBeShared()\" />\n          <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-all\" [attr.aria-labelledby]=\"'select-all'\">\n          </label>\n        </div>\n      </td>\n      <th *ngFor=\"let col of resultView.columns\" class=\"search-result-column-header\"\n        [attr.aria-sort]=\"isSortAscending(col) === null ? null : (isSortAscending(col) ? 'ascending' : 'descending')\" scope=\"col\">\n        <div>\n          <div class=\"search-result-column-label\" (click)=\"sort(col)\" (keyup)=\"noop()\">\n            {{ isTranslatable(col) ? (col.label | rpxTranslate) : col.label }}\n          </div>\n          <div *ngIf=\"comparator(col)\" class=\"search-result-column-sort\">\n            <a (click)=\"sort(col)\" class=\"sort-widget\" [innerHTML]=\"sortWidget(col)\" href=\"javascript:void(0)\"></a>\n          </div>\n        </div>\n      </th>\n      <th *ngIf=\"activityEnabled()\" style=\"width: 110px;\" scope=\"col\">&ZeroWidthSpace;</th>\n    </tr>\n  </thead>\n\n  <tbody>\n    <!-- sorted by consumer -->\n    <ng-container *ngIf=\"consumerSortingEnabled\">\n      <tr *ngFor=\"let result of resultView.results | paginate: { itemsPerPage: paginationPageSize, currentPage: selected.page, totalItems: resultTotal }\">\n        <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\" scope=\"col\">\n          <div class=\"govuk-checkboxes__item\">\n            <input class=\"govuk-checkboxes__input\" id=\"select-{{ result.case_id }}\" name=\"select-{{ result.case_id }}\"\n              type=\"checkbox\" (change)=\"changeSelection(result)\" [checked]=\"isSelected(result)\" [disabled]=\"!canBeShared(result)\" />\n            <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-{{ result.case_id }}\" [attr.aria-labelledby]=\"'select-' + result.case_id\">\n            </label>\n          </div>\n        </td>\n        <td class=\"search-result-column-cell\" *ngFor=\"let col of resultView.columns; let colIndex = index\" scope=\"row\">\n          <a *ngIf=\"colIndex == 0\" [routerLink]=\"prepareCaseLinkUrl(result.case_id)\"\n            attr.aria-label=\"go to case with Case reference:{{ result.case_id | ccdCaseReference }}\" class=\"govuk-link\">\n            <ng-container class=\"text-16\" *ngIf=\"!hideRows\">\n              <ccd-field-read *ngIf=\"draftPrefixOrGet(col, result); else case_reference\"\n                              ccdLabelSubstitutor [caseField]=\"getColumnsWithPrefix(result.columns[col.case_field_id], result)\"\n                              [contextFields]=\"result.hydrated_case_fields\"\n                              [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n              <ng-template #case_reference>{{result.case_id | ccdCaseReference}}</ng-template>\n            </ng-container>\n          </a>\n          <div *ngIf=\"colIndex != 0\" class=\"text-16\" [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-field-read ccdLabelSubstitutor\n                            [caseField]=\"result.columns[col.case_field_id]\"\n                            [contextFields]=\"result.hydrated_case_fields\"\n                            [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n          </div>\n        </td>\n        <td *ngIf=\"activityEnabled()\">\n          <div [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-activity [caseId]=\"result.case_id\" [displayMode]=\"ICON\"></ccd-activity>\n          </div>\n        </td>\n      </tr>\n    </ng-container>\n    <!-- sorted by toolkit -->\n    <ng-container *ngIf=\"!consumerSortingEnabled\">\n      <tr *ngFor=\"let result of resultView.results | ccdSortSearchResult : sortParameters | paginate: { itemsPerPage: paginationPageSize, currentPage: selected.page, totalItems: resultTotal }\">\n        <td *ngIf=\"selectionEnabled\" class=\"govuk-table__checkbox\" scope=\"col\">\n          <div class=\"govuk-checkboxes__item\">\n            <input class=\"govuk-checkboxes__input\" id=\"select-{{ result.case_id }}\" name=\"select-{{ result.case_id }}\"\n              type=\"checkbox\" (change)=\"changeSelection(result)\" [checked]=\"isSelected(result)\" [disabled]=\"!canBeShared(result)\" (keyup)=\"onKeyUp($event, result)\" />\n            <label class=\"govuk-label govuk-checkboxes__label\" for=\"select-{{ result.case_id }}\" [attr.aria-labelledby]=\"'select-' + result.case_id\">\n            </label>\n          </div>\n        </td>\n        <td class=\"search-result-column-cell\" *ngFor=\"let col of resultView.columns; let colIndex = index\" scope=\"row\">\n\n          <a *ngIf=\"colIndex == 0\" [routerLink]=\"prepareCaseLinkUrl(result.case_id)\"\n            attr.aria-label=\"go to case with Case reference:{{ result.case_id | ccdCaseReference }}\" class=\"govuk-link\">\n            <ng-container class=\"text-16\" *ngIf=\"!hideRows\">\n              <ccd-field-read *ngIf=\"draftPrefixOrGet(col, result); else case_reference\"\n                              ccdLabelSubstitutor [caseField]=\"getColumnsWithPrefix(result.columns[col.case_field_id], result)\"\n                              [contextFields]=\"result.hydrated_case_fields\"\n                              [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n              <ng-template #case_reference>{{result.case_id | ccdCaseReference}}</ng-template>\n            </ng-container>\n          </a>\n          <div *ngIf=\"colIndex != 0\" class=\"text-16\" [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-field-read ccdLabelSubstitutor\n                            [caseField]=\"result.columns[col.case_field_id]\"\n                            [contextFields]=\"result.hydrated_case_fields\"\n                            [elementsToSubstitute]=\"['value']\"></ccd-field-read>\n          </div>\n        </td>\n        <td *ngIf=\"activityEnabled()\">\n          <div [style.visibility]=\"hideRows ? 'hidden' : 'visible'\">\n            <ccd-activity [caseId]=\"result.case_id\" [displayMode]=\"ICON\"></ccd-activity>\n          </div>\n        </td>\n      </tr>\n    </ng-container>\n\n  </tbody>\n</table>\n\n<ccd-pagination\n  *ngIf=\"hasResults()\"\n  (pageChange)=\"goToPage($event)\"\n  [visibilityLabel]=\"hideRows ? 'hidden' : 'visible'\"\n  [autoHide]=\"true\"\n  [maxSize]=\"8\"\n  [screenReaderPaginationLabel]=\"'Pagination'\"\n  [screenReaderPageLabel]=\"page\"\n  [screenReaderCurrentLabel]=\"'You\\'re on page'\"></ccd-pagination>\n\n<div *ngIf=\"!(hasResults() || hasDrafts())\" class=\"notification\"\n[attr.aria-describedby]=\"'No cases found. Try using different filters.' | rpxTranslate\">\n{{'No cases found. Try using different filters.' | rpxTranslate}}\n</div>\n", styles: ["table thead tr th{vertical-align:top}table tbody tr td{font-size:16px;word-wrap:break-word}table tbody tr td a{float:left}table .caseid-col{white-space:nowrap}.notification{text-align:center;padding:30px 0;margin-top:75px}a:hover{color:#005ea5}.search-result-reset-link{padding-right:15px;padding-left:15px}.search-result-column-header{width:unset;table-layout:normal}.search-result-column-header div{display:table-cell;width:auto}@media screen and (max-width: 379px){.search-result-column-header div{display:block;float:right}}.search-result-column-label{font-size:16px;font-weight:700;word-wrap:break-word;cursor:pointer;padding-right:15px}.search-result-column-sort{font-size:16px}.sort-widget{cursor:pointer;text-decoration:none;color:#231f20}span.heading-medium{margin-top:-20px}.govuk-table__checkbox{vertical-align:middle;padding-left:3px}#search-result-heading__text:focus{outline:none}\n"] }]
     }], () => [{ type: SearchResultViewItemComparatorFactory }, { type: AbstractAppConfig }, { type: ActivityService }, { type: CaseReferencePipe }, { type: PlaceholderService }, { type: BrowserService }, { type: SessionStorageService }], { caseLinkUrlTemplate: [{
             type: Input
         }], jurisdiction: [{