How do I wait for confirmation in metamask/ethers before proceeding

Question

The following function happens when a user clicks a "withdraw" button in my dapp:

const canUserWithdraw = async () => {
            if (b <= a) {
                alert("You can withdraw today");
                contract.faucet(account[0], withdrawalAmount);
                await confirm();
            } else if (b > a) {
                alert("Insufficient funds");
            } else {
                alert("Please enter an amount you'd like to withdraw");
            }
        };
        await canUserWithdraw();

Then after they click confirm in metamask:

const confirm = async () => {
            await contract.on("confirmation", () => console.log("Transfer"));
        }

At the moment all I get is two console logs of "Transfer" - how can I process the second log (which means the transfer has been successful) so then I can update my DB?

Something like a loading page would be a good solution.

Answer 1

I do not think wallet will post event for confirmations, that are just increased block numbers after the transaction was initially mine. If you want to do this, you need to count blocks yourself over the JSON-RPC AI.

Furthermore for dApp us case, there is no need to wait confirmations at all, because there is no centralised element and mixing user funds involved.

Answer 2

Checkout web3.eth.getTransactionReceipt()

https://web3js.readthedocs.io/en/v1.2.11/web3-eth.html#gettransactionreceipt