From 382f195847cff68030616f7f039c2c388506d9ef Mon Sep 17 00:00:00 2001
From: talksik <patel.arjun50@gmail.com>
Date: Wed, 8 Apr 2026 10:53:11 -0700
Subject: [PATCH] fix: autoplay sound overlapping with main window

This created some distortion because while we were hiding the autoplay
window, this would not stop it's media. It's better to stop the media
completely
---
 js/src/autoplay_window/AutoplayApp.tsx | 7 +++++++
 js/src/electron.d.ts                   | 1 +
 js/src/main.ts                         | 2 ++
 js/src/preload.ts                      | 5 +++++
 4 files changed, 15 insertions(+)

diff --git a/js/src/autoplay_window/AutoplayApp.tsx b/js/src/autoplay_window/AutoplayApp.tsx
index 89a3ea4..c2326d8 100644
--- a/js/src/autoplay_window/AutoplayApp.tsx
+++ b/js/src/autoplay_window/AutoplayApp.tsx
@@ -10,6 +10,13 @@ export function AutoplayApp() {
     return window.electronAutoplay.onPlay((p) => setPayload(p));
   }, []);
 
+  useEffect(() => {
+    return window.electronAutoplay.onStop(() => {
+      mediaRef.current?.pause();
+      setPayload(null);
+    });
+  }, []);
+
   const stop = useCallback(() => {
     mediaRef.current?.pause();
     setPayload(null);
diff --git a/js/src/electron.d.ts b/js/src/electron.d.ts
index 3823276..343deaf 100644
--- a/js/src/electron.d.ts
+++ b/js/src/electron.d.ts
@@ -27,6 +27,7 @@ declare global {
       dismiss: () => void;
       navigate: (data: { networkId: string; streamId: string }) => void;
       onPlay: (callback: (payload: AutoplayPayload) => void) => () => void;
+      onStop: (callback: () => void) => () => void;
       onNavigate: (callback: (data: { networkId: string; streamId: string }) => void) => () => void;
     };
     electronLink: {
diff --git a/js/src/main.ts b/js/src/main.ts
index 46e9c23..2aeda3c 100644
--- a/js/src/main.ts
+++ b/js/src/main.ts
@@ -184,10 +184,12 @@ ipcMain.on('autoplay:play', (_event, payload) => {
 });
 
 ipcMain.on('autoplay:dismiss', () => {
+  autoplayWindow?.webContents.send('autoplay:stop');
   autoplayWindow?.hide();
 });
 
 ipcMain.on('autoplay:navigate', (_event, data) => {
+  autoplayWindow?.webContents.send('autoplay:stop');
   autoplayWindow?.hide();
   if (mainWindow) {
     mainWindow.webContents.send('autoplay:navigate', data);
diff --git a/js/src/preload.ts b/js/src/preload.ts
index 28f9b72..d6a20b3 100644
--- a/js/src/preload.ts
+++ b/js/src/preload.ts
@@ -29,6 +29,11 @@ contextBridge.exposeInMainWorld('electronAutoplay', {
     ipcRenderer.on('autoplay:play', handler);
     return () => { ipcRenderer.removeListener('autoplay:play', handler); };
   },
+  onStop: (callback: () => void) => {
+    const handler = () => callback();
+    ipcRenderer.on('autoplay:stop', handler);
+    return () => { ipcRenderer.removeListener('autoplay:stop', handler); };
+  },
   onNavigate: (callback: (data: { networkId: string; streamId: string }) => void) => {
     const handler = (_event: Electron.IpcRendererEvent, data: { networkId: string; streamId: string }) => callback(data);
     ipcRenderer.on('autoplay:navigate', handler);