[AAE-3469] New Service Task List in Task List Cloud Component (#6131)

* [AAE-3469] New Service Task Lisst Component

* Fix unit tests

* Add documentation

* Add public methods to Data Table Schema

demo-shell/src/app.config.json

@@ -969,6 +969,35 @@
       "delete"
     ]
   },
+  "adf-edit-service-task-filter": {
+    "filterProperties": [
+      "appName",
+      "serviceTaskId",
+      "activityName",
+      "activityType",
+      "completedDate",
+      "startedDate",
+      "sort",
+      "order",
+      "status",
+      "elementId",
+      "serviceName",
+      "processInstanceId",
+      "processDefinitionId",
+      "serviceName"
+    ],
+    "sortProperties": [
+      "id",
+      "activityName",
+      "completedDate",
+      "startedDate"
+    ],
+    "actions": [
+      "save",
+      "saveAs",
+      "delete"
+    ]
+  },
   "adf-edit-process-filter": {
     "filterProperties": [
       "status",
@@ -1066,6 +1095,44 @@
       ]
     }
   },
+  "adf-cloud-service-task-list": {
+    "presets": {
+      "default": [
+        {
+          "key": "entry.id",
+          "type": "text",
+          "title": "ADF_CLOUD_SERVICE_TASK_LIST.PROPERTIES.ID",
+          "sortable": true
+        },
+        {
+          "key": "entry.activityName",
+          "type": "text",
+          "title": "ADF_CLOUD_SERVICE_TASK_LIST.PROPERTIES.ACTIVITY_NAME",
+          "sortable": true
+        },
+        {
+          "key": "entry.status",
+          "type": "text",
+          "title": "ADF_CLOUD_SERVICE_TASK_LIST.PROPERTIES.STATUS",
+          "sortable": true
+        },
+        {
+          "key": "entry.startedDate",
+          "type": "date",
+          "title": "ADF_CLOUD_SERVICE_TASK_LIST.PROPERTIES.STARTED_DATE",
+          "sortable": true,
+          "format": "timeAgo"
+        },
+        {
+          "key": "entry.completedDate",
+          "type": "date",
+          "title": "ADF_CLOUD_SERVICE_TASK_LIST.PROPERTIES.COMPLETED_DATE",
+          "sortable": true,
+          "format": "timeAgo"
+        }
+      ]
+    }
+  },
   "adf-cloud-process-list": {
     "presets": {
       "default": [

demo-shell/src/app/app.module.ts

@@ -65,6 +65,7 @@ import { TasksCloudDemoComponent } from './components/cloud/tasks-cloud-demo.com
 import { ProcessesCloudDemoComponent } from './components/cloud/processes-cloud-demo.component';
 import { TaskDetailsCloudDemoComponent } from './components/cloud/task-details-cloud-demo.component';
 import { TaskHeaderCloudDemoComponent } from './components/cloud/task-header-cloud-demo.component';
+import { ServiceTaskListCloudDemoComponent } from './components/cloud/service-task-list-cloud-demo.component';
 import { CloudViewerComponent } from './components/cloud/cloud-viewer.component';
 import { ProcessDetailsCloudDemoComponent } from './components/cloud/process-details-cloud-demo.component';
 import { StartTaskCloudDemoComponent } from './components/cloud/start-task-cloud-demo.component';
@@ -189,7 +190,8 @@ registerLocaleData(localeSv);
         FormCloudDemoComponent,
         ConfirmDialogExampleComponent,
         SampleWidgetComponent,
-        ProcessCloudLayoutComponent
+        ProcessCloudLayoutComponent,
+        ServiceTaskListCloudDemoComponent
     ],
     providers: [
         {

demo-shell/src/app/app.routes.ts

@@ -54,6 +54,7 @@ import { DemoErrorComponent } from './components/error/demo-error.component';
 import { TaskHeaderCloudDemoComponent } from './components/cloud/task-header-cloud-demo.component';
 import { FilteredSearchComponent } from './components/files/filtered-search.component';
 import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component';
+import { ServiceTaskListCloudDemoComponent } from './components/cloud/service-task-list-cloud-demo.component';
 
 export const appRoutes: Routes = [
     { path: 'login', loadChildren: () => import('./components/login/login.module').then(m => m.AppLoginModule) },
@@ -176,22 +177,31 @@ export const appRoutes: Routes = [
             {
                 path: 'cloud',
                 canActivate: [AuthGuardSsoRoleService],
-                data: { roles: ['ACTIVITI_USER'], redirectUrl: '/error/403' },
+                data: { roles: ['ACTIVITI_ADMIN', 'ACTIVITI_USER'], redirectUrl: '/error/403' },
                 children: [
                     {
                         path: '',
+                        data: { roles: ['ACTIVITI_USER'], redirectUrl: '/error/403' },
                         component: AppsCloudDemoComponent
                     },
                     {
                         path: 'people-group-cloud',
+                        data: { roles: ['ACTIVITI_USER'], redirectUrl: '/error/403' },
                         component: PeopleGroupCloudDemoComponent
                     },
                     {
                         path: 'task-header-cloud',
+                        data: { roles: ['ACTIVITI_USER'], redirectUrl: '/error/403' },
                         component: TaskHeaderCloudDemoComponent
                     },
+                    {
+                        path: 'service-task-list',
+                        data: { roles: ['ACTIVITI_ADMIN'], redirectUrl: '/error/403' },
+                        component: ServiceTaskListCloudDemoComponent
+                    },
                     {
                         path: 'community',
+                        data: { roles: ['ACTIVITI_USER'], redirectUrl: '/error/403' },
                         loadChildren: () => import('./components/cloud/community/community.module').then(m => m.AppCommunityModule)
                     },
                     {

demo-shell/src/app/components/app-layout/app-layout.component.ts

@@ -55,7 +55,8 @@ export class AppLayoutComponent implements OnInit, OnDestroy {
                 { href: '/cloud/community', icon: 'cloud', title: 'APP_LAYOUT.COMMUNITY' },
                 { href: '/form-cloud', icon: 'poll', title: 'APP_LAYOUT.FORM' },
                 { href: '/cloud/people-group-cloud', icon: 'group', title: 'APP_LAYOUT.PEOPLE_GROUPS_CLOUD' },
-                { href: '/cloud/task-header-cloud', icon: 'cloud', title: 'APP_LAYOUT.TASK_HEADER_CLOUD.COMPONENT_NAME' }
+                { href: '/cloud/task-header-cloud', icon: 'cloud', title: 'APP_LAYOUT.TASK_HEADER_CLOUD.COMPONENT_NAME' },
+                { href: '/cloud/service-task-list', icon: 'cloud', title: 'APP_LAYOUT.SERVICE_TASK_LIST' }
             ]
         },
         { href: '/activiti', icon: 'device_hub', title: 'APP_LAYOUT.PROCESS_SERVICES', children: [

demo-shell/src/app/components/cloud/service-task-list-cloud-demo.component.html

@@ -0,0 +1,32 @@
+<div fxLayout="column" fxFill fxLayoutGap="2px">
+    <adf-cloud-edit-task-filter
+        [id]="'myFilter'"
+        [taskType]="'serviceTask'"
+        [filterProperties]="taskFilterProperties.filterProperties"
+        [sortProperties]="taskFilterProperties.sortProperties"
+        [actions]="taskFilterProperties.actions"
+        (filterChange)="onFilterChange($event)">
+    </adf-cloud-edit-task-filter>
+    <div fxLayout="column" fxFlex fxLayoutAlign="space-between" *ngIf="editedFilter">
+        <adf-cloud-task-list #taskCloud
+            fxFlex
+            [taskType]="'serviceTask'"
+            [queryParams]="editedFilter"
+            class="app-cloud-layout-overflow"
+            [appName]="editedFilter.appName"
+            [sorting]="sortArray"
+            [multiselect]="multiselect"
+            [selectionMode]="selectionMode"
+            [stickyHeader]="true"
+            [showActions]="actionMenu"
+            [showContextMenu]="contextMenu"
+            #taskCloud>
+        </adf-cloud-task-list>
+        <adf-pagination
+            [target]="taskCloud"
+            (changePageSize)="onChangePageSize($event)"
+            (nextPage)="resetSelectedRows()"
+            (prevPage)="resetSelectedRows()">
+        </adf-pagination>
+    </div>
+</div>

demo-shell/src/app/components/cloud/service-task-list-cloud-demo.component.ts

@@ -0,0 +1,98 @@
+/*!
+ * @license
+ * Copyright 2019 Alfresco Software, Ltd.
+ *
+ * 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, OnInit, OnDestroy } from '@angular/core';
+import { TaskListCloudSortingModel, TaskFilterCloudModel } from '@alfresco/adf-process-services-cloud';
+import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
+import { CloudLayoutService } from './services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+
+@Component({
+    templateUrl: 'service-task-list-cloud-demo.component.html'
+})
+export class ServiceTaskListCloudDemoComponent implements OnInit, OnDestroy {
+
+    public static ACTION_SAVE_AS = 'saveAs';
+    public static ACTION_DELETE = 'delete';
+    static TASK_FILTER_PROPERTY_KEYS = 'adf-edit-service-task-filter';
+
+    isFilterLoaded = false;
+
+    selectedRow: any;
+
+    sortArray: TaskListCloudSortingModel[];
+    editedFilter: TaskFilterCloudModel;
+    taskFilterProperties: any  = { filterProperties: [], sortProperties: [], actions: [] };
+
+    multiselect: boolean;
+    selectedRows: string[] = [];
+    actionMenu: boolean;
+    contextMenu: boolean;
+    actions: any[] = [];
+    selectedAction: { id: number, name: string, actionType: string};
+    selectedContextAction: { id: number, name: string, actionType: string};
+    selectionMode: string;
+
+    private onDestroy$ = new Subject<boolean>();
+
+    constructor(
+        private cloudLayoutService: CloudLayoutService,
+        private userPreference: UserPreferencesService,
+        private appConfig: AppConfigService) {
+
+        const properties = this.appConfig.get<Array<any>>(ServiceTaskListCloudDemoComponent.TASK_FILTER_PROPERTY_KEYS);
+        if (properties) {
+            this.taskFilterProperties = properties;
+        }
+    }
+
+    ngOnInit() {
+        this.isFilterLoaded = false;
+        this.cloudLayoutService.settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
+    }
+
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
+    }
+
+    setCurrentSettings(settings) {
+        if (settings) {
+            this.multiselect = settings.multiselect;
+            this.selectionMode = settings.selectionMode;
+            this.actionMenu = settings.actionMenu;
+            this.contextMenu = settings.contextMenu;
+            this.actions = settings.actions;
+        }
+    }
+
+    onChangePageSize(event) {
+        this.userPreference.paginationSize = event.maxItems;
+    }
+
+    resetSelectedRows() {
+        this.selectedRows = [];
+    }
+
+    onFilterChange(filter: any) {
+        this.editedFilter = Object.assign({}, filter);
+        this.sortArray = [new TaskListCloudSortingModel({ orderBy: this.editedFilter.sort, direction: this.editedFilter.order })];
+    }
+}