Force quit mpv on app close (#4)

src/main/features/core/player/index.ts

@@ -44,7 +44,7 @@ const mpv = new MpvAPI(
 );
 
 mpv.start().catch((error) => {
-  console.log('error', error);
+  console.log('error starting mpv', error);
 });
 
 mpv.on('status', (status) => {
@@ -152,10 +152,14 @@ ipcMain.on('player-auto-next', async (_event, data: PlayerData) => {
 
 // Sets the volume to the given value (0-100)
 ipcMain.on('player-volume', async (_event, value: number) => {
-  mpv.volume(value);
+  await mpv.volume(value);
 });
 
 // Toggles the mute status
 ipcMain.on('player-mute', async () => {
-  mpv.mute();
+  await mpv.mute();
+});
+
+ipcMain.on('player-quit', async () => {
+  await mpv.quit();
 });

src/main/main.ts

@@ -165,6 +165,10 @@ export const getMainWindow = () => {
   return mainWindow;
 };
 
+app.on('before-quit', () => {
+  mainWindow?.webContents.send('renderer-player-quit');
+});
+
 app.on('window-all-closed', () => {
   // Respect the OSX convention of having the application in memory even
   // after all windows have been closed

src/main/preload/mpv-player.ts

@@ -42,6 +42,10 @@ const volume = (value: number) => {
   ipcRenderer.send('player-volume', value);
 };
 
+const quit = () => {
+  ipcRenderer.send('player-quit');
+};
+
 const rendererAutoNext = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
   ipcRenderer.on('renderer-player-auto-next', cb);
 };
@@ -74,6 +78,10 @@ const rendererStop = (cb: (event: IpcRendererEvent, data: PlayerData) => void) =
   ipcRenderer.on('renderer-player-stop', cb);
 };
 
+const rendererQuit = (cb: (event: IpcRendererEvent) => void) => {
+  ipcRenderer.on('renderer-player-quit', cb);
+};
+
 export const mpvPlayer = {
   autoNext,
   currentTime,
@@ -82,6 +90,7 @@ export const mpvPlayer = {
   pause,
   play,
   previous,
+  quit,
   seek,
   seekTo,
   setQueue,
@@ -98,5 +107,6 @@ export const mpvPlayerListener = {
   rendererPlay,
   rendererPlayPause,
   rendererPrevious,
+  rendererQuit,
   rendererStop,
 };

src/renderer/features/player/hooks/use-center-controls.ts

@@ -13,9 +13,9 @@ import {
 } from '/@/renderer/store';
 import { useSettingsStore } from '/@/renderer/store/settings.store';
 
-const mpvPlayer = window.electron.mpvPlayer;
-const mpvPlayerListener = window.electron.mpvPlayerListener;
-const ipc = window.electron.ipc;
+const mpvPlayer = isElectron() ? window.electron.mpvPlayer : null;
+const mpvPlayerListener = isElectron() ? window.electron.mpvPlayerListener : null;
+const ipc = isElectron() ? window.electron.ipc : null;
 
 export const useCenterControls = (args: { playersRef: any }) => {
   const { playersRef } = args;
@@ -447,6 +447,10 @@ export const useCenterControls = (args: { playersRef: any }) => {
     [currentPlayerRef, isMpvPlayer, setCurrentTime],
   );
 
+  const handleQuit = useCallback(() => {
+    mpvPlayer.quit();
+  }, []);
+
   useEffect(() => {
     if (isElectron()) {
       mpvPlayerListener.rendererPlayPause(() => {
@@ -480,6 +484,10 @@ export const useCenterControls = (args: { playersRef: any }) => {
       mpvPlayerListener.rendererAutoNext(() => {
         handleAutoNext();
       });
+
+      mpvPlayerListener.rendererQuit(() => {
+        handleQuit();
+      });
     }
 
     return () => {
@@ -491,6 +499,7 @@ export const useCenterControls = (args: { playersRef: any }) => {
       ipc?.removeAllListeners('renderer-player-stop');
       ipc?.removeAllListeners('renderer-player-current-time');
       ipc?.removeAllListeners('renderer-player-auto-next');
+      ipc?.removeAllListeners('renderer-player-quit');
     };
   }, [
     autoNext,
@@ -500,6 +509,7 @@ export const useCenterControls = (args: { playersRef: any }) => {
     handlePlay,
     handlePlayPause,
     handlePrevTrack,
+    handleQuit,
     handleStop,
     isMpvPlayer,
     next,