Skip to main content

1. Wrap your app

import { SunbreakProvider } from "@tdfc/sunbreak-react";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <SunbreakProvider
      clientId={process.env.NEXT_PUBLIC_SUNBREAK_CLIENT_ID!}
      base={process.env.NEXT_PUBLIC_SUNBREAK_BASE!}
      wallet={connectedWalletAddress || undefined}
      // Option A: use a provider adapter (Privy, Dynamic, custom)
      providerAdapter={yourProviderAdapter}
      // Option B: or pass a proof object directly via `proof` prop
      // proof={currentProof}
    >
      {children}
    </SunbreakProvider>
  );
}
Notes
  • wallet should be the currently connected wallet address (or undefined when logged out).
  • You can prove wallet ownership either via:
    • providerAdapter (recommended for Privy / Dynamic / custom JWT providers), or
    • a proof prop you build yourself (SIWE, EIP-191, Ed25519, or provider_jwt).
  • Once the user is logged in and a proof is available, the SDK will handle /auth/register, /auth/refresh, and /api/session under the hood.
Learn more about configuring a provider here.

2. Login + gate example (pseudocode)

This is an illustrative high‑level flow. The key idea:
Once the user logs in and the SDK has a proof + wallet, you do NOT need to call session() yourself. Sunbreak automatically performs registration + refresh + session evaluation in the background. The value allowed will simply populate itself.
import { useState } from "react";
import { useSunbreak } from "@tdfc/sunbreak-react";

export function LoginAndAccessGate() {
  const { allowed, error } = useSunbreak();
  const [loggedIn, setLoggedIn] = useState(false);

  async function handleLogin() {
    // 1) Your own login + wallet connect
    //    - e.g. Dynamic, Privy, Wagmi + SIWE, custom JWT, etc.
    await connectWalletAndAppAuth();

    // 2) Once logged in, do NOTHING Sunbreak-specific.
    //    The SDK will:
    //    - detect the wallet + proof
    //    - auto-run /auth/register (if needed)
    //    - auto-run /auth/refresh
    //    - auto-run /api/session
    //    - populate allowed when ready

    setLoggedIn(true);
  }

  if (!loggedIn) {
    return <button onClick={handleLogin}>Sign in</button>;
  }

  if (error) {
    return <p>Something went wrong: {error}</p>;
  }

  // If blocked
  if (allowed === false) {
    return <p>Access denied</p>;
  }

  // If granted
  if (allowed === true) {
    return <p>Access granted. You may continue.</p>;
  }

  // While Sunbreak is still evaluating access
  return <p>Checking access…</p>;
}