Display name and date for process instances if no name present (#1515)

* Display name and date for process instances if no name present

Refs #1461

* Re-work tests for processlist and process details to reflect changes

Refs #1461

ng2-components/ng2-activiti-processlist/src/assets/activiti-process-instances-list.mock.ts

@@ -0,0 +1,74 @@
+/*!
+ * @license
+ * Copyright 2016 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 { ProcessInstance } from '../models/process-instance.model';
+
+export var fakeProcessInstances = [
+    new ProcessInstance({
+        id: 1,
+        name: 'Process 773443333',
+        processDefinitionId: 'fakeprocess:5:7507',
+        processDefinitionKey: 'fakeprocess',
+        processDefinitionName: 'Fake Process Name',
+        description: null, category: null,
+        started: '2015-11-09T12:36:14.184+0000',
+        startedBy: {
+            id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
+        }
+    }),
+    new ProcessInstance({
+        id: 2,
+        name: 'Process 382927392',
+        processDefinitionId: 'fakeprocess:5:7507',
+        processDefinitionKey: 'fakeprocess',
+        processDefinitionName: 'Fake Process Name',
+        description: null,
+        category: null,
+        started: '2017-11-09T12:37:25.184+0000',
+        startedBy: {
+            id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
+        }
+    })
+];
+
+export var fakeProcessInstancesWithNoName = [
+    new ProcessInstance({
+        id: 1,
+        name: null,
+        processDefinitionId: 'fakeprocess:5:7507',
+        processDefinitionKey: 'fakeprocess',
+        processDefinitionName: 'Fake Process Name',
+        description: null, category: null,
+        started: '2017-11-09T12:36:14.184+0000',
+        startedBy: {
+            id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
+        }
+    }),
+    new ProcessInstance({
+        id: 2,
+        name: '',
+        processDefinitionId: 'fakeprocess:5:7507',
+        processDefinitionKey: 'fakeprocess',
+        processDefinitionName: 'Fake Process Name',
+        description: null,
+        category: null,
+        started: '2017-11-09T12:37:25.184+0000',
+        startedBy: {
+            id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
+        }
+    })
+];

ng2-components/ng2-activiti-processlist/src/assets/activiti-process.model.mock.ts

@@ -50,3 +50,16 @@ export var exampleProcess = new ProcessInstance({
         email: 'bob@app.activiti.com'
     }
 });
+
+export var exampleProcessNoName = new ProcessInstance({
+    id: '123',
+    name: null,
+    started: '2016-11-10T03:37:30.010+0000',
+    startedBy: {
+        id: 1001,
+        firstName: 'Bob',
+        lastName: 'Jones',
+        email: 'bob@app.activiti.com'
+    },
+    processDefinitionName: 'My Process'
+});

ng2-components/ng2-activiti-processlist/src/components/activiti-process-instance-details.component.html

@@ -1,6 +1,6 @@
 <div *ngIf="!processInstanceDetails">{{ 'DETAILS.MESSAGES.NONE'|translate }}</div>
 <div *ngIf="processInstanceDetails">
-    <h2 class="mdl-card__title-text">{{processInstanceDetails.name}}</h2>
+    <h2 class="mdl-card__title-text">{{ getProcessNameOrDescription('medium') }}</h2>
     <activiti-process-instance-header [processInstance]="processInstanceDetails"></activiti-process-instance-header>
     <div class="mdl-card mdl-shadow--2dp activiti-process-container">
         <div class="mdl-cell mdl-cell--12-col">

ng2-components/ng2-activiti-processlist/src/components/activiti-process-instance-details.component.spec.ts

@@ -27,7 +27,7 @@ import { ActivitiTaskListModule } from 'ng2-activiti-tasklist';
 import { ActivitiProcessInstanceDetails } from './activiti-process-instance-details.component';
 import { ActivitiProcessService } from './../services/activiti-process.service';
 import { TranslationMock } from './../assets/translation.service.mock';
-import { exampleProcess } from './../assets/activiti-process.model.mock';
+import { exampleProcess, exampleProcessNoName } from './../assets/activiti-process.model.mock';
 import { ProcessInstance } from '../models/process-instance.model';
 
 describe('ActivitiProcessInstanceDetails', () => {
@@ -94,6 +94,18 @@ describe('ActivitiProcessInstanceDetails', () => {
         });
     }));
 
+    it('should display default details when the process instance has no name', async(() => {
+        getProcessSpy = getProcessSpy.and.returnValue(Observable.of(exampleProcessNoName));
+        fixture.detectChanges();
+        component.ngOnChanges({ 'processInstanceId': new SimpleChange(null, '123') });
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            let headerEl: DebugElement = fixture.debugElement.query(By.css('h2'));
+            expect(headerEl).not.toBeNull();
+            expect(headerEl.nativeElement.innerText).toBe('My Process - Nov 10, 2016, 3:37:30 AM');
+        });
+    }));
+
     describe('change detection', () => {
 
         let change = new SimpleChange('123', '456');

ng2-components/ng2-activiti-processlist/src/components/activiti-process-instance-details.component.ts

@@ -15,6 +15,7 @@
  * limitations under the License.
  */
 
+import { DatePipe } from '@angular/common';
 import { Component, Input, ViewChild, Output, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
 import { AlfrescoTranslationService, LogService } from 'ng2-alfresco-core';
 import { TaskDetailsEvent } from 'ng2-activiti-tasklist';
@@ -115,4 +116,22 @@ export class ActivitiProcessInstanceDetails implements OnChanges {
     onTaskClicked(event: TaskDetailsEvent) {
         this.taskClick.emit(event);
     }
+
+    getProcessNameOrDescription(dateFormat): string {
+        let name = '';
+        if (this.processInstanceDetails) {
+            name = this.processInstanceDetails.name ||
+                this.processInstanceDetails.processDefinitionName + ' - ' + this.getFormatDate(this.processInstanceDetails.started, dateFormat);
+        }
+        return name;
+    }
+
+    getFormatDate(value, format: string) {
+        let datePipe = new DatePipe('en-US');
+        try {
+            return datePipe.transform(value, format);
+        } catch (err) {
+            this.logService.error(`ProcessListInstanceHeader: error parsing date ${value} to format ${format}`);
+        }
+    }
 }

ng2-components/ng2-activiti-processlist/src/components/activiti-processlist.component.spec.ts

@@ -23,33 +23,12 @@ import { ActivitiProcessInstanceListComponent } from './activiti-processlist.com
 import { AlfrescoTranslationService, CoreModule } from 'ng2-alfresco-core';
 import { DataTableModule, ObjectDataRow, DataRowEvent, ObjectDataTableAdapter, DataSorting } from 'ng2-alfresco-datatable';
 
+import { fakeProcessInstances, fakeProcessInstancesWithNoName } from '../assets/activiti-process-instances-list.mock';
 import { TranslationMock } from './../assets/translation.service.mock';
-import { ProcessInstance } from '../models/process-instance.model';
 import { ActivitiProcessService } from '../services/activiti-process.service';
 
 describe('ActivitiProcessInstanceListComponent', () => {
 
-    let fakeGlobalProcesses = [
-        new ProcessInstance({
-            id: 1, name: 'process-name',
-            processDefinitionId: 'fakeprocess:5:7507',
-            processDefinitionKey: 'fakeprocess',
-            processDefinitionName: 'Fake Process Name',
-            description: null, category: null,
-            started: '2017-11-09T12:37:25.184+0000',
-            startedBy: {
-                id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
-            }
-        }),
-        new ProcessInstance({
-            id: 2, name: '', description: null, category: null,
-            started: '2015-11-09T12:37:25.184+0000',
-            startedBy: {
-                id: 3, firstName: 'tenant2', lastName: 'tenantLastname', email: 'tenant2@tenant'
-            }
-        })
-    ];
-
     let componentHandler: any;
     let fixture: ComponentFixture<ActivitiProcessInstanceListComponent>;
     let component: ActivitiProcessInstanceListComponent;
@@ -72,7 +51,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
             component = fixture.componentInstance;
             service = fixture.debugElement.injector.get(ActivitiProcessService);
 
-            getProcessInstancesSpy = spyOn(service, 'getProcessInstances').and.returnValue(Observable.of(fakeGlobalProcesses));
+            getProcessInstancesSpy = spyOn(service, 'getProcessInstances').and.returnValue(Observable.of(fakeProcessInstances));
 
             componentHandler = jasmine.createSpyObj('componentHandler', [
                 'upgradeAllRegistered',
@@ -114,10 +93,16 @@ describe('ActivitiProcessInstanceListComponent', () => {
         component.processDefinitionKey = null;
         fixture.detectChanges();
         tick();
-        expect(emitSpy).toHaveBeenCalledWith(fakeGlobalProcesses);
+        expect(emitSpy).toHaveBeenCalledWith(fakeProcessInstances);
     }));
 
-    it('should return the process instances list', (done) => {
+    it('should return the process instances list in original order when datalist passed non-existent columns', (done) => {
+        component.data = new ObjectDataTableAdapter(
+            [],
+            [
+                {type: 'text', key: 'fake-id', title: 'Name'}
+            ]
+        );
         component.appId = '1';
         component.state = 'open';
         component.processDefinitionKey = null;
@@ -126,22 +111,104 @@ describe('ActivitiProcessInstanceListComponent', () => {
             expect(component.data).toBeDefined();
             expect(component.isListEmpty()).not.toBeTruthy();
             expect(component.data.getRows().length).toEqual(2);
-            expect(component.data.getRows()[0].getValue('name')).toEqual('No name');
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
+            done();
+        });
+        fixture.detectChanges();
+    });
+
+    it('should order the process instances by name column when no sort passed', (done) => {
+        component.appId = '1';
+        component.state = 'open';
+        component.processDefinitionKey = null;
+        component.onSuccess.subscribe((res) => {
+            expect(res).toBeDefined();
+            expect(component.data).toBeDefined();
+            expect(component.isListEmpty()).not.toBeTruthy();
+            expect(component.data.getRows().length).toEqual(2);
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 382927392');
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Process 773443333');
+            done();
+        });
+        fixture.detectChanges();
+    });
+
+    it('should order the process instances by descending column when specified', (done) => {
+        component.appId = '1';
+        component.state = 'open';
+        component.processDefinitionKey = null;
+        component.sort = 'name-desc';
+        component.onSuccess.subscribe((res) => {
+            expect(res).toBeDefined();
+            expect(component.data).toBeDefined();
+            expect(component.isListEmpty()).not.toBeTruthy();
+            expect(component.data.getRows().length).toEqual(2);
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
+            done();
+        });
+        fixture.detectChanges();
+    });
+
+    it('should order the process instances by ascending column when specified', (done) => {
+        component.appId = '1';
+        component.state = 'open';
+        component.processDefinitionKey = null;
+        component.sort = 'started-asc';
+        component.onSuccess.subscribe((res) => {
+            expect(res).toBeDefined();
+            expect(component.data).toBeDefined();
+            expect(component.isListEmpty()).not.toBeTruthy();
+            expect(component.data.getRows().length).toEqual(2);
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Process 382927392');
+            done();
+        });
+        fixture.detectChanges();
+    });
+
+    it('should order the process instances by descending start date when specified', (done) => {
+        component.appId = '1';
+        component.state = 'open';
+        component.processDefinitionKey = null;
+        component.sort = 'started-desc';
+        component.onSuccess.subscribe((res) => {
+            expect(res).toBeDefined();
+            expect(component.data).toBeDefined();
+            expect(component.isListEmpty()).not.toBeTruthy();
+            expect(component.data.getRows().length).toEqual(2);
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 382927392');
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Process 773443333');
             done();
         });
         fixture.detectChanges();
     });
 
     it('should return the process instances list filtered by processDefinitionKey', (done) => {
+        let key = 'fakeprocess';
+        component.appId = '1';
+        component.state = 'open';
+        component.processDefinitionKey = key;
+        component.onSuccess.subscribe((res) => {
+            let lastCall = getProcessInstancesSpy.calls.mostRecent();
+            expect(lastCall).toBeDefined();
+            let lastCallArgs = lastCall.args;
+            expect(lastCallArgs[0]).toBeDefined();
+            expect(lastCallArgs[0].processDefinitionKey).toEqual(key);
+            done();
+        });
+        fixture.detectChanges();
+    });
+
+    it('should return a default name if no name is specified on the process', (done) => {
+        getProcessInstancesSpy = getProcessInstancesSpy.and.returnValue(Observable.of(fakeProcessInstancesWithNoName));
         component.appId = '1';
         component.state = 'open';
         component.processDefinitionKey = 'fakeprocess';
         component.onSuccess.subscribe( (res) => {
-            expect(res).toBeDefined();
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Fake Process Name - Nov 9, 2017, 12:36:14 PM');
-            expect(component.data).toBeDefined();
+            expect(component.data.getRows()[1].getValue('name')).toEqual('Fake Process Name - Nov 9, 2017, 12:37:25 PM');
-            expect(component.isListEmpty()).not.toBeTruthy();
-            expect(component.data.getRows().length).toEqual(2);
-            expect(component.data.getRows()[0].getValue('name')).toEqual('No name');
             done();
         });
         fixture.detectChanges();
@@ -172,7 +239,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
         let emitSpy = spyOn(component.onSuccess, 'emit');
         component.reload();
         tick();
-        expect(emitSpy).toHaveBeenCalledWith(fakeGlobalProcesses);
+        expect(emitSpy).toHaveBeenCalledWith(fakeProcessInstances);
     }));
 
     it('should reload processes when reload() is called', (done) => {
@@ -188,7 +255,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
             expect(component.data).toBeDefined();
             expect(component.isListEmpty()).not.toBeTruthy();
             expect(component.data.getRows().length).toEqual(2);
-            expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+            expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
             done();
         });
         component.reload();
@@ -235,7 +302,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
                 expect(component.data).toBeDefined();
                 expect(component.isListEmpty()).not.toBeTruthy();
                 expect(component.data.getRows().length).toEqual(2);
-                expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+                expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
                 done();
             });
 
@@ -251,7 +318,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
                 expect(component.data).toBeDefined();
                 expect(component.isListEmpty()).not.toBeTruthy();
                 expect(component.data.getRows().length).toEqual(2);
-                expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+                expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
                 done();
             });
 
@@ -267,7 +334,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
                 expect(component.data).toBeDefined();
                 expect(component.isListEmpty()).not.toBeTruthy();
                 expect(component.data.getRows().length).toEqual(2);
-                expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+                expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
                 done();
             });
 
