Summary

The useWalletConnectorEvent hook is used for handling events from a WalletConnector or an array of WalletConnectors. This hook allows you to specify an event to listen to and a handler function that will be called whenever the event is emitted. The handler will receive the event arguments followed by the instance of the WalletConnector that emitted the event.

ParameterTypeDescription
eventEmittersWalletConnector or WalletConnector[]The WalletConnector instance(s) to attach the event listener to. If an array is provided, the event listener is attached to all provided connectors.
eventNamestringThe name of the event to listen for.
handlerfunctionThe callback function to execute when the event is emitted. The arguments to the callback are the arguments emitted with the event, followed by the WalletConnector instance that emitted the event.

We currently support the following events:

  • accountChange
  • chainChange
  • disconnect

Example

Listen to primary wallet connector account changed

import {
  useWalletConnectorEvent,
  useDynamicContext
} from '@dynamic-labs/sdk-react-core'

const App = () => {
  const { primaryWallet } = useDynamicContext()

  useWalletConnectorEvent(
    primaryWallet?.connector,
    'accountChange',
    ({ accounts }, connector) => {
      console.group('accountChange');
      console.log('accounts', accounts);
      console.log('connector that emitted', connector);
      console.groupEnd();
    },
  );

  return null;
}

Listen to all wallets connectors for the disconnect event

import {
  useWalletConnectorEvent,
  useUserWallets
} from '@dynamic-labs/sdk-react-core'

const App = () => {
  const wallets = useUserWallets();

  const walletsConnectors = wallets.map(({ connector }) => connector);

  useWalletConnectorEvent(
    walletsConnectors,
    'disconnect',
    (connector) => {
      console.log(`Connector ${connector} disconnected`);
    }
  );

  return null;
}