<EtherspotTransactionKit /> - Etherspot Developer Documentation

Intro

In order for us to provide all the power of Etherspot to your app, we need to wrap your app in an EtherspotTransactionKit tag. This will allow the whole app to access libraries and services provided by TransactionKit.

How to use

The EtherspotTransactionKit component will wrap your top level App tag which is usually found in the React app’s index.js file. Here is how you would use the EtherspotTransactionKit tag.

// Import the following libraries
import { EtherspotTransactionKit } from '@etherspot/transaction-kit';
// We're importing Ethers here to create a random wallet
import { ethers } from 'ethers';

/**
 * Later in your app's function code...
 */

// Let's create the random wallet for demonstration purposes.
const randomWallet = ethers.Wallet.createRandom();
// Pass the private key into a new ethers.Wallet to return a
// provider. This is the account we pass into EtherspotUi.
const providerWallet = new ethers.Wallet(randomWallet.privateKey);

/**
 * In your app's render function, "wrap" the <App /> tag...
 */

root.render(
  <React.StrictMode>
    <EtherspotTransactionKit provider={providerWallet}> // <-- open here
      <App />
    </EtherspotTransactionKit>                          // <-- close here
  </React.StrictMode>
);