From 30b7cdb7c60d99eeea430a8f6421a1a02a325082 Mon Sep 17 00:00:00 2001
From: 4gray <serega05@gmail.com>
Date: Sat, 8 Nov 2025 22:38:44 +0100
Subject: [PATCH] fix(ui): unsubscribe observable and mark DI fields readonly

---
 .../multi-epg-container.component.ts          | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/libs/ui/components/src/lib/multi-epg/multi-epg-container.component.ts b/libs/ui/components/src/lib/multi-epg/multi-epg-container.component.ts
index e4808ecf2..6ab402725 100644
--- a/libs/ui/components/src/lib/multi-epg/multi-epg-container.component.ts
+++ b/libs/ui/components/src/lib/multi-epg/multi-epg-container.component.ts
@@ -19,7 +19,7 @@ import { MatTooltip } from '@angular/material/tooltip';
 import { MomentDatePipe } from '@iptvnator/pipes';
 import { TranslatePipe } from '@ngx-translate/core';
 import { addDays, differenceInMinutes, format, parse, subDays } from 'date-fns';
-import { BehaviorSubject, Observable } from 'rxjs';
+import { BehaviorSubject, Observable, Subscription } from 'rxjs';
 import {
     Channel,
     COMPONENT_OVERLAY_REF,
@@ -59,8 +59,13 @@ export class MultiEpgContainerComponent
     readonly epgContainer = viewChild.required<ElementRef>('epgContainer');
 
     @Input() set playlistChannels(value: Observable<Channel[]>) {
+        // Unsubscribe from previous subscription if it exists
+        if (this.playlistChannelsSubscription) {
+            this.playlistChannelsSubscription.unsubscribe();
+        }
+
         if (value) {
-            value.subscribe(() => {
+            this.playlistChannelsSubscription = value.subscribe(() => {
                 this.initializeVisibleChannels();
                 this.requestPrograms();
             });
@@ -81,13 +86,14 @@ export class MultiEpgContainerComponent
 
     private dateCache = new Map<string, Date>();
     private interval!: number;
+    private playlistChannelsSubscription?: Subscription;
 
     isLastPage = false;
     totalChannels = 0;
 
     private readonly dialog = inject(MatDialog);
-    private cdr = inject(ChangeDetectorRef);
-    private overlayRef = inject<OverlayRef>(COMPONENT_OVERLAY_REF);
+    private readonly cdr = inject(ChangeDetectorRef);
+    private readonly overlayRef = inject<OverlayRef>(COMPONENT_OVERLAY_REF);
 
     ngOnInit() {
         this.calculateCurrentTimeBar();
@@ -138,6 +144,11 @@ export class MultiEpgContainerComponent
         this.hourWidth$.complete();
         this.channels$.complete();
         clearInterval(this.interval);
+
+        // Clean up playlist channels subscription
+        if (this.playlistChannelsSubscription) {
+            this.playlistChannelsSubscription.unsubscribe();
+        }
     }
 
     trackByIndex(index: number): number {