import { Navigate, Outlet } from "react-router-dom"
import { useAuth } from "../auth/AuthContext"

export default function ProtectedRoute() {
  const { isAuthenticated, loading } = useAuth()

  if (loading) {
    return (
      <div style={{
        width: "100%", height: "100vh", display: "flex",
        alignItems: "center", justifyContent: "center", color: "#64748b",
      }}>
        Loading…
      </div>
    )
  }

  return isAuthenticated ? <Outlet /> : <Navigate to="/login" replace />
}