Skip to main content

Interoperability with WalletConnect in PnP Web Modal SDK

For enabling interoperability with Wallet Connect, ie. connecting your W3A generated wallet to other dApps which have Wallet Connect integration, you can use the showWalletConnectScanner() method. This method uses the Wallet Connect copy and paste flow, in which you can directly copy the QR Code details from a dApp like OpenSea and paste in it your shown modal.

info

This uses the Torus EVM Wallet UI Plugin. Please install and configure the package before using this function.

showWalletConnectScanner()​

Shows the Wallet Connect Scanner to connect with dApps having Wallet Connect login option.

Example​

import { TorusWalletConnectorPlugin } from "@web3auth/torus-wallet-connector-plugin";

const torusPlugin = new TorusWalletConnectorPlugin({
  torusWalletOpts: {},
  walletInitOptions: {
    whiteLabel: {
      theme: { isDark: true, colors: { primary: "#00a8ff" } },
      logoDark: "https://web3auth.io/images/w3a-L-Favicon-1.svg",
      logoLight: "https://web3auth.io/images/w3a-D-Favicon-1.svg",
    },
    useWalletConnect: true, // make sure this is enabled before using the showWalletConnectScanner function
    enableLogging: true,
  },
});

await web3auth.addPlugin(torusPlugin); // add plugin to web3auth instance

await torusPlugin.showWalletConnectScanner();