Gate a route
Wrap any React component with EntrosGate to require a verified human Trust Score before children render.
EntrosGate is a route guard. It reads the connected wallet's Anchor PDA, compares the Trust Score against a threshold, and renders children only if the threshold is met.
The full surface
<EntrosGate
minTrustScore={250}
fallback={<NotVerifiedView />}
loadingFallback={<Spinner />}
verifyHref="/verify"
>
<ProtectedContent />
</EntrosGate>| Prop | Type | Required | Default | Purpose |
|---|---|---|---|---|
minTrustScore | number | yes | — | Minimum on-chain Trust Score to allow children to render |
children | ReactNode | yes | — | What to render when the wallet passes the gate |
fallback | ReactNode | no | built-in prompt | What to render when the wallet fails the gate |
loadingFallback | ReactNode | no | minimal spinner | What to render while the PDA is being fetched |
verifyHref | string | no | /verify | Where the built-in fallback links unverified users |
Three render states
The gate has three branches:
- No wallet connected—built-in fallback prompts the user to connect.
- Wallet connected, Anchor below threshold or absent—built-in fallback prompts re-verification, links to
verifyHref. - Wallet connected, Anchor at or above threshold—children render.
Custom fallback
When the default fallback doesn't fit your design, supply your own:
<EntrosGate
minTrustScore={500}
fallback={
<div className="rounded-xl border p-6">
<h2>Verification required</h2>
<p>This action requires a Trust Score of 500. Verify or re-verify to proceed.</p>
<a href="/verify" className="btn">Verify</a>
</div>
}
>
<Airdrop />
</EntrosGate>The fallback prop is rendered for both "below threshold" and "no Anchor on file" cases. If you want to distinguish those two states, use verifyEntrosAttestation from the SDK directly and branch inside your own component.
Self-host the verify route
verifyHref defaults to /verify, which assumes you've either:
- Linked to
entros.io/verifyfrom your own app, or - Built your own verification surface using the Pulse SDK at the route
/verify
If you're hosting the verification flow yourself, set verifyHref to your route. If you're routing users to the canonical site, use verifyHref="https://entros.io/verify".
For an in-app verification trigger that doesn't redirect, drop in <EntrosVerify /> — the popup-pattern component from @entros/verify. The user verifies in a popup window without leaving your page; on success the gate's read of the on-chain Anchor will pass on next render.
Server-side gating
EntrosGate is a client component. For server-rendered or edge-function gating, read the Anchor PDA directly—see the no-SDK quickstart. The pattern composes cleanly: server-render the public shell, gate sensitive subtrees with EntrosGate on the client.
Where to look next
- Show a Trust Score badge without gating
- Read on-chain directly for non-React contexts
- SAS attestation for cross-program composability