From 028ccf1580f346eba29bc95e14a6274d32e4f6da Mon Sep 17 00:00:00 2001
From: 4gray <serega05@gmail.com>
Date: Sun, 16 Nov 2025 17:36:39 +0100
Subject: [PATCH] feat(ui/components): export and reuse overlay injection token

Introduce a shared InjectionToken for OverlayRef used by the multi-EPG
overlay component and export it from the components module.

- Add overlay-ref.token.ts defining COMPONENT_OVERLAY_REF to provide
  OverlayRef for dynamically created overlay components.
- Replace a locally created InjectionToken with an injected
  COMPONENT_OVERLAY_REF in multi-epg-container.component to avoid
  token duplication and ensure consistent DI across modules.
- Export the token from libs/ui/components/src/index.ts so other
  consumers can import and use the same token.

This reduces duplicated token definitions, fixes DI inconsistencies,
and makes the overlay ref reusable by external components.
---
 libs/ui/components/src/index.ts                        |  1 +
 .../src/lib/multi-epg/multi-epg-container.component.ts | 10 ++--------
 .../components/src/lib/multi-epg/overlay-ref.token.ts  |  9 +++++++++
 3 files changed, 12 insertions(+), 8 deletions(-)
 create mode 100644 libs/ui/components/src/lib/multi-epg/overlay-ref.token.ts

diff --git a/libs/ui/components/src/index.ts b/libs/ui/components/src/index.ts
index d5c46c97a..2c1817d76 100644
--- a/libs/ui/components/src/index.ts
+++ b/libs/ui/components/src/index.ts
@@ -9,6 +9,7 @@ export * from './lib/epg-list/epg-list.component';
 export * from './lib/html-video-player/html-video-player.component';
 export * from './lib/info-overlay/info-overlay.component';
 export * from './lib/multi-epg/multi-epg-container.component';
+export * from './lib/multi-epg/overlay-ref.token';
 export * from './lib/recent-playlists/playlist-info/playlist-info.component';
 export * from './lib/recent-playlists/playlist-item/playlist-item.component';
 export * from './lib/recent-playlists/recent-playlists.component';
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 2bfe0b177..3dfcc68d1 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
@@ -7,7 +7,6 @@ import {
     Component,
     ElementRef,
     inject,
-    InjectionToken,
     Input,
     OnDestroy,
     OnInit,
@@ -23,6 +22,7 @@ import { addDays, differenceInMinutes, format, parse, subDays } from 'date-fns';
 import { BehaviorSubject, Observable, Subscription } from 'rxjs';
 import { Channel, EpgChannel, EpgProgram } from 'shared-interfaces';
 import { EpgItemDescriptionComponent } from '../epg-list/epg-item-description/epg-item-description.component';
+import { COMPONENT_OVERLAY_REF } from './overlay-ref.token';
 
 interface EnrichedProgram extends EpgProgram {
     startDate: Date;
@@ -89,13 +89,7 @@ export class MultiEpgContainerComponent
 
     private readonly dialog = inject(MatDialog);
     private readonly cdr = inject(ChangeDetectorRef);
-    private readonly COMPONENT_OVERLAY_REF = new InjectionToken<OverlayRef>(
-        'COMPONENT_OVERLAY_REF'
-    );
-
-    private readonly overlayRef = inject<OverlayRef>(
-        this.COMPONENT_OVERLAY_REF
-    );
+    private readonly overlayRef = inject<OverlayRef>(COMPONENT_OVERLAY_REF);
 
     ngOnInit() {
         this.calculateCurrentTimeBar();
diff --git a/libs/ui/components/src/lib/multi-epg/overlay-ref.token.ts b/libs/ui/components/src/lib/multi-epg/overlay-ref.token.ts
new file mode 100644
index 000000000..db768fed1
--- /dev/null
+++ b/libs/ui/components/src/lib/multi-epg/overlay-ref.token.ts
@@ -0,0 +1,9 @@
+import { OverlayRef } from '@angular/cdk/overlay';
+import { InjectionToken } from '@angular/core';
+
+/**
+ * Injection token for providing OverlayRef to dynamically created overlay components
+ */
+export const COMPONENT_OVERLAY_REF = new InjectionToken<OverlayRef>(
+    'COMPONENT_OVERLAY_REF'
+);