@hmcts/ccd-case-ui-toolkit 7.0.60 → 7.0.61-task-changed-on-completion

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, Injector, ViewChild, HostListener, ViewContainerRef, CUSTOM_ELEMENTS_SCHEMA } 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 * as i5 from '@angular/common';
 import { CommonModule, DOCUMENT, AsyncPipe, CurrencyPipe, formatDate } from '@angular/common';
 import * as i1 from 'rpx-xui-translation';
@@ -24,7 +24,6 @@ import { StateMachine } from '@edium/fsm';
 import * as i1$3 from '@angular/material/legacy-dialog';
 import { MAT_LEGACY_DIALOG_DATA, MatLegacyDialogModule } from '@angular/material/legacy-dialog';
 import { MatDialogConfig } from '@angular/material/dialog';
-import { ComponentPortal, PortalModule } from '@angular/cdk/portal';
 import * as i2 from '@nicky-lenaers/ngx-scroll-to';
 import { ScrollToModule } from '@nicky-lenaers/ngx-scroll-to';
 import * as marked from 'marked';
@@ -52,6 +51,7 @@ import * as i15 from '@angular/material/legacy-input';
 import { MatLegacyInputModule } from '@angular/material/legacy-input';
 import * as i14 from '@hmcts/media-viewer';
 import { MediaViewerModule } from '@hmcts/media-viewer';
+import { PortalModule } from '@angular/cdk/portal';
 import * as i2$3 from 'ngx-pagination';
 import { NgxPaginationModule, PaginatePipe } from 'ngx-pagination';
 import * as i10 from '@angular/material/legacy-tabs';
@@ -8676,11 +8676,11 @@ var TaskState;
     TaskState["PendingReConfiguration"] = "PENDING_RECONFIGURATION";
 })(TaskState || (TaskState = {}));
 
