"use client"

import { useEffect, ReactNode } from "react"
import { useRouter } from "next/navigation"
import { useAuth } from "@/lib/auth-context"

interface ProtectedRouteProps {
  children: ReactNode | ((props: { user: any; logout: () => void }) => ReactNode);
}

export function ProtectedRoute({ children }: ProtectedRouteProps) {
  const { user, logout } = useAuth()
  const router = useRouter()

  useEffect(() => {
    if (!user) {
      router.push("/login")
    }
  }, [user, router])

  if (!user) {
    return null
  }

  return typeof children === "function" 
    ? children({ user, logout })
    : children
}