move remote init into hook

src/renderer/app.tsx

@@ -26,12 +26,10 @@ import {
     useCssSettings,
     useHotkeySettings,
     usePlaybackSettings,
-    useRemoteSettings,
     useSettingsStore,
 } from '/@/renderer/store';
 import { useAppTheme } from '/@/renderer/themes/use-app-theme';
 import { sanitizeCss } from '/@/renderer/utils/sanitize';
-import { toast } from '/@/shared/components/toast/toast';
 import '/styles/overlayscrollbars.css';
 import { PlayerType, WebAudio } from '/@/shared/types/types';
 
@@ -39,7 +37,6 @@ ModuleRegistry.registerModules([ClientSideRowModelModule, InfiniteRowModelModule
 
 const mpvPlayer = isElectron() ? window.api.mpvPlayer : null;
 const ipc = isElectron() ? window.api.ipc : null;
-const remote = isElectron() ? window.api.remote : null;
 const utils = isElectron() ? window.api.utils : null;
 
 export const App = () => {
@@ -49,9 +46,6 @@ export const App = () => {
     const { content, enabled } = useCssSettings();
     const { type: playbackType } = usePlaybackSettings();
     const { bindings } = useHotkeySettings();
-    // const handlePlayQueueAdd = useHandlePlayQueueAdd();
-    // const { clearQueue, restoreQueue } = useQueueControls();
-    const remoteSettings = useRemoteSettings();
     const cssRef = useRef<HTMLStyleElement | null>(null);
     useDiscordRpc();
     useServerVersion();
@@ -78,10 +72,6 @@ export const App = () => {
         return () => {};
     }, [content, enabled]);
 
-    // const providerValue = useMemo(() => {
-    //     return { handlePlayQueueAdd };
-    // }, [handlePlayQueueAdd]);
-
     const webAudioProvider = useMemo(() => {
         return { setWebAudio, webAudio };
     }, [webAudio]);
@@ -129,52 +119,6 @@ export const App = () => {
         }
     }, [bindings]);
 
-    // useEffect(() => {
-    //     if (utils) {
-    //         utils.onSaveQueue(() => {
-    //             const { current, queue } = usePlayerStore.getState();
-    //             const stateToSave: Partial<Pick<PlayerState, 'current' | 'queue'>> = {
-    //                 current: {
-    //                     ...current,
-    //                     status: PlayerStatus.PAUSED,
-    //                 },
-    //                 queue,
-    //             };
-    //             utils.saveQueue(stateToSave);
-    //         });
-
-    //         utils.onRestoreQueue((_event: any, data) => {
-    //             const playerData = restoreQueue(data);
-    //             if (playbackType === PlaybackType.LOCAL) {
-    //                 setQueue(playerData, true);
-    //             }
-    //             updateSong(playerData.current.song);
-    //         });
-    //     }
-
-    //     return () => {
-    //         ipc?.removeAllListeners('renderer-restore-queue');
-    //         ipc?.removeAllListeners('renderer-save-queue');
-    //     };
-    // }, [playbackType, restoreQueue]);
-
-    useEffect(() => {
-        if (remote) {
-            remote
-                ?.updateSetting(
-                    remoteSettings.enabled,
-                    remoteSettings.port,
-                    remoteSettings.username,
-                    remoteSettings.password,
-                )
-                .catch((error) => {
-                    toast.warn({ message: error, title: 'Failed to enable remote' });
-                });
-        }
-        // We only want to fire this once
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-
     useEffect(() => {
         if (language) {
             i18n.changeLanguage(language);

src/renderer/features/remote/hooks/use-remote.tsx

@@ -5,7 +5,8 @@ import { usePlayerEvents } from '/@/renderer/features/player/audio-player/hooks/
 import { useCreateFavorite } from '/@/renderer/features/shared/mutations/create-favorite-mutation';
 import { useDeleteFavorite } from '/@/renderer/features/shared/mutations/delete-favorite-mutation';
 import { useSetRating } from '/@/renderer/features/shared/mutations/set-rating-mutation';
-import { usePlayerActions } from '/@/renderer/store';
+import { usePlayerActions, useRemoteSettings } from '/@/renderer/store';
+import { toast } from '/@/shared/components/toast/toast';
 import { LibraryItem, Song } from '/@/shared/types/domain-types';
 import { PlayerShuffle } from '/@/shared/types/types';
 
@@ -15,10 +16,31 @@ const ipc = isElectron() ? window.api.ipc : null;
 export const useRemote = () => {
     const { mediaSkipForward, setTimestamp, setVolume } = usePlayerActions();
 
+    const remoteSettings = useRemoteSettings();
     const updateRatingMutation = useSetRating({});
     const addToFavoritesMutation = useCreateFavorite({});
     const removeFromFavoritesMutation = useDeleteFavorite({});
 
+    // Initialize the remote
+    useEffect(() => {
+        if (!remote) {
+            return;
+        }
+
+        remote
+            ?.updateSetting(
+                remoteSettings.enabled,
+                remoteSettings.port,
+                remoteSettings.username,
+                remoteSettings.password,
+            )
+            .catch((error) => {
+                toast.warn({ message: error, title: 'Failed to enable remote' });
+            });
+        // We only want to fire this once
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+
     useEffect(() => {
         if (!remote) {
             return;