[ADF- 4871][TaskHeaderCloudComponent] Add Candidate Users/Groups properties (#5189)

* [ADF-4871] [TaskHeaderCloudComponent] Add Candidate Users/Groups properties

* Added Candidate users/groups properties to the task heade cloud component.

* * Created CardViewArrayItemComponent
* Modified FullName pipe to return username or email incase fullname missing.
* Added candidate Users/Groups properties to the taskcloudheader component.
* Added two service into task-cloudservice
* Updated Demoshell card-view with new widget

* * Fixed failing unit test

* * Fixed comments.

* * Refactored CardViewArrayItem model
* Fixed comments.

* * Changed candidate group icon

lib/process-services-cloud/src/lib/i18n/en.json

@@ -208,7 +208,11 @@
       "DESCRIPTION": "Description",
       "DESCRIPTION_DEFAULT": "No description",
       "FORM_NAME": "Form Name",
-      "FORM_NAME_DEFAULT": "No form"
+      "FORM_NAME_DEFAULT": "No form",
+      "CANDIDATE_USERS": "Candidate Users",
+      "CANDIDATE_USERS_DEFAULT": "No Candidate Users",
+      "CANDIDATE_GROUPS": "Candidate Groups",
+      "CANDIDATE_GROUPS_DEFAULT": "No Candidate Groups"
     },
     "FORM_VALIDATION": {
         "INVALID_FIELD": "Enter a different value"

lib/process-services-cloud/src/lib/task/services/task-cloud.service.spec.ts

@@ -60,6 +60,26 @@ describe('Task Cloud Service', () => {
         };
     }
 
+    function returnFakeCandidateUsersResults() {
+        return {
+            oauth2Auth: {
+                callCustomApi : () => {
+                    return Promise.resolve(['mockuser1', 'mockuser2', 'mockuser3']);
+                }
+            }
+        };
+    }
+
+    function returnFakeCandidateGroupResults() {
+        return {
+            oauth2Auth: {
+                callCustomApi : () => {
+                    return Promise.resolve(['mockgroup1', 'mockgroup2', 'mockgroup3']);
+                }
+            }
+        };
+    }
+
     setupTestBed({
         imports: [
             CoreModule.forRoot()
@@ -312,4 +332,76 @@ describe('Task Cloud Service', () => {
                 done();
             });
     });
+
+    it('should return the candidate users by appName and taskId', (done) => {
+        const appName = 'taskp-app';
+        const taskId = '68d54a8f';
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateUsersResults);
+        service.getCandidateUsers(appName, taskId).subscribe((res: string[]) => {
+            expect(res).toBeDefined();
+            expect(res).not.toBeNull();
+            expect(res.length).toBe(3);
+            expect(res[0]).toBe('mockuser1');
+            expect(res[1]).toBe('mockuser2');
+            done();
+        });
+    });
+
+    it('should log message and return empty array if appName is not defined when fetching candidate users', (done) => {
+        const appName = null;
+        const taskId = '68d54a8f';
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateUsersResults);
+        service.getCandidateUsers(appName, taskId).subscribe(
+            (res: any[]) => {
+                expect(res.length).toBe(0);
+                done();
+            });
+    });
+
+    it('should log message and return empty array if taskId is not defined when fetching candidate users', (done) => {
+        const appName = 'task-app';
+        const taskId = null;
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateUsersResults);
+        service.getCandidateUsers(appName, taskId).subscribe(
+            (res: any[]) => {
+                expect(res.length).toBe(0);
+                done();
+            });
+    });
+
+    it('should return the candidate groups by appName and taskId', (done) => {
+        const appName = 'taskp-app';
+        const taskId = '68d54a8f';
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateGroupResults);
+        service.getCandidateGroups(appName, taskId).subscribe((res: string[]) => {
+            expect(res).toBeDefined();
+            expect(res).not.toBeNull();
+            expect(res.length).toBe(3);
+            expect(res[0]).toBe('mockgroup1');
+            expect(res[1]).toBe('mockgroup2');
+            done();
+        });
+    });
+
+    it('should log message and return empty array if appName is not defined when fetching candidate groups', (done) => {
+        const appName = null;
+        const taskId = '68d54a8f';
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateGroupResults);
+        service.getCandidateGroups(appName, taskId).subscribe(
+            (res: any[]) => {
+                expect(res.length).toBe(0);
+                done();
+            });
+    });
+
+    it('should log message and return empty array if taskId is not defined when fetching candidate groups', (done) => {
+        const appName = 'task-app';
+        const taskId = null;
+        spyOn(alfrescoApiMock, 'getInstance').and.callFake(returnFakeCandidateGroupResults);
+        service.getCandidateGroups(appName, taskId).subscribe(
+            (res: any[]) => {
+                expect(res.length).toBe(0);
+                done();
+            });
+    });
 });

