Skip to main content
For concepts, dashboard setup, and the two outcomes (block vs scope), see Access Control and Gates. This page covers React-specific usage including scopes and the Dynamic widget.

Using our UI

When gates are enabled, the Dynamic Widget automatically blocks or annotates the user’s session according to your rules. No additional code is needed to enforce access or add scopes in the JWT.

Using your UI

Use checks to read scopes and adjust your UI. See scope examples below.

Examples

Block site for users without specific amount of tokens. Gate setup:
  • User needs to have at least 1 SHIB to enter the site.
  • User is blocked in Dynamic Widget:
Add scope for users’ JWT when having specific NFT Gate setup:
  • User needs to have specific NFT to have admin scope
  • User has an admin scope added to the jwt
    json
    {
      ...
      "scope": "admin",
      ...
    }
    

Working with scopes

Use the useDynamicScopes hook to check user scopes and conditionally render content.
React
import { useDynamicScopes } from '@dynamic-labs/sdk-react-core';

export const GatedView = () => {
  const { hasScope } = useDynamicScopes();
  return hasScope('admin') ? <AdminPanel /> : <RequestAccess />;
};