source: frontend/src/context/playerContext.tsx@ 0808ef2

main
Last change on this file since 0808ef2 was 9c1dcc7, checked in by Filip Gavrilovski <filipgavrilovski28@…>, 5 months ago

add experimental video miniplayer

  • Property mode set to 100644
File size: 1.4 KB
Line 
1import {
2 createContext,
3 useCallback,
4 useContext,
5 useState,
6 type ReactNode,
7} from "react";
8
9export interface PlayerSong {
10 id: number;
11 title: string;
12 artist: string;
13 cover?: string | null;
14 embedUrl: string;
15}
16
17interface PlayerContextType {
18 currentSong: PlayerSong | null;
19 isMinimized: boolean;
20 play: (song: PlayerSong) => void;
21 stop: () => void;
22 toggleMinimize: () => void;
23 isPlaying: boolean;
24}
25
26const PlayerContext = createContext<PlayerContextType>({
27 currentSong: null,
28 isMinimized: false,
29 isPlaying: false,
30 play: () => {},
31 stop: () => {},
32 toggleMinimize: () => {},
33});
34
35export const PlayerProvider = ({ children }: { children: ReactNode }) => {
36 const [currentSong, setCurrentSong] = useState<PlayerSong | null>(null);
37 const [isMinimized, setIsMinimized] = useState(true);
38 const [isPlaying, setIsPlaying] = useState(false);
39
40 const play = useCallback((song: PlayerSong) => {
41 setCurrentSong(song);
42 setIsPlaying(true);
43 }, []);
44
45 const stop = useCallback(() => {
46 setIsPlaying(false);
47 setCurrentSong(null);
48 }, []);
49
50 const toggleMinimize = useCallback(() => {
51 setIsMinimized((prev) => !prev);
52 }, []);
53
54 return (
55 <PlayerContext.Provider
56 value={{
57 currentSong,
58 isMinimized,
59 isPlaying,
60 play,
61 stop,
62 toggleMinimize,
63 }}
64 >
65 {children}
66 </PlayerContext.Provider>
67 );
68};
69
70export const usePlayer = () => useContext(PlayerContext);
Note: See TracBrowser for help on using the repository browser.