lib/process-services-cloud/src/lib/task/services/task-cloud.service.ts

@@ -17,7 +17,7 @@
 
 import { Injectable } from '@angular/core';
 import { AlfrescoApiService, LogService, AppConfigService, IdentityUserService } from '@alfresco/adf-core';
-import { from, throwError, Observable } from 'rxjs';
+import { from, throwError, Observable, of } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
 import { TaskDetailsCloudModel, StartTaskCloudResponseModel } from '../start-task/models/task-details-cloud.model';
 import { BaseCloudService } from '../../services/base-cloud.service';
@@ -246,6 +246,60 @@ export class TaskCloudService extends BaseCloudService {
         }
     }
 
+    /**
+     * Gets candidate users of the task.
+     * @param appName Name of the app
+     * @param taskId ID of the task
+     * @returns Candidate users
+     */
+    getCandidateUsers(appName: string, taskId: string): Observable<string[]> {
+        if ((appName || appName === '') && taskId) {
+            const queryUrl = `${this.getBasePath(appName)}/query/v1/tasks/${taskId}/candidate-users`;
+            return from(this.apiService.getInstance()
+                .oauth2Auth.callCustomApi(queryUrl, 'GET',
+                    null, null, null,
+                    null, null,
+                    this.contentTypes, this.accepts,
+                    this.returnType, null, null)
+            ).pipe(
+                map((response: string[]) => {
+                    return response;
+                }),
+                catchError((err) => this.handleError(err))
+            );
+        } else {
+            this.logService.error('AppName and TaskId are mandatory to get candidate user');
+            return of([]);
+        }
+    }
+
+    /**
+     * Gets candidate groups of the task.
+     * @param appName Name of the app
+     * @param taskId ID of the task
+     * @returns Candidate groups
+     */
+    getCandidateGroups(appName: string, taskId: string): Observable<string[]> {
+        if ((appName || appName === '') && taskId) {
+            const queryUrl = `${this.getBasePath(appName)}/query/v1/tasks/${taskId}/candidate-groups`;
+            return from(this.apiService.getInstance()
+                .oauth2Auth.callCustomApi(queryUrl, 'GET',
+                    null, null, null,
+                    null, null,
+                    this.contentTypes, this.accepts,
+                    this.returnType, null, null)
+            ).pipe(
+                map((response: string[]) => {
+                    return response;
+                }),
+                catchError((err) => this.handleError(err))
+            );
+        } else {
+            this.logService.error('AppName and TaskId are mandatory to get candidate groups');
+            return of([]);
+        }
+    }
+
     private isAssignedToMe(assignee: string): boolean {
         const currentUser = this.identityUserService.getCurrentUserInfo().username;
         return assignee === currentUser;

lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.spec.ts

@@ -32,8 +32,12 @@ describe('TaskHeaderCloudComponent', () => {
     let service: TaskCloudService;
     let appConfigService: AppConfigService;
     let identityUserService: IdentityUserService;
+    let getCandidateGroupsSpy: jasmine.Spy;
+    let getCandidateUsersSpy: jasmine.Spy;
 
     const identityUserMock = { username: 'testuser', firstName: 'fake-identity-first-name', lastName: 'fake-identity-last-name', email: 'fakeIdentity@email.com' };
+    const mockCandidateUsers = ['mockuser1', 'mockuser2', 'mockuser3'];
+    const mockCandidateGroups = ['mockgroup1', 'mockgroup2', 'mockgroup3'];
 
     setupTestBed({
         imports: [
@@ -53,6 +57,8 @@ describe('TaskHeaderCloudComponent', () => {
         identityUserService = TestBed.get(IdentityUserService);
         appConfigService = TestBed.get(AppConfigService);
         spyOn(service, 'getTaskById').and.returnValue(of(assignedTaskDetailsCloudMock));
+        getCandidateUsersSpy = spyOn(service, 'getCandidateUsers').and.returnValue(of(mockCandidateUsers));
+        getCandidateGroupsSpy = spyOn(service, 'getCandidateGroups').and.returnValue(of(mockCandidateGroups));
         spyOn(identityUserService, 'getCurrentUserInfo').and.returnValue(identityUserMock);
     });
 
@@ -151,6 +157,60 @@ describe('TaskHeaderCloudComponent', () => {
         });
     }));
 
+    it('should display candidate user', async(() => {
+        component.ngOnInit();
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            const candidateUser1 = fixture.nativeElement.querySelector('[data-automation-id="card-arrayitem-chip-mockuser1"] span');
+            const candidateUser2 = fixture.nativeElement.querySelector('[data-automation-id="card-arrayitem-chip-mockuser2"] span');
+            expect(getCandidateUsersSpy).toHaveBeenCalled();
+            expect(candidateUser1.innerText).toBe('mockuser1');
+            expect(candidateUser2.innerText).toBe('mockuser2');
+        });
+    }));
+
+    it('should display placeholder if no candidate users', async(() => {
+        component.ngOnInit();
+        getCandidateUsersSpy.and.returnValue(of([]));
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            const labelValue = fixture.debugElement.query(By.css('[data-automation-id="card-array-label-candidateUsers"]'));
+            const defaultElement = fixture.debugElement.query(By.css('[data-automation-id="card-arrayitem-default"]'));
+            expect(labelValue.nativeElement.innerText).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_USERS');
+            expect(defaultElement.nativeElement.innerText).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_USERS_DEFAULT');
+        });
+
+    }));
+
+    it('should display candidate groups', async(() => {
+        component.ngOnInit();
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            const candidateGroup1 = fixture.nativeElement.querySelector('[data-automation-id="card-arrayitem-chip-mockgroup1"] span');
+            const candidateGroup2 = fixture.nativeElement.querySelector('[data-automation-id="card-arrayitem-chip-mockgroup2"] span');
+            expect(getCandidateGroupsSpy).toHaveBeenCalled();
+            expect(candidateGroup1.innerText).toBe('mockgroup1');
+            expect(candidateGroup2.innerText).toBe('mockgroup2');
+        });
+    }));
+
+    it('should display placeholder if no candidate groups', async(() => {
+        component.ngOnInit();
+        getCandidateGroupsSpy.and.returnValue(of([]));
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            const labelValue = fixture.debugElement.query(By.css('[data-automation-id="card-array-label-candidateGroups"]'));
+            const defaultElement = fixture.debugElement.query(By.css('[data-automation-id="card-arrayitem-default"]'));
+            expect(labelValue.nativeElement.innerText).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_GROUPS');
+            expect(defaultElement.nativeElement.innerText).toBe('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_GROUPS_DEFAULT');
+        });
+
+    }));
+
     describe('Config Filtering', () => {
 
         it('should show only the properties from the configuration file', async(() => {

lib/process-services-cloud/src/lib/task/task-header/components/task-header-cloud.component.ts

@@ -21,6 +21,7 @@ import {
     CardViewItem,
     CardViewTextItemModel,
     CardViewBaseItemModel,
+    CardViewArrayItemModel,
     TranslationService,
     AppConfigService,
     UpdateNotification,
@@ -29,7 +30,7 @@ import {
 import { TaskDetailsCloudModel, TaskStatusEnum } from '../../start-task/models/task-details-cloud.model';
 import { Router } from '@angular/router';
 import { TaskCloudService } from '../../services/task-cloud.service';
-import { Subject } from 'rxjs';
+import { Subject, Observable } from 'rxjs';
 import { NumericFieldValidator } from '../../../validators/numeric-field.validator';
 import { takeUntil } from 'rxjs/operators';
 
@@ -197,10 +198,38 @@ export class TaskHeaderCloudComponent implements OnInit, OnDestroy {
                     multiline: true,
                     editable: true
                 }
+            ),
+            new CardViewArrayItemModel(
+                {
+                    label: 'ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_USERS',
+                    value: this.getCandidateUsers(),
+                    key: 'candidateUsers',
+                    icon: 'person',
+                    default: this.translationService.instant('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_USERS_DEFAULT'),
+                    noOfItemsToDisplay: 2
+                }
+            ),
+            new CardViewArrayItemModel(
+                {
+                    label: 'ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_GROUPS',
+                    value: this.getCandidateGroups(),
+                    key: 'candidateGroups',
+                    icon: 'group',
+                    default: this.translationService.instant('ADF_CLOUD_TASK_HEADER.PROPERTIES.CANDIDATE_GROUPS_DEFAULT'),
+                    noOfItemsToDisplay: 2
+                }
             )
         ];
     }
 
+    private getCandidateUsers(): Observable<string[]> {
+        return this.taskCloudService.getCandidateUsers(this.appName, this.taskId);
+    }
+
+    private getCandidateGroups(): Observable<string[]> {
+        return this.taskCloudService.getCandidateGroups(this.appName, this.taskId);
+    }
+
     /**
      * Refresh the card data
      */