Task/eliminate OnDestroy lifecycle hook from header component (#6567)

* Eliminate OnDestroy lifecycle hook

apps/client/src/app/components/header/header.component.ts

@@ -24,6 +24,7 @@ import {
   ChangeDetectionStrategy,
   Component,
   CUSTOM_ELEMENTS_SCHEMA,
+  DestroyRef,
   EventEmitter,
   HostListener,
   Input,
@@ -31,6 +32,7 @@ import {
   Output,
   ViewChild
 } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { MatBadgeModule } from '@angular/material/badge';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialog } from '@angular/material/dialog';
@@ -48,8 +50,8 @@ import {
   radioButtonOffOutline,
   radioButtonOnOutline
 } from 'ionicons/icons';
-import { EMPTY, Subject } from 'rxjs';
+import { EMPTY } from 'rxjs';
-import { catchError, takeUntil } from 'rxjs/operators';
+import { catchError } from 'rxjs/operators';
 
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -131,10 +133,9 @@ export class GfHeaderComponent implements OnChanges {
   public routerLinkRegister = publicRoutes.register.routerLink;
   public routerLinkResources = publicRoutes.resources.routerLink;
 
-  private unsubscribeSubject = new Subject<void>();
-
   public constructor(
     private dataService: DataService,
+    private destroyRef: DestroyRef,
     private dialog: MatDialog,
     private impersonationStorageService: ImpersonationStorageService,
     private layoutService: LayoutService,
@@ -146,7 +147,7 @@ export class GfHeaderComponent implements OnChanges {
   ) {
     this.impersonationStorageService
       .onChangeHasImpersonation()
-      .pipe(takeUntil(this.unsubscribeSubject))
+      .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe((impersonationId) => {
         this.hasImpersonationId = !!impersonationId;
         this.impersonationId = impersonationId;
@@ -224,11 +225,11 @@ export class GfHeaderComponent implements OnChanges {
   public onDateRangeChange(dateRange: DateRange) {
     this.dataService
       .putUserSetting({ dateRange })
-      .pipe(takeUntil(this.unsubscribeSubject))
+      .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe(() => {
         this.userService
           .get(true)
-          .pipe(takeUntil(this.unsubscribeSubject))
+          .pipe(takeUntilDestroyed(this.destroyRef))
           .subscribe();
       });
   }
@@ -252,11 +253,11 @@ export class GfHeaderComponent implements OnChanges {
 
     this.dataService
       .putUserSetting(userSetting)
-      .pipe(takeUntil(this.unsubscribeSubject))
+      .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe(() => {
         this.userService
           .get(true)
-          .pipe(takeUntil(this.unsubscribeSubject))
+          .pipe(takeUntilDestroyed(this.destroyRef))
           .subscribe();
       });
   }
@@ -301,7 +302,7 @@ export class GfHeaderComponent implements OnChanges {
 
     dialogRef
       .afterClosed()
-      .pipe(takeUntil(this.unsubscribeSubject))
+      .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe((data) => {
         if (data?.accessToken) {
           this.dataService
@@ -314,7 +315,7 @@ export class GfHeaderComponent implements OnChanges {
 
                 return EMPTY;
               }),
-              takeUntil(this.unsubscribeSubject)
+              takeUntilDestroyed(this.destroyRef)
             )
             .subscribe(({ authToken }) => {
               this.setToken(authToken);
@@ -331,7 +332,7 @@ export class GfHeaderComponent implements OnChanges {
 
     this.userService
       .get()
-      .pipe(takeUntil(this.unsubscribeSubject))
+      .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe((user) => {
         const userLanguage = user?.settings?.language;
 
@@ -342,9 +343,4 @@ export class GfHeaderComponent implements OnChanges {
         }
       });
   }
-
-  public ngOnDestroy() {
-    this.unsubscribeSubject.next();
-    this.unsubscribeSubject.complete();
-  }
 }