[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
2025-07-31 17:38:48 +00:00 · 2019-07-16 15:56:00 +01:00
parent e2311ab045
commit 1abb9bfc89
98 changed files with 1581 additions and 1066 deletions
--- a/demo-shell/src/app/components/process-service/form-node-viewer.component.ts
+++ b/demo-shell/src/app/components/process-service/form-node-viewer.component.ts
@@ -15,32 +15,25 @@
 * 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';

@Component({
    selector: 'app-form-node-viewer',
    templateUrl: './form-node-viewer.component.html',
    styleUrls: ['./form-node-viewer.component.css']
 })
-export class FormNodeViewerComponent implements OnInit, OnDestroy {
+export class FormNodeViewerComponent implements OnInit {

    nodeId: string;

-    private sub: Subscription;
-
    constructor(private route: ActivatedRoute) {
    }

    ngOnInit() {
-        this.sub = this.route.params.subscribe((params) => {
+        this.route.params.subscribe((params) => {
            this.nodeId = params['id'];
        });
    }

-    ngOnDestroy() {
-        this.sub.unsubscribe();
-    }
-
 }
--- a/demo-shell/src/app/components/process-service/form-viewer.component.ts
+++ b/demo-shell/src/app/components/process-service/form-viewer.component.ts
@@ -15,9 +15,8 @@
 * 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({
@@ -25,23 +24,16 @@ import { Params } from '@angular/router/src/shared';
    templateUrl: './form-viewer.component.html',
    styleUrls: ['./form-viewer.component.css']
 })
-export class FormViewerComponent implements OnInit, OnDestroy {
+export class FormViewerComponent implements OnInit {

    taskId: string;

-    private sub: Subscription;
-
    constructor(private route: ActivatedRoute) {
    }

    ngOnInit() {
-        this.sub = this.route.params.subscribe((params: Params) => {
+        this.route.params.subscribe((params: Params) => {
            this.taskId = params['id'];
        });
    }
-
-    ngOnDestroy() {
-        this.sub.unsubscribe();
-    }
-
 }
--- a/demo-shell/src/app/components/process-service/process-attachments.component.ts
+++ b/demo-shell/src/app/components/process-service/process-attachments.component.ts
@@ -22,7 +22,8 @@ import { UploadService } from '@alfresco/adf-core';
 import { AlfrescoApiService } from '@alfresco/adf-core';
 import { AppConfigService } from '@alfresco/adf-core';
 import { PreviewService } from '../../services/preview.service';
-import { Subscription } from 'rxjs';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';

 export function processUploadServiceFactory(api: AlfrescoApiService, config: AppConfigService) {
    return new ProcessUploadService(api, config);
@@ -51,7 +52,7 @@ export class ProcessAttachmentsComponent implements OnInit, OnChanges, OnDestroy

    processInstance: ProcessInstance;

-    private subscriptions: Subscription[] = [];
+    private onDestroy$ = new Subject<boolean>();

    constructor(
        private uploadService: UploadService,
@@ -60,11 +61,9 @@ export class ProcessAttachmentsComponent implements OnInit, OnChanges, OnDestroy
    ) {}

    ngOnInit() {
-        this.subscriptions.push(
-            this.uploadService.fileUploadComplete.subscribe(
-                (value) => this.onFileUploadComplete(value.data)
-            )
-        );
+        this.uploadService.fileUploadComplete
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(value => this.onFileUploadComplete(value.data));
    }

    ngOnChanges() {
@@ -77,8 +76,8 @@ export class ProcessAttachmentsComponent implements OnInit, OnChanges, OnDestroy
    }

    ngOnDestroy() {
-        this.subscriptions.forEach((subscription) => subscription.unsubscribe());
-        this.subscriptions = [];
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
    }

    onFileUploadComplete(content: any) {
--- a/demo-shell/src/app/components/process-service/process-service.component.ts
+++ b/demo-shell/src/app/components/process-service/process-service.component.ts
@@ -35,7 +35,7 @@ import {
    UserProcessInstanceFilterRepresentation
 } from '@alfresco/js-api';
 import {
-    FORM_FIELD_VALIDATORS, FormEvent, FormFieldEvent, FormRenderingService, FormService,
+    FORM_FIELD_VALIDATORS, FormRenderingService, FormService,
    DynamicTableRow, ValidateDynamicTableRowEvent, AppConfigService, PaginationComponent, UserPreferenceValues
 } from '@alfresco/adf-core';

@@ -57,12 +57,13 @@ import {
    TaskListComponent
 } from '@alfresco/adf-process-services';
 import { LogService } from '@alfresco/adf-core';
-import { AlfrescoApiService, UserPreferencesService, ValidateFormEvent } from '@alfresco/adf-core';
-import { Subscription } from 'rxjs';
+import { AlfrescoApiService, UserPreferencesService } from '@alfresco/adf-core';
+import { Subject } from 'rxjs';
 import { /*CustomEditorComponent*/ CustomStencil01 } from './custom-editor/custom-editor.component';
 import { DemoFieldValidator } from './demo-field-validator';
 import { PreviewService } from '../../services/preview.service';
 import { Location } from '@angular/common';
+import { takeUntil } from 'rxjs/operators';

 const currentProcessIdNew = '__NEW__';
 const currentTaskIdNew = '__NEW__';
@@ -160,7 +161,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
        new DemoFieldValidator()
    ];

-    private subscriptions: Subscription[] = [];
+    private onDestroy$ = new Subject<boolean>();

    constructor(private elementRef: ElementRef,
                private route: ActivatedRoute,
@@ -184,17 +185,28 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
        // Uncomment this line to map 'custom_stencil_01' to local editor component
        formRenderingService.setComponentTypeResolver('custom_stencil_01', () => CustomStencil01, true);

-        this.subscriptions.push(
-            formService.formLoaded.subscribe((formEvent: FormEvent) => {
+        formService.formLoaded
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(formEvent => {
                this.logService.log(`Form loaded: ${formEvent.form.id}`);
-            }),
-            formService.formFieldValueChanged.subscribe((formFieldEvent: FormFieldEvent) => {
+            });
+
+        formService.formFieldValueChanged
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(formFieldEvent => {
                this.logService.log(`Field value changed. Form: ${formFieldEvent.form.id}, Field: ${formFieldEvent.field.id}, Value: ${formFieldEvent.field.value}`);
-            }),
-            this.preferenceService.select(UserPreferenceValues.PaginationSize).subscribe((pageSize) => {
+            });
+
+        this.preferenceService
+            .select(UserPreferenceValues.PaginationSize)
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe((pageSize) => {
                this.paginationPageSize = pageSize;
-            }),
-            formService.validateDynamicTableRow.subscribe(
+            });
+
+        formService.validateDynamicTableRow
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(
                (validateDynamicTableRowEvent: ValidateDynamicTableRowEvent) => {
                    const row: DynamicTableRow = validateDynamicTableRowEvent.row;
                    if (row && row.value && row.value.name === 'admin') {
@@ -203,23 +215,28 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
                        validateDynamicTableRowEvent.preventDefault();
                    }
                }
-            ),
+            );

-            formService.formContentClicked.subscribe((content) => {
+        formService.formContentClicked
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe((content) => {
                this.showContentPreview(content);
-            }),
+            });

-            formService.validateForm.subscribe((validateFormEvent: ValidateFormEvent) => {
+        formService.validateForm
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe(validateFormEvent => {
                this.logService.log('Error form:' + validateFormEvent.errorsField);
-            })
-        );
+            });

        // Uncomment this block to see form event handling in action
        /*
-        formService.formEvents.subscribe((event: Event) => {
-            this.logService.log('Event fired:' + event.type);
-            this.logService.log('Event Target:' + event.target);
-        });
+        formService.formEvents
+            .pipe(takeUntil(this.onDestroy$))
+            .subscribe((event: Event) => {
+                this.logService.log('Event fired:' + event.type);
+                this.logService.log('Event Target:' + event.target);
+            });
        */
    }

@@ -247,8 +264,8 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
    }

    ngOnDestroy() {
-        this.subscriptions.forEach((subscription) => subscription.unsubscribe());
-        this.subscriptions = [];
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
    }

    onTaskFilterClick(filter: FilterRepresentationModel): void {
--- a/demo-shell/src/app/components/process-service/task-attachments.component.ts
+++ b/demo-shell/src/app/components/process-service/task-attachments.component.ts
@@ -19,12 +19,13 @@ import { Component, Input, OnChanges, OnInit, ViewChild, OnDestroy } from '@angu
 import {
    TaskListService,
    TaskAttachmentListComponent,
-    TaskDetailsModel,
-    TaskUploadService
+    TaskUploadService,
+    TaskDetailsModel
 } from '@alfresco/adf-process-services';
-import { UploadService, AlfrescoApiService, AppConfigService, FileUploadCompleteEvent } from '@alfresco/adf-core';
+import { UploadService, AlfrescoApiService, AppConfigService } from '@alfresco/adf-core';
 import { PreviewService } from '../../services/preview.service';
-import { Subscription } from 'rxjs';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';

 export function taskUploadServiceFactory(api: AlfrescoApiService, config: AppConfigService) {
    return new TaskUploadService(api, config);
@@ -51,9 +52,9 @@ export class TaskAttachmentsComponent implements OnInit, OnChanges, OnDestroy {
    @Input()
    taskId: string;

-    taskDetails: any;
+    taskDetails: TaskDetailsModel;

-    private subscriptions: Subscription[] = [];
+    private onDestroy$ = new Subject<boolean>();

    constructor(
        private uploadService: UploadService,
@@ -62,25 +63,22 @@ export class TaskAttachmentsComponent implements OnInit, OnChanges, OnDestroy {
    }

    ngOnInit() {
-        this.subscriptions.push(
-            this.uploadService.fileUploadComplete.subscribe(
-                (fileUploadCompleteEvent: FileUploadCompleteEvent) => this.onFileUploadComplete(fileUploadCompleteEvent.data)
-            )
-        );
+        this.uploadService.fileUploadComplete
+        .pipe(takeUntil(this.onDestroy$))
+        .subscribe(event => this.onFileUploadComplete(event.data));
    }

    ngOnChanges() {
        if (this.taskId) {
-            this.activitiTaskList.getTaskDetails(this.taskId)
-                .subscribe((taskDetails: TaskDetailsModel) => {
-                    this.taskDetails = taskDetails;
-                });
+            this.activitiTaskList
+                .getTaskDetails(this.taskId)
+                .subscribe(taskDetails => this.taskDetails = taskDetails);
        }
    }

    ngOnDestroy() {
-        this.subscriptions.forEach((subscription) => subscription.unsubscribe());
-        this.subscriptions = [];
+        this.onDestroy$.next(true);
+        this.onDestroy$.complete();
    }

    onFileUploadComplete(content: any) {