React Hooks

useSophonContext

Sophon's React Context which is set via SophonContextProvider that have all the information about the current user and the SDK state.

Properties

accountSwitchState

This enum type specifies the current state of switching or linking wallets in a multi-wallet enabled environment. This can be idle, linking_new_wallet, switching_primary, primary_not_connected

authMode

This enum type specifies whether the SDK's users will need to sign to authenticate and prove ownership of their account, or just connect is enough. This can be connect-only or connect-and-sign

awaitingSignatureState

This enum type specifies the current state while waiting for a signature of a new wallet to link in a multi-wallet enabled environment. This can be idle, linking_new_wallet, transferring_wallet

handleLogOut

A helper-method to log-out the currently authenticated user account.

isVerificationInProgress

Whether any verifications are in progress for the current user (ex. connect, sign and email login verifications).

loadingNetwork

Returns true when the SDK is looking for the network of the primary wallet's wallet connector.

network

This represents the current network selected for the primary wallet

networkConfigurations

This contains the current network configurations for various EVM and Solana chains. These information includes chain ID, RPC URLs, and other important information.

primaryWallet

An instance of a Wallet that represents the most recent connected Wallet.

"use client";

import { useSophonContext } from "@sophon-labs/account-react";

export default async function ExampleHookUsage() {
  const { primaryWallet } = useSophonContext();

  return (
    <div>
      Wallet: {primaryWallet?.address}, Balance:{" "}
      {await primaryWallet?.getBalance()}
    </div>
  );
}

sdkHasLoaded

Whether the sdk's data is done loading — useful for avoiding stale data flashes by not rendering until the sdk is done loading.

"use client";

import { useSophonContext } from "@sophon-labs/account-react";

export default async function ExampleHookUsage() {
  const { sdkHasLoaded } = useSophonContext();

  if (!sdkHasLoaded) {
    return <div>Loading...</div>;
  }

  return <div>SDK has loaded</div>;
}

setAuthMode

Sets the current authentication mode of branded wallets (“connect-and-sign” or “connect-only”). Note: does nothing if the user is already logged in. You might also want to toggle the initialAuthenticationMode prop.

setShowAuthFlow

It controls whether or not to display the DynamicAuthFlow SDK component.

showAuthFlow

The value set by setShowAuthFlow, it controls whether or not to display the DynamicAuthFlow SDK component.

user

The user object of the currently authenticated user.

userWithMissingInfo

Present if the user is authenticated but hasn't finished onboarding (i.e. mandatory info capture/MFA), undefined if the user hasn't started the login/signup process or has already fully completed it.