Function AuthGate

apps/cloud/src/routes/__root.tsx:192–334

()

}

function AuthGate() {
  const auth = useAuth();
  const location = useLocation();
  const navigate = useNavigate();
  const isOnboardingRoute = ONBOARDING_PATHS.has(location.pathname);
  const isPublicRoute = PUBLIC_PATHS.has(location.pathname);
  // The org the URL names (the `{-$orgSlug}` segment), if any. `/account/me`
  // is scoped to it, so `auth.organization` IS this org when the caller is a
  // member — and `null` when the URL names an org they can't access.
  const urlOrgSlug = (useParams({ strict: false }) as { orgSlug?: string }).orgSlug;
  // The same slug derived from the PATHNAME instead of the route params: the
  // params resolve asynchronously (a fresh load renders once with no orgSlug,
  // then again with it), and anything keyed on them remounts on that flap.
  // The pathname is synchronously correct on the very first render, and it is
  // exactly what the request header derives from (getActiveOrgSlug), so the
  // registry scope below can never disagree with the header scope.
  const firstSegment = location.pathname.split("/")[1] ?? "";
  const pathnameOrgSlug = isValidOrgSlug(firstSegment) ? firstSegment : null;

  // The SSR gate already bounced fresh org-less document requests to
  // /create-org; this catches the MID-SESSION transitions (org deleted,
  // membership revoked → /account/me now reports no org). Only for BARE paths:
  // an org-less result on a slugged URL is a wrong address (404 below), not a
  // reason to send the user to onboarding.
  const needsOrgRedirect =
    auth.status === "authenticated" &&
    auth.organization == null &&
    !urlOrgSlug &&
    !isOnboardingRoute &&
    !isPublicRoute;

  React.useEffect(() => {
    if (needsOrgRedirect) {
      void navigate({ to: "/create-org", replace: true });
    }
  }, [needsOrgRedirect, navigate]);

  // The signed-out safety net behind the SSR gate: if a session dies while
  // the SPA is already loaded (logout elsewhere, expiry), go to /login the
  // same way a fresh document request would — keeping where they were.
  const needsLoginRedirect = auth.status === "unauthenticated" && !isPublicRoute;
  React.useEffect(() => {
    if (needsLoginRedirect) {
      window.location.assign(loginPath(`${location.pathname}${location.searchStr}`));
    }
  }, [needsLoginRedirect, location.pathname, location.searchStr]);

  if (isPublicRoute) {
    return <Outlet />;
  }

  // Every state that isn't "authenticated with an org, on a page that wants
  // the shell" is a moment between redirects, or the one frame between mount
  // and the hint cookie seeding (SPA mode reads it in an effect). Neutral
  // blank — the one placeholder that's correct whatever happens next. The
  // app-shell skeleton this file used to render here is exactly the
  // wrong-UI flash the document gate + hint exist to prevent.
  if (auth.status === "loading" || auth.status === "unauthenticated") {