[ADF-4828] [ProcessListCloudComponent] Add action and context menu. (#5009)

* * Demo on list com

* [ADF-4828] [ADF] [ProcessListCloudComponent] Add action and context menu.

* Exposed action and context menu.
* Provided a way to in the demo shell to test action menu.
* Added required transaltion on demo shell.

* * Added doc

* * Fixed comments.

demo-shell/src/app/components/cloud/processes-cloud-demo.component.ts

@@ -24,7 +24,7 @@ import {
 } from '@alfresco/adf-process-services-cloud';
 
 import { ActivatedRoute, Router } from '@angular/router';
-import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
+import { UserPreferencesService, AppConfigService, DataCellEvent } from '@alfresco/adf-core';
 import { CloudLayoutService, CloudServiceSettings } from './services/cloud-layout.service';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
@@ -55,11 +55,17 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
     selectionMode: string;
     selectedRows: string[] = [];
     testingMode: boolean;
+    actionMenu: boolean;
+    contextMenu: boolean;
+    actions: any[] = [];
+    selectedAction: { id: number, name: string, actionType: string};
+    selectedContextAction: { id: number, name: string, actionType: string};
     processFilterProperties: any  = { filterProperties: [], sortProperties: [], actions: [] };
     processDetailsRedirection: boolean;
 
     editedFilter: ProcessFilterCloudModel;
 
+    private performAction$ = new Subject<any>();
     private onDestroy$ = new Subject<boolean>();
 
     constructor(
@@ -89,6 +95,7 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
         this.cloudLayoutService.settings$
             .pipe(takeUntil(this.onDestroy$))
             .subscribe(settings => this.setCurrentSettings(settings));
+        this.performContextActions();
     }
 
     ngOnDestroy() {
@@ -102,6 +109,9 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
             this.testingMode = settings.testingMode;
             this.selectionMode = settings.selectionMode;
             this.processDetailsRedirection = settings.processDetailsRedirection;
+            this.actionMenu = settings.actionMenu;
+            this.contextMenu = settings.contextMenu;
+            this.actions = settings.actions;
         }
     }
 
@@ -140,4 +150,41 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
         this.resetSelectedRows();
         this.selectedRows = nodes.map((node) => node.obj.entry);
     }
+
+    onShowRowActionsMenu(event: DataCellEvent) {
+        event.value.actions = this.actions;
+    }
+
+    onShowRowContextMenu(event: DataCellEvent) {
+        event.value.actions = this.actions.map((action) => {
+            return {
+                data: event.value.row['obj'],
+                model: action,
+                subject: this.performAction$
+
+            };
+        });
+    }
+
+    onExecuteRowAction(row: any) {
+        const value = row.value.row['obj'].entry;
+        const action = row.value.action;
+        this.selectedAction = {id: value.id, name: value.name, actionType: action.title};
+    }
+
+    performContextActions() {
+        this.performAction$
+          .pipe(takeUntil(this.onDestroy$))
+          .subscribe((action: any) => {
+            if (action) {
+              this.onExecuteContextAction(action);
+            }
+          });
+    }
+
+    onExecuteContextAction(contextAction: any) {
+        const value = contextAction.data.entry;
+        const action = contextAction.model;
+        this.selectedContextAction = {id: value.id, name: value.name, actionType: action.title};
+    }
 }