WalletConnect is an open source protocol for connecting DAPPs to mobile wallets with QR code scanning or deep linking.
There are two common ways to integrate:
1. Web3Modal
Web3Modal is an easy-to-use library to help developers add support for multiple providers (including WalletConnect) in their apps with a simple customizable configuration.
Sample code for configuring WalletConnect with Bitrock Blockchain
import Web3 from "web3";
import WalletConnectProvider from "@walletconnect/web3-provider";
import Web3Modal from "web3modal";
// set chain id and rpc mapping in provider options
const providerOptions = {
walletconnect: {
package: WalletConnectProvider,
options: {
rpc: {
7171: "https://connect.bit-rock.io",
},
chainId: 7171,
},
},
};
const web3Modal = new Web3Modal({
network: "mainnet", // optional
cacheProvider: true, // optional
providerOptions, // required
});
const provider = await web3Modal.connect();
await web3Modal.toggleModal();
// regular web3 provider methods
const newWeb3 = new Web3(provider);
const accounts = await newWeb3.eth.getAccounts();
console.log(accounts);
2. Standalone Client
Bitrock Wallet extends WalletConnect 1.x with aditional JSON-RPC methods to support multi-chain dApps. Currently, you can get all accounts and sign transactions for Bitrock Blockchain implements signJSON method in wallet core.
Before you can sign transactions, you have to initiate a connection to a WalletConnect bridge server, and handle all possible states:
import WalletConnect from "@walletconnect/client";
import QRCodeModal from "@walletconnect/qrcode-modal";
// Create a connector
const connector = new WalletConnect({
bridge: "https://bridge.walletconnect.org", // Required
qrcodeModal: QRCodeModal,
});
// Check if connection is already established
if (!connector.connected) {
// create new session
connector.createSession();
}
// Subscribe to connection events
connector.on("connect", (error, payload) => {
if (error) {
throw error;
}
// Get provided accounts and chainId
const { accounts, chainId } = payload.params[0];
});
connector.on("session_update", (error, payload) => {
if (error) {
throw error;
}
// Get updated accounts and chainId
const { accounts, chainId } = payload.params[0];
});
connector.on("disconnect", (error, payload) => {
if (error) {
throw error;
}
// Delete connector
});
code snippet above is copied from https://docs.walletconnect.org/quick-start/dapps/client#initiate-connection, please check out the original link for standard methods.
Get chain accounts from Bitrock Wallet
Once you have walletconnect client set up, you will be able to get user's accounts:
const request = connector._formatRequest({
method: "get_accounts",
});
connector
._sendCallRequest(request)
.then((result) => {
// Returns the accounts
console.log(result);
})
.catch((error) => {
// Error returned when rejected
console.error(error);
});
The result is an array with following structure:
[
{
network: number,
address: string,
},
];
Need more details about Wallet Connect set up for your dApp to connect to Bitrock Wallet smoothly find it HERE