From 49c204affd3faffd7cb76533952615a62e6f7f07 Mon Sep 17 00:00:00 2001 From: Isha Date: Fri, 8 Nov 2024 14:40:12 +0530 Subject: [PATCH] Add toast for failed txs --- build-webapp.sh | 1 + .../application-deployment-request.yml | 2 ++ packages/frontend/.env.example | 2 +- .../projects/create/AccountsDropdown.tsx | 1 - .../components/projects/create/Configure.tsx | 28 ++++++++++++------- .../projects/create/IFrameModal.tsx | 8 +++--- packages/frontend/src/utils/constants.ts | 2 +- 7 files changed, 27 insertions(+), 17 deletions(-) diff --git a/build-webapp.sh b/build-webapp.sh index e6476e6f..b289f28f 100755 --- a/build-webapp.sh +++ b/build-webapp.sh @@ -17,6 +17,7 @@ VITE_GITHUB_IMAGE_UPLOAD_PWA_TEMPLATE_REPO = 'LACONIC_HOSTED_CONFIG_github_image VITE_GITHUB_NEXT_APP_TEMPLATE_REPO = 'LACONIC_HOSTED_CONFIG_github_next_app_templaterepo' VITE_WALLET_CONNECT_ID = 'LACONIC_HOSTED_CONFIG_wallet_connect_id' VITE_LACONICD_CHAIN_ID = 'LACONIC_HOSTED_CONFIG_laconicd_chain_id' +VITE_WALLET_IFRAME_URL = 'LACONIC_HOSTED_CONFIG_wallet_iframe_url' VITE_LIT_RELAY_API_KEY = 'LACONIC_HOSTED_CONFIG_lit_relay_api_key' VITE_BUGSNAG_API_KEY = 'LACONIC_HOSTED_CONFIG_bugsnag_api_key' VITE_PASSKEY_WALLET_RPID = 'LACONIC_HOSTED_CONFIG_passkey_wallet_rpid' diff --git a/packages/deployer/staging-records/application-deployment-request.yml b/packages/deployer/staging-records/application-deployment-request.yml index fd7ee288..897c47a4 100644 --- a/packages/deployer/staging-records/application-deployment-request.yml +++ b/packages/deployer/staging-records/application-deployment-request.yml @@ -18,6 +18,8 @@ record: LACONIC_HOSTED_CONFIG_bugsnag_api_key: 8c480cd5386079f9dd44f9581264a073 LACONIC_HOSTED_CONFIG_passkey_wallet_rpid: dashboard.staging.apps.snowballtools.com LACONIC_HOSTED_CONFIG_turnkey_api_base_url: https://api.turnkey.com + LACONIC_HOSTED_CONFIG_laconicd_chain_id: + LACONIC_HOSTED_CONFIG_wallet_iframe_url: LACONIC_HOSTED_CONFIG_turnkey_organization_id: 5049ae99-5bca-40b3-8317-504384d4e591 meta: note: Added by Snowball @ Mon Jun 24 23:51:48 UTC 2024 diff --git a/packages/frontend/.env.example b/packages/frontend/.env.example index 75671697..62241552 100644 --- a/packages/frontend/.env.example +++ b/packages/frontend/.env.example @@ -15,4 +15,4 @@ VITE_PASSKEY_WALLET_RPID= VITE_TURNKEY_API_BASE_URL= VITE_LACONICD_CHAIN_ID= -VITE_IFRAME_ORIGIN_URL= +VITE_WALLET_IFRAME_URL= diff --git a/packages/frontend/src/components/projects/create/AccountsDropdown.tsx b/packages/frontend/src/components/projects/create/AccountsDropdown.tsx index e404b093..d885a018 100644 --- a/packages/frontend/src/components/projects/create/AccountsDropdown.tsx +++ b/packages/frontend/src/components/projects/create/AccountsDropdown.tsx @@ -7,7 +7,6 @@ const AccountsDropdown = ({ accounts: string[]; onAccountChange: (selectedAccount: string) => void; }) => { - return (
{!accounts.length ? ( diff --git a/packages/frontend/src/components/projects/create/Configure.tsx b/packages/frontend/src/components/projects/create/Configure.tsx index a8731ba5..47cc2c04 100644 --- a/packages/frontend/src/components/projects/create/Configure.tsx +++ b/packages/frontend/src/components/projects/create/Configure.tsx @@ -23,7 +23,7 @@ import { useGQLClient } from '../../../context/GQLClientContext'; import IFrameModal from './IFrameModal'; import EnvironmentVariablesForm from 'pages/org-slug/projects/id/settings/EnvironmentVariablesForm'; import { EnvironmentVariablesFormValues } from 'types/types'; -import { VITE_LACONICD_CHAIN_ID, VITE_IFRAME_ORIGIN_URL } from 'utils/constants'; +import { VITE_LACONICD_CHAIN_ID, VITE_WALLET_IFRAME_URL } from 'utils/constants'; import AccountsDropdown from './AccountsDropdown'; type ConfigureDeploymentFormValues = { @@ -37,7 +37,7 @@ type ConfigureFormValues = ConfigureDeploymentFormValues & EnvironmentVariablesFormValues; const DEFAULT_MAX_PRICE = '10000'; -const TX_APPROVAL_TIMEOUT = 60000; +const TX_APPROVAL_TIMEOUT_MS = 60000; const Configure = () => { const [isLoading, setIsLoading] = useState(false); @@ -216,6 +216,13 @@ const Configure = () => { ); if (!txHash) { + console.error('Tx not successful'); + toast({ + id: 'unsuccessful-tx', + title: 'Transaction rejected', + variant: 'error', + onDismiss: dismiss, + }); return; } @@ -289,6 +296,7 @@ const Configure = () => { variant: 'error', onDismiss: dismiss, }); + throw new Error('Error deploying app'); } }, [client, createProject, dismiss, toast], @@ -318,7 +326,7 @@ const Configure = () => { const cosmosSendTokensHandler = useCallback( async (selectedAccount: string, amount: string) => { if (!selectedAccount) { - return; + throw new Error('Account not selected'); } const senderAddress = selectedAccount; @@ -330,14 +338,13 @@ const Configure = () => { await requestTx(senderAddress, snowballAddress, amount); - const txHash = await new Promise((resolve, reject) => { + const txHash = await new Promise((resolve, reject) => { const handleTxStatus = async (event: MessageEvent) => { - if (event.origin !== VITE_IFRAME_ORIGIN_URL) return; + if (event.origin !== VITE_WALLET_IFRAME_URL) return; - if (event.data.type === 'TRANSACTION_SUCCESS') { + if (event.data.type === 'TRANSACTION_RESPONSE') { const txResponse = event.data.data; resolve(txResponse); - setIsFrameVisible(false); } else if (event.data.type === 'ERROR') { console.error('Error from wallet:', event.data.message); reject(new Error('Transaction failed')); @@ -348,6 +355,7 @@ const Configure = () => { onDismiss: dismiss, }); } + setIsFrameVisible(false); window.removeEventListener('message', handleTxStatus); }; @@ -364,12 +372,12 @@ const Configure = () => { variant: 'error', onDismiss: dismiss, }); - }, TX_APPROVAL_TIMEOUT); + }, TX_APPROVAL_TIMEOUT_MS); }); return txHash; } catch (error) { console.error('Error in transaction:', error); - return; + throw new Error('Error in transaction:'); } finally { setIsPaymentLoading(false); } @@ -393,7 +401,7 @@ const Configure = () => { toAddress: recipient, amount, }, - VITE_IFRAME_ORIGIN_URL + VITE_WALLET_IFRAME_URL ); setIsFrameVisible(true); diff --git a/packages/frontend/src/components/projects/create/IFrameModal.tsx b/packages/frontend/src/components/projects/create/IFrameModal.tsx index b7db68e5..d912438f 100644 --- a/packages/frontend/src/components/projects/create/IFrameModal.tsx +++ b/packages/frontend/src/components/projects/create/IFrameModal.tsx @@ -2,7 +2,7 @@ import { useCallback, useEffect } from 'react'; import { Box, Modal } from '@mui/material'; -import { VITE_LACONICD_CHAIN_ID, VITE_IFRAME_ORIGIN_URL } from 'utils/constants'; +import { VITE_LACONICD_CHAIN_ID, VITE_WALLET_IFRAME_URL } from 'utils/constants'; const IFrameModal = ({ setAccounts, @@ -16,7 +16,7 @@ const IFrameModal = ({ useEffect(() => { const handleMessage = (event: MessageEvent) => { // TODO: Use env for origin URL - if (event.origin !== VITE_IFRAME_ORIGIN_URL) return; + if (event.origin !== VITE_WALLET_IFRAME_URL) return; if (event.data.type === 'WALLET_ACCOUNTS_DATA') { setAccounts(event.data.data); @@ -45,7 +45,7 @@ const IFrameModal = ({ type: 'REQUEST_WALLET_ACCOUNTS', chainId: VITE_LACONICD_CHAIN_ID, }, - VITE_IFRAME_ORIGIN_URL + VITE_WALLET_IFRAME_URL ); }, []); @@ -71,7 +71,7 @@ const IFrameModal = ({