diff --git a/packages/bridge-ui/config/schemas/configuredCustomTokens.schema.json b/packages/bridge-ui/config/schemas/configuredCustomTokens.schema.json index 044be0aff9d..1a92562b13f 100644 --- a/packages/bridge-ui/config/schemas/configuredCustomTokens.schema.json +++ b/packages/bridge-ui/config/schemas/configuredCustomTokens.schema.json @@ -30,6 +30,9 @@ }, "mintable": { "type": "boolean" + }, + "wrapped": { + "type": "boolean" } }, "required": ["name", "addresses", "symbol", "decimals", "type", "logoURI"] diff --git a/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ReviewStep/ReviewStep.svelte b/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ReviewStep/ReviewStep.svelte index 17a5dd1a867..099573e7cff 100644 --- a/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ReviewStep/ReviewStep.svelte +++ b/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ReviewStep/ReviewStep.svelte @@ -9,6 +9,7 @@ import { destNetwork as destChain, enteredAmount, selectedToken } from '$components/Bridge/state'; import { PUBLIC_SLOW_L1_BRIDGING_WARNING } from '$env/static/public'; import { LayerType } from '$libs/chain'; + import { isWrapped, type Token } from '$libs/token'; import { connectedSourceChain } from '$stores/network'; export let hasEnoughEth: boolean = false; @@ -21,6 +22,10 @@ $: displayL1Warning = slowL1Warning && $destChain?.id && chainConfig[$destChain.id].type === LayerType.L1; + $: wrapped = $selectedToken !== null && isWrapped($selectedToken as Token); + + $: wrappedAssetWarning = $t('bridge.alerts.wrapped_eth'); + const dispatch = createEventDispatcher(); const editTransactionDetails = () => { @@ -64,6 +69,11 @@ <Alert type="warning">{$t('bridge.alerts.slow_bridging')}</Alert> {/if} +{#if wrapped} + <!-- eslint-disable-next-line svelte/no-at-html-tags --> + <Alert type="warning">{@html wrappedAssetWarning}</Alert> +{/if} + <div class="h-sep" /> <!-- Recipient & Processing Fee diff --git a/packages/bridge-ui/src/i18n/en.json b/packages/bridge-ui/src/i18n/en.json index eea6937a316..c62cfc463ba 100644 --- a/packages/bridge-ui/src/i18n/en.json +++ b/packages/bridge-ui/src/i18n/en.json @@ -38,7 +38,8 @@ "nft_scan_again": "Scan again" }, "alerts": { - "slow_bridging": "Please note: Bridging to L1 will take around 24hrs!" + "slow_bridging": "Please note: Bridging to L1 will take around 24hrs!", + "wrapped_eth": "You are bridging wrapped ETH. Please be aware that un-wrapping will only work on the original chain of the token, <span class=\"font-bold\">NOT</span> on the destination." }, "button": { "approve": "Approve", @@ -360,10 +361,10 @@ "transactions": "Transactions" }, "paginator": { - "of": "of", - "page": "Page", + "everything_loaded": "Everything loaded", "more": "Fetch more...", - "everything_loaded": "Everything loaded" + "of": "of", + "page": "Page" }, "paused_modal": { "description": "The bridge is currently not available. Follow our official communication channels for more information. ", diff --git a/packages/bridge-ui/src/libs/token/tokens.ts b/packages/bridge-ui/src/libs/token/tokens.ts index aab7965a156..1d93f217ee8 100644 --- a/packages/bridge-ui/src/libs/token/tokens.ts +++ b/packages/bridge-ui/src/libs/token/tokens.ts @@ -24,3 +24,7 @@ export const testNFT: Token[] = customToken.filter( ); export const tokens = [ETHToken, ...testERC20Tokens]; + +export const getTokensByType = (type: TokenType): Token[] => tokens.filter((token) => token.type === type); + +export const isWrapped = (token: Token): boolean => tokens.find((token) => token.wrapped === true) === token; diff --git a/packages/bridge-ui/src/libs/token/types.ts b/packages/bridge-ui/src/libs/token/types.ts index da71e4b15e4..8472614d9f0 100644 --- a/packages/bridge-ui/src/libs/token/types.ts +++ b/packages/bridge-ui/src/libs/token/types.ts @@ -23,6 +23,7 @@ export type Token = { imported?: boolean; mintable?: boolean; balance?: bigint; + wrapped?: boolean; }; export type NFT = Token & {