cerc-io/snowballtools-base
11
0
Fork 3
Code Issues 11 Pull Requests 3 Actions Packages Projects Releases Wiki Activity

Fix polling for checking balance

Browse Source
This commit is contained in:
Shreerang Kale 2025-02-11 14:29:13 +05:30
parent cec75f9175
commit 604f9181c5
1 changed files with 47 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
packages/frontend/src/components/projects/create/Configure.tsx
View File

@ -98,11 +98,16 @@ const Configure = () => {
} }
return amount.replace(/\D/g, ''); return amount.replace(/\D/g, '');
}, [selectedOption, selectedDeployer?.minimumPayment, selectedMaxPrice, selectedNumProviders]); }, [
selectedOption,
selectedDeployer?.minimumPayment,
selectedMaxPrice,
selectedNumProviders,
]);
const { isBalanceSufficient, checkBalance } = useCheckBalance( const { isBalanceSufficient, checkBalance } = useCheckBalance(
amountToBePaid, amountToBePaid,
'walletIframe' 'walletIframe',
); );
const createProject = async ( const createProject = async (
@ -288,19 +293,19 @@ const Configure = () => {
if (templateId) { if (templateId) {
createFormData.option === 'Auction' createFormData.option === 'Auction'
? navigate( ? navigate(
`/${orgSlug}/projects/create/success/${projectId}?isAuction=true`, `/${orgSlug}/projects/create/success/${projectId}?isAuction=true`,
) )
: navigate( : navigate(
`/${orgSlug}/projects/create/template/deploy?projectId=${projectId}&templateId=${templateId}`, `/${orgSlug}/projects/create/template/deploy?projectId=${projectId}&templateId=${templateId}`,
); );
} else { } else {
createFormData.option === 'Auction' createFormData.option === 'Auction'
? navigate( ? navigate(
`/${orgSlug}/projects/create/success/${projectId}?isAuction=true`, `/${orgSlug}/projects/create/success/${projectId}?isAuction=true`,
) )
: navigate( : navigate(
`/${orgSlug}/projects/create/deploy?projectId=${projectId}`, `/${orgSlug}/projects/create/deploy?projectId=${projectId}`,
); );
} }
} catch (error: any) { } catch (error: any) {
toast({ toast({
@ -345,12 +350,20 @@ const Configure = () => {
await requestTx(senderAddress, snowballAddress, amount); await requestTx(senderAddress, snowballAddress, amount);
const txHash = await new Promise<string | null>((resolve, reject) => { const txHash = await new Promise<string | null>((resolve, reject) => {
// Call cleanup method only if appropriate event type is recieved
const cleanup = () => {
setIsFrameVisible(false);
window.removeEventListener('message', handleTxStatus);
};
const handleTxStatus = async (event: MessageEvent) => { const handleTxStatus = async (event: MessageEvent) => {
if (event.origin !== VITE_WALLET_IFRAME_URL) return; if (event.origin !== VITE_WALLET_IFRAME_URL) return;
if (event.data.type === 'TRANSACTION_RESPONSE') { if (event.data.type === 'TRANSACTION_RESPONSE') {
const txResponse = event.data.data; const txResponse = event.data.data;
resolve(txResponse); resolve(txResponse);
cleanup();
} else if (event.data.type === 'ERROR') { } else if (event.data.type === 'ERROR') {
console.error('Error from wallet:', event.data.message); console.error('Error from wallet:', event.data.message);
reject(new Error('Transaction failed')); reject(new Error('Transaction failed'));
@ -360,10 +373,9 @@ const Configure = () => {
variant: 'error', variant: 'error',
onDismiss: dismiss, onDismiss: dismiss,
}); });
}
setIsFrameVisible(false);
window.removeEventListener('message', handleTxStatus); cleanup();
}
}; };
window.addEventListener('message', handleTxStatus); window.addEventListener('message', handleTxStatus);
@ -424,7 +436,7 @@ const Configure = () => {
}, []); }, []);
useEffect(() => { useEffect(() => {
if (isAccountsDataReceived) { if (isAccountsDataReceived && !isBalanceSufficient) {
checkBalance(); checkBalance();
const interval = setInterval(() => { const interval = setInterval(() => {
@ -435,7 +447,12 @@ const Configure = () => {
clearInterval(interval); clearInterval(interval);
}; };
} }
}, [amountToBePaid, selectedAccount, selectedDeployer, isAccountsDataReceived]); }, [
amountToBePaid,
selectedAccount,
selectedDeployer,
isAccountsDataReceived,
]);
return ( return (
<div className="space-y-7 px-4 py-6"> <div className="space-y-7 px-4 py-6">
@ -604,7 +621,10 @@ const Configure = () => {
type="submit" type="submit"
shape="default" shape="default"
disabled={ disabled={
isLoading || isPaymentLoading || !selectedAccount || !isBalanceSufficient isLoading ||
isPaymentLoading ||
!selectedAccount ||
!isBalanceSufficient
} }
rightIcon={ rightIcon={
isLoading || isPaymentLoading ? ( isLoading || isPaymentLoading ? (
@ -624,10 +644,13 @@ const Configure = () => {
</Button> </Button>
{isAccountsDataReceived && isBalanceSufficient !== undefined ? ( {isAccountsDataReceived && isBalanceSufficient !== undefined ? (
(!selectedAccount || !isBalanceSufficient) ? ( !selectedAccount || !isBalanceSufficient ? (
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<Button
<Button {...buttonSize} shape="default" onClick={() => setBalanceMessage('Waiting for payment')}> {...buttonSize}
shape="default"
onClick={() => setBalanceMessage('Waiting for payment')}
>
<a <a
href="https://store.laconic.com" href="https://store.laconic.com"
target="_blank" target="_blank"
@ -642,7 +665,11 @@ const Configure = () => {
<LoadingIcon className="animate-spin w-5 h-5" /> <LoadingIcon className="animate-spin w-5 h-5" />
<p>{balanceMessage}</p> <p>{balanceMessage}</p>
</div> </div>
) : !selectedAccount ? 'No accounts found. Create a wallet.' : 'Insufficient funds.'} ) : !selectedAccount ? (
'No accounts found. Create a wallet.'
) : (
'Insufficient funds.'
)}
</p> </p>
</div> </div>
) : null ) : null