From 27c21205a841ed8199554c4d2e152e710b4d788d Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Tue, 4 Nov 2025 12:32:38 +0100 Subject: [PATCH 1/5] Show estimated USD value of a bridge transfer --- .../ReceiveFlow/components/AmountScreen.tsx | 34 ++++++++++++++----- .../SendFlow/components/AmountScreen.tsx | 34 ++++++++++++++----- .../src/contexts/TokenPricesContext.tsx | 16 ++++++++- 3 files changed, 65 insertions(+), 19 deletions(-) diff --git a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/ReceiveFlow/components/AmountScreen.tsx b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/ReceiveFlow/components/AmountScreen.tsx index 3501c81d8..2a592e0a3 100644 --- a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/ReceiveFlow/components/AmountScreen.tsx +++ b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/ReceiveFlow/components/AmountScreen.tsx @@ -19,11 +19,15 @@ import { import { RSK_CHAIN_ID } from '../../../../../../config/chains'; +import { AmountRenderer } from '../../../../../2_molecules/AmountRenderer/AmountRenderer'; import { MaxButton } from '../../../../../2_molecules/MaxButton/MaxButton'; +import { USD } from '../../../../../../constants/currencies'; import { useAccount } from '../../../../../../hooks'; import { useChainStore } from '../../../../../../hooks/useChainStore'; +import { useDollarValue } from '../../../../../../hooks/useDollarValue'; import { useTokenDetailsByAsset } from '../../../../../../hooks/useTokenDetailsByAsset'; import { translations } from '../../../../../../locales/i18n'; +import { toWei } from '../../../../../../utils/math'; import { ReceiveFlowContext, ReceiveFlowStep, @@ -79,6 +83,12 @@ export const AmountScreen: React.FC = () => { receiver, }); + const { usdValue } = useDollarValue( + token!, + amount !== '' ? toWei(amount).toString() : '0', + RSK_CHAIN_ID, + ); + return (
{chainId && ( @@ -108,15 +118,21 @@ export const AmountScreen: React.FC = () => { )}
- +
+ + +
+ +
+
{t(translations.erc20Bridge.receive.addressLabel)} diff --git a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx index 4a88baf86..b3dabc442 100644 --- a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx +++ b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx @@ -20,10 +20,14 @@ import { import { RSK_CHAIN_ID } from '../../../../../../config/chains'; +import { AmountRenderer } from '../../../../../2_molecules/AmountRenderer/AmountRenderer'; import { MaxButton } from '../../../../../2_molecules/MaxButton/MaxButton'; +import { USD } from '../../../../../../constants/currencies'; import { useAccount } from '../../../../../../hooks'; +import { useDollarValue } from '../../../../../../hooks/useDollarValue'; import { useTokenDetailsByAsset } from '../../../../../../hooks/useTokenDetailsByAsset'; import { translations } from '../../../../../../locales/i18n'; +import { toWei } from '../../../../../../utils/math'; import { SendFlowContext, SendFlowStep } from '../../../contexts/sendflow'; import { useBridgeService } from '../../../hooks/useBridgeService'; import { useBridgeValidation } from '../../../hooks/useBridgeValidation'; @@ -72,6 +76,12 @@ export const AmountScreen: React.FC = () => { receiver, }); + const { usdValue } = useDollarValue( + token!, + amount !== '' ? toWei(amount).toString() : '0', + RSK_CHAIN_ID, + ); + return (
{chainId && ( @@ -101,15 +111,21 @@ export const AmountScreen: React.FC = () => { )}
- +
+ + +
+ +
+
( undefined, ); @@ -40,7 +49,12 @@ export const TokenPricesProvider: React.FC = ({ placeholderData: keepPreviousData, refetchInterval: DATA_REFRESH_INTERVAL, queryFn: async () => { - const data = await loadIndexer(currentChainId).tokens.list(); + // Fallback to RSK_MAINNET if current chain is unsupported + const chain = UNSUPPORTED_CHAIN_IDS.includes(currentChainId as ChainIds) + ? ChainIds.RSK_MAINNET + : currentChainId; + + const data = await loadIndexer(chain).tokens.list(); if (data) { const prices = data.reduce( From 20156b34b3957bd33a93063d13f89ecca9e55cbd Mon Sep 17 00:00:00 2001 From: tiltom Date: Tue, 4 Nov 2025 13:33:47 +0200 Subject: [PATCH 2/5] Create blue-fireants-lie.md --- .changeset/blue-fireants-lie.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/blue-fireants-lie.md diff --git a/.changeset/blue-fireants-lie.md b/.changeset/blue-fireants-lie.md new file mode 100644 index 000000000..054dca0c6 --- /dev/null +++ b/.changeset/blue-fireants-lie.md @@ -0,0 +1,5 @@ +--- +"frontend": patch +--- + +SOV-5216: Show estimated USD value of bridge transfers From 4eaab153e4b4689d936ab0ad03df42e19502e1cd Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 5 Nov 2025 17:14:12 +0100 Subject: [PATCH 3/5] Trigger staging build --- .../components/SendFlow/components/AmountScreen.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx index b3dabc442..6d9d1c6a1 100644 --- a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx +++ b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx @@ -121,7 +121,6 @@ export const AmountScreen: React.FC = () => { className="w-full mb-0 max-w-full" placeholder="0" /> -
From 6cc2c1170da140a617e577f717695a3d3537163d Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 5 Nov 2025 17:20:55 +0100 Subject: [PATCH 4/5] Trigger branch deploy --- .../components/SendFlow/components/AmountScreen.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx index 6d9d1c6a1..b3dabc442 100644 --- a/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx +++ b/apps/frontend/src/app/3_organisms/ERC20BridgeDialog/components/SendFlow/components/AmountScreen.tsx @@ -121,6 +121,7 @@ export const AmountScreen: React.FC = () => { className="w-full mb-0 max-w-full" placeholder="0" /> +
From acfac2f02e60c6fee89f74c6d6f349a40a8d42be Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Thu, 6 Nov 2025 11:14:49 +0100 Subject: [PATCH 5/5] Add fix for ESOV --- apps/frontend/src/hooks/useDollarValue.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/apps/frontend/src/hooks/useDollarValue.ts b/apps/frontend/src/hooks/useDollarValue.ts index 5018a0012..cf5de956a 100644 --- a/apps/frontend/src/hooks/useDollarValue.ts +++ b/apps/frontend/src/hooks/useDollarValue.ts @@ -45,6 +45,8 @@ export function useDollarValue( return COMMON_SYMBOLS.ETH; } else if (['wbtc', 'tbtc'].includes(asset.toLocaleLowerCase())) { return COMMON_SYMBOLS.BTC; + } else if (asset.toLocaleLowerCase() === 'esov') { + return COMMON_SYMBOLS.SOV; } } return asset.toUpperCase();