- 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.
42 lines
1.0 KiB
TypeScript
42 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { useCurrentUser, useLogout } from "@/hooks/use-auth";
|
|
import { useAuthContext } from "@/context/auth-context";
|
|
|
|
export function NavAuth() {
|
|
const { token, isLoaded } = useAuthContext();
|
|
const { data: user } = useCurrentUser();
|
|
const { mutate: logout, isPending } = useLogout();
|
|
|
|
if (!isLoaded) return null;
|
|
|
|
if (!token) {
|
|
return (
|
|
<Link
|
|
href="/login"
|
|
className="rounded-md px-3 py-1.5 text-sm text-zinc-400 transition-colors hover:bg-zinc-800 hover:text-zinc-100"
|
|
>
|
|
Sign in
|
|
</Link>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-2">
|
|
{user && (
|
|
<span className="hidden text-xs text-zinc-500 sm:block">
|
|
{user.email}
|
|
</span>
|
|
)}
|
|
<button
|
|
onClick={() => logout()}
|
|
disabled={isPending}
|
|
className="rounded-md px-3 py-1.5 text-sm text-zinc-400 transition-colors hover:bg-zinc-800 hover:text-zinc-100 disabled:opacity-50"
|
|
>
|
|
Sign out
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|