- Add AuthContext to manage user authentication state and token storage. - Create hooks for login, registration, and logout functionalities. - Implement dashboard layout with authentication check and loading state. - Enhance dashboard page with channel management features including create, edit, and delete channels. - Integrate API calls for channel operations and current broadcast retrieval. - Add stream URL resolution via server-side API route to handle redirects. - Update TV page to utilize new hooks for channel and broadcast management. - Refactor components for better organization and user experience. - Update application metadata for improved branding.
53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
createContext,
|
|
useContext,
|
|
useState,
|
|
useEffect,
|
|
type ReactNode,
|
|
} from "react";
|
|
|
|
const TOKEN_KEY = "k-tv-token";
|
|
|
|
interface AuthContextValue {
|
|
token: string | null;
|
|
/** True once the initial localStorage read has completed */
|
|
isLoaded: boolean;
|
|
setToken: (token: string | null) => void;
|
|
}
|
|
|
|
const AuthContext = createContext<AuthContextValue | null>(null);
|
|
|
|
export function AuthProvider({ children }: { children: ReactNode }) {
|
|
const [token, setTokenState] = useState<string | null>(null);
|
|
const [isLoaded, setIsLoaded] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const stored = localStorage.getItem(TOKEN_KEY);
|
|
if (stored) setTokenState(stored);
|
|
setIsLoaded(true);
|
|
}, []);
|
|
|
|
const setToken = (t: string | null) => {
|
|
setTokenState(t);
|
|
if (t) {
|
|
localStorage.setItem(TOKEN_KEY, t);
|
|
} else {
|
|
localStorage.removeItem(TOKEN_KEY);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<AuthContext.Provider value={{ token, isLoaded, setToken }}>
|
|
{children}
|
|
</AuthContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useAuthContext() {
|
|
const ctx = useContext(AuthContext);
|
|
if (!ctx) throw new Error("useAuthContext must be used within AuthProvider");
|
|
return ctx;
|
|
}
|