diff --git a/packages/bridge-ui-v2/src/components/Transactions/InsufficientFunds.svelte b/packages/bridge-ui-v2/src/components/Transactions/InsufficientFunds.svelte new file mode 100644 index 00000000000..f19a30ba294 --- /dev/null +++ b/packages/bridge-ui-v2/src/components/Transactions/InsufficientFunds.svelte @@ -0,0 +1,70 @@ + + + + + diff --git a/packages/bridge-ui-v2/src/components/Transactions/Status.svelte b/packages/bridge-ui-v2/src/components/Transactions/Status.svelte index fa60111f37d..8b5e370c9c7 100644 --- a/packages/bridge-ui-v2/src/components/Transactions/Status.svelte +++ b/packages/bridge-ui-v2/src/components/Transactions/Status.svelte @@ -31,6 +31,8 @@ import { network } from '$stores/network'; import { pendingTransactions } from '$stores/pendingTransactions'; + import InsufficientFunds from './InsufficientFunds.svelte'; + const log = getLogger('components:Status'); export let bridgeTx: BridgeTransaction; @@ -41,6 +43,8 @@ let processable = false; // bridge tx state to be processed: claimed/retried/released let bridgeTxStatus: Maybe; + let modalOpen = false; + // TODO: enum? let loading: 'claiming' | 'releasing' | false = false; @@ -136,7 +140,7 @@ warningToast($t('transactions.actions.claim.rejected')); break; case err instanceof InsufficientBalanceError: - errorToast($t('transactions.errors.insufficient_balance')); + modalOpen = true; break; case err instanceof InvalidProofError: errorToast($t('TODO: InvalidProofError')); @@ -289,3 +293,5 @@ {$t('transactions.status.error.name')} {/if} + + diff --git a/packages/bridge-ui-v2/src/i18n/en.json b/packages/bridge-ui-v2/src/i18n/en.json index 637a43e9c9f..a5943f0201f 100644 --- a/packages/bridge-ui-v2/src/i18n/en.json +++ b/packages/bridge-ui-v2/src/i18n/en.json @@ -141,7 +141,12 @@ "claim": { "tx": "Transaction sent to claim {token} tokens. Click here to see it in the explorer.", "success": "Transaction completed! Your funds have been successfully claimed on {network}.", - "rejected": "Request to claim rejected." + "rejected": "Request to claim rejected.", + "dialog": { + "title": "Please wait", + "description": "Insufficient balance to claim yourself. Please wait for the relayer to claim for you automatically. Refer to our guide for more information.", + "link": "Go to guide" + } }, "release": { "tx": "Transaction sent to release {token} tokens. Click here to see it in the explorer.",