I'm trying to improve UX by showing a spinner while a transaction gets resolver, however my flow is breaking. What am I doing wrong here?
// WITHDRAWALS
if (currentTab == "withdrawal") {
if (
contractInfo.qitbalance > BigNumber.from(0) &&
inputValue !== "" &&
Date.now() / 1000 > contractInfo.lockupEnds
) {
if (ethers.utils.parseEther(inputValue).toBigInt() > 0) {
const QITconnect = QIT.connect(library.getSigner());
try {
await QITconnect.requestWithdrawal(ethers.utils.parseUnits(inputValue, 6))
.then((tx: any) => {
//action prior to transaction being mined
console.log("Transaction pending");
console.log(tx);
library.provider
.waitForTransaction(tx.hash)
.then(() => {
//action after transaction is mined
console.log("Transaction mined");
})
.catch(() => {
//action if transaction fails
console.log("Transaction failed");
});
})
.catch(() => {
//action to perform when user clicks "reject"
console.log("Transaction rejected");
});
} catch (error: any) {
setShow(true);
console.log("User rejected transaction");
}
}
}
}
This is what's happening immediately.