-var EventCompletionPortalTypes;
-(function (EventCompletionPortalTypes) {
-    EventCompletionPortalTypes[EventCompletionPortalTypes["TaskCancelled"] = 0] = "TaskCancelled";
-    EventCompletionPortalTypes[EventCompletionPortalTypes["TaskReassigned"] = 1] = "TaskReassigned";
-})(EventCompletionPortalTypes || (EventCompletionPortalTypes = {}));
+var EventCompletionTaskStates;
+(function (EventCompletionTaskStates) {
+    EventCompletionTaskStates[EventCompletionTaskStates["TaskCancelled"] = 0] = "TaskCancelled";
+    EventCompletionTaskStates[EventCompletionTaskStates["TaskReassigned"] = 1] = "TaskReassigned";
+})(EventCompletionTaskStates || (EventCompletionTaskStates = {}));
 
 const EVENT_COMPLETION_STATE_MACHINE = 'EVENT COMPLETION STATE MACHINE';
 class EventCompletionStateMachineService {
@@ -8719,6 +8719,7 @@ class EventCompletionStateMachineService {
         this.addTransitionsForStateTaskUnassigned();
     }
     entryActionForStateCheckTasksCanBeCompleted(state, context) {
+        const assignNeeded = context.sessionStorageService.getItem('assignNeeded');
         context.workAllocationService.getTask(context.task.id).subscribe(taskResponse => {
             if (taskResponse && taskResponse.task && taskResponse.task.task_state) {
                 switch (taskResponse.task.task_state.toUpperCase()) {
@@ -8738,6 +8739,11 @@ class EventCompletionStateMachineService {
                             // Task still assigned to current user, complete event and task
                             state.trigger(EventCompletionStates.CompleteEventAndTask);
                         }
+                        else if (assignNeeded === 'true - override') {
+                            // this will treat task as unassigned instead of reassigned to complete after user confirmation
+                            // assignNeeded will also be immediately overwritten to true
+                            state.trigger(EventCompletionStates.TaskUnassigned);
+                        }
                         else {
                             // Task has been reassigned to another user, display error message
                             context.reassignedTask = taskResponse.task;
@@ -8759,7 +8765,7 @@ class EventCompletionStateMachineService {
         // Trigger final state to complete processing of state machine
         state.trigger(EventCompletionStates.Final);
         // Load case event completion task cancelled component
-        context.component.showPortal(EventCompletionPortalTypes.TaskCancelled);
+        context.component.setTaskState(EventCompletionTaskStates.TaskCancelled);
     }
     entryActionForStateCompleteEventAndTask(state, context) {
         // Trigger final state to complete processing of state machine
@@ -8779,7 +8785,7 @@ class EventCompletionStateMachineService {
         // Trigger final state to complete processing of state machine
         state.trigger(EventCompletionStates.Final);
         // Load case event completion task reassigned component
-        context.component.showPortal(EventCompletionPortalTypes.TaskReassigned);
+        context.component.setTaskState(EventCompletionTaskStates.TaskReassigned);
     }
     entryActionForStateTaskUnassigned(state, context) {
         // Trigger final state to complete processing of state machine
@@ -8948,7 +8954,7 @@ class WorkAllocationService {
     isWAEnabled(jurisdiction, caseType) {
         this.features = this.appConfig.getWAServiceConfig();
         const ftstr = JSON.stringify(this.features);
-        console.log(`isWAEnabled: ${ftstr}`);
+        this.appConfig.logMessage(`isWAEnabled: wa-service-config returning ${ftstr.length > 0}`);
         let enabled = false;
         if (!jurisdiction || !caseType) {
             const caseInfo = JSON.parse(this.sessionStorageService.getItem('caseInfo'));
@@ -8956,7 +8962,7 @@ class WorkAllocationService {
             caseType = caseInfo.caseType;
         }
         if (!this.features || !this.features.configurations) {
-            console.log('isWAEnabled: no features');
+            this.appConfig.logMessage('isWAEnabled: no features');
             return false;
         }
         this.features.configurations.forEach(serviceConfig => {
@@ -8964,7 +8970,7 @@ class WorkAllocationService {
                 enabled = true;
             }
         });
-        console.log(`isWAEnabled: returning ${enabled}`);
+        this.appConfig.logMessage(`isWAEnabled: returning ${enabled}`);
         return enabled;
     }
     /**
@@ -8992,7 +8998,7 @@ class WorkAllocationService {
         if (!this.isWAEnabled()) {
             return of(null);
         }
-        console.log(`completeTask: completing ${taskId}`);
+        this.appConfig.logMessage(`completeTask: completing ${taskId}`);
         const url = `${this.appConfig.getWorkAllocationApiUrl()}/task/${taskId}/complete`;
         return this.http
             .post(url, { actionByEvent: true, eventName: eventName })
@@ -9013,6 +9019,7 @@ class WorkAllocationService {
         if (!this.isWAEnabled()) {
             return of(null);
         }
+        this.appConfig.logMessage(`assignAndCompleteTask: completing ${taskId}`);
         const url = `${this.appConfig.getWorkAllocationApiUrl()}/task/${taskId}/complete`;
         return this.http
             .post(url, {
@@ -9100,6 +9107,7 @@ class WorkAllocationService {
             tasks: []
         };
         if (!this.isWAEnabled()) {
+            this.appConfig.logMessage(`isWAEnabled false for ${caseId} in event ${eventId}`);
             return of(defaultPayload);
         }
         return this.http.get(`${this.appConfig.getWorkAllocationApiUrl()}/case/tasks/${caseId}/event/${eventId}/caseType/${caseType}/jurisdiction/${jurisdiction}`);
@@ -9111,6 +9119,7 @@ class WorkAllocationService {
         if (!this.isWAEnabled()) {
             return of({ task: null });
         }
+        this.appConfig.logMessage(`getTask: ${taskId}`);
         return this.http.get(`${this.appConfig.getWorkAllocationApiUrl()}/task/${taskId}`);
     }
     static ɵfac = function WorkAllocationService_Factory(t) { return new (t || WorkAllocationService)(i0.ɵɵinject(HttpService), i0.ɵɵinject(AbstractAppConfig), i0.ɵɵinject(HttpErrorService), i0.ɵɵinject(AlertService), i0.ɵɵinject(SessionStorageService)); };
@@ -9173,6 +9182,7 @@ class CaseEditComponent {
     validPageListCaseFieldsService;
     workAllocationService;
     alertService;
+    abstractConfig;
     static ORIGIN_QUERY_PARAM = 'origin';
     static ALERT_MESSAGE = 'Page is being refreshed so you will be redirected to the first page of this event.';
     eventTrigger;
@@ -9198,7 +9208,7 @@ class CaseEditComponent {
     error;
     callbackErrorsSubject = new Subject();
     validPageList = [];
-    constructor(fb, caseNotifier, router, route, fieldsUtils, fieldsPurger, registrarService, wizardFactory, sessionStorageService, windowsService, formValueService, formErrorService, loadingService, validPageListCaseFieldsService, workAllocationService, alertService) {
+    constructor(fb, caseNotifier, router, route, fieldsUtils, fieldsPurger, registrarService, wizardFactory, sessionStorageService, windowsService, formValueService, formErrorService, loadingService, validPageListCaseFieldsService, workAllocationService, alertService, abstractConfig) {
         this.fb = fb;
         this.caseNotifier = caseNotifier;
         this.router = router;
@@ -9215,6 +9225,7 @@ class CaseEditComponent {
         this.validPageListCaseFieldsService = validPageListCaseFieldsService;
         this.workAllocationService = workAllocationService;
         this.alertService = alertService;
+        this.abstractConfig = abstractConfig;
     }
     ngOnInit() {
         this.wizard = this.wizardFactory.create(this.eventTrigger);
@@ -9338,6 +9349,7 @@ class CaseEditComponent {
         const eventId = this.getEventId(form);
         const caseId = this.getCaseId(caseDetails);
         if (this.taskExistsForThisEventAndCase(taskInSessionStorage, taskEventInSessionStorage, eventId, caseId)) {
+            this.abstractConfig.logMessage(`task exist for this event for caseId and eventId as ${caseId} ${eventId}`);
             // Show event completion component to perform event completion checks
             this.eventCompletionParams = ({
                 caseId,
@@ -9545,10 +9557,12 @@ class CaseEditComponent {
         const assignNeeded = this.sessionStorageService.getItem('assignNeeded') === 'true';
         if (taskStr && assignNeeded) {
             const task = JSON.parse(taskStr);
+            this.abstractConfig.logMessage(`postCompleteTaskIfRequired with assignNeeded: taskId ${task.id} and event name ${this.eventTrigger.name}`);
             return this.workAllocationService.assignAndCompleteTask(task.id, this.eventTrigger.name);
         }
         else if (taskStr) {
             const task = JSON.parse(taskStr);
+            this.abstractConfig.logMessage(`postCompleteTaskIfRequired: taskId ${task.id} and event name ${this.eventTrigger.name}`);
             return this.workAllocationService.completeTask(task.id, this.eventTrigger.name);
         }
         return of(true);
@@ -9608,7 +9622,7 @@ class CaseEditComponent {
     hasCallbackFailed(response) {
         return response['callback_response_status'] !== 'CALLBACK_COMPLETED';
     }
-    static ɵfac = function CaseEditComponent_Factory(t) { return new (t || CaseEditComponent)(i0.ɵɵdirectiveInject(i4.FormBuilder), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FieldsUtils), i0.ɵɵdirectiveInject(FieldsPurger), i0.ɵɵdirectiveInject(ConditionalShowRegistrarService), i0.ɵɵdirectiveInject(WizardFactoryService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(WindowService), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(AlertService)); };
+    static ɵfac = function CaseEditComponent_Factory(t) { return new (t || CaseEditComponent)(i0.ɵɵdirectiveInject(i4.FormBuilder), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FieldsUtils), i0.ɵɵdirectiveInject(FieldsPurger), i0.ɵɵdirectiveInject(ConditionalShowRegistrarService), i0.ɵɵdirectiveInject(WizardFactoryService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(WindowService), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(AbstractAppConfig)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditComponent, selectors: [["ccd-case-edit"]], inputs: { eventTrigger: "eventTrigger", submit: "submit", validate: "validate", saveDraft: "saveDraft", caseDetails: "caseDetails" }, outputs: { cancelled: "cancelled", submitted: "submitted" }, features: [i0.ɵɵProvidersFeature([GreyBarService])], decls: 1, vars: 0, template: function CaseEditComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelement(0, "router-outlet");
         } }, dependencies: [i1$1.RouterOutlet], styles: ["#fieldset-case-data[_ngcontent-%COMP%]{margin-bottom:30px}#fieldset-case-data[_ngcontent-%COMP%]   th[_ngcontent-%COMP%]{width:1%;white-space:nowrap;vertical-align:top}.compound-field[_ngcontent-%COMP%]   td[_ngcontent-%COMP%]{padding:0}#confirmation-header[_ngcontent-%COMP%]{width:630px;background-color:#17958b;border:solid 1px #979797;color:#fff;text-align:center}#confirmation-body[_ngcontent-%COMP%]{width:630px;background-color:#fff}.valign-top[_ngcontent-%COMP%]{vertical-align:top}.summary-fields[_ngcontent-%COMP%]{margin-bottom:30px}.summary-fields[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]   th[_ngcontent-%COMP%], .summary-fields[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]   td[_ngcontent-%COMP%]{border-bottom:0px}a.disabled[_ngcontent-%COMP%]{pointer-events:none;cursor:default}.case-field-label[_ngcontent-%COMP%]{width:45%}.case-field-content[_ngcontent-%COMP%]{width:50%}.no-bottom-border[_ngcontent-%COMP%]{border-bottom:none}.case-field-change[_ngcontent-%COMP%]{width:5%}"] });
@@ -9616,7 +9630,7 @@ class CaseEditComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEditComponent, [{
         type: Component,
         args: [{ selector: 'ccd-case-edit', providers: [GreyBarService], template: "<router-outlet></router-outlet>\n", styles: ["#fieldset-case-data{margin-bottom:30px}#fieldset-case-data th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}#confirmation-header{width:630px;background-color:#17958b;border:solid 1px #979797;color:#fff;text-align:center}#confirmation-body{width:630px;background-color:#fff}.valign-top{vertical-align:top}.summary-fields{margin-bottom:30px}.summary-fields tbody tr th,.summary-fields tbody tr td{border-bottom:0px}a.disabled{pointer-events:none;cursor:default}.case-field-label{width:45%}.case-field-content{width:50%}.no-bottom-border{border-bottom:none}.case-field-change{width:5%}\n"] }]
-    }], () => [{ type: i4.FormBuilder }, { type: CaseNotifier }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: FieldsUtils }, { type: FieldsPurger }, { type: ConditionalShowRegistrarService }, { type: WizardFactoryService }, { type: SessionStorageService }, { type: WindowService }, { type: FormValueService }, { type: FormErrorService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }, { type: WorkAllocationService }, { type: AlertService }], { eventTrigger: [{
+    }], () => [{ type: i4.FormBuilder }, { type: CaseNotifier }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: FieldsUtils }, { type: FieldsPurger }, { type: ConditionalShowRegistrarService }, { type: WizardFactoryService }, { type: SessionStorageService }, { type: WindowService }, { type: FormValueService }, { type: FormErrorService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }, { type: WorkAllocationService }, { type: AlertService }, { type: AbstractAppConfig }], { eventTrigger: [{
             type: Input
         }], submit: [{
             type: Input
@@ -9631,7 +9645,7 @@ class CaseEditComponent {
         }], submitted: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEditComponent, { className: "CaseEditComponent", filePath: "lib/shared/components/case-editor/case-edit/case-edit.component.ts", lineNumber: 33 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEditComponent, { className: "CaseEditComponent", filePath: "lib/shared/components/case-editor/case-edit/case-edit.component.ts", lineNumber: 34 }); })();
 
 function CaseEditConfirmComponent_div_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "div");
@@ -10950,20 +10964,118 @@ class CallbackErrorsComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CallbackErrorsComponent, { className: "CallbackErrorsComponent", filePath: "lib/shared/components/error/callback-errors.component.ts", lineNumber: 10 }); })();
 
+function CaseEventCompletionComponent_app_case_event_completion_task_cancelled_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "app-case-event-completion-task-cancelled", 2);
+    i0.ɵɵlistener("notifyEventCompletionCancelled", function CaseEventCompletionComponent_app_case_event_completion_task_cancelled_0_Template_app_case_event_completion_task_cancelled_notifyEventCompletionCancelled_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setEventCanBeCompleted($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("context", ctx_r1.context);
+} }
+function CaseEventCompletionComponent_app_case_event_completion_task_reassigned_1_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "app-case-event-completion-task-reassigned", 3);
+    i0.ɵɵlistener("notifyEventCompletionReassigned", function CaseEventCompletionComponent_app_case_event_completion_task_reassigned_1_Template_app_case_event_completion_task_reassigned_notifyEventCompletionReassigned_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setEventCanBeCompleted($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("context", ctx_r1.context);
+} }
+const COMPONENT_PORTAL_INJECTION_TOKEN = new InjectionToken('');
+class CaseEventCompletionComponent {
+    service;
+    router;
+    route;
+    sessionStorageService;
+    workAllocationService;
+    alertService;
+    eventCompletionParams;
+    eventCanBeCompleted = new EventEmitter();
+    eventCompletionTaskStates = EventCompletionTaskStates;
+    stateMachine;
+    context;
+    taskState;
+    constructor(service, router, route, sessionStorageService, workAllocationService, alertService) {
+        this.service = service;
+        this.router = router;
+        this.route = route;
+        this.sessionStorageService = sessionStorageService;
+        this.workAllocationService = workAllocationService;
+        this.alertService = alertService;
+    }
+    ngOnChanges(changes) {
+        if (changes.eventCompletionParams?.currentValue) {
+            // Setup the context
+            this.context = {
+                task: this.eventCompletionParams.task,
+                caseId: this.eventCompletionParams.caseId,
+                eventId: this.eventCompletionParams.eventId,
+                reassignedTask: null,
+                router: this.router,
+                route: this.route,
+                sessionStorageService: this.sessionStorageService,
+                workAllocationService: this.workAllocationService,
+                alertService: this.alertService,
+                canBeCompleted: false,
+                component: this
+            };
+            // Initialise state machine
+            this.stateMachine = this.service.initialiseStateMachine(this.context);
+            // Create states
+            this.service.createStates(this.stateMachine);
+            // Add transitions for the states
+            this.service.addTransitions();
+            // Start state machine
+            this.service.startStateMachine(this.stateMachine);
+        }
+    }
+    setTaskState(taskState) {
+        this.taskState = taskState;
+    }
+    setEventCanBeCompleted(completable) {
+        // note: event not completed from here as will then skip task completion
+        if (!completable) {
+            // if event cannot be completed ensure that this is communicated
+            // otherwise this will be handled via onchanges
+            this.eventCanBeCompleted.emit(completable);
+        }
+    }
+    static ɵfac = function CaseEventCompletionComponent_Factory(t) { return new (t || CaseEventCompletionComponent)(i0.ɵɵdirectiveInject(EventCompletionStateMachineService), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(AlertService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionComponent, selectors: [["ccd-case-event-completion"]], inputs: { eventCompletionParams: "eventCompletionParams" }, outputs: { eventCanBeCompleted: "eventCanBeCompleted" }, features: [i0.ɵɵNgOnChangesFeature], decls: 2, vars: 2, consts: [[3, "context", "notifyEventCompletionCancelled", 4, "ngIf"], [3, "context", "notifyEventCompletionReassigned", 4, "ngIf"], [3, "notifyEventCompletionCancelled", "context"], [3, "notifyEventCompletionReassigned", "context"]], template: function CaseEventCompletionComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, CaseEventCompletionComponent_app_case_event_completion_task_cancelled_0_Template, 1, 1, "app-case-event-completion-task-cancelled", 0)(1, CaseEventCompletionComponent_app_case_event_completion_task_reassigned_1_Template, 1, 1, "app-case-event-completion-task-reassigned", 1);
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngIf", ctx.taskState === ctx.eventCompletionTaskStates.TaskCancelled);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.taskState === ctx.eventCompletionTaskStates.TaskReassigned);
+        } }, encapsulation: 2 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEventCompletionComponent, [{
+        type: Component,
+        args: [{ selector: 'ccd-case-event-completion', template: "<app-case-event-completion-task-cancelled\n    *ngIf=\"taskState === eventCompletionTaskStates.TaskCancelled\"\n    [context]=\"context\"\n    (notifyEventCompletionCancelled)=\"setEventCanBeCompleted($event)\">\n</app-case-event-completion-task-cancelled>\n<app-case-event-completion-task-reassigned\n    *ngIf=\"taskState === eventCompletionTaskStates.TaskReassigned\"\n    [context]=\"context\"\n    (notifyEventCompletionReassigned)=\"setEventCanBeCompleted($event)\">\n</app-case-event-completion-task-reassigned>" }]
+    }], () => [{ type: EventCompletionStateMachineService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: SessionStorageService }, { type: WorkAllocationService }, { type: AlertService }], { eventCompletionParams: [{
+            type: Input
+        }], eventCanBeCompleted: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionComponent, { className: "CaseEventCompletionComponent", filePath: "lib/shared/components/case-editor/case-event-completion/case-event-completion.component.ts", lineNumber: 20 }); })();
+
 const _c0$X = a0 => ["/", "cases", "case-details", a0, "tasks"];
 class CaseEventCompletionTaskCancelledComponent {
-    parentComponent;
+    context;
+    notifyEventCompletionCancelled = new EventEmitter();
     caseId;
-    constructor(parentComponent) {
-        this.parentComponent = parentComponent;
-        this.caseId = this.parentComponent.context.caseId;
+    ngOnInit() {
+        this.caseId = this.context.caseId;
     }
     onContinue() {
-        // Emit event can be completed event
-        this.parentComponent.eventCanBeCompleted.emit(true);
+        // Removes task to complete so event completes without task
+        this.context.sessionStorageService.removeItem('taskToComplete');
+        // may be able to remove this call below since it is now unneccesary
+        this.notifyEventCompletionCancelled.emit(true);
     }
-    static ɵfac = function CaseEventCompletionTaskCancelledComponent_Factory(t) { return new (t || CaseEventCompletionTaskCancelledComponent)(i0.ɵɵdirectiveInject(COMPONENT_PORTAL_INJECTION_TOKEN)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionTaskCancelledComponent, selectors: [["app-case-event-completion-task-cancelled"]], decls: 31, vars: 27, consts: [[1, "govuk-!-margin-9"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["href", "#"], [1, "govuk-form-group", "govuk-form-group--error"], [1, "govuk-heading-m"], [1, "form-group", "form-group-related"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-!-margin-right-2", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", 3, "routerLink"]], template: function CaseEventCompletionTaskCancelledComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵfac = function CaseEventCompletionTaskCancelledComponent_Factory(t) { return new (t || CaseEventCompletionTaskCancelledComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionTaskCancelledComponent, selectors: [["app-case-event-completion-task-cancelled"]], inputs: { context: "context" }, outputs: { notifyEventCompletionCancelled: "notifyEventCompletionCancelled" }, decls: 31, vars: 27, consts: [[1, "govuk-!-margin-9"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["href", "#"], [1, "govuk-form-group", "govuk-form-group--error"], [1, "govuk-heading-m"], [1, "form-group", "form-group-related"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-!-margin-right-2", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", 3, "routerLink"]], template: function CaseEventCompletionTaskCancelledComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "h2", 2);
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "rpxTranslate");
@@ -11021,11 +11133,12 @@ class CaseEventCompletionTaskCancelledComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEventCompletionTaskCancelledComponent, [{
         type: Component,
         args: [{ selector: 'app-case-event-completion-task-cancelled', template: "<div class=\"govuk-!-margin-9\">\n  <div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"error-summary\">\n    <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n      {{'There is a problem' | rpxTranslate}}\n    </h2>\n    <div class=\"govuk-error-summary__body\">\n      <ul class=\"govuk-list govuk-error-summary__list\">\n        <li>\n          <a href=\"#\">{{'Task cancelled/marked as done' | rpxTranslate}}</a>\n        </li>\n      </ul>\n    </div>\n  </div>\n\n  <div class=\"govuk-form-group govuk-form-group--error\">\n    <h2 class=\"govuk-heading-m\">{{'Task cancelled/marked as done' | rpxTranslate}}</h2>\n    <p>{{'This task has been cancelled or marked as done.' | rpxTranslate}}</p>\n    <p>{{'Click Continue to complete the event and save your progress.' | rpxTranslate}}</p>\n\n    <p>{{'Alternatively, click Cancel to return to the tasks tab without saving your progress.' | rpxTranslate}}</p>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"govuk-button govuk-!-margin-right-2\" data-module=\"govuk-button\" (click)=\"onContinue()\">\n        {{'Continue' | rpxTranslate}}\n      </button>\n      <a [routerLink]=\"['/', 'cases', 'case-details', caseId, 'tasks']\"\n              class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n        {{'Cancel' | rpxTranslate}}\n      </a>\n    </div>\n  </div>\n</div>\n" }]
-    }], () => [{ type: CaseEventCompletionComponent, decorators: [{
-                type: Inject,
-                args: [COMPONENT_PORTAL_INJECTION_TOKEN]
-            }] }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionTaskCancelledComponent, { className: "CaseEventCompletionTaskCancelledComponent", filePath: "lib/shared/components/case-editor/case-event-completion/components/case-event-completion-task-cancelled/case-event-completion-task-cancelled.component.ts", lineNumber: 8 }); })();
+    }], null, { context: [{
+            type: Input
+        }], notifyEventCompletionCancelled: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionTaskCancelledComponent, { className: "CaseEventCompletionTaskCancelledComponent", filePath: "lib/shared/components/case-editor/case-event-completion/components/case-event-completion-task-cancelled/case-event-completion-task-cancelled.component.ts", lineNumber: 9 }); })();
 
 const _c0$W = a0 => ["/", "cases", "case-details", a0, "tasks"];
 function CaseEventCompletionTaskReassignedComponent_div_0_Template(rf, ctx) { if (rf & 1) {
@@ -11085,32 +11198,26 @@ function CaseEventCompletionTaskReassignedComponent_div_0_Template(rf, ctx) { if
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(30, 24, "Cancel"), " ");
 } }
 class CaseEventCompletionTaskReassignedComponent {
-    parentComponent;
-    route;
-    workAllocationService;
     sessionStorageService;
     judicialworkerService;
     caseworkerService;
-    alertService;
+    context;
+    notifyEventCompletionReassigned = new EventEmitter();
     caseId;
     assignedUserId;
     assignedUserName;
     subscription;
     caseworkerSubscription;
     judicialworkerSubscription;
-    constructor(parentComponent, route, workAllocationService, sessionStorageService, judicialworkerService, caseworkerService, alertService) {
-        this.parentComponent = parentComponent;
-        this.route = route;
-        this.workAllocationService = workAllocationService;
+    constructor(sessionStorageService, judicialworkerService, caseworkerService) {
         this.sessionStorageService = sessionStorageService;
         this.judicialworkerService = judicialworkerService;
         this.caseworkerService = caseworkerService;
-        this.alertService = alertService;
     }
     ngOnInit() {
         // Get case id and task from the parent component
-        this.caseId = this.parentComponent.context.caseId;
-        const task = this.parentComponent.context.reassignedTask;
+        this.caseId = this.context.caseId;
+        const task = this.context.reassignedTask;
         // Current user is a caseworker?
         this.caseworkerSubscription = this.caseworkerService.getCaseworkers(task.jurisdiction).subscribe(result => {
             if (result && result[0].service === task.jurisdiction && result[0].caseworkers) {
@@ -11151,17 +11258,17 @@ class CaseEventCompletionTaskReassignedComponent {
         // Get task details
         const taskStr = this.sessionStorageService.getItem('taskToComplete');
         if (taskStr) {
-            this.sessionStorageService.setItem('assignNeeded', 'true');
-            // set event can be completed to true
-            this.parentComponent.eventCanBeCompleted.emit(true);
+            // Set session to override reassignment settings so code flow does not return to this component
+            this.sessionStorageService.setItem('assignNeeded', 'true - override');
+            this.notifyEventCompletionReassigned.emit(true);
         }
         else {
             // Emit event cannot be completed event
-            this.parentComponent.eventCanBeCompleted.emit(false);
+            this.notifyEventCompletionReassigned.emit(false);
         }
     }
-    static ɵfac = function CaseEventCompletionTaskReassignedComponent_Factory(t) { return new (t || CaseEventCompletionTaskReassignedComponent)(i0.ɵɵdirectiveInject(COMPONENT_PORTAL_INJECTION_TOKEN), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(JudicialworkerService), i0.ɵɵdirectiveInject(CaseworkerService), i0.ɵɵdirectiveInject(AlertService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionTaskReassignedComponent, selectors: [["app-case-event-completion-task-reassigned"]], decls: 1, vars: 1, consts: [["class", "govuk-!-margin-9", 4, "ngIf"], [1, "govuk-!-margin-9"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["href", "#"], [1, "govuk-form-group", "govuk-form-group--error"], [1, "govuk-heading-m"], [1, "form-group", "form-group-related"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-!-margin-right-2", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", 3, "routerLink"]], template: function CaseEventCompletionTaskReassignedComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵfac = function CaseEventCompletionTaskReassignedComponent_Factory(t) { return new (t || CaseEventCompletionTaskReassignedComponent)(i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(JudicialworkerService), i0.ɵɵdirectiveInject(CaseworkerService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionTaskReassignedComponent, selectors: [["app-case-event-completion-task-reassigned"]], inputs: { context: "context" }, outputs: { notifyEventCompletionReassigned: "notifyEventCompletionReassigned" }, decls: 1, vars: 1, consts: [["class", "govuk-!-margin-9", 4, "ngIf"], [1, "govuk-!-margin-9"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["href", "#"], [1, "govuk-form-group", "govuk-form-group--error"], [1, "govuk-heading-m"], [1, "form-group", "form-group-related"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-!-margin-right-2", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", 3, "routerLink"]], template: function CaseEventCompletionTaskReassignedComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseEventCompletionTaskReassignedComponent_div_0_Template, 31, 28, "div", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.assignedUserName);
@@ -11170,92 +11277,12 @@ class CaseEventCompletionTaskReassignedComponent {
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEventCompletionTaskReassignedComponent, [{
         type: Component,
         args: [{ selector: 'app-case-event-completion-task-reassigned', template: "<div class=\"govuk-!-margin-9\" *ngIf=\"assignedUserName\">\n  <div class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n    data-module=\"error-summary\">\n    <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n      {{'There is a problem' | rpxTranslate}}\n    </h2>\n    <div class=\"govuk-error-summary__body\">\n      <ul class=\"govuk-list govuk-error-summary__list\">\n        <li>\n          <a href=\"#\">{{'Task reassigned' | rpxTranslate}}</a>\n        </li>\n      </ul>\n    </div>\n  </div>\n\n  <div class=\"govuk-form-group govuk-form-group--error\">\n    <h2 class=\"govuk-heading-m\">{{'Task reassigned' | rpxTranslate}}</h2>\n    <p>{{'This task has been reassigned to' | rpxTranslate}} {{assignedUserName}}.</p>\n    <p>{{'Click Continue to reassign the task to you and save your progress.' | rpxTranslate}}</p>\n    <p>{{'Alternatively, click Cancel to return to the tasks tab without saving your progress.' | rpxTranslate}}</p>\n    <div class=\"form-group form-group-related\">\n      <button class=\"govuk-button govuk-!-margin-right-2\" data-module=\"govuk-button\" (click)=\"onContinue()\">\n        {{'Continue' | rpxTranslate}}\n      </button>\n      <a [routerLink]=\"['/', 'cases', 'case-details', caseId, 'tasks']\"\n              class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n        {{'Cancel' | rpxTranslate}}\n      </a>\n    </div>\n  </div>\n</div>\n" }]
-    }], () => [{ type: CaseEventCompletionComponent, decorators: [{
-                type: Inject,
-                args: [COMPONENT_PORTAL_INJECTION_TOKEN]
-            }] }, { type: i1$1.ActivatedRoute }, { type: WorkAllocationService }, { type: SessionStorageService }, { type: JudicialworkerService }, { type: CaseworkerService }, { type: AlertService }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionTaskReassignedComponent, { className: "CaseEventCompletionTaskReassignedComponent", filePath: "lib/shared/components/case-editor/case-event-completion/components/case-event-completion-task-reassigned/case-event-completion-task-reassigned.component.ts", lineNumber: 16 }); })();
-
-function CaseEventCompletionComponent_ng_template_0_Template(rf, ctx) { }
-const COMPONENT_PORTAL_INJECTION_TOKEN = new InjectionToken('');
-class CaseEventCompletionComponent {
-    service;
-    router;
-    route;
-    sessionStorageService;
-    workAllocationService;
-    alertService;
-    eventCompletionParams;
-    eventCanBeCompleted = new EventEmitter();
-    stateMachine;
-    context;
-    selectedComponentPortal;
-    constructor(service, router, route, sessionStorageService, workAllocationService, alertService) {
-        this.service = service;
-        this.router = router;
-        this.route = route;
-        this.sessionStorageService = sessionStorageService;
-        this.workAllocationService = workAllocationService;
-        this.alertService = alertService;
-    }
-    ngOnChanges(changes) {
-        if (changes.eventCompletionParams && changes.eventCompletionParams.currentValue) {
-            // Setup the context
-            this.context = {
-                task: this.eventCompletionParams.task,
-                caseId: this.eventCompletionParams.caseId,
-                eventId: this.eventCompletionParams.eventId,
-                reassignedTask: null,
-                router: this.router,
-                route: this.route,
-                sessionStorageService: this.sessionStorageService,
-                workAllocationService: this.workAllocationService,
-                alertService: this.alertService,
-                canBeCompleted: false,
-                component: this
-            };
-            // Initialise state machine
-            this.stateMachine = this.service.initialiseStateMachine(this.context);
-            // Create states
-            this.service.createStates(this.stateMachine);
-            // Add transitions for the states
-            this.service.addTransitions();
-            // Start state machine
-            this.service.startStateMachine(this.stateMachine);
-        }
-    }
-    showPortal(portalType) {
-        const injector = Injector.create({
-            providers: [
-                { provide: COMPONENT_PORTAL_INJECTION_TOKEN, useValue: this }
-            ]
-        });
-        // tslint:disable-next-line:switch-default
-        switch (portalType) {
-            case EventCompletionPortalTypes.TaskCancelled:
-                this.selectedComponentPortal = new ComponentPortal(CaseEventCompletionTaskCancelledComponent, null, injector);
-                break;
-            case EventCompletionPortalTypes.TaskReassigned:
-                this.selectedComponentPortal = new ComponentPortal(CaseEventCompletionTaskReassignedComponent, null, injector);
-                break;
-        }
-    }
-    static ɵfac = function CaseEventCompletionComponent_Factory(t) { return new (t || CaseEventCompletionComponent)(i0.ɵɵdirectiveInject(EventCompletionStateMachineService), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(AlertService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEventCompletionComponent, selectors: [["ccd-case-event-completion"]], inputs: { eventCompletionParams: "eventCompletionParams" }, outputs: { eventCanBeCompleted: "eventCanBeCompleted" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 1, consts: [[3, "cdkPortalOutlet"]], template: function CaseEventCompletionComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, CaseEventCompletionComponent_ng_template_0_Template, 0, 0, "ng-template", 0);
-        } if (rf & 2) {
-            i0.ɵɵproperty("cdkPortalOutlet", ctx.selectedComponentPortal);
-        } }, encapsulation: 2 });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEventCompletionComponent, [{
-        type: Component,
-        args: [{ selector: 'ccd-case-event-completion', template: "<ng-template [cdkPortalOutlet]=\"selectedComponentPortal\"></ng-template>\n" }]
-    }], () => [{ type: EventCompletionStateMachineService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: SessionStorageService }, { type: WorkAllocationService }, { type: AlertService }], { eventCompletionParams: [{
+    }], () => [{ type: SessionStorageService }, { type: JudicialworkerService }, { type: CaseworkerService }], { context: [{
             type: Input
-        }], eventCanBeCompleted: [{
+        }], notifyEventCompletionReassigned: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionComponent, { className: "CaseEventCompletionComponent", filePath: "lib/shared/components/case-editor/case-event-completion/case-event-completion.component.ts", lineNumber: 21 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEventCompletionTaskReassignedComponent, { className: "CaseEventCompletionTaskReassignedComponent", filePath: "lib/shared/components/case-editor/case-event-completion/components/case-event-completion-task-reassigned/case-event-completion-task-reassigned.component.ts", lineNumber: 17 }); })();
 
 class AddressOption {
     description;
@@ -28482,6 +28509,10 @@ i0.ɵɵsetComponentScope(QueryAttachmentsReadComponent, function () { return [i5
 i0.ɵɵsetComponentScope(QueryEventCompletionComponent, function () { return [
     // Case event completion
     CaseEventCompletionComponent]; }, []);
+i0.ɵɵsetComponentScope(
+// Case event completion
+CaseEventCompletionComponent, function () { return [i5.NgIf, CaseEventCompletionTaskCancelledComponent,
+    CaseEventCompletionTaskReassignedComponent]; }, []);
 
 var CaseEditSubmitTitles;
 (function (CaseEditSubmitTitles) {