// 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}</>;
}