@hmcts/ccd-case-ui-toolkit 7.0.38 → 7.0.39-callback-event-errors-rework

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

@@ -6601,7 +6601,7 @@ DocumentManagementService.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token
 
 class ErrorNotifierService {
     constructor() {
-        this.errorSource = new Subject();
+        this.errorSource = new BehaviorSubject(null);
         this.error = this.errorSource.asObservable();
     }
     announceError(error) {
@@ -10372,6 +10372,7 @@ class CallbackErrorsComponent {
             errorContext.ignoreWarning = false;
             errorContext.triggerText = this.triggerTextContinue;
         }
+        errorContext.eventId = this.error?.details?.eventId;
         return errorContext;
     }
     hasInvalidData() {
@@ -30309,11 +30310,14 @@ CaseResolver.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: CaseResolve
     }], function () { return [{ type: CaseNotifier }, { type: DraftService }, { type: NavigationNotifierService }, { type: i1$1.Router }, { type: SessionStorageService }, { type: AbstractAppConfig }]; }, null); })();
 
 class EventTriggerResolver {
-    constructor(casesService, alertService, profileService, profileNotifier) {
+    constructor(casesService, alertService, profileService, profileNotifier, router, appConfig, errorNotifier) {
         this.casesService = casesService;
         this.alertService = alertService;
         this.profileService = profileService;
         this.profileNotifier = profileNotifier;
+        this.router = router;
+        this.appConfig = appConfig;
+        this.errorNotifier = errorNotifier;
     }
     resolve(route) {
         return this.isRootTriggerEventRoute(route) ? this.getAndCacheEventTrigger(route)
@@ -30345,7 +30349,11 @@ class EventTriggerResolver {
         return this.casesService
             .getEventTrigger(caseTypeId, eventTriggerId, cid, ignoreWarning)
             .pipe(map(eventTrigger => this.cachedEventTrigger = eventTrigger), catchError(error => {
+            error.details = { eventId: eventTriggerId, ...error.details };
+            this.alertService.setPreserveAlerts(true);
             this.alertService.error(error.message);
+            this.errorNotifier.announceError(error);
+            this.router.navigate([`/cases/case-details/${cid}/tasks`]);
             return throwError(error);
         })).toPromise();
     }
@@ -30354,11 +30362,11 @@ EventTriggerResolver.PARAM_CASE_ID = 'cid';
 EventTriggerResolver.PARAM_EVENT_ID = 'eid';
 EventTriggerResolver.IGNORE_WARNING = 'ignoreWarning';
 EventTriggerResolver.IGNORE_WARNING_VALUES = ['true', 'false'];
-EventTriggerResolver.ɵfac = function EventTriggerResolver_Factory(t) { return new (t || EventTriggerResolver)(i0.ɵɵinject(CasesService), i0.ɵɵinject(AlertService), i0.ɵɵinject(ProfileService), i0.ɵɵinject(ProfileNotifier)); };
+EventTriggerResolver.ɵfac = function EventTriggerResolver_Factory(t) { return new (t || EventTriggerResolver)(i0.ɵɵinject(CasesService), i0.ɵɵinject(AlertService), i0.ɵɵinject(ProfileService), i0.ɵɵinject(ProfileNotifier), i0.ɵɵinject(i1$1.Router), i0.ɵɵinject(AbstractAppConfig), i0.ɵɵinject(ErrorNotifierService)); };
 EventTriggerResolver.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: EventTriggerResolver, factory: EventTriggerResolver.ɵfac });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EventTriggerResolver, [{
         type: Injectable
-    }], function () { return [{ type: CasesService }, { type: AlertService }, { type: ProfileService }, { type: ProfileNotifier }]; }, null); })();
+    }], function () { return [{ type: CasesService }, { type: AlertService }, { type: ProfileService }, { type: ProfileNotifier }, { type: i1$1.Router }, { type: AbstractAppConfig }, { type: ErrorNotifierService }]; }, null); })();
 
 function CaseEventTriggerComponent_div_0_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
