Live video on the AT Protocol
1import {
2 setSidebarHidden,
3 setSidebarUnhidden,
4} from "features/base/sidebarSlice";
5import {
6 createContext,
7 ReactNode,
8 useContext,
9 useEffect,
10 useState,
11} from "react";
12import { useDispatch } from "react-redux";
13
14interface FullscreenContextValue {
15 fullscreen: boolean;
16 setFullscreen: (value: boolean) => void;
17}
18
19const FullscreenContext = createContext<FullscreenContextValue | undefined>(
20 undefined,
21);
22
23export const FullscreenProvider = ({ children }: { children: ReactNode }) => {
24 const [fullscreen, setFullscreen] = useState(false);
25
26 // for hiding sidebar
27 const dispatch = useDispatch();
28
29 useEffect(() => {
30 if (fullscreen) {
31 dispatch(setSidebarHidden());
32 } else {
33 dispatch(setSidebarUnhidden());
34 }
35 }, [fullscreen]);
36
37 return (
38 <FullscreenContext.Provider value={{ fullscreen, setFullscreen }}>
39 {children}
40 </FullscreenContext.Provider>
41 );
42};
43
44export function useFullscreen() {
45 const ctx = useContext(FullscreenContext);
46 if (!ctx) {
47 throw new Error("useFullscreen must be used within a FullscreenProvider");
48 }
49 return ctx;
50}