AuthGuard

Wrapper that renders children only when authenticated — showing a login fallback, or transparently issuing a guest session for opted-in built apps.

import { AuthGuard } from 'flowstack-sdk'

AuthGuard gates its children behind authentication. When the user is not signed in it renders the fallback — typically a login screen containing BrokeredLoginButton, which it can show automatically.

Guest chat (built apps). When the app has an appScope and the site enabled guest chat server-side (app_config.allowGuestChat), an unauthenticated visitor is transparently issued a short-lived guest session (POST /auth/guest) instead of seeing the login gate — removing the "sign up first" friction. Control is the per-site backend flag: if the site hasn't opted in, /auth/guest returns 403 and AuthGuard falls back to the normal login UI. It's a no-op unless the app is built with an appScope (the Casino dashboard has none, so it always requires real login). Opt out per-guard with allowGuest={false}.

Never use `redirectTo`. Use fallback={<BrokeredLoginButton />} instead — redirectTo="/" kicks users out before they can sign in.

Signature

<AuthGuard fallback={<LoginScreen />}>{children}</AuthGuard>

Parameters

Examples

import { AuthGuard } from 'flowstack-sdk';

export default function App() {
  return (
    <AuthGuard fallback={<LoginScreen />}>
      <Console />
    </AuthGuard>
  );
}

// LoginScreen shows BrokeredLoginButton
function LoginScreen() {
  return (
    <div style={{ display: 'flex', justifyContent: 'center', padding: '4rem' }}>
      <BrokeredLoginButton />
    </div>
  );
}

See also

BrokeredLoginButton · useFlowstack · useAuthGuard · useAuth

Source: README.md#authguard--never-use-redirectto · Also available in llms-full.txt and registry.json.