[ADF-3284] ProcessFilter - preselect filter param (#3637)

* preselect filter

* tests fix

* process filter refactor

* unit tests fix

* focus tests fix

demo-shell/src/app/components/process-service/process-service.component.html

@@ -123,7 +123,7 @@
                                              [headingIcon]="'assessment'">
                             <adf-process-instance-filters
                                 #activitiprocessfilter
-                                [filterParam]="{index: 0}"
+                                [filterParam]="filterSelected"
                                 [appId]="appId"
                                 (filterClick)="onProcessFilterClick($event)"
                                 (success)="onSuccessProcessFilterList($event)">

lib/process-services/process-list/components/process-filters.component.spec.ts

@@ -15,32 +15,53 @@
  * limitations under the License.
  */
 
-import { SimpleChange } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA, SimpleChange } from '@angular/core';
 import { AppsProcessService } from '@alfresco/adf-core';
 import { Observable } from 'rxjs/Observable';
 import { FilterProcessRepresentationModel } from '../models/filter-process.model';
 import { ProcessFilterService } from '../services/process-filter.service';
 import { ProcessFiltersComponent } from './process-filters.component';
+import { setupTestBed } from '../../../core/testing/setupTestBed';
+import { CoreModule } from '../../../core/core.module';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 describe('ProcessFiltersComponent', () => {
 
     let filterList: ProcessFiltersComponent;
+    let fixture: ComponentFixture<ProcessFiltersComponent>;
     let processFilterService: ProcessFilterService;
     let appsProcessService: AppsProcessService;
     let fakeGlobalFilterPromise;
     let mockErrorFilterPromise;
 
+    setupTestBed({
+        imports: [
+            NoopAnimationsModule,
+            CoreModule.forRoot()
+        ],
+        declarations: [ProcessFiltersComponent],
+        providers: [AppsProcessService, ProcessFilterService],
+        schemas: [CUSTOM_ELEMENTS_SCHEMA]
+    });
+
     beforeEach(() => {
+        fixture = TestBed.createComponent(ProcessFiltersComponent);
+        filterList = fixture.componentInstance;
+
         fakeGlobalFilterPromise = Promise.resolve([
             new FilterProcessRepresentationModel({
+                id: 10,
                 name: 'FakeInvolvedTasks',
                 filter: { state: 'open', assignment: 'fake-involved' }
             }),
             new FilterProcessRepresentationModel({
+                id: 20,
                 name: 'FakeMyTasks',
                 filter: { state: 'open', assignment: 'fake-assignee' }
             }),
             new FilterProcessRepresentationModel({
+                id: 30,
                 name: 'Running',
                 filter: { state: 'open', assignment: 'fake-running' }
             })
@@ -55,6 +76,10 @@ describe('ProcessFiltersComponent', () => {
         filterList = new ProcessFiltersComponent(processFilterService, appsProcessService);
     });
 
+    afterEach(() => {
+        fixture.destroy();
+    });
+
     it('should return the filter task list', (done) => {
         spyOn(processFilterService, 'getProcessFilters').and.returnValue(Observable.fromPromise(fakeGlobalFilterPromise));
         const appId = '1';
@@ -140,10 +165,9 @@ describe('ProcessFiltersComponent', () => {
 
     it('should emit an event when a filter is selected', (done) => {
         let currentFilter = new FilterProcessRepresentationModel({
-            filter: {
+            id: 10,
-                state: 'open',
+            name: 'FakeInvolvedTasks',
-                assignment: 'fake-involved'
+            filter: { state: 'open', assignment: 'fake-involved' }
-            }
         });
 
         filterList.filterClick.subscribe((filter: FilterProcessRepresentationModel) => {
@@ -196,25 +220,63 @@ describe('ProcessFiltersComponent', () => {
         expect(filterList.getCurrentFilter()).toBe(filter);
     });
 
-    it ('should select current process filter', (done) => {
+    it('should select the filter passed as input by id', (done) => {
         spyOn(processFilterService, 'getProcessFilters').and.returnValue(Observable.fromPromise(fakeGlobalFilterPromise));
-        const appId = '1';
+
+        filterList.filterParam = new FilterProcessRepresentationModel({ id: 20 });
+
+        const appId = 1;
         let change = new SimpleChange(null, appId, true);
+
         filterList.ngOnChanges({ 'appId': change });
 
-        expect(filterList.currentFilter).toBeUndefined();
+        fixture.whenStable().then(() => {
-
+            fixture.detectChanges();
-        const selectedFilter = new FilterProcessRepresentationModel({
+            expect(filterList.filters).toBeDefined();
-            name: 'FakeMyTasks',
+            expect(filterList.filters.length).toEqual(3);
-            filter: { state: 'open', assignment: 'fake-assignee' }
+            expect(filterList.currentFilter).toBeDefined();
-        });
-
-        filterList.success.subscribe(() => {
-            filterList.selectProcessFilter(selectedFilter);
             expect(filterList.currentFilter.name).toEqual('FakeMyTasks');
             done();
         });
+    });
 
-        filterList.ngOnInit();
+    it('should select the filter passed as input by name', (done) => {
+        spyOn(processFilterService, 'getProcessFilters').and.returnValue(Observable.fromPromise(fakeGlobalFilterPromise));
+
+        filterList.filterParam = new FilterProcessRepresentationModel({ name: 'FakeMyTasks' });
+
+        const appId = 1;
+        let change = new SimpleChange(null, appId, true);
+
+        filterList.ngOnChanges({ 'appId': change });
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(filterList.filters).toBeDefined();
+            expect(filterList.filters.length).toEqual(3);
+            expect(filterList.currentFilter).toBeDefined();
+            expect(filterList.currentFilter.name).toEqual('FakeMyTasks');
+            done();
+        });
+    });
+
+    it('should select first filter if filterParam is empty', (done) => {
+        spyOn(processFilterService, 'getProcessFilters').and.returnValue(Observable.fromPromise(fakeGlobalFilterPromise));
+
+        filterList.filterParam = new FilterProcessRepresentationModel({});
+
+        const appId = 1;
+        let change = new SimpleChange(null, appId, true);
+
+        filterList.ngOnChanges({ 'appId': change });
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(filterList.filters).toBeDefined();
+            expect(filterList.filters.length).toEqual(3);
+            expect(filterList.currentFilter).toBeDefined();
+            expect(filterList.currentFilter.name).toEqual('FakeInvolvedTasks');
+            done();
+        });
     });
 });

lib/process-services/process-list/components/process-filters.component.ts

@@ -17,9 +17,8 @@
 
 import { AppsProcessService } from '@alfresco/adf-core';
 import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
-import { ProcessInstanceFilterRepresentation } from 'alfresco-js-api';
+import { ProcessInstanceFilterRepresentation, UserProcessInstanceFilterRepresentation } from 'alfresco-js-api';
 import { Observable } from 'rxjs/Observable';
-import { Observer } from 'rxjs/Observer';
 import { FilterProcessRepresentationModel } from '../models/filter-process.model';
 import { ProcessFilterService } from './../services/process-filter.service';
 
@@ -60,22 +59,17 @@ export class ProcessFiltersComponent implements OnInit, OnChanges {
     @Input()
     showIcon: boolean = true;
 
-    private filterObserver: Observer<ProcessInstanceFilterRepresentation>;
     filter$: Observable<ProcessInstanceFilterRepresentation>;
 
     currentFilter: ProcessInstanceFilterRepresentation;
 
-    filters: ProcessInstanceFilterRepresentation [] = [];
+    filters: UserProcessInstanceFilterRepresentation [] = [];
 
-    constructor(private processFilterService: ProcessFilterService, private appsProcessService: AppsProcessService) {
+    constructor(private processFilterService: ProcessFilterService,
-        this.filter$ = new Observable<ProcessInstanceFilterRepresentation>(observer => this.filterObserver = observer).share();
+                private appsProcessService: AppsProcessService) {
     }
 
-    ngOnInit() {
+    ngOnInit() {}
-        this.filter$.subscribe((filter: ProcessInstanceFilterRepresentation) => {
-            this.filters.push(filter);
-        });
-    }
 
     ngOnChanges(changes: SimpleChanges) {
         const appId = changes['appId'];
@@ -102,10 +96,7 @@ export class ProcessFiltersComponent implements OnInit, OnChanges {
                     this.processFilterService.createDefaultFilters(appId).subscribe(
                         (resDefault: ProcessInstanceFilterRepresentation[]) => {
                             this.resetFilter();
-                            resDefault.forEach((filter) => {
+                            this.filters = resDefault;
-                                this.filterObserver.next(filter);
-                            });
-
                             this.selectProcessFilter(this.filterParam);
                             this.success.emit(resDefault);
                         },
@@ -115,10 +106,7 @@ export class ProcessFiltersComponent implements OnInit, OnChanges {
                     );
                 } else {
                     this.resetFilter();
-                    res.forEach((filter) => {
+                    this.filters = res;
-                        this.filterObserver.next(filter);
-                    });
-
                     this.selectProcessFilter(this.filterParam);
                     this.success.emit(res);
                 }
@@ -158,8 +146,10 @@ export class ProcessFiltersComponent implements OnInit, OnChanges {
      */
     public selectProcessFilter(filterParam: FilterProcessRepresentationModel) {
         if (filterParam) {
-            this.filters.filter((processFilter: ProcessInstanceFilterRepresentation, index) => {
+            this.filters.filter((processFilter: UserProcessInstanceFilterRepresentation, index) => {
-                if (filterParam.name && filterParam.name.toLowerCase() === processFilter.name.toLowerCase() || filterParam.index === index) {
+                if (filterParam.name && filterParam.name.toLowerCase() === processFilter.name.toLowerCase() ||
+                    filterParam.id === processFilter.id ||
+                    filterParam.index === index) {
                     this.currentFilter = processFilter;
                 }
             });
@@ -208,6 +198,6 @@ export class ProcessFiltersComponent implements OnInit, OnChanges {
     }
 
     private isCurrentFilterEmpty(): boolean {
-        return this.currentFilter === undefined || null ? true : false;
+        return this.currentFilter === undefined || null;
     }
 }