diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html
new file mode 100644
index 00000000000..94f8ea35f10
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.html
@@ -0,0 +1 @@
+
diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts
new file mode 100644
index 00000000000..43fc628f48e
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.spec.ts
@@ -0,0 +1,53 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TaskScreenCloudComponent } from './screen-cloud.component';
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ScreenRenderingService } from '../../../services/public-api';
+import { By } from '@angular/platform-browser';
+
+@Component({
+ selector: 'adf-cloud-test-component',
+ template: `test component
`,
+ imports: [CommonModule],
+ standalone: true
+})
+class TestComponent {}
+
+describe('TaskScreenCloudComponent', () => {
+ let fixture: ComponentFixture;
+ let screenRenderingService: ScreenRenderingService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ imports: [TaskScreenCloudComponent, TestComponent]
+ });
+ fixture = TestBed.createComponent(TaskScreenCloudComponent);
+ screenRenderingService = TestBed.inject(ScreenRenderingService);
+ screenRenderingService.register({ ['test']: () => TestComponent });
+ fixture.componentRef.setInput('screenId', 'test');
+ fixture.detectChanges();
+ });
+
+ it('should create custom component instance', () => {
+ const dynamicComponent = fixture.debugElement.query(By.css('.adf-cloud-test-container'));
+ expect(dynamicComponent).toBeTruthy();
+ });
+});
diff --git a/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts
new file mode 100644
index 00000000000..3ea9c1a4bb9
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/screen/components/screen-cloud/screen-cloud.component.ts
@@ -0,0 +1,62 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonModule } from '@angular/common';
+import { Component, ComponentRef, inject, Input, OnInit, ViewChild, ViewContainerRef } from '@angular/core';
+import { ScreenRenderingService } from '../../../services/public-api';
+
+@Component({
+ selector: 'adf-cloud-task-screen',
+ standalone: true,
+ imports: [CommonModule],
+ template: ''
+})
+export class TaskScreenCloudComponent implements OnInit {
+ /** Task id to fetch corresponding form and values. */
+ @Input() taskId: string;
+ /** App id to fetch corresponding form and values. */
+ @Input()
+ appName: string = '';
+ /** Screen id to fetch corresponding screen widget. */
+ @Input()
+ screenId: string = '';
+ /** Toggle readonly state of the task. */
+ @Input()
+ readOnly = false;
+
+ @ViewChild('container', { read: ViewContainerRef, static: true })
+ container: ViewContainerRef;
+ componentRef: ComponentRef;
+
+ private readonly screenRenderingService = inject(ScreenRenderingService);
+
+ ngOnInit() {
+ if (this.screenId) {
+ const componentType = this.screenRenderingService.resolveComponentType({ type: this.screenId });
+ this.componentRef = this.container.createComponent(componentType);
+ if (this.taskId) {
+ this.componentRef.setInput('taskId', this.taskId);
+ }
+ if (this.appName) {
+ this.componentRef.setInput('appName', this.appName);
+ }
+ if (this.screenId) {
+ this.componentRef.setInput('screenId', this.screenId);
+ }
+ }
+ }
+}
diff --git a/lib/process-services-cloud/src/lib/services/public-api.ts b/lib/process-services-cloud/src/lib/services/public-api.ts
index 40684e03a66..f07bd965135 100644
--- a/lib/process-services-cloud/src/lib/services/public-api.ts
+++ b/lib/process-services-cloud/src/lib/services/public-api.ts
@@ -15,13 +15,14 @@
* limitations under the License.
*/
-export * from './user-preference-cloud.service';
-export * from './local-preference-cloud.service';
+export * from './base-cloud.service';
export * from './cloud-token.service';
+export * from './form-fields.interfaces';
+export * from './local-preference-cloud.service';
export * from './notification-cloud.service';
export * from './preference-cloud.interface';
-export * from './form-fields.interfaces';
-export * from './base-cloud.service';
+export * from './screen-rendering.service';
export * from './task-list-cloud.service.interface';
+export * from './user-preference-cloud.service';
export * from './variable-mapper.sevice';
export * from './web-socket.service';
diff --git a/lib/process-services-cloud/src/lib/services/screen-rendering.service.spec.ts b/lib/process-services-cloud/src/lib/services/screen-rendering.service.spec.ts
new file mode 100644
index 00000000000..542c61a872b
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/services/screen-rendering.service.spec.ts
@@ -0,0 +1,32 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { TestBed } from '@angular/core/testing';
+import { ScreenRenderingService } from './screen-rendering.service';
+
+describe('ScreenRenderingService', () => {
+ let service: ScreenRenderingService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(ScreenRenderingService);
+ });
+
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/lib/process-services-cloud/src/lib/services/screen-rendering.service.ts b/lib/process-services-cloud/src/lib/services/screen-rendering.service.ts
new file mode 100644
index 00000000000..156f727a454
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/services/screen-rendering.service.ts
@@ -0,0 +1,24 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { DynamicComponentMapper } from '@alfresco/adf-core';
+import { Injectable } from '@angular/core';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class ScreenRenderingService extends DynamicComponentMapper {}
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.html b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.html
deleted file mode 100644
index 05a1d244644..00000000000
--- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.html
+++ /dev/null
@@ -1,73 +0,0 @@
-
-
-
-
-
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.html b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.html
new file mode 100644
index 00000000000..233ffabda54
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.html
@@ -0,0 +1,39 @@
+
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.scss b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.scss
similarity index 67%
rename from lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.scss
rename to lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.scss
index 80e7995fcca..3ed08852124 100644
--- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.scss
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.scss
@@ -29,23 +29,4 @@
}
}
}
-
- &-cloud-spinner {
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- }
-}
-
-adf-cloud-task-form {
- .adf-task-form-cloud-spinner {
- display: flex;
- justify-content: center;
- align-items: center;
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- overflow: hidden;
- }
}
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.spec.ts b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.spec.ts
new file mode 100644
index 00000000000..4d9a9f3be20
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.spec.ts
@@ -0,0 +1,282 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { FORM_FIELD_VALIDATORS, FormModel, FormOutcomeEvent, FormOutcomeModel } from '@alfresco/adf-core';
+import { FormCustomOutcomesComponent } from '@alfresco/adf-process-services-cloud';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { of } from 'rxjs';
+import { FormCloudComponent } from '../../../../form/components/form-cloud.component';
+import { DisplayModeService } from '../../../../form/services/display-mode.service';
+import { IdentityUserService } from '../../../../people/services/identity-user.service';
+import { ProcessServiceCloudTestingModule } from '../../../../testing/process-service-cloud.testing.module';
+import { TaskCloudService } from '../../../services/task-cloud.service';
+import {
+ TASK_ASSIGNED_STATE,
+ TASK_CLAIM_PERMISSION,
+ TASK_CREATED_STATE,
+ TASK_RELEASE_PERMISSION,
+ TASK_VIEW_PERMISSION,
+ TaskDetailsCloudModel
+} from '../../../start-task/models/task-details-cloud.model';
+import { MockFormFieldValidator } from '../../mocks/task-form-cloud.mock';
+import { UserTaskCloudButtonsComponent } from '../user-task-cloud-buttons/user-task-cloud-buttons.component';
+import { TaskFormCloudComponent } from './task-form-cloud.component';
+
+const taskDetails: TaskDetailsCloudModel = {
+ appName: 'simple-app',
+ appVersion: 1,
+ assignee: 'admin.adf',
+ completedDate: null,
+ createdDate: new Date(1555419255340),
+ description: null,
+ formKey: null,
+ id: 'bd6b1741-6046-11e9-80f0-0a586460040d',
+ name: 'Task1',
+ owner: 'admin.adf',
+ standalone: false,
+ status: TASK_ASSIGNED_STATE,
+ permissions: [TASK_VIEW_PERMISSION]
+};
+
+describe('TaskFormCloudComponent', () => {
+ let taskCloudService: TaskCloudService;
+ let identityUserService: IdentityUserService;
+ let getCurrentUserSpy: jasmine.Spy;
+ let component: TaskFormCloudComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ imports: [ProcessServiceCloudTestingModule],
+ declarations: [FormCloudComponent, UserTaskCloudButtonsComponent, FormCustomOutcomesComponent]
+ });
+ taskDetails.status = TASK_ASSIGNED_STATE;
+ taskDetails.permissions = [TASK_VIEW_PERMISSION];
+ taskDetails.standalone = false;
+
+ identityUserService = TestBed.inject(IdentityUserService);
+ getCurrentUserSpy = spyOn(identityUserService, 'getCurrentUserInfo').and.returnValue({ username: 'admin.adf' });
+ taskCloudService = TestBed.inject(TaskCloudService);
+ fixture = TestBed.createComponent(TaskFormCloudComponent);
+ component = fixture.componentInstance;
+ });
+
+ afterEach(() => {
+ fixture.destroy();
+ });
+
+ describe('Claim/Unclaim buttons', () => {
+ beforeEach(() => {
+ spyOn(component, 'hasCandidateUsers').and.returnValue(true);
+ fixture.componentRef.setInput('taskDetails', taskDetails);
+ component.taskId = 'task1';
+ component.showCancelButton = true;
+ fixture.detectChanges();
+ });
+
+ it('should not show release button for standalone task', () => {
+ taskDetails.permissions = [TASK_RELEASE_PERMISSION];
+ taskDetails.standalone = true;
+ fixture.detectChanges();
+ const canUnclaimTask = component.canUnclaimTask();
+
+ expect(canUnclaimTask).toBe(false);
+ });
+
+ it('should not show claim button for standalone task', () => {
+ taskDetails.status = TASK_CREATED_STATE;
+ taskDetails.permissions = [TASK_CLAIM_PERMISSION];
+ taskDetails.standalone = true;
+ fixture.detectChanges();
+ const canClaimTask = component.canClaimTask();
+
+ expect(canClaimTask).toBe(false);
+ });
+
+ it('should show release button when task is assigned to one of the candidate users', () => {
+ taskDetails.permissions = [TASK_RELEASE_PERMISSION];
+ fixture.detectChanges();
+ const canUnclaimTask = component.canUnclaimTask();
+
+ expect(canUnclaimTask).toBe(true);
+ });
+
+ it('should not show unclaim button when status is ASSIGNED but assigned to different person', () => {
+ getCurrentUserSpy.and.returnValue({});
+ fixture.detectChanges();
+ const canUnclaimTask = component.canUnclaimTask();
+
+ expect(canUnclaimTask).toBe(false);
+ });
+
+ it('should not show unclaim button when status is not ASSIGNED', () => {
+ taskDetails.status = undefined;
+ fixture.detectChanges();
+ const canUnclaimTask = component.canUnclaimTask();
+
+ expect(canUnclaimTask).toBe(false);
+ });
+
+ it('should not show unclaim button when status is ASSIGNED and permissions not include RELEASE', () => {
+ taskDetails.status = TASK_ASSIGNED_STATE;
+ taskDetails.permissions = [TASK_VIEW_PERMISSION];
+ fixture.detectChanges();
+ const canUnclaimTask = component.canUnclaimTask();
+
+ expect(canUnclaimTask).toBe(false);
+ });
+
+ it('should show claim button when status is CREATED and permission includes CLAIM', () => {
+ taskDetails.status = TASK_CREATED_STATE;
+ taskDetails.permissions = [TASK_CLAIM_PERMISSION];
+ fixture.detectChanges();
+ const canClaimTask = component.canClaimTask();
+
+ expect(canClaimTask).toBe(true);
+ });
+
+ it('should not show claim button when status is not CREATED', () => {
+ taskDetails.status = undefined;
+ fixture.detectChanges();
+ const canClaimTask = component.canClaimTask();
+
+ expect(canClaimTask).toBe(false);
+ });
+
+ it('should not show claim button when status is CREATED and permission not includes CLAIM', () => {
+ taskDetails.status = TASK_CREATED_STATE;
+ taskDetails.permissions = [TASK_VIEW_PERMISSION];
+ fixture.detectChanges();
+ const canClaimTask = component.canClaimTask();
+
+ expect(canClaimTask).toBe(false);
+ });
+ });
+
+ describe('Inputs', () => {
+ beforeEach(() => {
+ fixture.componentRef.setInput('taskDetails', taskDetails);
+ });
+
+ it('should not show complete/claim/unclaim buttons when readOnly=true', () => {
+ component.appName = 'app1';
+ component.taskId = 'task1';
+ component.readOnly = true;
+ fixture.detectChanges();
+
+ const canShowCompleteBtn = component.canCompleteTask();
+ expect(canShowCompleteBtn).toBe(false);
+
+ const canClaimTask = component.canClaimTask();
+ expect(canClaimTask).toBe(false);
+
+ const canUnclaimTask = component.canUnclaimTask();
+ expect(canUnclaimTask).toBe(false);
+ });
+
+ it('should append additional field validators to the default ones when provided', () => {
+ const mockFirstCustomFieldValidator = new MockFormFieldValidator();
+ const mockSecondCustomFieldValidator = new MockFormFieldValidator();
+ fixture.componentRef.setInput('fieldValidators', [mockFirstCustomFieldValidator, mockSecondCustomFieldValidator]);
+ fixture.detectChanges();
+
+ expect(component.fieldValidators).toEqual([...FORM_FIELD_VALIDATORS, mockFirstCustomFieldValidator, mockSecondCustomFieldValidator]);
+ });
+
+ it('should use default field validators when no additional validators are provided', () => {
+ fixture.detectChanges();
+
+ expect(component.fieldValidators).toEqual([...FORM_FIELD_VALIDATORS]);
+ });
+ });
+
+ describe('Events', () => {
+ beforeEach(() => {
+ fixture.componentRef.setInput('taskDetails', taskDetails);
+ component.appName = 'app1';
+ component.taskId = 'task1';
+ fixture.detectChanges();
+ });
+
+ it('should emit cancelClick when cancel button is clicked', async () => {
+ spyOn(component.cancelClick, 'emit').and.stub();
+ component.onCancelClick();
+ fixture.detectChanges();
+
+ expect(component.cancelClick.emit).toHaveBeenCalledOnceWith('task1');
+ });
+
+ it('should emit taskClaimed when task is claimed', async () => {
+ spyOn(taskCloudService, 'claimTask').and.returnValue(of({}));
+ spyOn(component, 'hasCandidateUsers').and.returnValue(true);
+ spyOn(component.taskClaimed, 'emit').and.stub();
+ taskDetails.status = TASK_CREATED_STATE;
+ taskDetails.permissions = [TASK_CLAIM_PERMISSION];
+ component.onClaimTask();
+ fixture.detectChanges();
+
+ expect(component.taskClaimed.emit).toHaveBeenCalledOnceWith('task1');
+ });
+
+ it('should emit error when error occurs', async () => {
+ spyOn(component.error, 'emit').and.stub();
+ component.onError({});
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ expect(component.error.emit).toHaveBeenCalled();
+ });
+
+ it('should emit an executeOutcome event when form outcome executed', () => {
+ const executeOutcomeSpy: jasmine.Spy = spyOn(component.executeOutcome, 'emit');
+ component.onFormExecuteOutcome(new FormOutcomeEvent(new FormOutcomeModel(new FormModel())));
+
+ expect(executeOutcomeSpy).toHaveBeenCalled();
+ });
+
+ it('should emit displayModeOn when display mode is turned on', async () => {
+ spyOn(component.displayModeOn, 'emit').and.stub();
+ component.onDisplayModeOn(DisplayModeService.DEFAULT_DISPLAY_MODE_CONFIGURATIONS[0]);
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ expect(component.displayModeOn.emit).toHaveBeenCalledWith(DisplayModeService.DEFAULT_DISPLAY_MODE_CONFIGURATIONS[0]);
+ });
+
+ it('should emit displayModeOff when display mode is turned on', async () => {
+ spyOn(component.displayModeOff, 'emit').and.stub();
+ component.onDisplayModeOff(DisplayModeService.DEFAULT_DISPLAY_MODE_CONFIGURATIONS[0]);
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ expect(component.displayModeOff.emit).toHaveBeenCalledWith(DisplayModeService.DEFAULT_DISPLAY_MODE_CONFIGURATIONS[0]);
+ });
+ });
+
+ it('should call children cloud task form change display mode when changing the display mode', () => {
+ const displayMode = 'displayMode';
+ component.taskDetails = { ...taskDetails, formKey: 'some-form' };
+ fixture.detectChanges();
+
+ expect(component.adfCloudForm).toBeDefined();
+
+ const switchToDisplayModeSpy = spyOn(component.adfCloudForm, 'switchToDisplayMode');
+ component.switchToDisplayMode(displayMode);
+
+ expect(switchToDisplayModeSpy).toHaveBeenCalledOnceWith(displayMode);
+ });
+});
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.stories.ts b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.stories.ts
similarity index 91%
rename from lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.stories.ts
rename to lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.stories.ts
index e1d34d1ebcf..91f657f5c47 100644
--- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.stories.ts
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.stories.ts
@@ -16,13 +16,13 @@
*/
import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular';
-import { FormCloudService } from '../../../form/public-api';
-import { TaskCloudService } from '../../services/task-cloud.service';
-import { TaskFormModule } from '../task-form.module';
+import { FormCloudService } from '../../../../form/public-api';
+import { TaskCloudService } from '../../../services/task-cloud.service';
+import { TaskFormModule } from '../../task-form.module';
import { TaskFormCloudComponent } from './task-form-cloud.component';
-import { TaskCloudServiceMock } from '../../mock/task-cloud.service.mock';
-import { FormCloudServiceMock } from '../../../form/mocks/form-cloud.service.mock';
-import { ProcessServicesCloudStoryModule } from '../../../testing/process-services-cloud-story.module';
+import { TaskCloudServiceMock } from '../../../mock/task-cloud.service.mock';
+import { FormCloudServiceMock } from '../../../../form/mocks/form-cloud.service.mock';
+import { ProcessServicesCloudStoryModule } from '../../../../testing/process-services-cloud-story.module';
import { importProvidersFrom } from '@angular/core';
export default {
@@ -37,9 +37,7 @@ export default {
]
}),
applicationConfig({
- providers: [
- importProvidersFrom(ProcessServicesCloudStoryModule)
- ]
+ providers: [importProvidersFrom(ProcessServicesCloudStoryModule)]
})
],
argTypes: {
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.ts
similarity index 73%
rename from lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts
rename to lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.ts
index fbf86f03843..5427b01a244 100644
--- a/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud.component.ts
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/task-form-cloud/task-form-cloud.component.ts
@@ -15,28 +15,15 @@
* limitations under the License.
*/
-import {
- Component,
- DestroyRef,
- EventEmitter,
- inject,
- Input,
- OnChanges,
- OnInit,
- Output,
- SimpleChanges,
- ViewChild,
- ViewEncapsulation
-} from '@angular/core';
-import { TaskDetailsCloudModel } from '../../start-task/models/task-details-cloud.model';
-import { TaskCloudService } from '../../services/task-cloud.service';
import { ContentLinkModel, FORM_FIELD_VALIDATORS, FormFieldValidator, FormModel, FormOutcomeEvent, FormRenderingService } from '@alfresco/adf-core';
-import { AttachFileCloudWidgetComponent } from '../../../form/components/widgets/attach-file/attach-file-cloud-widget.component';
-import { DropdownCloudWidgetComponent } from '../../../form/components/widgets/dropdown/dropdown-cloud.widget';
-import { DateCloudWidgetComponent } from '../../../form/components/widgets/date/date-cloud.widget';
-import { FormCloudDisplayModeConfiguration } from '../../../services/form-fields.interfaces';
-import { FormCloudComponent } from '../../../form/components/form-cloud.component';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Component, EventEmitter, Input, OnInit, Output, ViewChild, ViewEncapsulation } from '@angular/core';
+import { FormCloudComponent } from '../../../../form/components/form-cloud.component';
+import { AttachFileCloudWidgetComponent } from '../../../../form/components/widgets/attach-file/attach-file-cloud-widget.component';
+import { DateCloudWidgetComponent } from '../../../../form/components/widgets/date/date-cloud.widget';
+import { DropdownCloudWidgetComponent } from '../../../../form/components/widgets/dropdown/dropdown-cloud.widget';
+import { FormCloudDisplayModeConfiguration } from '../../../../services/form-fields.interfaces';
+import { TaskCloudService } from '../../../services/task-cloud.service';
+import { TaskDetailsCloudModel } from '../../../start-task/models/task-details-cloud.model';
@Component({
selector: 'adf-cloud-task-form',
@@ -44,11 +31,19 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
styleUrls: ['./task-form-cloud.component.scss'],
encapsulation: ViewEncapsulation.None
})
-export class TaskFormCloudComponent implements OnInit, OnChanges {
+export class TaskFormCloudComponent implements OnInit {
/** App id to fetch corresponding form and values. */
@Input()
appName: string = '';
+ /**Candidates users*/
+ @Input()
+ candidateUsers: string[] = [];
+
+ /**Candidates groups */
+ @Input()
+ candidateGroups: string[] = [];
+
/** Task id to fetch corresponding form and values. */
@Input()
taskId: string;
@@ -87,6 +82,10 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
@Input()
fieldValidators: FormFieldValidator[];
+ /** Task details. */
+ @Input()
+ taskDetails: TaskDetailsCloudModel;
+
/** Emitted when the form is saved. */
@Output()
formSaved = new EventEmitter();
@@ -126,12 +125,6 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
@Output()
executeOutcome = new EventEmitter();
- /**
- * Emitted when a task is loaded`.
- */
- @Output()
- onTaskLoaded = new EventEmitter(); /* eslint-disable-line */
-
/** Emitted when a display mode configuration is turned on. */
@Output()
displayModeOn = new EventEmitter();
@@ -143,15 +136,8 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
@ViewChild('adfCloudForm', { static: false })
adfCloudForm: FormCloudComponent;
- taskDetails: TaskDetailsCloudModel;
-
- candidateUsers: string[] = [];
- candidateGroups: string[] = [];
-
loading: boolean = false;
- private readonly destroyRef = inject(DestroyRef);
-
constructor(private taskCloudService: TaskCloudService, private formRenderingService: FormRenderingService) {
this.formRenderingService.setComponentTypeResolver('upload', () => AttachFileCloudWidgetComponent, true);
this.formRenderingService.setComponentTypeResolver('dropdown', () => DropdownCloudWidgetComponent, true);
@@ -160,46 +146,12 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
ngOnInit() {
this.initFieldValidators();
-
- if (this.appName === '' && this.taskId) {
- this.loadTask();
- }
- }
-
- ngOnChanges(changes: SimpleChanges) {
- const appName = changes['appName'];
- if (appName && appName.currentValue !== appName.previousValue && this.taskId) {
- this.loadTask();
- return;
- }
-
- const taskId = changes['taskId'];
- if (taskId?.currentValue && this.appName) {
- this.loadTask();
- return;
- }
}
private initFieldValidators() {
this.fieldValidators = this.fieldValidators ? [...FORM_FIELD_VALIDATORS, ...this.fieldValidators] : [...FORM_FIELD_VALIDATORS];
}
- private loadTask() {
- this.loading = true;
- this.taskCloudService
- .getTaskById(this.appName, this.taskId)
- .pipe(takeUntilDestroyed(this.destroyRef))
- .subscribe((details) => {
- this.taskDetails = details;
- this.loading = false;
- this.onTaskLoaded.emit(this.taskDetails);
- });
-
- this.taskCloudService.getCandidateUsers(this.appName, this.taskId).subscribe((users) => (this.candidateUsers = users || []));
-
- this.taskCloudService.getCandidateGroups(this.appName, this.taskId).subscribe((groups) => (this.candidateGroups = groups || []));
- }
-
hasForm(): boolean {
return this.taskDetails && !!this.taskDetails.formKey;
}
@@ -212,6 +164,10 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
return !this.readOnly && this.taskCloudService.canClaimTask(this.taskDetails) && this.hasCandidateUsersOrGroups();
}
+ canUnclaimTask(): boolean {
+ return !this.readOnly && this.taskCloudService.canUnclaimTask(this.taskDetails) && this.hasCandidateUsersOrGroups();
+ }
+
hasCandidateUsers(): boolean {
return this.candidateUsers.length !== 0;
}
@@ -224,26 +180,19 @@ export class TaskFormCloudComponent implements OnInit, OnChanges {
return this.hasCandidateUsers() || this.hasCandidateGroups();
}
- canUnclaimTask(): boolean {
- return !this.readOnly && this.taskCloudService.canUnclaimTask(this.taskDetails) && this.hasCandidateUsersOrGroups();
- }
-
isReadOnly(): boolean {
return this.readOnly || !this.taskCloudService.canCompleteTask(this.taskDetails);
}
onCompleteTask() {
- this.loadTask();
this.taskCompleted.emit(this.taskId);
}
onClaimTask() {
- this.loadTask();
this.taskClaimed.emit(this.taskId);
}
onUnclaimTask() {
- this.loadTask();
this.taskUnclaimed.emit(this.taskId);
}
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.html b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.html
new file mode 100644
index 00000000000..7b06233dee9
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.html
@@ -0,0 +1,32 @@
+
+
+
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.spec.ts b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.spec.ts
new file mode 100644
index 00000000000..bc523077213
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.spec.ts
@@ -0,0 +1,130 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { UserTaskCloudButtonsComponent } from './user-task-cloud-buttons.component';
+import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
+import { HarnessLoader } from '@angular/cdk/testing';
+import { MatButtonHarness } from '@angular/material/button/testing';
+import { NoopTranslateModule } from '@alfresco/adf-core';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+import { ProcessServiceCloudTestingModule } from 'lib/process-services-cloud/src/lib/testing/process-service-cloud.testing.module';
+import { TaskCloudService } from '@alfresco/adf-process-services-cloud';
+import { of } from 'rxjs';
+
+describe('UserTaskCloudButtonsComponent', () => {
+ let component: UserTaskCloudButtonsComponent;
+ let fixture: ComponentFixture;
+ let loader: HarnessLoader;
+ let debugElement: DebugElement;
+ let taskCloudService: TaskCloudService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ imports: [NoopTranslateModule, ProcessServiceCloudTestingModule],
+ declarations: [UserTaskCloudButtonsComponent]
+ });
+ fixture = TestBed.createComponent(UserTaskCloudButtonsComponent);
+ debugElement = fixture.debugElement;
+ component = fixture.componentInstance;
+ loader = TestbedHarnessEnvironment.loader(fixture);
+ taskCloudService = TestBed.inject(TaskCloudService);
+
+ fixture.componentRef.setInput('appName', 'app-test');
+ fixture.componentRef.setInput('taskId', 'task1');
+
+ fixture.detectChanges();
+ });
+
+ it('should show cancel button', async () => {
+ fixture.componentRef.setInput('showCancelButton', false);
+ let cancelButton: MatButtonHarness = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '#adf-cloud-cancel-task' }));
+
+ expect(cancelButton).toBeNull();
+
+ fixture.componentRef.setInput('showCancelButton', true);
+ fixture.detectChanges();
+ cancelButton = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '#adf-cloud-cancel-task' }));
+
+ expect(cancelButton).toBeTruthy();
+ });
+
+ it('should emit onCancelClick when cancel button clicked', async () => {
+ const cancelClickSpy = spyOn(component.cancelClick, 'emit');
+ fixture.componentRef.setInput('showCancelButton', true);
+ fixture.detectChanges();
+ const cancelButton: MatButtonHarness = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '#adf-cloud-cancel-task' }));
+ await cancelButton.click();
+ expect(cancelClickSpy).toHaveBeenCalled();
+ });
+
+ it('should show claim button', async () => {
+ let claimButton: MatButtonHarness = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '.adf-user-task-cloud-claim-btn' }));
+
+ expect(claimButton).toBeNull();
+
+ fixture.componentRef.setInput('canClaimTask', true);
+ fixture.detectChanges();
+ claimButton = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '.adf-user-task-cloud-claim-btn' }));
+
+ expect(claimButton).toBeTruthy();
+ });
+
+ it('should emit claimTask when claim button clicked', async () => {
+ spyOn(taskCloudService, 'claimTask').and.returnValue(of({}));
+ fixture.componentRef.setInput('canClaimTask', true);
+ spyOn(component.claimTask, 'emit').and.stub();
+ fixture.detectChanges();
+
+ const claimButton = debugElement.query(By.css('[adf-cloud-claim-task]'));
+ expect(claimButton).toBeTruthy();
+
+ claimButton.triggerEventHandler('click', {});
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ expect(component.claimTask.emit).toHaveBeenCalled();
+ });
+
+ it('should show unclaim button', async () => {
+ let unclaimButton: MatButtonHarness = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '.adf-user-task-cloud-unclaim-btn' }));
+
+ expect(unclaimButton).toBeNull();
+
+ fixture.componentRef.setInput('canUnclaimTask', true);
+ fixture.detectChanges();
+ unclaimButton = await loader.getHarnessOrNull(MatButtonHarness.with({ selector: '.adf-user-task-cloud-unclaim-btn' }));
+
+ expect(unclaimButton).toBeTruthy();
+ });
+
+ it('should emit unclaim when button clicked', async () => {
+ spyOn(taskCloudService, 'unclaimTask').and.returnValue(of({}));
+ fixture.componentRef.setInput('canUnclaimTask', true);
+ spyOn(component.unclaimTask, 'emit').and.stub();
+ fixture.detectChanges();
+
+ const unclaimButton = debugElement.query(By.css('[adf-cloud-unclaim-task]'));
+ expect(unclaimButton).toBeTruthy();
+ unclaimButton.triggerEventHandler('click', {});
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ expect(component.unclaimTask.emit).toHaveBeenCalled();
+ });
+});
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.ts b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.ts
new file mode 100644
index 00000000000..c5f9ece2186
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud-buttons/user-task-cloud-buttons.component.ts
@@ -0,0 +1,71 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+
+@Component({
+ selector: 'adf-cloud-user-task-cloud-buttons',
+ styles: ['button { margin-right: 8px; }'],
+ templateUrl: './user-task-cloud-buttons.component.html'
+})
+export class UserTaskCloudButtonsComponent {
+ /** App id to fetch corresponding form and values. */
+ @Input()
+ appName: string = '';
+
+ @Input()
+ canClaimTask: boolean;
+
+ @Input()
+ canUnclaimTask: boolean;
+
+ /** Task id to fetch corresponding form and values. */
+ @Input()
+ taskId: string;
+
+ /** Toggle rendering of the `Cancel` button. */
+ @Input()
+ showCancelButton = true;
+
+ /** Emitted when any error occurs. */
+ @Output() error = new EventEmitter();
+
+ /** Emitted when the cancel button is clicked. */
+ @Output() cancelClick = new EventEmitter();
+
+ /** Emitted when the task is claimed. */
+ @Output() claimTask = new EventEmitter();
+
+ /** Emitted when the task is unclaimed. */
+ @Output() unclaimTask = new EventEmitter();
+
+ onError(data: any): void {
+ this.error.emit(data);
+ }
+
+ onUnclaimTask(): void {
+ this.unclaimTask.emit();
+ }
+
+ onClaimTask(): void {
+ this.claimTask.emit();
+ }
+
+ onCancelClick(): void {
+ this.cancelClick.emit();
+ }
+}
diff --git a/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html
new file mode 100644
index 00000000000..536db5439e8
--- /dev/null
+++ b/lib/process-services-cloud/src/lib/task/task-form/components/user-task-cloud/user-task-cloud.component.html
@@ -0,0 +1,92 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ taskDetails?.name || 'FORM.FORM_RENDERER.NAMELESS_TASK' | translate }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+