From fa85894658f7f3777d7b67a587ba8251948ab431 Mon Sep 17 00:00:00 2001
From: splincode <omaxphp@yandex.ru>
Date: Thu, 7 Mar 2024 10:46:51 +0300
Subject: [PATCH] refactor: fix possible memory leak

---
 .../directives/ripple/ripple.directive.ts       |  4 +++-
 projects/core/components/link/link.component.ts | 10 ++++++----
 .../kit/components/action/action.component.ts   |  7 ++++---
 .../components/stepper/step/step.component.ts   | 17 ++++++++++-------
 4 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/projects/addon-mobile/directives/ripple/ripple.directive.ts b/projects/addon-mobile/directives/ripple/ripple.directive.ts
index ed4fcae0448a..70a429651230 100644
--- a/projects/addon-mobile/directives/ripple/ripple.directive.ts
+++ b/projects/addon-mobile/directives/ripple/ripple.directive.ts
@@ -38,7 +38,9 @@ export class TuiRippleDirective {
         const touchEnd$ = tuiTypedFromEvent(this.el, 'touchend');
         const touchMove$ = tuiTypedFromEvent(this.el, 'touchmove');
 
-        this.end$.subscribe(element => this.renderer.removeChild(this.el, element));
+        this.end$
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(element => this.renderer.removeChild(this.el, element));
 
         this.start$
             .pipe(
diff --git a/projects/core/components/link/link.component.ts b/projects/core/components/link/link.component.ts
index b76f68f921e0..c86398e3db97 100644
--- a/projects/core/components/link/link.component.ts
+++ b/projects/core/components/link/link.component.ts
@@ -19,7 +19,7 @@ import {
 import {MODE_PROVIDER} from '@taiga-ui/core/providers';
 import {TUI_MODE} from '@taiga-ui/core/tokens';
 import type {TuiHorizontalDirection} from '@taiga-ui/core/types';
-import {map, merge} from 'rxjs';
+import {map, merge, takeUntil} from 'rxjs';
 
 // @bad TODO: Think about extending Interactive
 @Component({
@@ -70,9 +70,11 @@ export class TuiLinkComponent implements TuiFocusableElementAccessor {
     protected readonly mode$ = inject(TUI_MODE);
 
     constructor() {
-        inject(TuiFocusVisibleService).subscribe(visible => {
-            this.focusVisible = visible;
-        });
+        inject(TuiFocusVisibleService)
+            .pipe(takeUntil(inject(TuiDestroyService, {self: true})))
+            .subscribe(visible => {
+                this.focusVisible = visible;
+            });
     }
 
     public get nativeFocusableElement(): TuiNativeFocusableElement {
diff --git a/projects/kit/components/action/action.component.ts b/projects/kit/components/action/action.component.ts
index a1f15beaf3a7..f55f9cec7fe3 100644
--- a/projects/kit/components/action/action.component.ts
+++ b/projects/kit/components/action/action.component.ts
@@ -15,6 +15,7 @@ import {
     TuiFocusVisibleService,
     tuiIsNativeFocused,
 } from '@taiga-ui/cdk';
+import {takeUntil} from 'rxjs';
 
 @Component({
     selector: 'button[tuiAction], a[tuiAction]',
@@ -41,9 +42,9 @@ export class TuiActionComponent extends AbstractTuiInteractive {
     constructor() {
         super();
 
-        inject(TuiFocusVisibleService).subscribe(visible => {
-            this.updateFocusVisible(visible);
-        });
+        inject(TuiFocusVisibleService)
+            .pipe(takeUntil(inject(TuiDestroyService, {self: true})))
+            .subscribe(visible => this.updateFocusVisible(visible));
     }
 
     public get nativeFocusableElement(): TuiNativeFocusableElement | null {
diff --git a/projects/kit/components/stepper/step/step.component.ts b/projects/kit/components/stepper/step/step.component.ts
index 40a216490b7f..05013a449fc2 100644
--- a/projects/kit/components/stepper/step/step.component.ts
+++ b/projects/kit/components/stepper/step/step.component.ts
@@ -11,7 +11,7 @@ import {RouterLinkActive} from '@angular/router';
 import {TuiDestroyService, TuiFocusVisibleService} from '@taiga-ui/cdk';
 import {TUI_COMMON_ICONS} from '@taiga-ui/core';
 import type {Observable} from 'rxjs';
-import {EMPTY, filter} from 'rxjs';
+import {EMPTY, filter, takeUntil} from 'rxjs';
 
 import {TuiStepperComponent} from '../stepper.component';
 
@@ -46,13 +46,16 @@ export class TuiStepComponent {
     protected readonly icons = inject(TUI_COMMON_ICONS);
 
     constructor() {
-        this.routerLinkActive$.pipe(filter(Boolean)).subscribe(() => {
-            this.activate();
-        });
+        this.routerLinkActive$
+            .pipe(filter(Boolean))
+            .pipe(takeUntil(inject(TuiDestroyService, {self: true})))
+            .subscribe(() => this.activate());
 
-        this.focusVisible$.subscribe(visible => {
-            this.focusVisible = visible;
-        });
+        this.focusVisible$
+            .pipe(takeUntil(inject(TuiDestroyService, {self: true})))
+            .subscribe(visible => {
+                this.focusVisible = visible;
+            });
     }
 
     @HostBinding('class._active')