import { Navigate, Outlet, useLocation } from 'react-router-dom';

import { useAuth } from './auth-context';

/** Wraps private routes: anonymous visitors land on /login and return after. */
export function RequireAuth(): React.JSX.Element {
  const { user, isLoading } = useAuth();
  const location = useLocation();
  if (isLoading) return <></>;
  if (!user) {
    const next = encodeURIComponent(location.pathname + location.search);
    return <Navigate to={`/login?next=${next}`} replace />;
  }
  return <Outlet />;
}

/** Wraps auth pages: signed-in users have no business on /login etc. */
export function RequireAnonymous(): React.JSX.Element {
  const { user, isLoading } = useAuth();
  if (isLoading) return <></>;
  if (user) return <Navigate to="/" replace />;
  return <Outlet />;
}

export function RequireSiteAdmin(): React.JSX.Element {
  const { user, isLoading } = useAuth();
  if (isLoading) return <></>;
  if (!user?.isSiteAdmin) return <Navigate to="/" replace />;
  return <Outlet />;
}