@@ -30986,7 +30994,7 @@ function CaseFullAccessViewComponent_div_8_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("isDisabled", ctx_r3.isTriggerButtonDisabled())("triggers", ctx_r3.caseDetails.triggers)("triggerText", ctx_r3.triggerText);
+    i0.ɵɵproperty("isDisabled", ctx_r3.isTriggerButtonDisabled())("triggers", ctx_r3.caseDetails.triggers)("triggerText", ctx_r3.triggerText)("eventId", ctx_r3.eventId);
 } }
 function CaseFullAccessViewComponent_div_9_Template(rf, ctx) { if (rf & 1) {
     const _r13 = i0.ɵɵgetCurrentView();
@@ -31157,23 +31165,20 @@ class CaseFullAccessViewComponent {
         this.caseFlagsExternalUser = false;
         this.caseFlagsReadExternalMode = '#ARGUMENT(READ,EXTERNAL)';
         this.subs = [];
-        this.callbackErrorsSubject = new Subject();
     }
     ngOnInit() {
+        this.callbackErrorsSubject = this.errorNotifierService.errorSource.pipe(filter((x) => {
+            if (x && x.status !== 401 && x.status !== 403) {
+                this.error = x;
+                return true;
+            }
+            return false;
+        }));
         initDialog();
         this.init();
-        this.callbackErrorsSubject.subscribe(errorEvent => {
-            this.error = errorEvent;
-        });
-        this.errorSubscription = this.errorNotifierService.error.subscribe(error => {
-            if (error && error.status !== 401 && error.status !== 403) {
-                this.error = error;
-                this.callbackErrorsSubject.next(this.error);
-            }
-        });
         this.markdownUseHrefAsRouterLink = true;
-        this.sessionStorageService.removeItem('eventUrl');
-        this.subscription = this.convertHrefToRouterService.getHrefMarkdownLinkContent().subscribe((hrefMarkdownLinkContent) => {
+        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
             if (hrefMarkdownLinkContent !== 'Default') {
                 this.convertHrefToRouterService.callAngularRouter(hrefMarkdownLinkContent);
@@ -31233,7 +31238,7 @@ class CaseFullAccessViewComponent {
         }));
     }
     postViewActivity() {
-        return this.activityPollingService.postViewActivity(this.caseDetails.case_id);
+        return this.activityPollingService.postViewActivity(this.caseDetails?.case_id);
     }
     clearErrorsAndWarnings() {
         this.resetErrors();
@@ -31241,7 +31246,7 @@ class CaseFullAccessViewComponent {
         this.triggerText = CaseFullAccessViewComponent.TRIGGER_TEXT_START;
     }
     async applyTrigger(trigger) {
-        this.error = null;
+        this.errorNotifierService.announceError(null);
         const theQueryParams = {};
         if (this.ignoreWarning) {
             theQueryParams['ignoreWarning'] = this.ignoreWarning;
@@ -31289,6 +31294,7 @@ class CaseFullAccessViewComponent {
     callbackErrorsNotify(callbackErrorsContext) {
         this.ignoreWarning = callbackErrorsContext.ignoreWarning;
         this.triggerText = callbackErrorsContext.triggerText;
+        this.eventId = callbackErrorsContext.eventId;
     }
     isDraft() {
         return Draft.isDraft(this.caseDetails.case_id);
@@ -31398,7 +31404,7 @@ class CaseFullAccessViewComponent {
     }
     hasActiveCaseFlags() {
         // Determine which tab contains the FlagLauncher CaseField type, from the CaseView object in the snapshot data
-        const caseFlagsTab = this.caseDetails.tabs
+        const caseFlagsTab = this.caseDetails?.tabs
             ? (this.caseDetails.tabs).filter(tab => tab.fields && tab.fields.some(caseField => FieldsUtils.isFlagLauncherCaseField(caseField)))[0]
             : null;
         if (caseFlagsTab) {
@@ -31445,24 +31451,23 @@ class CaseFullAccessViewComponent {
     }
     init() {
         // Clone and sort tabs array
-        this.sortedTabs = this.orderService.sort(this.caseDetails.tabs);
+        this.sortedTabs = this.orderService.sort(this.caseDetails?.tabs);
         this.caseFields = this.getTabFields();
         this.sortedTabs = this.sortTabFieldsAndFilterTabs(this.sortedTabs);
         this.formGroup = this.buildFormGroup(this.caseFields);
-        if (this.caseDetails.triggers && this.error) {
+        if (this.caseDetails?.triggers && this.error) {
             this.resetErrors();
         }
     }
     sortTabFieldsAndFilterTabs(tabs) {
-        return tabs
-            .map(tab => Object.assign({}, tab, { fields: this.orderService.sort(tab.fields) }))
+        return tabs?.map(tab => Object.assign({}, tab, { fields: this.orderService.sort(tab.fields) }))
             .filter(tab => ShowCondition.getInstance(tab.show_condition).matchByContextFields(this.caseFields));
     }
     getTabFields() {
-        const caseDataFields = this.sortedTabs.reduce((acc, tab) => {
+        const caseDataFields = this.sortedTabs?.reduce((acc, tab) => {
             return acc.concat(plainToClass(CaseField, tab.fields));
         }, []);
-        return caseDataFields.concat(this.caseDetails.metadataFields);
+        return caseDataFields?.concat(this.caseDetails.metadataFields);
     }
     /**
      * For EUI-3825:
@@ -31483,16 +31488,9 @@ class CaseFullAccessViewComponent {
         return new FormGroup({ data: new FormControl(value) });
     }
     resetErrors() {
-        this.error = null;
-        this.callbackErrorsSubject.next(null);
+        this.errorNotifierService.announceError(null);
         this.alertService.clear();
     }
-    getUrlFragment(url) {
-        return url.split('#')[url.split('#').length - 1];
-    }
-    getTabIndexByTabLabel(tabGroup, tabLabel) {
-        return tabGroup._tabs.toArray().findIndex((t) => t.textLabel.toLowerCase() === tabLabel.toLowerCase());
-    }
 }
 CaseFullAccessViewComponent.ORIGIN_QUERY_PARAM = 'origin';
 CaseFullAccessViewComponent.TRIGGER_TEXT_START = 'Go';
@@ -31505,7 +31503,7 @@ CaseFullAccessViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
     } 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: [["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject", "callbackErrorsContext"], [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, "isDisabled", "triggers", "triggerText", "onTriggerChange", "onTriggerSubmit"], [3, "notificationBannerConfig", "linkClicked"], ["animationDuration", "0ms", 3, "disableRipple", "selectedIndex", "selectedIndexChange"], ["tabGroup", ""], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "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: [["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject", "callbackErrorsContext"], [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, "isDisabled", "triggers", "triggerText", "eventId", "onTriggerChange", "onTriggerSubmit"], [3, "notificationBannerConfig", "linkClicked"], ["animationDuration", "0ms", 3, "disableRipple", "selectedIndex", "selectedIndexChange"], ["tabGroup", ""], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "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) {
         i0.ɵɵtemplate(0, CaseFullAccessViewComponent_div_0_Template, 14, 12, "div", 0);
         i0.ɵɵtemplate(1, CaseFullAccessViewComponent_div_1_Template, 8, 7, "div", 0);
         i0.ɵɵelementStart(2, "ccd-callback-errors", 1);
@@ -31516,7 +31514,7 @@ CaseFullAccessViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
         i0.ɵɵelement(6, "ccd-case-header", 5);
         i0.ɵɵtemplate(7, CaseFullAccessViewComponent_div_7_Template, 4, 3, "div", 6);
         i0.ɵɵelementEnd();
-        i0.ɵɵtemplate(8, CaseFullAccessViewComponent_div_8_Template, 2, 3, "div", 7);
+        i0.ɵɵtemplate(8, CaseFullAccessViewComponent_div_8_Template, 2, 4, "div", 7);
         i0.ɵɵelementEnd();
         i0.ɵɵtemplate(9, CaseFullAccessViewComponent_div_9_Template, 3, 1, "div", 8);
         i0.ɵɵelementStart(10, "div", 3)(11, "div", 9);
@@ -31543,7 +31541,7 @@ CaseFullAccessViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
     } }, styles: ["th[_ngcontent-%COMP%]{width:1%;white-space:nowrap;vertical-align:top}.compound-field[_ngcontent-%COMP%]   th[_ngcontent-%COMP%]{padding:0}.case-viewer-controls[_ngcontent-%COMP%]{margin-top:47px;margin-bottom:20px}ccd-case-header[_ngcontent-%COMP%]{float:left;margin-right:10px}ccd-event-trigger[_ngcontent-%COMP%]{float:right}.case-viewer-label[_ngcontent-%COMP%]{min-width:300px;white-space:normal}.markdown[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%]{margin-bottom:0}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFullAccessViewComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-full-access-view', template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\" (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}\n"] }]
+        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\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\"\n                                          [markdownUseHrefAsRouterLink]=\"markdownUseHrefAsRouterLink\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n        </mat-tab>\n      </mat-tab-group>\n      <router-outlet *ngIf=\"(prependedTabs && prependedTabs.length) || (appendedTabs && appendedTabs.length)\"></router-outlet>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}\n"] }]
     }], function () { return [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i4.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }]; }, { hasPrint: [{
             type: Input
         }], hasEventSelector: [{
@@ -32693,9 +32691,9 @@ function EventTriggerComponent_form_0_Template(rf, ctx) { if (rf & 1) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("formGroup", ctx_r0.triggerForm);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 7, "Next step"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 8, "Next step"));
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(11, _c0$4, !ctx_r0.triggerForm.value["trigger"]));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(12, _c0$4, !ctx_r0.triggerForm.value["trigger"]))("compareWith", ctx_r0.compareFn);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", 1 !== ctx_r0.triggers.length);
     i0.ɵɵadvance(1);
@@ -32703,23 +32701,33 @@ function EventTriggerComponent_form_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("disabled", ctx_r0.isButtonDisabled());
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 9, ctx_r0.triggerText));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 10, ctx_r0.triggerText));
 } }
 class EventTriggerComponent {
     constructor(fb, orderService) {
         this.fb = fb;
         this.orderService = orderService;
+        this.eventId = '';
         this.onTriggerSubmit = new EventEmitter();
         this.onTriggerChange = new EventEmitter();
     }
+    ngOnInit() {
+        this.triggers = this.orderService.sort(this.triggers);
+        if (this.eventId) {
+            const eventBundle = this.triggers.find(ev => ev.id === this.eventId);
+            this.triggerForm.controls['trigger'].patchValue({ id: eventBundle.id, name: eventBundle.name, description: eventBundle.description });
+        }
+    }
     ngOnChanges(changes) {
         if (changes.triggers && changes.triggers.currentValue) {
-            this.triggers = this.orderService.sort(this.triggers);
             this.triggerForm = this.fb.group({
                 trigger: [this.getDefault(), Validators.required]
             });
         }
     }
+    compareFn(c1, c2) {
+        return c1 && c2 ? c1.id === c2.id : c1 === c2;
+    }
     isButtonDisabled() {
         return !this.triggerForm.valid || this.isDisabled;
     }
@@ -32734,20 +32742,22 @@ class EventTriggerComponent {
     }
 }
 EventTriggerComponent.ɵfac = function EventTriggerComponent_Factory(t) { return new (t || EventTriggerComponent)(i0.ɵɵdirectiveInject(i3.FormBuilder), i0.ɵɵdirectiveInject(OrderService)); };
-EventTriggerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EventTriggerComponent, selectors: [["ccd-event-trigger"]], inputs: { triggers: "triggers", triggerText: "triggerText", isDisabled: "isDisabled" }, outputs: { onTriggerSubmit: "onTriggerSubmit", onTriggerChange: "onTriggerChange" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 1, consts: [["class", "event-trigger", 3, "formGroup", "ngSubmit", 4, "ngIf"], [1, "event-trigger", 3, "formGroup", "ngSubmit"], [1, "form-group", 2, "width", "350px !important"], ["for", "next-step", 1, "form-label"], ["id", "next-step", "formControlName", "trigger", 1, "form-control", "ccd-dropdown", 3, "ngClass", "change"], ["value", "", "data-default", "", 4, "ngIf"], [3, "ngValue", "title", 4, "ngFor", "ngForOf"], ["type", "submit", 1, "button", 3, "disabled"], ["value", "", "data-default", ""], [3, "ngValue", "title"]], template: function EventTriggerComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵtemplate(0, EventTriggerComponent_form_0_Template, 11, 13, "form", 0);
+EventTriggerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EventTriggerComponent, selectors: [["ccd-event-trigger"]], inputs: { triggers: "triggers", triggerText: "triggerText", isDisabled: "isDisabled", eventId: "eventId" }, outputs: { onTriggerSubmit: "onTriggerSubmit", onTriggerChange: "onTriggerChange" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 1, consts: [["class", "event-trigger", 3, "formGroup", "ngSubmit", 4, "ngIf"], [1, "event-trigger", 3, "formGroup", "ngSubmit"], [1, "form-group", 2, "width", "350px !important"], ["for", "next-step", 1, "form-label"], ["id", "next-step", "formControlName", "trigger", 1, "form-control", "ccd-dropdown", 3, "ngClass", "compareWith", "change"], ["value", "", "data-default", "", 4, "ngIf"], [3, "ngValue", "title", 4, "ngFor", "ngForOf"], ["type", "submit", 1, "button", 3, "disabled"], ["value", "", "data-default", ""], [3, "ngValue", "title"]], template: function EventTriggerComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵtemplate(0, EventTriggerComponent_form_0_Template, 11, 14, "form", 0);
     } if (rf & 2) {
         i0.ɵɵproperty("ngIf", ctx.triggers && ctx.triggers.length);
     } }, dependencies: [i4.NgClass, i4.NgForOf, i4.NgIf, i3.ɵNgNoValidate, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.NgControlStatusGroup, i3.FormGroupDirective, i3.FormControlName, i1.RpxTranslatePipe], styles: [".event-trigger[_ngcontent-%COMP%]{width:auto;margin-top:40px;margin-bottom:20px}.event-trigger[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]{margin-top:3px;margin-right:10px;margin-bottom:0;float:left;text-align:right;width:325px}.event-trigger[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .form-label[_ngcontent-%COMP%]{float:left;margin-top:5px}.event-trigger[_ngcontent-%COMP%]   select[_ngcontent-%COMP%]{width:250px}.event-trigger[_ngcontent-%COMP%]   select.EventTrigger-empty[_ngcontent-%COMP%], .event-trigger[_ngcontent-%COMP%]   select[_ngcontent-%COMP%]   [data-default][_ngcontent-%COMP%]{color:#6f777b}"] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EventTriggerComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-event-trigger', template: "<form *ngIf=\"triggers && triggers.length\" class=\"event-trigger\" (ngSubmit)=\"triggerSubmit()\" [formGroup]=\"triggerForm\">\n  <div class=\"form-group\" style=\"width: 350px !important;\">\n    <label class=\"form-label\" for=\"next-step\">{{'Next step' | rpxTranslate}}</label>\n    <select class=\"form-control ccd-dropdown\" id=\"next-step\" (change)=\"triggerChange()\" formControlName=\"trigger\" [ngClass]=\"{\n          'EventTrigger-empty': !triggerForm.value['trigger']\n        }\">\n      <option *ngIf=\"1 !== triggers.length\" value=\"\" data-default>{{'Select action' | rpxTranslate}}</option>\n      <option *ngFor=\"let trigger of triggers\" [ngValue]=\"trigger\" [title]=\"trigger.description\">{{trigger.name | rpxTranslate}}</option>\n    </select>\n  </div>\n  <button [disabled]=\"isButtonDisabled()\" type=\"submit\" class=\"button\">{{triggerText | rpxTranslate}}</button>\n</form>\n", styles: [".event-trigger{width:auto;margin-top:40px;margin-bottom:20px}.event-trigger .form-group{margin-top:3px;margin-right:10px;margin-bottom:0;float:left;text-align:right;width:325px}.event-trigger .form-group .form-label{float:left;margin-top:5px}.event-trigger select{width:250px}.event-trigger select.EventTrigger-empty,.event-trigger select [data-default]{color:#6f777b}\n"] }]
+        args: [{ selector: 'ccd-event-trigger', template: "<form *ngIf=\"triggers && triggers.length\" class=\"event-trigger\" (ngSubmit)=\"triggerSubmit()\" [formGroup]=\"triggerForm\">\n  <div class=\"form-group\" style=\"width: 350px !important;\">\n    <label class=\"form-label\" for=\"next-step\">{{'Next step' | rpxTranslate}}</label>\n    <select class=\"form-control ccd-dropdown\" id=\"next-step\" (change)=\"triggerChange()\" formControlName=\"trigger\" [ngClass]=\"{\n          'EventTrigger-empty': !triggerForm.value['trigger']\n        }\" [compareWith]=\"compareFn\">\n      <option *ngIf=\"1 !== triggers.length\" value=\"\" data-default>{{'Select action' | rpxTranslate}}</option>\n      <option *ngFor=\"let trigger of triggers\" [ngValue]=\"trigger\"  [title]=\"trigger.description\">{{trigger.name | rpxTranslate}}</option>\n    </select>\n  </div>\n  <button [disabled]=\"isButtonDisabled()\" type=\"submit\" class=\"button\">{{triggerText | rpxTranslate}}</button>\n</form>\n", styles: [".event-trigger{width:auto;margin-top:40px;margin-bottom:20px}.event-trigger .form-group{margin-top:3px;margin-right:10px;margin-bottom:0;float:left;text-align:right;width:325px}.event-trigger .form-group .form-label{float:left;margin-top:5px}.event-trigger select{width:250px}.event-trigger select.EventTrigger-empty,.event-trigger select [data-default]{color:#6f777b}\n"] }]
     }], function () { return [{ type: i3.FormBuilder }, { type: OrderService }]; }, { triggers: [{
             type: Input
         }], triggerText: [{
             type: Input
         }], isDisabled: [{
             type: Input
+        }], eventId: [{
+            type: Input
         }], onTriggerSubmit: [{
             type: Output
         }], onTriggerChange: [{