From 4df6a763f98be741ee704f4af63c6e9709fb6f3a Mon Sep 17 00:00:00 2001
From: mauriziovitale84 <maurizio.vitale@alfresco.com>
Date: Thu, 15 Sep 2016 11:16:00 +0100
Subject: [PATCH] Add activiti apps component in the demo shell

---
 .../activiti/activiti-demo.component.html     |  9 ++--
 .../activiti/activiti-demo.component.ts       | 45 +++++++++++--------
 2 files changed, 33 insertions(+), 21 deletions(-)

diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.html b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
index f94e5cec19..ada072f2bc 100644
--- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
+++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html
@@ -1,4 +1,5 @@
 <div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
+    <activiti-apps (appClick)="onAppClick($event)"></activiti-apps>
     <header class="mdl-layout__header">
         <!-- Tabs -->
         <div class="mdl-layout__tab-bar mdl-js-ripple-effect">
@@ -13,7 +14,7 @@
                 <div class="mdl-grid">
                     <div class="mdl-cell mdl-cell--2-col task-column mdl-shadow--2dp">
                         <span>Task Filters</span>
-                        <activiti-filters [appId]="appId" (filterClick)="onTaskFilterClick($event)"></activiti-filters>
+                        <activiti-filters [appId]="appId" (filterClick)="onTaskFilterClick($event)" #activitifilter></activiti-filters>
                     </div>
                     <div class="mdl-cell mdl-cell--3-col task-column mdl-shadow--2dp">
                         <span>Task List</span>
@@ -36,12 +37,14 @@
                         <div class="mdl-cell mdl-cell--2-col task-column">
                             <span>Process Filters</span>
                             <activiti-start-process-instance [appId]="appId"></activiti-start-process-instance>
-                            <activiti-process-instance-filters (filterClick)="onProcessFilterClick($event)"></activiti-process-instance-filters>
+                            <activiti-process-instance-filters [appId]="appId"
+                                    (filterClick)="onProcessFilterClick($event)"></activiti-process-instance-filters>
                         </div>
                         <div class="mdl-cell mdl-cell--3-col task-column">
                             <span>Process List</span>
                             <activiti-process-instance-list [filter]="processFilter" [schemaColumn]="processSchemaColumns"
-                                               (rowClick)="onProcessRowClick($event)" #activitiprocesslist></activiti-process-instance-list>
+                                               (rowClick)="onProcessRowClick($event)" (onSuccess)="onSuccessProcessList($event)"
+                                                            #activitiprocesslist></activiti-process-instance-list>
                         </div>
                         <div class="mdl-cell mdl-cell--7-col task-column">
                             <span>Process Details</span>
diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
index 32bc6a8861..a5b64ffb4e 100644
--- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
+++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts
@@ -16,7 +16,12 @@
  */
 
 import { Component, AfterViewChecked, ViewChild, Input } from '@angular/core';
-import { ALFRESCO_TASKLIST_DIRECTIVES, TaskQueryRequestRepresentationModel } from 'ng2-activiti-tasklist';
+import { ALFRESCO_TASKLIST_DIRECTIVES,
+    TaskQueryRequestRepresentationModel,
+    AppDefinitionRepresentationModel,
+    FilterRepresentationModel,
+    UserTaskFilterRepresentationModel
+} from 'ng2-activiti-tasklist';
 import { ACTIVITI_PROCESSLIST_DIRECTIVES } from 'ng2-activiti-processlist';
 import { ActivitiForm } from 'ng2-activiti-form';
 import { ActivatedRoute } from '@angular/router';
@@ -36,6 +41,9 @@ export class ActivitiDemoComponent implements AfterViewChecked {
 
     currentChoice: string = 'task-list';
 
+    @ViewChild('activitifilter')
+    activitifilter: any;
+
     @ViewChild('activitidetails')
     activitidetails: any;
 
@@ -60,7 +68,7 @@ export class ActivitiDemoComponent implements AfterViewChecked {
     sub: Subscription;
 
     @Input()
-    appId: string;
+    appId: number;
 
     setChoice($event) {
         this.currentChoice = $event.target.value;
@@ -94,36 +102,37 @@ export class ActivitiDemoComponent implements AfterViewChecked {
         this.sub.unsubscribe();
     }
 
-    onTaskFilterClick(event: any) {
-        this.taskFilter = event;
-        let requestNode = {appDefinitionId: this.taskFilter.appId,
-            processDefinitionId: this.taskFilter.filter.processDefinitionId,
-            text: this.taskFilter.filter.name,
-            assignment: this.taskFilter.filter.assignment,
-            state: this.taskFilter.filter.state,
-            sort: this.taskFilter.filter.sort
-        };
-        this.activititasklist.load(new TaskQueryRequestRepresentationModel(requestNode));
+    onAppClick(app: AppDefinitionRepresentationModel) {
+        this.appId = app.id;
+        this.taskFilter = null;
+        this.currentTaskId = null;
+
+        this.processFilter = null;
+        this.currentProcessInstanceId = null;
     }
 
-    onSuccessTaskList(event: any) {
+    onTaskFilterClick(event: FilterRepresentationModel) {
+        this.taskFilter = event;
+    }
+
+    onSuccessTaskList(event: UserTaskFilterRepresentationModel) {
         this.currentTaskId = this.activititasklist.getCurrentTaskId();
-        this.activitidetails.loadDetails(this.currentTaskId);
     }
 
     onProcessFilterClick(event: any) {
-        this.processFilter = event.filter;
-        this.activitiprocesslist.load(this.processFilter);
+        this.processFilter = event;
+    }
+
+    onSuccessProcessList(event: any) {
+        this.currentProcessInstanceId = this.activitiprocesslist.getCurrentProcessId();
     }
 
     onTaskRowClick(taskId) {
         this.currentTaskId = taskId;
-        this.activitidetails.loadDetails(this.currentTaskId);
     }
 
     onProcessRowClick(processInstanceId) {
         this.currentProcessInstanceId = processInstanceId;
-        this.activitiprocessdetails.load(this.currentProcessInstanceId);
     }
 
     processCancelled(data: any) {