diff --git a/docs/cel2/fee-currencies.md b/docs/cel2/fee-currencies.md index ca40a95372..0f54dc2bcd 100644 --- a/docs/cel2/fee-currencies.md +++ b/docs/cel2/fee-currencies.md @@ -43,8 +43,11 @@ Wallets will overwrite the `feeCurrency`, which is why this is recommended for w For using Fee Abstraction for a wallet or inside your dApp we recommend using [viem](https://viem.sh/docs/introduction.html) or [wagmi](https://wagmi.sh/). +:::info +While we recommend viem, [web3.js](https://docs.web3js.org/) has added as of 4.13.1 support for `feeCurrency` via the usage of [plugins](https://docs.web3js.org/#packages--plugins). There is a celo-specific [plugin for web3@4 available on github](https://github.com/celo-org/web3-plugin-transaction-types). + :::warning -Currently, ethers.js and web3.js don't support the `feeCurrency` property +Currently, ethers.js doesn't support the `feeCurrency` property ::: ### Sending transaction using Fee Abstraction diff --git a/docs/developer/sdks/celo-sdks.md b/docs/developer/sdks/celo-sdks.md index 003719245d..ec10174403 100644 --- a/docs/developer/sdks/celo-sdks.md +++ b/docs/developer/sdks/celo-sdks.md @@ -17,3 +17,4 @@ Because Celo is compitable with Ethereum any ethereum package can be used with C - [ContractKit](../contractkit/index.md) - [thirdweb SDK](../thirdweb-sdk/index.md) - [Rainbowkit-Celo](../rainbowkit-celo/index.md) +- [web3](../web3/index.md) diff --git a/docs/developer/web3/index.md b/docs/developer/web3/index.md new file mode 100644 index 0000000000..2721e127f9 --- /dev/null +++ b/docs/developer/web3/index.md @@ -0,0 +1,46 @@ +--- +title: Web3.js +description: Using Web3.js with Celo +--- + +## Web3.js + +Web3.js was established in 2014, making it the oldest web3 library. With extensive documentation, an active community and modular design, Web3.js is powerful and easy-to-use. It has _support for Celo via plugins since version 4.13.1_. + +The [Web3.js docs](https://docs.web3js.org/) have excellent examples of how to use it in your project. + +### With Celo + +You need to install `@celo/web3-plugin-transaction-types` as well as `web3@4.13.1` or higher. + +```ts +// see web3 docs for more info on setup + +import { Web3 } from "web3"; +import { CeloTransactionTypesPlugin } from "@celo/web3-plugin-transaction-types"; + +const web3 = new Web3("http://127.0.0.1:8545"); +web3.registerPlugin(new CeloTransactionTypesPlugin()); + +// Now `web3.celo` is available and `celo.eth` is celo-aware + +const cEUR = await web3.celo.getCoreContractAddress("StableTokenEUR"); +const txData = { + from: "0x123...", + to: "0x456...", + value: 123n, + feeCurrency: cEUR, // optional +}; +await web3.celo.populateTransaction(txData); +const tx = await web3.eth.sendTransaction(txData); +``` + +## Gas Price + +When paying for transaction with an alternate feeCurrency token it is important to know the price of gas denominated in that token. You can use `web3.celo.populateTransaction` to make sure `maxPriorityFeePerGas`, `maxFeePerGas`, and `gas` are filled properly. + +```ts +await web3.celo.populateTransaction(txData); +``` + +More examples in the [github repository readme](https://github.com/celo-org/web3-plugin-transaction-types).