useFlowstack

The hook built apps use to read auth state — isAuthenticated, isInitialized, and credentials — instead of useAuth().

import { useFlowstack } from 'flowstack-sdk'

For built apps, read auth state from useFlowstack() instead of useAuth(). It exposes whether the provider has initialized, whether a session is active, and the active credentials (e.g. credentials?.email). It also exposes setCredentials — call setCredentials(null) to sign out.

Built apps authenticate via BrokeredLoginButton; useFlowstack() is how they observe the resulting auth state and identity.

Signature

const { isAuthenticated, isInitialized, credentials, setCredentials } = useFlowstack()

Returns

Examples

function AuthGate() {
  const { isAuthenticated, isInitialized } = useFlowstack();
  if (!isInitialized) return <div>Loading...</div>;
  // BrokeredLoginButton opens Casino's auth popup — Privy runs there, not here
  return isAuthenticated ? <MainApp /> : (
    <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', minHeight: '100dvh' }}>
      <BrokeredLoginButton label="Continue with Flowstack" />
    </div>
  );
}

function Header() {
  const { credentials, setCredentials } = useFlowstack();
  return (
    <header>
      <span>{credentials?.email}</span>
      <button onClick={() => setCredentials(null)}>Sign out</button>
    </header>
  );
}

See also

BrokeredLoginButton · AuthGuard · useAuth · FlowstackProvider

Source: README.md#useauth · Also available in llms-full.txt and registry.json.