diff --git a/packages/frontend/src/components/projects/create/Configure.tsx b/packages/frontend/src/components/projects/create/Configure.tsx index d6d8dacb..1559ef6d 100644 --- a/packages/frontend/src/components/projects/create/Configure.tsx +++ b/packages/frontend/src/components/projects/create/Configure.tsx @@ -36,11 +36,13 @@ type ConfigureFormValues = ConfigureDeploymentFormValues & EnvironmentVariablesFormValues; const Configure = () => { - const { signClient, session } = useWalletConnectClient(); + const { signClient, session, accounts } = useWalletConnectClient(); const [isLoading, setIsLoading] = useState(false); const [deployers, setDeployers] = useState([]); const [selectedAccount, setSelectedAccount] = useState(); + const [isPaymentLoading, setIsPaymentLoading] = useState(false); + const [isPaymentDone, setIsPaymentDone] = useState(false); const [searchParams] = useSearchParams(); const templateId = searchParams.get('templateId'); @@ -271,6 +273,16 @@ const Configure = () => { const snowballAddress = await client.getAddress(); try { + setIsPaymentDone(false); + setIsPaymentLoading(true); + + toast({ + id: 'sending-payment-request', + title: 'Check your wallet and approve payment request', + variant: 'loading', + onDismiss: dismiss, + }); + const result: { signature: string } = await signClient.request({ topic: session.topic, chainId: `cosmos:${chainId}`, @@ -290,12 +302,28 @@ const Configure = () => { throw new Error('Error completing transaction'); } + toast({ + id: 'payment-successful', + title: 'Payment successful', + variant: 'success', + onDismiss: dismiss, + }); + return result.signature; } catch (error: any) { - throw error; + console.error('Error sending tokens', error); + toast({ + id: 'error-sending-tokens', + title: 'Error sending tokens', + variant: 'error', + onDismiss: dismiss, + }); + } finally { + setIsPaymentLoading(false); + setIsPaymentDone(true); } }, - [session, signClient], + [session, signClient, toast], ); useEffect(() => { @@ -440,22 +468,30 @@ const Configure = () => { Connect to your wallet -
- -
+ {accounts && accounts?.length > 0 && ( +
+ +
+ )}