Skip to main content
The Embedded Wallet Kit makes authentication simple. You can call specific login and signup functions to create your own UI components and authentication flow.

Authentication State

To check if a user is authenticated, you can use the authState variable from the useTurnkey hook.
import { useTurnkey, AuthState } from "@turnkey/react-wallet-kit";

function AuthStatus() {
  const { authState, user, handleLogin } = useTurnkey();

  return (
    <div>
      {authState === AuthState.Authenticated ? (
        <p>Welcome back, {user?.userName}!</p>
      ) : (
        <button onClick={handleLogin}>Log in</button>
      )}
    </div>
  );
}
You can also set up an onAuthenticationSuccess callback passed in through the TurnkeyProvider to handle post-authentication logic, such as redirecting.
<TurnkeyProvider
  config={turnkeyConfig}
  callbacks={{
    onAuthenticationSuccess: ({ session }) => {
      console.log("User authenticated:", session);
      router.push("/dashboard");
    },
  }}
>
  {children}
</TurnkeyProvider>

Customize sub-organization creation

Need to configure default user names, passkey names, wallet creations or anything sub-org related? You can learn more about customizing the sub-orgs you create in the Sub-Organization Customization section. Follow the guides below to learn how to set up email and SMS authentication, passkey authentication, and social logins in your React Native app.
I