begin implementing player context

src/renderer/features/player/context/player-context.tsx

@@ -1,7 +1,8 @@
 import { createContext, useCallback, useMemo } from 'react';
 
-import { AddToQueueType } from '/@/renderer/store';
+import { AddToQueueType, usePlayerActions } from '/@/renderer/store';
 import { LibraryItem, QueueSong, Song } from '/@/shared/types/domain-types';
+import { Play } from '/@/shared/types/types';
 
 interface PlayerContext {
     addToQueueByData: (data: Song[], type: AddToQueueType) => void;
@@ -12,11 +13,11 @@ interface PlayerContext {
     increaseVolume: (amount: number) => void;
     mediaNext: () => void;
     mediaPause: () => void;
-    mediaPlay: (id: string) => void;
+    mediaPlay: (id?: string) => void;
     mediaPrevious: () => void;
     mediaSeekToTimestamp: (timestamp: number) => void;
-    mediaStepBackward: () => void;
-    mediaStepForward: () => void;
+    mediaSkipBackward: () => void;
+    mediaSkipForward: () => void;
     mediaToggleMute: () => void;
     mediaTogglePlayPause: () => void;
     moveSelectedTo: (items: QueueSong[], edge: 'bottom' | 'top', uniqueId: string) => void;
@@ -41,8 +42,8 @@ export const PlayerContext = createContext<PlayerContext>({
     mediaPlay: () => {},
     mediaPrevious: () => {},
     mediaSeekToTimestamp: () => {},
-    mediaStepBackward: () => {},
-    mediaStepForward: () => {},
+    mediaSkipBackward: () => {},
+    mediaSkipForward: () => {},
     mediaToggleMute: () => {},
     mediaTogglePlayPause: () => {},
     moveSelectedTo: () => {},
@@ -56,56 +57,140 @@ export const PlayerContext = createContext<PlayerContext>({
 });
 
 export const PlayerProvider = ({ children }: { children: React.ReactNode }) => {
-    const addToQueueByData = useCallback((data: Song[], type: AddToQueueType) => {}, []);
+    const storeActions = usePlayerActions();
+
+    const addToQueueByData = useCallback(
+        (data: Song[], type: AddToQueueType) => {
+            if (typeof type === 'object' && 'edge' in type && type.edge !== null) {
+                const edge = type.edge === 'top' ? 'top' : 'bottom';
+                storeActions.addToQueueByUniqueId(data, type.uniqueId, edge);
+            } else {
+                storeActions.addToQueueByType(data, type as Play);
+            }
+        },
+        [storeActions],
+    );
 
     const addToQueueByFetch = useCallback(
         (id: string[], itemType: LibraryItem, type: AddToQueueType) => {},
         [],
     );
-    const clearQueue = useCallback(() => {}, []);
+    const clearQueue = useCallback(() => {
+        storeActions.clearQueue();
+    }, [storeActions]);
 
-    const clearSelected = useCallback((items: QueueSong[]) => {}, []);
-
-    const decreaseVolume = useCallback((amount: number) => {}, []);
-
-    const increaseVolume = useCallback((amount: number) => {}, []);
-
-    const mediaNext = useCallback(() => {}, []);
-
-    const mediaPause = useCallback(() => {}, []);
-
-    const mediaPlay = useCallback((id: string) => {}, []);
-
-    const mediaPrevious = useCallback(() => {}, []);
-
-    const mediaSeekToTimestamp = useCallback((timestamp: number) => {}, []);
-
-    const mediaStepBackward = useCallback(() => {}, []);
-
-    const mediaStepForward = useCallback(() => {}, []);
-
-    const mediaToggleMute = useCallback(() => {}, []);
-
-    const mediaTogglePlayPause = useCallback(() => {}, []);
-
-    const moveSelectedTo = useCallback(
-        (items: QueueSong[], edge: 'bottom' | 'top', uniqueId: string) => {},
-        [],
+    const clearSelected = useCallback(
+        (items: QueueSong[]) => {
+            storeActions.clearSelected(items);
+        },
+        [storeActions],
     );
 
-    const moveSelectedToBottom = useCallback((items: QueueSong[]) => {}, []);
+    const decreaseVolume = useCallback(
+        (amount: number) => {
+            storeActions.decreaseVolume(amount);
+        },
+        [storeActions],
+    );
 
-    const moveSelectedToNext = useCallback((items: QueueSong[]) => {}, []);
+    const increaseVolume = useCallback(
+        (amount: number) => {
+            storeActions.increaseVolume(amount);
+        },
+        [storeActions],
+    );
 
-    const moveSelectedToTop = useCallback((items: QueueSong[]) => {}, []);
+    const mediaNext = useCallback(() => {
+        storeActions.mediaNext();
+    }, [storeActions]);
 
-    const setVolume = useCallback((volume: number) => {}, []);
+    const mediaPause = useCallback(() => {
+        storeActions.mediaPause();
+    }, [storeActions]);
 
-    const shuffle = useCallback(() => {}, []);
+    const mediaPlay = useCallback(
+        (id?: string) => {
+            storeActions.mediaPlay(id);
+        },
+        [storeActions],
+    );
 
-    const shuffleAll = useCallback(() => {}, []);
+    const mediaPrevious = useCallback(() => {
+        storeActions.mediaPrevious();
+    }, [storeActions]);
 
-    const shuffleSelected = useCallback((items: QueueSong[]) => {}, []);
+    const mediaSeekToTimestamp = useCallback(
+        (timestamp: number) => {
+            storeActions.mediaSeekToTimestamp(timestamp);
+        },
+        [storeActions],
+    );
+
+    const mediaSkipBackward = useCallback(() => {
+        storeActions.mediaSkipBackward();
+    }, [storeActions]);
+
+    const mediaSkipForward = useCallback(() => {
+        storeActions.mediaSkipForward();
+    }, [storeActions]);
+
+    const mediaToggleMute = useCallback(() => {
+        storeActions.mediaToggleMute();
+    }, [storeActions]);
+
+    const mediaTogglePlayPause = useCallback(() => {
+        storeActions.mediaTogglePlayPause();
+    }, [storeActions]);
+
+    const moveSelectedTo = useCallback(
+        (items: QueueSong[], edge: 'bottom' | 'top', uniqueId: string) => {
+            storeActions.moveSelectedTo(items, uniqueId, edge);
+        },
+        [storeActions],
+    );
+
+    const moveSelectedToBottom = useCallback(
+        (items: QueueSong[]) => {
+            storeActions.moveSelectedToBottom(items);
+        },
+        [storeActions],
+    );
+
+    const moveSelectedToNext = useCallback(
+        (items: QueueSong[]) => {
+            storeActions.moveSelectedToNext(items);
+        },
+        [storeActions],
+    );
+
+    const moveSelectedToTop = useCallback(
+        (items: QueueSong[]) => {
+            storeActions.moveSelectedToTop(items);
+        },
+        [storeActions],
+    );
+
+    const setVolume = useCallback(
+        (volume: number) => {
+            storeActions.setVolume(volume);
+        },
+        [storeActions],
+    );
+
+    const shuffle = useCallback(() => {
+        storeActions.shuffle();
+    }, [storeActions]);
+
+    const shuffleAll = useCallback(() => {
+        storeActions.shuffleAll();
+    }, [storeActions]);
+
+    const shuffleSelected = useCallback(
+        (items: QueueSong[]) => {
+            storeActions.shuffleSelected(items);
+        },
+        [storeActions],
+    );
 
     const contextValue: PlayerContext = useMemo(
         () => ({
@@ -120,8 +205,8 @@ export const PlayerProvider = ({ children }: { children: React.ReactNode }) => {
             mediaPlay,
             mediaPrevious,
             mediaSeekToTimestamp,
-            mediaStepBackward,
-            mediaStepForward,
+            mediaSkipBackward,
+            mediaSkipForward,
             mediaToggleMute,
             mediaTogglePlayPause,
             moveSelectedTo,
@@ -145,8 +230,8 @@ export const PlayerProvider = ({ children }: { children: React.ReactNode }) => {
             mediaPlay,
             mediaPrevious,
             mediaSeekToTimestamp,
-            mediaStepBackward,
-            mediaStepForward,
+            mediaSkipBackward,
+            mediaSkipForward,
             mediaToggleMute,
             mediaTogglePlayPause,
             moveSelectedTo,