import { useEffect, type ReactNode } from "react";
import { useNavigate } from "react-router";
import { api } from "~/api/client";

interface ProtectedRouteProps {
  children: ReactNode;
}

export function ProtectedRoute({ children }: ProtectedRouteProps) {
  const navigate = useNavigate();

  useEffect(() => {
    if (!api.isAuthenticated()) {
      navigate("/login");
    }
  }, [navigate]);

  if (!api.isAuthenticated()) {
    return null;
  }

  return <>{children}</>;
}