🧑💻
How to Encode Calls in Purchase Mode
Brydge's contracts need to know the following:
- The contract address(es) that will be called and their ABI
- The function name(s) that will be called and their parameters
- Quantity of native tokens each contract will receive (if any)
The
calls
prop in BrydgeWidget
expects to receive an array structured like this:const calls = [
{ _to: 'contractAddress', _value: 'nativeTokenAmount', _calldata: 'generatedCalldata'},
];
For many use cases, the
_to
address will need to be that of the actively connected wallet, however, if you are integrating via the iFrame component you may not have you own provider with which to dynamically fetch a user's address. Don't worry! Instead, you can fill the _to
field with the special placeholder address: 0x0123456789abcdeffedcba9876543210deadbeef
and we will swap this out for the connected wallet on our end. Please note that no placeholder address other than the above can be used for this purpose.You'll find below an example of how to set up
calls
. If you prefer something more tangible, check out our Zora Marketplace integration example.const contract1 = {
address: '0x123...',
functionName: 'function1Name',
price: 234,
parameter1: 'someParameter',
parameter2: 'someParameter',
abi: //abiJSONhere
}
const contract2 = {
address: '0x456...',
functionName: 'function2Name',
price: 0,
parameter1: 'someParameter',
abi: //abiJSONhere
}
const contract1Interface = new ethers.utils.Interface(contract1.abi)
const contract2Interface = new ethers.utils.Interface(contract2.abi)
const contract1Calldata = contract1Interface.encodeFunctionData(contract1.functionName, [contract1.parameter1, contract1.parameter2]);
const contract2Calldata = contract2Interface.encodeFunctionData(contract2.functionName, [contract2.parameter1]);
const calls = [
{ _to: contract1.address, _value: contract1.price, _calldata: contract1Calldata },
{ _to: contract1.address, _value: contract2.price, _calldata: contract2Calldata },
];
This calls array can be passed directly into the
calls
prop in the BrydgeWidget
component.