[ACS-8959] Introduce new takeUntilDestroyed operator where possible (#10388)

lib/core/feature-flags/src/lib/components/feature-override-indicator.component.ts

@@ -15,11 +15,10 @@
  * limitations under the License.
  */
 
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, OnDestroy, ViewEncapsulation } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Inject, Input, ViewEncapsulation } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FeaturesServiceToken, IDebugFeaturesService } from '../interfaces/features.interface';
-import { takeUntil } from 'rxjs/operators';
-import { Subject } from 'rxjs';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 @Component({
     selector: 'adf-feature-flags-override-indicator',
@@ -49,9 +48,8 @@ import { Subject } from 'rxjs';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class FlagsOverrideComponent implements OnDestroy {
+export class FlagsOverrideComponent {
     isEnabled = false;
-    destroy$ = new Subject<void>();
 
     @Input()
     size: 'small' | 'medium' | 'large' = 'medium';
@@ -64,16 +62,11 @@ export class FlagsOverrideComponent implements OnDestroy {
         if (this.featuresService.isEnabled$) {
             this.featuresService
                 .isEnabled$()
-                .pipe(takeUntil(this.destroy$))
+                .pipe(takeUntilDestroyed())
                 .subscribe((isEnabled) => {
                     this.isEnabled = isEnabled;
                     changeDetectorRef.markForCheck();
                 });
         }
     }
-
-    ngOnDestroy(): void {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
 }

lib/core/feature-flags/src/lib/components/flags/flags.component.ts

@@ -15,18 +15,18 @@
  * limitations under the License.
  */
 
-import { ChangeDetectionStrategy, Component, Inject, OnDestroy, ViewEncapsulation } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Inject, ViewEncapsulation } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import {
-    IWritableFeaturesService,
     FeaturesServiceToken,
-    WritableFeaturesServiceToken,
     IDebugFeaturesService,
-    WritableFlagChangeset,
-    IFeaturesService
+    IFeaturesService,
+    IWritableFeaturesService,
+    WritableFeaturesServiceToken,
+    WritableFlagChangeset
 } from '../../interfaces/features.interface';
-import { BehaviorSubject, Observable, Subject, combineLatest } from 'rxjs';
-import { debounceTime, map, take, takeUntil, tap } from 'rxjs/operators';
+import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
+import { debounceTime, map, take, tap } from 'rxjs/operators';
 import { MatTableModule } from '@angular/material/table';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { MatToolbarModule } from '@angular/material/toolbar';
@@ -37,6 +37,7 @@ import { FormsModule } from '@angular/forms';
 import { FlagsOverrideComponent } from '../feature-override-indicator.component';
 import { MatDialogModule } from '@angular/material/dialog';
 import { TranslateModule } from '@ngx-translate/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 @Component({
     selector: 'adf-feature-flags-overrides',
@@ -59,17 +60,15 @@ import { TranslateModule } from '@ngx-translate/core';
     encapsulation: ViewEncapsulation.None,
     changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class FlagsComponent implements OnDestroy {
+export class FlagsComponent {
     displayedColumns: string[] = ['icon', 'flag', 'value'];
     flags$: Observable<{ fictive: boolean; flag: string; value: any }[]>;
     isEnabled = false;
-    destroy$ = new Subject<void>();
 
     inputValue = '';
     inputValue$ = new BehaviorSubject<string>('');
     showPlusButton$!: Observable<boolean>;
     writableFlagChangeset: WritableFlagChangeset = {};
-
     constructor(
         @Inject(FeaturesServiceToken)
         private featuresService: IDebugFeaturesService & IFeaturesService<WritableFlagChangeset>,
@@ -79,7 +78,7 @@ export class FlagsComponent implements OnDestroy {
         if (this.featuresService.isEnabled$) {
             this.featuresService
                 .isEnabled$()
-                .pipe(takeUntil(this.destroy$))
+                .pipe(takeUntilDestroyed())
                 .subscribe((isEnabled) => {
                     this.isEnabled = isEnabled;
                 });
@@ -149,9 +148,4 @@ export class FlagsComponent implements OnDestroy {
     protected onDelete(flag: string) {
         this.writableFeaturesService.removeFlag(flag);
     }
-
-    ngOnDestroy(): void {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
 }

lib/core/feature-flags/src/lib/directives/features.directive.ts

@@ -15,21 +15,20 @@
  * limitations under the License.
  */
 
-import { Directive, Inject, Input, OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core';
-import { BehaviorSubject, Subject, combineLatest } from 'rxjs';
-import { IFeaturesService, FeaturesServiceToken, FlagChangeset } from '../interfaces/features.interface';
-import { takeUntil } from 'rxjs/operators';
+import { Directive, Inject, Input, TemplateRef, ViewContainerRef } from '@angular/core';
+import { BehaviorSubject, combineLatest } from 'rxjs';
+import { FeaturesServiceToken, FlagChangeset, IFeaturesService } from '../interfaces/features.interface';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 @Directive({
     /* eslint-disable-next-line @angular-eslint/directive-selector */
     selector: '[adfForFeatures]',
     standalone: true
 })
-export class FeaturesDirective implements OnDestroy {
+export class FeaturesDirective {
     private hasView = false;
     private inputUpdate$ = new BehaviorSubject([] as string[]);
-    private destroy$ = new Subject();
-
+    
     @Input()
     set adfForFeatures(feature: string[] | string) {
         this.inputUpdate$.next(Array.isArray(feature) ? feature : [feature]);
@@ -41,7 +40,7 @@ export class FeaturesDirective implements OnDestroy {
         private viewContainer: ViewContainerRef
     ) {
         combineLatest([this.featuresService.getFlags$(), this.inputUpdate$])
-            .pipe(takeUntil(this.destroy$))
+            .pipe(takeUntilDestroyed())
             .subscribe(([flags, features]: any) => this.updateView(flags, features));
     }
 
@@ -56,9 +55,4 @@ export class FeaturesDirective implements OnDestroy {
             this.hasView = false;
         }
     }
-
-    ngOnDestroy() {
-        this.destroy$.next({});
-        this.destroy$.complete();
-    }
 }

lib/core/feature-flags/src/lib/directives/not-features.directive.ts

@@ -15,20 +15,19 @@
  * limitations under the License.
  */
 
-import { Directive, Inject, Input, OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core';
-import { BehaviorSubject, Subject, combineLatest } from 'rxjs';
-import { IFeaturesService, FeaturesServiceToken, FlagChangeset } from '../interfaces/features.interface';
-import { takeUntil } from 'rxjs/operators';
+import { Directive, Inject, Input, TemplateRef, ViewContainerRef } from '@angular/core';
+import { BehaviorSubject, combineLatest } from 'rxjs';
+import { FeaturesServiceToken, FlagChangeset, IFeaturesService } from '../interfaces/features.interface';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 @Directive({
     /* eslint-disable-next-line @angular-eslint/directive-selector */
     selector: '[adfNotForFeatures]',
     standalone: true
 })
-export class NotFeaturesDirective implements OnDestroy {
+export class NotFeaturesDirective {
     private hasView = false;
     private inputUpdate$ = new BehaviorSubject([] as string[]);
-    private destroy$ = new Subject();
 
     @Input()
     set adfNotForFeatures(feature: string[] | string) {
@@ -41,7 +40,7 @@ export class NotFeaturesDirective implements OnDestroy {
         private viewContainer: ViewContainerRef
     ) {
         combineLatest([this.featuresService.getFlags$(), this.inputUpdate$])
-            .pipe(takeUntil(this.destroy$))
+            .pipe(takeUntilDestroyed())
             .subscribe(([flags, features]: any) => this.updateView(flags, features));
     }
 
@@ -56,9 +55,4 @@ export class NotFeaturesDirective implements OnDestroy {
             this.hasView = false;
         }
     }
-
-    ngOnDestroy() {
-        this.destroy$.next({});
-        this.destroy$.complete();
-    }
 }