[ADF-4745] memory leak fixes (#4931)

* fix app-layout component

* fix card-view component

* fix cloud-layout service

* code fixes

* code fixes

* even more fixes

* even more fixes

* lint fixes

* test fixes

* fix code

* remove useless pipes

* fix code owners

* enable spellcheck for cloud components

* update test

* update test

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

@@ -19,26 +19,24 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
 @Component({
-  selector: 'app-cloud-breadcrumbs',
-  templateUrl: './cloud-breadcrumb-component.html',
-  styleUrls: ['cloud-breadcrumb-component.scss']
+    selector: 'app-cloud-breadcrumbs',
+    templateUrl: './cloud-breadcrumb-component.html',
+    styleUrls: ['cloud-breadcrumb-component.scss']
 })
 export class CloudBreadcrumbsComponent implements OnInit {
+    appName: string;
+    filterName: string;
 
-  appName: string;
-  filterName: string;
+    constructor(private route: ActivatedRoute) {}
 
-  constructor(private route: ActivatedRoute) { }
-
-  ngOnInit() {
-    this.route.parent.params.subscribe((
-      params) => {
-      this.appName = params.appName;
-    });
-    this.route.queryParams.subscribe((params) => {
-      if (params.filterName) {
-        this.filterName = params.filterName;
-      }
-    });
-  }
+    ngOnInit() {
+        this.route.parent.params.subscribe(params => {
+            this.appName = params.appName;
+        });
+        this.route.queryParams.subscribe(params => {
+            if (params.filterName) {
+                this.filterName = params.filterName;
+            }
+        });
+    }
 }

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

@@ -46,8 +46,9 @@ export class CloudFiltersDemoComponent implements OnInit {
     ) {}
 
     ngOnInit() {
-        this.currentTaskFilter$ = this.cloudLayoutService.getCurrentTaskFilterParam();
-        this.currentProcessFilter$ = this.cloudLayoutService.getCurrentProcessFilterParam();
+        this.currentTaskFilter$ = this.cloudLayoutService.taskFilter$;
+        this.currentProcessFilter$ = this.cloudLayoutService.processFilter$;
+
         let root = '';
         if (this.route.snapshot && this.route.snapshot.firstChild) {
             root = this.route.snapshot.firstChild.url[0].path;

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

@@ -15,15 +15,18 @@
  * limitations under the License.
  */
 
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { CloudLayoutService } from './services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
 
 @Component({
     selector: 'app-cloud-settings',
     templateUrl: './cloud-settings.component.html',
     styleUrls: ['./cloud-settings.component.scss']
 })
-export class CloudSettingsComponent implements OnInit {
+export class CloudSettingsComponent implements OnInit, OnDestroy {
+    private onDestroy$ = new Subject<boolean>();
 
     multiselect: boolean;
     selectionMode: string;
@@ -40,8 +43,15 @@ export class CloudSettingsComponent implements OnInit {
     constructor(private cloudLayoutService: CloudLayoutService) { }
 
     ngOnInit() {
-        this.cloudLayoutService.getCurrentSettings()
-            .subscribe((settings) => this.setCurrentSettings(settings));
+        this.cloudLayoutService
+            .settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
+    }
+
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
     }
 
     setCurrentSettings(settings) {

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

@@ -15,32 +15,24 @@
  * limitations under the License.
  */
 
-import { Component, OnDestroy, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { Subscription } from 'rxjs';
 import { Params } from '@angular/router/src/shared';
 
 @Component({
     selector: 'app-cloud-viewer',
     templateUrl: './cloud-viewer.component.html'
 })
-export class CloudViewerComponent implements OnInit, OnDestroy {
+export class CloudViewerComponent implements OnInit {
 
     nodeId: string;
 
-    private sub: Subscription;
-
     constructor(private route: ActivatedRoute) {
     }
 
     ngOnInit() {
-        this.sub = this.route.params.subscribe((params: Params) => {
+        this.route.params.subscribe((params: Params) => {
             this.nodeId = params['nodeId'];
         });
     }
-
-    ngOnDestroy() {
-        this.sub.unsubscribe();
-    }
-
 }

demo-shell/src/app/components/cloud/community/community-filters.component.ts

@@ -45,8 +45,9 @@ export class CommunityCloudFiltersDemoComponent implements OnInit {
     ) {}
 
     ngOnInit() {
-        this.currentTaskFilter$ = this.cloudLayoutService.getCurrentTaskFilterParam();
-        this.currentProcessFilter$ = this.cloudLayoutService.getCurrentProcessFilterParam();
+        this.currentTaskFilter$ = this.cloudLayoutService.taskFilter$;
+        this.currentProcessFilter$ = this.cloudLayoutService.processFilter$;
+
         let root = '';
         if (this.route.snapshot && this.route.snapshot.firstChild) {
             root = this.route.snapshot.firstChild.url[0].path;

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

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, ViewChild, OnInit } from '@angular/core';
+import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
 import {
     ProcessListCloudComponent,
     ProcessFilterCloudModel,
@@ -27,12 +27,14 @@ import {
 import { ActivatedRoute, Router } from '@angular/router';
 import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
 import { CloudLayoutService } from '../services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { Pagination } from '@alfresco/js-api';
 
 @Component({
     templateUrl: './community-processes-cloud.component.html'
 })
-export class CommunityProcessesCloudDemoComponent implements OnInit {
-
+export class CommunityProcessesCloudDemoComponent implements OnInit, OnDestroy {
     public static ACTION_SAVE_AS = 'saveAs';
     static PROCESS_FILTER_PROPERTY_KEYS = 'adf-edit-process-filter';
 
@@ -56,6 +58,8 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
 
     editedFilter: ProcessFilterCloudModel;
 
+    private onDestroy$ = new Subject<boolean>();
+
     constructor(
         private route: ActivatedRoute,
         private router: Router,
@@ -63,7 +67,10 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
         private userPreference: UserPreferencesService,
         private processFilterCloudService: ProcessFilterCloudService,
         private appConfig: AppConfigService) {
-        const properties = this.appConfig.get<Array<any>>(CommunityProcessesCloudDemoComponent.PROCESS_FILTER_PROPERTY_KEYS);
+        const properties = this.appConfig.get<Array<any>>(
+            CommunityProcessesCloudDemoComponent.PROCESS_FILTER_PROPERTY_KEYS
+        );
+
         if (properties) {
             this.processFilterProperties = properties;
         }
@@ -71,6 +78,7 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
 
     ngOnInit() {
         this.isFilterLoaded = false;
+
         this.route.parent.params.subscribe((params) => {
             this.appName = params.appName;
         });
@@ -85,14 +93,23 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
             }
         });
 
-        this.cloudLayoutService.getCurrentSettings()
-            .subscribe((settings) => this.setCurrentSettings(settings));
+        this.cloudLayoutService
+            .settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
+    }
+
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
     }
 
     loadDefaultFilters() {
-        this.processFilterCloudService.getProcessFilters('community').subscribe( (filters: ProcessFilterCloudModel[]) => {
-            this.onFilterChange(filters[0]);
-        });
+        this.processFilterCloudService
+            .getProcessFilters('community')
+            .subscribe((filters: ProcessFilterCloudModel[]) => {
+                this.onFilterChange(filters[0]);
+            });
     }
 
     setCurrentSettings(settings) {
@@ -103,7 +120,7 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
         }
     }
 
-    onChangePageSize(event) {
+    onChangePageSize(event: Pagination) {
         this.userPreference.paginationSize = event.maxItems;
     }
 
@@ -111,13 +128,18 @@ export class CommunityProcessesCloudDemoComponent implements OnInit {
         this.selectedRows = [];
     }
 
-    onRowClick(processInstanceId) {
+    onRowClick(processInstanceId: string) {
         this.router.navigate([`/cloud/community/process-details/${processInstanceId}`]);
     }
 
     onFilterChange(query: any) {
         this.editedFilter = Object.assign({}, query);
-        this.sortArray = [new ProcessListCloudSortingModel({ orderBy: this.editedFilter.sort, direction: this.editedFilter.order })];
+        this.sortArray = [
+            new ProcessListCloudSortingModel({
+                orderBy: this.editedFilter.sort,
+                direction: this.editedFilter.order
+            })
+        ];
     }
 
     onProcessFilterAction(filterAction: any) {

demo-shell/src/app/components/cloud/community/community-task-cloud.component.ts

@@ -15,11 +15,14 @@
  * limitations under the License.
  */
 
-import { Component, ViewChild, OnInit } from '@angular/core';
+import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
 import { TaskListCloudComponent, TaskListCloudSortingModel, TaskFilterCloudModel, TaskFilterCloudService } from '@alfresco/adf-process-services-cloud';
 import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { CloudLayoutService } from '../services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { Pagination } from '@alfresco/js-api';
 
 @Component({
     templateUrl: './community-task-cloud.component.html',
@@ -28,8 +31,7 @@ import { CloudLayoutService } from '../services/cloud-layout.service';
       }
       `]
 })
-export class CommunityTasksCloudDemoComponent implements OnInit {
-
+export class CommunityTasksCloudDemoComponent implements OnInit, OnDestroy {
     public static ACTION_SAVE_AS = 'saveAs';
     static TASK_FILTER_PROPERTY_KEYS = 'adf-edit-task-filter';
 
@@ -51,6 +53,8 @@ export class CommunityTasksCloudDemoComponent implements OnInit {
     selectionMode: string;
     taskDetailsRedirection: boolean;
 
+    private onDestroy$ = new Subject<boolean>();
+
     constructor(
         private cloudLayoutService: CloudLayoutService,
         private route: ActivatedRoute,
@@ -79,14 +83,23 @@ export class CommunityTasksCloudDemoComponent implements OnInit {
             }
         });
 
-        this.cloudLayoutService.getCurrentSettings()
-            .subscribe((settings) => this.setCurrentSettings(settings));
+        this.cloudLayoutService
+            .settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
+    }
+
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
     }
 
     loadDefaultFilters() {
-        this.taskFilterCloudService.getTaskListFilters('community').subscribe( (filters: TaskFilterCloudModel[]) => {
-            this.onFilterChange(filters[0]);
-        });
+        this.taskFilterCloudService
+            .getTaskListFilters('community')
+            .subscribe((filters: TaskFilterCloudModel[]) => {
+                this.onFilterChange(filters[0]);
+            });
     }
 
     setCurrentSettings(settings) {
@@ -98,7 +111,7 @@ export class CommunityTasksCloudDemoComponent implements OnInit {
         }
     }
 
-    onChangePageSize(event) {
+    onChangePageSize(event: Pagination) {
         this.userPreference.paginationSize = event.maxItems;
     }
 
@@ -106,7 +119,7 @@ export class CommunityTasksCloudDemoComponent implements OnInit {
         this.selectedRows = [];
     }
 
-    onRowClick(taskId) {
+    onRowClick(taskId: string) {
         if (!this.multiselect && this.selectionMode !== 'multiple' && this.taskDetailsRedirection) {
             this.router.navigate([`/cloud/community/task-details/${taskId}`]);
         }

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

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, ViewChild, OnInit } from '@angular/core';
+import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
 import {
     ProcessListCloudComponent,
     ProcessFilterCloudModel,
@@ -25,13 +25,16 @@ import {
 
 import { ActivatedRoute, Router } from '@angular/router';
 import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
-import { CloudLayoutService } from './services/cloud-layout.service';
+import { CloudLayoutService, CloudServiceSettings } from './services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { Pagination } from '@alfresco/js-api';
 
 @Component({
     templateUrl: './processes-cloud-demo.component.html',
     styleUrls: ['./processes-cloud-demo.component.scss']
 })
-export class ProcessesCloudDemoComponent implements OnInit {
+export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
 
     public static ACTION_SAVE_AS = 'saveAs';
     static PROCESS_FILTER_PROPERTY_KEYS = 'adf-edit-process-filter';
@@ -57,6 +60,8 @@ export class ProcessesCloudDemoComponent implements OnInit {
 
     editedFilter: ProcessFilterCloudModel;
 
+    private onDestroy$ = new Subject<boolean>();
+
     constructor(
         private route: ActivatedRoute,
         private router: Router,
@@ -81,11 +86,17 @@ export class ProcessesCloudDemoComponent implements OnInit {
             this.filterId = params.id;
         });
 
-        this.cloudLayoutService.getCurrentSettings()
-            .subscribe((settings) => this.setCurrentSettings(settings));
+        this.cloudLayoutService.settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
     }
 
-    setCurrentSettings(settings) {
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
+    }
+
+    setCurrentSettings(settings: CloudServiceSettings) {
         if (settings) {
             this.multiselect = settings.multiselect;
             this.testingMode = settings.testingMode;
@@ -94,7 +105,7 @@ export class ProcessesCloudDemoComponent implements OnInit {
         }
     }
 
-    onChangePageSize(event) {
+    onChangePageSize(event: Pagination) {
         this.userPreference.paginationSize = event.maxItems;
     }
 
@@ -102,7 +113,7 @@ export class ProcessesCloudDemoComponent implements OnInit {
         this.selectedRows = [];
     }
 
-    onRowClick(processInstanceId) {
+    onRowClick(processInstanceId: string) {
         if (!this.multiselect && this.selectionMode !== 'multiple' && this.processDetailsRedirection) {
             this.router.navigate([`/cloud/${this.appName}/process-details/${processInstanceId}`]);
         }
@@ -110,7 +121,12 @@ export class ProcessesCloudDemoComponent implements OnInit {
 
     onFilterChange(query: any) {
         this.editedFilter = Object.assign({}, query);
-        this.sortArray = [new ProcessListCloudSortingModel({ orderBy: this.editedFilter.sort, direction: this.editedFilter.order })];
+        this.sortArray = [
+            new ProcessListCloudSortingModel({
+                orderBy: this.editedFilter.sort,
+                direction: this.editedFilter.order
+            })
+        ];
     }
 
     onProcessFilterAction(filterAction: any) {

demo-shell/src/app/components/cloud/services/cloud-layout.service.ts

@@ -16,14 +16,28 @@
  */
 
 import { Injectable } from '@angular/core';
-import { Observable, BehaviorSubject } from 'rxjs';
+import { BehaviorSubject } from 'rxjs';
+
+export interface CloudServiceSettings {
+    multiselect: boolean;
+    testingMode: boolean;
+    taskDetailsRedirection: boolean;
+    processDetailsRedirection: boolean;
+    selectionMode: string;
+}
+
+export interface FilterSettings {
+    id?: string;
+    index?: number;
+    key?: string;
+}
 
 @Injectable({
     providedIn: 'root'
 })
 export class CloudLayoutService {
 
-    private settings = {
+    private settings: CloudServiceSettings = {
         multiselect: false,
         testingMode: false,
         taskDetailsRedirection: true,
@@ -31,40 +45,19 @@ export class CloudLayoutService {
         selectionMode: 'single'
     };
 
-    private filterTaskSubject: BehaviorSubject<any> = new BehaviorSubject({index: 0});
-    private filterTask$: Observable<any>;
-    private filterProcessSubject: BehaviorSubject<any> = new BehaviorSubject({index: 0});
-    private filterProcess$: Observable<any>;
-    private settingsSubject: BehaviorSubject<any> = new BehaviorSubject(this.settings);
-    private settings$: Observable<any>;
+    taskFilter$ = new BehaviorSubject<FilterSettings>({index: 0});
+    processFilter$ = new BehaviorSubject<FilterSettings>({index: 0});
+    settings$ = new BehaviorSubject<CloudServiceSettings>(this.settings);
 
-    constructor() {
-        this.filterTask$ = this.filterTaskSubject.asObservable();
-        this.filterProcess$ = this.filterProcessSubject.asObservable();
-        this.settings$ = this.settingsSubject.asObservable();
+    setCurrentTaskFilterParam(param: FilterSettings) {
+        this.taskFilter$.next(param);
     }
 
-    getCurrentTaskFilterParam() {
-        return this.filterTask$;
+    setCurrentProcessFilterParam(param: FilterSettings) {
+        this.processFilter$.next(param);
     }
 
-    setCurrentTaskFilterParam(param) {
-        this.filterTaskSubject.next(param);
-    }
-
-    getCurrentProcessFilterParam() {
-        return this.filterProcess$;
-    }
-
-    setCurrentProcessFilterParam(param) {
-        this.filterProcessSubject.next(param);
-    }
-
-    getCurrentSettings() {
-        return this.settings$;
-    }
-
-    setCurrentSettings(param) {
-        this.settingsSubject.next(param);
+    setCurrentSettings(param: CloudServiceSettings) {
+        this.settings$.next(param);
     }
 }

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

@@ -15,17 +15,19 @@
  * limitations under the License.
  */
 
-import { Component, ViewChild, OnInit } from '@angular/core';
+import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
 import { TaskListCloudComponent, TaskListCloudSortingModel, TaskFilterCloudModel } from '@alfresco/adf-process-services-cloud';
 import { UserPreferencesService, AppConfigService } from '@alfresco/adf-core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { CloudLayoutService } from './services/cloud-layout.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
 
 @Component({
     templateUrl: 'tasks-cloud-demo.component.html',
     styleUrls: ['tasks-cloud-demo.component.scss']
 })
-export class TasksCloudDemoComponent implements OnInit {
+export class TasksCloudDemoComponent implements OnInit, OnDestroy {
 
     public static ACTION_SAVE_AS = 'saveAs';
     static TASK_FILTER_PROPERTY_KEYS = 'adf-edit-task-filter';
@@ -50,6 +52,8 @@ export class TasksCloudDemoComponent implements OnInit {
     selectionMode: string;
     taskDetailsRedirection: boolean;
 
+    private onDestroy$ = new Subject<boolean>();
+
     constructor(
         private cloudLayoutService: CloudLayoutService,
         private route: ActivatedRoute,
@@ -75,8 +79,14 @@ export class TasksCloudDemoComponent implements OnInit {
             this.filterId = params.id;
         });
 
-        this.cloudLayoutService.getCurrentSettings()
-            .subscribe((settings) => this.setCurrentSettings(settings));
+        this.cloudLayoutService.settings$
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(settings => this.setCurrentSettings(settings));
+    }
+
+    ngOnDestroy() {
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
     }
 
     setCurrentSettings(settings) {