Modifying the Code
Lets modify the code to implement the Data API.
In this section, we will modify the code to implement the Data API.
Modify Backend src/app/api/wallet/route.ts
First we will implement the getBlockHeight
function. This function is the same as the one in ERC20 Balance App, but we will repeat it for the sake of the tutorial. The goal of this function is to fetch recent blocks from the Data API then to return the highest block in the first position.
Next we will implement the listERC721Balances
function. The goal of this function is to fetch the ERC-721 token balances for a given address.
Now we will implement the listErc1155Balances
function. The goal of this function is to fetch the ERC-1155 token balances for a given address.
Finally we will implement the listRecentTransactions
function. The goal of this function is to fetch recent transactions for a given address given a block start and end.
Modify Frontend src/app/basic-wallet/page.tsx
Now we will modify the frontend to make calls to our backend.
First we will implement the fetchERC20Balances
function. The goal of this function is to make a call to our backend to get the user's ERC-20 token balances.
Next we will implement the fetchERC721Balances
function. The goal of this function is to call our listErc721Balances
function on the backend and return it as a Erc721TokenBalance
array.
Now we will implement the fetchERC1155Balances
function. The goal of this function is to call our listERC1155Balances
function on the backend and return it as a Erc1155TokenBalance
array.
Finally we will implement the fetchRecentTransactions
function. The goal of this function is to call our listRecentTransactions
function on the backend and return it as an object of type TransactionDetails
.