I have a simple react frontend application using web3 to mint my ERC721 contract NFTs. I am using metamask to sign transactions when calling functions on my smart contract. My code works when I call the minting function to mint a new NFT. But any code after the 'const tx = ...' line does not execute in the below code snippet inside the "mint" function. I get the metamask window asking to confirm the transaction. I can see that a new NFT was minted when I check the NFT count using truffle console. My code is below. Not sure why js code after sending the confirmation does not work. Any help on this much appreciated. Currently I am using ganache-cli to deploy my smart contract. I included portions of my full code below. I included the constructor function and the mint function. The other functions not shown setup the connection to metmask provider and define an instance of web3 using metamask provider.
import React, {Component} from "react";
import Web3 from "web3";
import detectEthereumProvider from "@metamask/detect-provider";
class NftComponent extends Component {
constructor(props) {
super(props);
this.state = {
account:'',
contract:null,
addressToMintNft:'',
Nftcount:null,
web3Local: null
}
}
//rest of the functions
.........
.........
.........
mint = async (addressTo, count) => {
console.log('Address to which NFT will be minted :');
console.log(addressTo);
console.log('Number of NFTs requested to be minted is');
console.log(count);
const tx = await this.state.contract.methods.mint(addressTo, count).send({from: this.state.account})
console.log('Transaction from calling mint function is:');
console.log(tx);
}