working auth

components/protectedPage.tsx

@@ -0,0 +1,34 @@
+// components/ProtectedPage.tsx
+"use client";
+
+import { ReactNode, useEffect } from "react";
+import { usePathname, useRouter } from "next/navigation";
+import { useAuth } from "@/context/AuthContext";
+
+export function ProtectedPage({ children }: { children: ReactNode }) {
+  const { user, loading } = useAuth();
+  const router = useRouter();
+  const pathname = usePathname();
+
+  useEffect(() => {
+    if (!loading && !user) {
+      const next = encodeURIComponent(pathname || "/");
+      router.replace(`/login?next=${next}`);
+    }
+  }, [loading, user, router, pathname]);
+
+  if (loading) {
+    return (
+      <main className="min-h-screen bg-black text-zinc-50 flex items-center justify-center">
+        <p className="text-sm text-zinc-500">Checking your session…</p>
+      </main>
+    );
+  }
+
+  if (!user) {
+    // We just redirected; render nothing
+    return null;
+  }
+
+  return <>{children}</>;
+}