🪛Integrating the Widget

WalletChat widget integration steps for react-wallet-chat NPM package

Custom Integration Steps

  1. Install NPM package "react-wallet-chat"

yarn add react-wallet-chat if using yarn instead of npm

  1. On any page you wish to have the chat widget active, import:

import {WalletChatProvider, WalletChatWidget} from 'react-wallet-chat'

And include in your page source:

<WalletChatWidget />

  1. Add the WalletChat Widget with connectedWallet parameter to include the address, activeConnector and chainId. PS: in this case the activeConnector is from the WAGMI package, and could be substituted as needed to get the wallet name/type.

    <FunctionalComponent {...pageProps} />

          address && activeConnector && chainId
            ? {
            walletName: activeConnector.name,
            account: address,
            chainId: chain.id,
        : undefined

Last updated