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

import { useMe } from "../api/queries";
import { AppShellSkeleton } from "@/components/ui/skeletons";

export function RequireAuth() {
  const { data: user, isLoading } = useMe();
  const location = useLocation();

  if (isLoading) return <AppShellSkeleton />;

  if (!user) {
    const from = encodeURIComponent(location.pathname + location.search);
    return <Navigate to={`/login?from=${from}`} replace />;
  }

  return <Outlet />;
}