feat: implement authentication context and hooks for user management

- 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.

k-tv-frontend/app/(main)/layout.tsx

@@ -1,10 +1,10 @@
 import Link from "next/link";
 import { type ReactNode } from "react";
+import { NavAuth } from "./components/nav-auth";
 
 const NAV_LINKS = [
   { href: "/tv", label: "TV" },
   { href: "/dashboard", label: "Dashboard" },
-  { href: "/docs", label: "Docs" },
 ];
 
 export default function MainLayout({ children }: { children: ReactNode }) {
@@ -12,21 +12,29 @@ export default function MainLayout({ children }: { children: ReactNode }) {
     <div className="flex min-h-screen flex-col bg-zinc-950 text-zinc-100">
       <header className="sticky top-0 z-50 border-b border-zinc-800 bg-zinc-950/80 backdrop-blur">
         <nav className="mx-auto flex h-14 max-w-7xl items-center justify-between px-6">
-          <Link href="/tv" className="text-sm font-semibold tracking-widest text-zinc-100 uppercase">
+          <Link
+            href="/tv"
+            className="text-sm font-semibold tracking-widest text-zinc-100 uppercase"
+          >
             K-TV
           </Link>
-          <ul className="flex items-center gap-1">
-            {NAV_LINKS.map(({ href, label }) => (
-              <li key={href}>
-                <Link
-                  href={href}
-                  className="rounded-md px-3 py-1.5 text-sm text-zinc-400 transition-colors hover:bg-zinc-800 hover:text-zinc-100"
-                >
-                  {label}
-                </Link>
-              </li>
-            ))}
-          </ul>
+          <div className="flex items-center gap-1">
+            <ul className="flex items-center gap-1">
+              {NAV_LINKS.map(({ href, label }) => (
+                <li key={href}>
+                  <Link
+                    href={href}
+                    className="rounded-md px-3 py-1.5 text-sm text-zinc-400 transition-colors hover:bg-zinc-800 hover:text-zinc-100"
+                  >
+                    {label}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+            <div className="ml-2 border-l border-zinc-800 pl-2">
+              <NavAuth />
+            </div>
+          </div>
         </nav>
       </header>
       <main className="flex flex-1 flex-col">{children}</main>