The Structural Diagram to Know How WalletConnect Works
connector event subscription
function on(event : string , callback : (error : Error | null , payload : any | null ) => void ) : void
event
: connect, disconnect, session_request, session_update, call_request, wc_sessionRequest, wc_sessionUpdate
create session (session_request)
async function createSession() : Promise<void>;
kill session (disconnect)
function killSession() : void
example code
import WalletConnect from "@dcentwallet/walletconnect-client";
import QRcodeModal from "@dcentwallet/qrcode-modal"
// if connect func exec , modal must be opened
const connect = async () => {
const qrcodeModalOptions = {};
const connector = new WalletConnect({ qrcodeModal: QRCodeModal, qrcodeModalOptions });
// create session
if(!connector.connected){
await connector.createSession({chainId : '' }) // in order to open modal, createSession is required
}
// subscribe connector event
subscribeToEvents();
}
// subscribe event function
// callback : (err, payload) => void
const subscribeToEvent = () => {
connector.on('session_update', async callback )
connector.on('connect', callback )
connector.on('disconnect', callback ) // kill session
}
const killSession = async () => {
if(connector) {
connector.killSession();
}
// attach reset your app state code
}type
sendTransaction, signTransaction
async function sendTransaction({
from : string, // required
to : string, // required
gas : string, // required
gasPrice : string, //required
value : string, // required
data : string, // required
nonce : string, // required
}) : Promise<string> //required
async function signTransaction({
from: string, // required
to: string, // required
gas: string, // required
gasPrice: string, // required
value: string, // required
data: string, // required
nonce: string, // required
}): Promise<string>;
const tx = { from, to, nonce, gasPrice, gasLimit, value, data };
const sendTransactionResult = await connector.sendTransaction(tx) // sendTransactionResult returns transaction hash
const signTransactionResult = await connector.signTransaction(tx) // signTransactionResult returns signed transaction
// result returns transaction hash
Other connector methods : signMessage
, signPersonalMessage
, signTypedData
For more information, refer to the following:
Get D’CENT Wallet Address
connector.on('connect', (err, payload) => {
const { chainId, accounts } = payload.params[0];
const address = accounts[0] // D'CENT Wallet Address
}
Request D’CENT to create accounts
const qrcodeModalOptions = {}; // see below more details
const connector = new WalletConnect({ qrcodeModal: QRCodeModal, qrcodeModalOptions})
qrcodeModalOptions
qrcodeModalOptions
interface
example
const qrcodeModalOptions = {
serviceName: "insert your dapp name",
accounts: [
{
contractAddress: '',
networkType: 'XRP'
},
{
contractAddress: '0x2791bca1f2de4661ed88a30c99a7a9449aa84174',
networkType: 'POLYGON',
name: 'USD Coin',
symbol: 'USDC',
},
{
contractAddress: '0xc2132d05d31c914a87c6611c10748aeb04b58e8f',
networkType: 'POLYGON',
name: 'Tether',
symbol: 'USDT'
}
]
};
const connector = new WalletConnect({ qrcodeModal : QRcodeModal, qrcodeModalOptions });
NetworkType List
Network types where you can create accounts. (Main Account & Token Account Support)