[ADF-2324] Process Pagination - Items per page is not saved on user preferences (#2966)

* Made the  pagination pageSize to be reflected according to the changes done in either tasklist or processlist pagination.

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

@@ -1,4 +1,4 @@
-<mat-tab-group [(selectedIndex)]="activeTab" data-automation-id="navigation-bar">
+<mat-tab-group [(selectedIndex)]="activeTab" (selectedTabChange)="onTabChange($event)" data-automation-id="navigation-bar">
     <mat-tab id="tasks-header" href="#tasks" label="{{'PS-TAB.TASKS-TAB' | translate}}">
         <div class="page-content">
             <div class="adf-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
@@ -58,6 +58,7 @@
                     <adf-pagination
                         *ngIf="taskList"
                         [target]="taskList"
+                        (changePageSize)="onChangePageSize($event)"
                         [supportedPageSizes]="supportedPages"
                         #taskListPagination>
                     </adf-pagination>
@@ -155,6 +156,7 @@
                     <adf-pagination
                         *ngIf="processList"
                         [target]="processList"
+                        (changePageSize)="onChangePageSize($event)"
                         [supportedPageSizes]="supportedPages"
                         #processListPagination>
                     </adf-pagination>

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

@@ -24,10 +24,12 @@ import {
     OnDestroy,
     OnInit,
     ViewChild,
-    ViewEncapsulation
+    ViewEncapsulation,
+    EventEmitter,
+    Output
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ProcessInstanceFilterRepresentation } from 'alfresco-js-api';
+import { ProcessInstanceFilterRepresentation, Pagination } from 'alfresco-js-api';
 import {
     FORM_FIELD_VALIDATORS, FormEvent, FormFieldEvent, FormRenderingService, FormService,
     DynamicTableRow, ValidateDynamicTableRowEvent, AppConfigService, PaginationComponent
@@ -106,6 +108,9 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     @Input()
     appId: number = null;
 
+    @Output()
+    changePageSize: EventEmitter<Pagination> = new EventEmitter();
+
     fileShowed = false;
     selectFirstReport = false;
 
@@ -160,7 +165,6 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
                 private preferenceService: UserPreferencesService) {
         this.dataTasks = new ObjectDataTableAdapter();
         this.dataTasks.setSorting(new DataSorting('created', 'desc'));
-        this.supportedPages = this.preferenceService.getDifferentPageSizes();
         this.paginationPageSize = this.preferenceService.paginationSize;
 
         this.defaultProcessName = this.appConfig.get<string>('adf-start-process.name');
@@ -216,6 +220,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
             this.currentProcessInstanceId = null;
         });
         this.layoutType = AppsListComponent.LAYOUT_GRID;
+        this.supportedPages = this.preferenceService.getDifferentPageSizes();
     }
 
     ngOnDestroy() {
@@ -232,6 +237,15 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
         this.taskPage = 0;
     }
 
+    onTabChange(event: Pagination): void {
+        this.paginationPageSize = this.preferenceService.paginationSize;
+    }
+
+    onChangePageSize(event: Pagination): void {
+        this.preferenceService.paginationSize = event.maxItems;
+        this.changePageSize.emit(event);
+    }
+
     onReportClick(event: any): void {
         this.report = event;
     }