I'm building a react app which currently is able to connect to a wallet and display some data from a few deployed contracts. Upon connection to a wallet, I want to mint 1000 units of a token which I have deployed to that wallet, and then display that balance (1000 of token) in the react app. It's displaying everything as it should be BUT for some reason the balance showing is zero even after connecting to the wallet, and I can verify that for some reason, the token is not being minted. Here are the functions I've written for this specific purpose in my frontend "interact.js" file that has a bunch of functions that are exported to the main react component.
export const mintToken = async (address, amount) => { await tokenContract.methods.mint(address, amount).call(); }
export const loadTokenBalance = async () => { const wallet = await connectWallet();
await mintToken(wallet.address, 1000);
const newBalance = await tokenContract.methods.balanceOf(wallet.address).call(); return newBalance; }
The loadTokenBalance function is accessed by the react component and rendered the balance returned by this method. But for some reason it keeps returning zero because the tokens are not being minted. Would highly appreciate anyone's assistance.