useWalletServicesPlugin

Hook to access the Wallet Services plugin context. It returns the plugin instance and its connection state. For common actions, prefer the dedicated hooks: useWalletUI, useCheckout, useSwap, useFunding, useReceive, and useWalletConnectScanner.

info

Please note that this hook doesn't work for external wallet logins. It only works for social login embedded wallets.

Import

import { useWalletServicesPlugin } from '@web3auth/modal/react'

Usage

import { useWalletServicesPlugin } from '@web3auth/modal/react'

function WalletServicesExample() {
  const { plugin, ready, connecting } = useWalletServicesPlugin()

  return (
    <div>
      <button onClick={() => plugin?.showWalletConnectScanner()} disabled={!ready}>
        Show WalletConnect Scanner
      </button>
      <button onClick={() => plugin?.showCheckout()} disabled={!ready}>
        Show Checkout
      </button>
      <button onClick={() => plugin?.showWalletUi()} disabled={!ready}>
        Show Wallet UI
      </button>
      {connecting && <div>Connecting Wallet Services...</div>}
    </div>
  )
}

Return type

import { type IWalletServicesContext } from '@web3auth/modal/react'

ready

boolean

Whether the Wallet Services plugin is connected and ready to use.

connecting

boolean

Whether the Wallet Services plugin is currently connecting.

plugin

WalletServicesPluginType | null

The Wallet Services plugin instance, or null if it's not available. The plugin exposes showWalletUi, showCheckout, showSwap, showFunding, showReceive, and showWalletConnectScanner. Each method throws if the plugin isn't connected.