Function AuthGate

apps/host-selfhost/web/routes/__root.tsx:109–158

({ children }: { children: ReactNode })

);

function AuthGate({ children }: { children: ReactNode }) {
  const auth = useAuth();
  // When unauthenticated, decide between first-run setup and sign-in by asking
  // the server whether the instance still has zero members.
  const [setupStatus, setSetupStatus] = useState<
    | { state: "checking"; attempt: number }
    | { state: "ready"; needsSetup: boolean }
    | { state: "error"; attempt: number }
  >({ state: "checking", attempt: 0 });
  useEffect(() => {
    if (auth.status !== "unauthenticated") return;
    let alive = true;
    setSetupStatus((current) => ({ state: "checking", attempt: current.attempt }));
    void fetchNeedsSetup().then(
      (value) => {
        if (alive) setSetupStatus({ state: "ready", needsSetup: value });
      },
      () => {
        if (alive) {
          setSetupStatus((current) => ({
            state: "error",
            attempt: current.state === "ready" ? 0 : current.attempt,
          }));
        }
      },
    );
    return () => {
      alive = false;
    };
  }, [auth.status, setupStatus.attempt]);

  if (auth.status === "loading") return <Loading />;
  if (auth.status === "unauthenticated") {
    if (setupStatus.state === "checking") return <Loading />;
    if (setupStatus.state === "error") {
      return (
        <SetupStatusErrorCard
          onRetry={() =>
            setSetupStatus((current) => ({
              state: "checking",
              attempt: current.state === "ready" ? 0 : current.attempt + 1,
            }))
          }
        />
      );
    }
    return setupStatus.needsSetup ? <SetupPage /> : <LoginPage />;
  }
  return <>{children}</>;
}

function AuthenticatedApp() {
  const auth = useAuth();