I am trying to call a function from my solidity contract which shows how many nfts have been minted so far, I want the front end user to be able to see the number even if they don't have a wallet in their browser. I thought I could do this using ethers.getDefaultProvider but I just cannot seem to get it to work? With my code I don't get any errors, but neither do I get the number showing up? Can anyone help with where I am going wrong? Here are the relevant parts of my code
const [totalMinted, setTotalMinted] = useState ("");
const checkNFTsMinted = async () => {
try {
const provider = ethers.getDefaultProvider("homestead");
const connectedContract = new ethers.Contract
(CONTRACT_ADDRESS, Token.abi, provider);
//Gets total nfts minted from the smart contract
let totalNFTsMinted = await
connectedContract.getMintedAmount();
//updates the state
setTotalMinted(totalNFTsMinted.toNumber());
}
catch(error){console.log('how many NFTs still avail Error:', error)}
}
<div className="App">
<h1>{totalMinted}</h1> </div>
and how the function looks in my solidity contract
function getMintedAmount() public view returns (uint256) {
return _tokenIdCounter.current();
}
I am new to programming so maybe I am missing something really obvious but I dont know what it is. Thanks
EDIT: When I use this code snippet instead it works to show the number minted
const checkNFTsMinted = async () => {
try {
const {ethereum} = window;
const provider = new ethers.providers.Web3Provider (ethereum);
const signer = provider.getSigner();
const connectedContract = new ethers.Contract
(tokenAddress, Token.abi, provider);
//Gets total nfts minted from the smart contract
let totalNFTsMinted = await
connectedContract.getMintedAmount();
//updates the state
setTotalMinted(totalNFTsMinted.toNumber());
}
catch(error){console.log('how many NFTs still avail Error:', error)}
}
useEffect(() => {
checkNFTsMinted()
}, [])
so I believe it is something front-end related that I am doing wrong as the number stops showing when I change that.