React | ThunderID

API reference

Every export is fully typed. The signatures and props below come from the package's own reference documentation, so what is listed here is what the installed version ships.

Hooks

Contexts

Components

hookuseThunderID()

The

useThunderID hook provides access to the ThunderID authentication context in React applications. It allows you to retrieve authentication state, user information, and other context values managed by the ThunderIDProvider.

Returns

isSignedIn

boolean

Whether the user is currently signed in

user

User \

The authenticated user object, or `null` if not signed in

signIn

() => Promise

Initiates the sign-in flow

signOut

() => Promise

Initiates the sign-out flow

loading

boolean

Indicates if an authentication operation is in progress

error

Error \

The last error encountered during authentication, if any

Example

import { useThunderID } from '@thunderid/react'

function MyComponent() {
  const { isSignedIn, user, signIn, signOut } = useThunderID()

  return (
    <div>
      {isSignedIn ? (
        <>
          <p>Welcome, {user?.displayName}!</p>
          <button onClick={() => signOut()}>Sign Out</button>
        </>
      ) : (
        <button onClick={() => signIn()}>Sign In</button>
      )}
    </div>
  )
}

export default MyComponent

Get started

Provider, session, and a protected route, start to finish.

Connect your application

~5 min

Getting started / Connect your application / React

Open in docs

The quickstart is maintained alongside the rest of the getting-started guides so it stays in step with the platform. This page covers the package itself: its API surface, guides, and compatibility.

Guides

Task-focused walkthroughs maintained alongside the SDK.

Protecting routes

Guard a route tree so unauthenticated visitors are sent through sign-in, covering React Router, TanStack Router, and a hand-rolled guard.

19 min read

Accessing protected APIs

Attach an access token to requests against your own resource server.

8 min read