@@ -283,7 +350,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
                 expect(component.data).toBeDefined();
                 expect(component.isListEmpty()).not.toBeTruthy();
                 expect(component.data.getRows().length).toEqual(2);
-                expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+                expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
                 done();
             });
 
@@ -314,7 +381,7 @@ describe('ActivitiProcessInstanceListComponent', () => {
                 expect(component.data).toBeDefined();
                 expect(component.isListEmpty()).not.toBeTruthy();
                 expect(component.data.getRows().length).toEqual(2);
-                expect(component.data.getRows()[1].getValue('name')).toEqual('No name');
+                expect(component.data.getRows()[0].getValue('name')).toEqual('Process 773443333');
                 done();
             });
 

ng2-components/ng2-activiti-processlist/src/components/activiti-processlist.component.ts

@@ -15,6 +15,7 @@
  * limitations under the License.
  */
 
+import { DatePipe } from '@angular/common';
 import { Component, Input, Output, EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core';
 import { AlfrescoTranslationService } from 'ng2-alfresco-core';
 import { ObjectDataTableAdapter, DataTableAdapter, DataRowEvent, ObjectDataRow, DataSorting } from 'ng2-alfresco-datatable';
@@ -154,7 +155,8 @@ export class ActivitiProcessInstanceListComponent implements OnInit, OnChanges {
             instancesRows.push(new ObjectDataRow({
                 id: row.id,
                 name: row.name,
-                started: row.started
+                started: row.started,
+                processDefinitionName: row.processDefinitionName
             }));
         });
         return instancesRows;
@@ -236,12 +238,30 @@ export class ActivitiProcessInstanceListComponent implements OnInit, OnChanges {
      */
     private optimizeNames(instances: any[]) {
         instances = instances.map(t => {
-            t.obj.name = t.obj.name || 'No name';
+            t.obj.name = this.getProcessNameOrDescription(t.obj, 'medium');
             return t;
         });
         return instances;
     }
 
+    getProcessNameOrDescription(processInstance, dateFormat): string {
+        let name = '';
+        if (processInstance) {
+            name = processInstance.name ||
+                processInstance.processDefinitionName + ' - ' + this.getFormatDate(processInstance.started, dateFormat);
+        }
+        return name;
+    }
+
+    getFormatDate(value, format: string) {
+        let datePipe = new DatePipe('en-US');
+        try {
+            return datePipe.transform(value, format);
+        } catch (err) {
+            return '';
+        }
+    }
+
     private createRequestNode() {
         let requestNode = {
             appDefinitionId: this.appId,