refactor feature hooks to be conditionally initialized

src/renderer/features/player/hooks/use-auto-dj.ts

@@ -1,5 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query';
-import { useEffect } from 'react';
+import React, { useEffect } from 'react';
 
 import { queryKeys } from '/@/renderer/api/query-keys';
 import { eventEmitter } from '/@/renderer/events/event-emitter';
@@ -13,6 +13,7 @@ import {
     useCurrentServerId,
     usePlayerStore,
     usePlayerStoreBase,
+    useSettingsStore,
 } from '/@/renderer/store';
 import { LogCategory, logFn } from '/@/renderer/utils/logger';
 import { logMsg } from '/@/renderer/utils/logger-message';
@@ -232,3 +233,18 @@ export const useAutoDJ = () => {
         settings.timing,
     ]);
 };
+
+const AutoDJHookInner = () => {
+    useAutoDJ();
+    return null;
+};
+
+export const AutoDJHook = () => {
+    const isAutoDJEnabled = useSettingsStore((state) => state.autoDJ.enabled);
+
+    if (!isAutoDJEnabled) {
+        return null;
+    }
+
+    return React.createElement(AutoDJHookInner);
+};

src/renderer/features/player/hooks/use-media-session.ts

@@ -1,11 +1,12 @@
 import isElectron from 'is-electron';
-import { useCallback, useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 
 import { getItemImageUrl } from '/@/renderer/components/item-image/item-image';
 import { usePlayerEvents } from '/@/renderer/features/player/audio-player/hooks/use-player-events';
 import { usePlayer } from '/@/renderer/features/player/context/player-context';
 import {
     usePlaybackSettings,
+    usePlaybackType,
     usePlayerStore,
     useSettingsStore,
     useSkipButtons,
@@ -143,3 +144,25 @@ export const useMediaSession = () => {
         [isMediaSessionEnabled, mediaSession],
     );
 };
+
+const MediaSessionHookInner = () => {
+    useMediaSession();
+    return null;
+};
+
+export const MediaSessionHook = () => {
+    const isElectronEnv = isElectron();
+    const playbackType = usePlaybackType();
+    const isMediaSessionEnabled = useSettingsStore((state) => state.playback.mediaSession);
+
+    // We always want to enable media session when on web
+    // Otherwise, only enable if it is explicitly enabled in the settings AND using the web player
+    const shouldUseMediaSession =
+        !isElectronEnv || (isMediaSessionEnabled && playbackType === PlayerType.WEB);
+
+    if (!shouldUseMediaSession) {
+        return null;
+    }
+
+    return React.createElement(MediaSessionHookInner);
+};

src/renderer/features/player/hooks/use-mpris.ts

@@ -1,5 +1,5 @@
 import isElectron from 'is-electron';
-import { useEffect } from 'react';
+import React, { useEffect } from 'react';
 
 import { useItemImageUrl } from '/@/renderer/components/item-image/item-image';
 import { usePlayerEvents } from '/@/renderer/features/player/audio-player/hooks/use-player-events';
@@ -119,3 +119,20 @@ export const useMPRIS = () => {
         [],
     );
 };
+
+const MPRISHookInner = () => {
+    useMPRIS();
+    return null;
+};
+
+export const MPRISHook = () => {
+    const isElectronEnv = isElectron();
+    const utils = isElectronEnv ? window.api.utils : null;
+    const mpris = isElectronEnv && utils?.isLinux() ? window.api.mpris : null;
+
+    if (mpris === null) {
+        return null;
+    }
+
+    return React.createElement(MPRISHookInner);
+};

src/renderer/features/player/hooks/use-playback-hotkeys.ts

@@ -38,3 +38,8 @@ export const usePlaybackHotkeys = () => {
 
     useHotkeys(playbackHotkeysItems);
 };
+
+export const PlaybackHotkeysHook = () => {
+    usePlaybackHotkeys();
+    return null;
+};

src/renderer/features/player/hooks/use-power-save-blocker.ts

@@ -1,8 +1,7 @@
 import isElectron from 'is-electron';
-import { useCallback, useEffect } from 'react';
+import React, { useCallback, useEffect } from 'react';
 
-import { usePlayerStatus } from '/@/renderer/store';
-import { useWindowSettings } from '/@/renderer/store';
+import { usePlayerStatus, useSettingsStore, useWindowSettings } from '/@/renderer/store';
 import { PlayerStatus } from '/@/shared/types/types';
 
 const ipc = isElectron() ? window.api.ipc : null;
@@ -48,3 +47,19 @@ export const usePowerSaveBlocker = () => {
         };
     }, [stopPowerSaveBlocker]);
 };
+
+const PowerSaveBlockerHookInner = () => {
+    usePowerSaveBlocker();
+    return null;
+};
+
+export const PowerSaveBlockerHook = () => {
+    const isElectronEnv = isElectron();
+    const preventSleepOnPlayback = useSettingsStore((state) => state.window.preventSleepOnPlayback);
+
+    if (!isElectronEnv || !preventSleepOnPlayback) {
+        return null;
+    }
+
+    return React.createElement(PowerSaveBlockerHookInner);
+};

src/renderer/features/player/hooks/use-queue-restore.ts

@@ -32,6 +32,11 @@ export const useQueueRestoreTimestamp = () => {
     );
 };
 
+export const QueueRestoreTimestampHook = () => {
+    useQueueRestoreTimestamp();
+    return null;
+};
+
 export const useSaveQueue = () => {
     const serverId = useCurrentServerId();
 

src/renderer/features/player/hooks/use-scrobble.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 
 import { useItemImageUrl } from '/@/renderer/components/item-image/item-image';
 import { usePlayerEvents } from '/@/renderer/features/player/audio-player/hooks/use-player-events';
@@ -8,6 +8,7 @@ import {
     usePlaybackSettings,
     usePlayerSong,
     usePlayerStore,
+    useSettingsStore,
     useTimestampStoreBase,
 } from '/@/renderer/store';
 import { LogCategory, logFn } from '/@/renderer/utils/logger';
@@ -425,3 +426,19 @@ export const useScrobble = () => {
         [handleScrobbleFromSongChange, handleProgressUpdate, handleScrobbleFromSeek],
     );
 };
+
+const ScrobbleHookInner = () => {
+    useScrobble();
+    return null;
+};
+
+export const ScrobbleHook = () => {
+    const isScrobbleEnabled = useSettingsStore((state) => state.playback.scrobble.enabled);
+    const privateMode = useAppStore((state) => state.privateMode);
+
+    if (!isScrobbleEnabled || privateMode) {
+        return null;
+    }
+
+    return React.createElement(ScrobbleHookInner);
+};

src/renderer/features/player/hooks/use-update-current-song.ts

@@ -80,3 +80,8 @@ export const useUpdateCurrentSong = () => {
         [handleSongChange],
     );
 };
+
+export const UpdateCurrentSongHook = () => {
+    useUpdateCurrentSong();
+    return null;
+};