NeedsAgent

component

Gate a feature behind a minimum AGENT balance, showing a deep-linked "Get AGENT →" CTA when the user has insufficient funds.

import { NeedsAgent } from 'flowstack-sdk/wallet'

Gates a feature behind a minimum AGENT balance. If the user has insufficient AGENT, it shows a "Get AGENT →" CTA that deep-links to the OIF /buy page. If sufficient, it renders children and calls onProceed when clicked.

Deep-link flow:

1. Built app renders <NeedsAgent amountNeeded={5} returnUrl={window.location.href}> 2. User has 0 AGENT → "Get AGENT →" button appears 3. Click opens https://openinferencefoundation.org/buy?returnTo=<encoded-url>&need=5 4. User buys AGENT with a credit card on OIF (no wallet setup required — Privy creates it) 5. OIF redirects back to returnUrl — user now has AGENT and can proceed

Signature

<NeedsAgent amountNeeded={2} onProceed={fn} returnUrl={url}>{children}</NeedsAgent>

Parameters

Param	Type	Notes	Description
`amountNeeded`	`number`	required	Minimum AGENT balance required to proceed.
`onProceed`	`() => void`	—	Called when the user clicks through with sufficient balance.
`returnUrl`	`string`	—	URL the OIF /buy flow redirects back to after purchase, e.g. `window.location.href`.
`children`	`ReactNode`	—	Content rendered when the user has sufficient AGENT.

Examples

Gate a feature behind 2 AGENT

<NeedsAgent
  amountNeeded={2}
  onProceed={generateAlbumArt}
  returnUrl={window.location.href}
>
  <p>Generate a new design — costs 2 AGENT</p>
</NeedsAgent>

NeedsAgent

Signature

Parameters

Examples

See also