feat(youtube): add YouTube Watch support with hot-swap and platform isolation

- Add youtube_watch as a second tracked platform with 10s watch threshold
- Implement hot-swap in content.ts: destroys and re-bootstraps engine on
  platform boundary crossings (Shorts - Watch)
- Add destroy() lifecycle methods to AppOrchestrator, SessionManager,
  and Tracker to prevent memory leaks during context switches
- Filter BLOCK_NOW messages by PlatformId to prevent cross-platform
  message crosstalk
- Migrate PlatformAdapter interface to src/core/interfaces/
- Update i18n and popup UI to expose YouTube Watch controls

Author: YazanAmmar

src/app/orchestrator.ts

@@ -5,7 +5,7 @@ import { SessionManager } from '../core/session';
 import { showOverlay, initOverlayListeners } from '../ui/overlay/controller';
 import { ConnectionManager } from '../core/interfaces/connection-manager';
 import { StorageFacade } from '../core/storage/index';
-import { PlatformAdapter } from '../types';
+import { PlatformAdapter } from '../core/interfaces/platform-adapter';
 import { StorageChange } from '../core/storage/driver';
 import { MessageBus } from '../core/interfaces/message-bus';
 
@@ -17,6 +17,10 @@ export class AppOrchestrator {
   private storage: StorageFacade;
 
   private sessionManager!: SessionManager;
+  private messenger!: Messenger;
+  private tracker!: Tracker;
+
+  private storageListener: ((changes: Record<string, StorageChange>) => void) | null = null;
 
   constructor(
     adapter: PlatformAdapter,
@@ -32,9 +36,13 @@ export class AppOrchestrator {
 
   public async start() {
     initOverlayListeners();
+
+    const pId = this.activeAdapter.id;
+
     const safeBlock = async (reason: string = 'time') => {
       if (!this.isBlocked) {
         this.isBlocked = true;
+        console.warn(`[Limitra] Initiating block logic. Reason: ${reason}`);
         if (this.sessionManager) {
           await this.sessionManager.blockSession();
         }
@@ -43,21 +51,24 @@ export class AppOrchestrator {
       }
     };
 
-    const messenger = new Messenger(() => {
-      void safeBlock('time');
-    }, this.messageBus);
-    messenger.init();
+    this.messenger = new Messenger(
+      () => {
+        void safeBlock('time');
+      },
+      this.messageBus,
+      pId,
+    );
+
+    this.messenger.init();
 
     this.sessionManager = new SessionManager(
-      messenger,
+      this.messenger,
       this.activeAdapter,
       this.connectionManager,
       this.storage,
     );
     await this.sessionManager.init();
 
-    const pId = this.activeAdapter.id;
-
     let limit = await this.storage.getLimit(pId);
     const initialCount = await this.storage.getCount(pId);
     let isLimitEnabled = await this.storage.getEnableLimit(pId);
@@ -77,7 +88,7 @@ export class AppOrchestrator {
     );
     limiter.setInitialCount(initialCount);
 
-    this.storage.onChange((changes: Record<string, StorageChange>) => {
+    this.storageListener = (changes: Record<string, StorageChange>) => {
       if (changes[`limitra_${pId}_limit`] || changes[`limitra_${pId}_enable_limit`]) {
         if (changes[`limitra_${pId}_limit`]) {
           limit = Number(changes[`limitra_${pId}_limit`].newValue) || 0;
@@ -114,7 +125,9 @@ export class AppOrchestrator {
           void safeBlock('time');
         }
       }
-    });
+    };
+
+    this.storage.onChange(this.storageListener);
 
     const bypassed = await this.storage.detectBypass(pId);
     if (bypassed) {
@@ -125,7 +138,7 @@ export class AppOrchestrator {
       await safeBlock('time');
     }
 
-    const tracker = new Tracker(async () => {
+    this.tracker = new Tracker(async () => {
       if (this.isBlocked) {
         const overlay = document.getElementById('limitra-overlay');
         const isTampered =
@@ -135,19 +148,43 @@ export class AppOrchestrator {
           window.getComputedStyle(overlay).opacity === '0';
         if (isTampered) {
           console.warn(
-            '[Limitra] Tampering with the blocking interface via DevTools has been detected. Reapplying enforcement...',
+            '[Limitra] Tampering or SPA page refresh detected. Reapplying enforcement...',
           );
           if (overlay) overlay.remove();
           this.activeAdapter.executePunishment();
           await showOverlay('bypass');
         }
         return;
       }
+
       if (isLimitEnabled && limit > 0) {
         await this.storage.incrementCount(pId);
       }
     });
-    tracker.setAdapter(this.activeAdapter);
-    tracker.init();
+    this.tracker.setAdapter(this.activeAdapter);
+    this.tracker.init();
+  }
+
+  public destroy() {
+    if (this.storageListener) {
+      this.storage.removeListener(this.storageListener);
+      this.storageListener = null;
+    }
+    if (this.messenger) {
+      this.messenger.destroy();
+    }
+    if (this.activeAdapter) {
+      this.activeAdapter.disconnect();
+    }
+    if (this.sessionManager) {
+      this.sessionManager.destroy();
+    }
+    if (this.tracker) {
+      this.tracker.destroy();
+    }
+
+    const overlay = document.getElementById('limitra-overlay');
+    if (overlay) overlay.remove();
+    document.body.classList.remove('limitra-global-punishment');
   }
 }

src/content.ts

@@ -15,26 +15,53 @@ if (!window.__LIMITRA_INJECTED__) {
   window.__LIMITRA_INJECTED__ = true;
 
   void (async () => {
-    try {
-      const storageDriver = new ChromeStorageDriver();
-      const storage = new StorageFacade(storageDriver);
-      const messageBus = new ChromeMessageBus();
-      const connectionManager = new ChromeConnectionManager();
-
-      const adapters = [new YouTubeAdapter(storage)];
-      const currentUrl = location.href;
-      const activeAdapter = adapters.find((adapter) => adapter.isCurrentPlatform(currentUrl));
-
-      if (!activeAdapter) {
-        console.warn('[Limitra] Site not supported yet. Sleeping...');
-        return;
+    const storageDriver = new ChromeStorageDriver();
+    const storage = new StorageFacade(storageDriver);
+    const messageBus = new ChromeMessageBus();
+    const connectionManager = new ChromeConnectionManager();
+
+    let currentApp: AppOrchestrator | null = null;
+
+    let isBootstrapping = false;
+
+    const bootstrap = async () => {
+      if (isBootstrapping) return;
+      isBootstrapping = true;
+
+      try {
+        if (currentApp) {
+          console.warn('[Limitra] Platform change detected. Destroying old instance...');
+          currentApp.destroy();
+          currentApp = null;
+        }
+
+        const currentUrl = location.href;
+
+        const adapters = [
+          new YouTubeAdapter(storage, currentUrl, () => {
+            void bootstrap();
+          }),
+        ];
+
+        const activeAdapter = adapters.find((adapter) => adapter.isCurrentPlatform(currentUrl));
+
+        if (!activeAdapter) {
+          console.warn('[Limitra] Site not supported yet or context irrelevant. Sleeping...');
+          return;
+        }
+
+        currentApp = new AppOrchestrator(activeAdapter, messageBus, connectionManager, storage);
+        await currentApp.start();
+
+        console.warn(`[Limitra] engine started for: ${activeAdapter.id}`);
+      } catch (err) {
+        console.error('[Limitra] Bootstrap failed:', err);
+        window.__LIMITRA_INJECTED__ = false;
+      } finally {
+        isBootstrapping = false;
       }
+    };
 
-      const app = new AppOrchestrator(activeAdapter, messageBus, connectionManager, storage);
-      await app.start();
-    } catch (err) {
-      console.error('[Limitra] Bootstrap failed:', err);
-      window.__LIMITRA_INJECTED__ = false;
-    }
+    await bootstrap();
   })();
 }

src/core/background-orchestrator.ts

@@ -40,7 +40,7 @@ export class BackgroundOrchestrator {
     const limitMs = timeLimitMins * 60 * 1000;
 
     if (timeSpentMs >= limitMs) {
-      const message: ExtensionMessage = { action: AppAction.BLOCK_NOW };
+      const message: ExtensionMessage = { action: AppAction.BLOCK_NOW, platform };
       await this.tabManager.sendMessageToPattern(config.urlPatterns, message);
     } else {
       const timeRemainingMs = limitMs - timeSpentMs;

src/core/interfaces/platform-adapter.ts

@@ -0,0 +1,43 @@
+import { PlatformId } from '../../types';
+
+export type ItemChangeCallback = (itemId: string) => void;
+
+/**
+ * PlatformAdapter Port: Defines the contract for any supported platform (YouTube, IG, etc.)
+ */
+export interface PlatformAdapter {
+  /**
+   * Unique identifier for the platform (used for scoped storage and dynamic tracking)
+   */
+  readonly id: PlatformId;
+
+  /**
+   * Platform name used for UI and logging
+   */
+  name: string;
+
+  /**
+   * Checks whether the current URL belongs to this platform and its specific mode
+   */
+  isCurrentPlatform(url: string): boolean;
+
+  /**
+   * Starts observing platform-specific events (e.g., video changes, scrolling)
+   */
+  observe(onItemChange: ItemChangeCallback): void;
+
+  /**
+   * Cleans up all observers, intervals, and listeners
+   */
+  disconnect(): void;
+
+  /**
+   * Applies the enforcement/punishment logic (e.g., pause, mute, blur)
+   */
+  executePunishment(): void;
+
+  /**
+   * Checks if media is currently active (playing) for accurate time tracking
+   */
+  isVideoPlaying(): boolean;
+}

src/core/messenger.ts

@@ -1,20 +1,26 @@
 import { AppAction, ExtensionMessage } from '../types';
+import { PlatformId } from '../types';
 import { MessageBus } from './interfaces/message-bus';
 
 export class Messenger {
   private onBlockCallback: () => void;
   private messageBus: MessageBus;
+  private platformId: PlatformId;
 
   private messageListener = (message: ExtensionMessage) => {
     if (message && message.action === AppAction.BLOCK_NOW) {
-      console.warn('[Messenger] Received BLOCK_NOW from background');
+      if (message.platform && message.platform !== this.platformId) {
+        return;
+      }
+      console.warn('[Messenger] Received BLOCK_NOW from background for:', this.platformId);
       this.onBlockCallback();
     }
   };
 
-  constructor(onBlock: () => void, messageBus: MessageBus) {
+  constructor(onBlock: () => void, messageBus: MessageBus, platformId: PlatformId) {
     this.onBlockCallback = onBlock;
     this.messageBus = messageBus;
+    this.platformId = platformId;
   }
 
   public init() {
@@ -27,10 +33,10 @@ export class Messenger {
   }
 
   public notifyActive() {
-    void this.messageBus.sendMessage({ action: AppAction.TAB_ACTIVE });
+    void this.messageBus.sendMessage({ action: AppAction.TAB_ACTIVE, platform: this.platformId });
   }
 
   public notifyHidden() {
-    void this.messageBus.sendMessage({ action: AppAction.TAB_HIDDEN });
+    void this.messageBus.sendMessage({ action: AppAction.TAB_HIDDEN, platform: this.platformId });
   }
 }

src/core/session.ts

@@ -1,6 +1,6 @@
 import { StorageFacade } from './storage/index';
 import { Messenger } from './messenger';
-import { PlatformAdapter } from '../types';
+import { PlatformAdapter } from '../core/interfaces/platform-adapter';
 import { ConnectionManager } from './interfaces/connection-manager';
 
 export class SessionManager {
@@ -14,6 +14,16 @@ export class SessionManager {
   private heartbeatId: ReturnType<typeof window.setInterval> | null = null;
   private connectionManager: ConnectionManager;
 
+  private activityHandler = () => {
+    this.lastActivityTime = Date.now();
+  };
+
+  private visibilityHandler = async () => {
+    if (this.isBlocked) return;
+    if (document.hidden) await this.stopTracking();
+    else this.lastActivityTime = Date.now();
+  };
+
   constructor(
     messenger: Messenger,
     adapter: PlatformAdapter,
@@ -44,13 +54,7 @@ export class SessionManager {
 
   private setupActivityListeners() {
     ['mousemove', 'keydown', 'scroll', 'click'].forEach((event) => {
-      window.addEventListener(
-        event,
-        () => {
-          this.lastActivityTime = Date.now();
-        },
-        { passive: true },
-      );
+      window.addEventListener(event, this.activityHandler, { passive: true });
     });
   }
 
@@ -119,14 +123,25 @@ export class SessionManager {
   }
 
   private observeVisibility() {
-    document.addEventListener('visibilitychange', async () => {
-      if (this.isBlocked) return;
-      if (document.hidden) await this.stopTracking();
-      else this.lastActivityTime = Date.now();
-    });
+    document.addEventListener('visibilitychange', this.visibilityHandler);
   }
 
   private setupUnloadHandler() {
     this.connectionManager.connect('limitra-session');
   }
+
+  public destroy() {
+    if (this.heartbeatId !== null) {
+      window.clearInterval(this.heartbeatId);
+      this.heartbeatId = null;
+    }
+
+    ['mousemove', 'keydown', 'scroll', 'click'].forEach((event) => {
+      window.removeEventListener(event, this.activityHandler);
+    });
+
+    document.removeEventListener('visibilitychange', this.visibilityHandler);
+
+    void this.stopTracking();
+  }
 }