import { Navigate } from "react-router";
import { useAuthContext } from "@/providers/auth-context";
import { Box, CircularProgress } from "@mui/material";

interface GuestRouteProps {
  children: React.ReactNode;
}

export function GuestRoute({ children }: GuestRouteProps) {
  const { isAuthenticated, isLoading } = useAuthContext();

  if (isLoading) {
    return (
      <Box
        className="flex min-h-screen items-center justify-center"
        role="status"
        aria-label="Loading"
      >
        <CircularProgress />
      </Box>
    );
  }

  if (isAuthenticated) {
    return <Navigate to="/" replace />;
  }

  return children;
}