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/(auth)/register/page.tsx

@@ -0,0 +1,74 @@
+"use client";
+
+import Link from "next/link";
+import { useState } from "react";
+import { useRegister } from "@/hooks/use-auth";
+
+export default function RegisterPage() {
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const { mutate: register, isPending, error } = useRegister();
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    register({ email, password });
+  };
+
+  return (
+    <div className="w-full max-w-sm space-y-6">
+      <div className="space-y-1 text-center">
+        <h1 className="text-xl font-semibold text-zinc-100">Create account</h1>
+        <p className="text-sm text-zinc-500">start building your channels</p>
+      </div>
+
+      <form onSubmit={handleSubmit} className="space-y-4">
+        <div className="space-y-1.5">
+          <label className="block text-xs font-medium text-zinc-400">
+            Email
+          </label>
+          <input
+            type="email"
+            required
+            autoComplete="email"
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+            placeholder="you@example.com"
+            className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm text-zinc-100 placeholder:text-zinc-600 focus:border-zinc-500 focus:outline-none"
+          />
+        </div>
+
+        <div className="space-y-1.5">
+          <label className="block text-xs font-medium text-zinc-400">
+            Password
+          </label>
+          <input
+            type="password"
+            required
+            autoComplete="new-password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            placeholder="••••••••"
+            className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm text-zinc-100 placeholder:text-zinc-600 focus:border-zinc-500 focus:outline-none"
+          />
+        </div>
+
+        {error && <p className="text-xs text-red-400">{error.message}</p>}
+
+        <button
+          type="submit"
+          disabled={isPending}
+          className="w-full rounded-md bg-white px-3 py-2 text-sm font-medium text-zinc-900 transition-colors hover:bg-zinc-200 disabled:cursor-not-allowed disabled:opacity-50"
+        >
+          {isPending ? "Creating account…" : "Create account"}
+        </button>
+      </form>
+
+      <p className="text-center text-xs text-zinc-500">
+        Already have an account?{" "}
+        <Link href="/login" className="text-zinc-300 hover:text-white">
+          Sign in
+        </Link>
+      </p>
+    </div>
+  );
+}