From df60ba41ff4e1eec0024abbbc255bf946bd42dc9 Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 7 Jan 2026 08:51:11 +0200 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 91a7d8c2f..5de23b88e 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, @@ -80,6 +84,12 @@ export const AmountScreen: React.FC = () => { receiver, }); + const { usdValue } = useDollarValue( + token!, + amount !== '' ? toWei(amount).toString() : '0', + RSK_CHAIN_ID, + ); + const isBridgeLocked = useERC20BridgeLocked(); return ( @@ -111,15 +121,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 3d98a7447..c36ced8d3 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'; @@ -74,6 +78,12 @@ export const AmountScreen: React.FC = () => { receiver, }); + const { usdValue } = useDollarValue( + token!, + amount !== '' ? toWei(amount).toString() : '0', + RSK_CHAIN_ID, + ); + return (
{chainId && ( @@ -103,15 +113,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 40b394019c21079f0456ce7db00357e9a0f38d31 Mon Sep 17 00:00:00 2001 From: tiltom Date: Wed, 7 Jan 2026 08:51:11 +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 c96e8dcf0b07d8c293f60561986db0bcf7d1ca6d Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 7 Jan 2026 08:51:11 +0200 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 c36ced8d3..a7acb3af5 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 @@ -123,7 +123,6 @@ export const AmountScreen: React.FC = () => { className="w-full mb-0 max-w-full" placeholder="0" /> -
From 621e97f22bd3244a1bec357bbca6098bdaddb330 Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 7 Jan 2026 08:51:11 +0200 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 a7acb3af5..c36ced8d3 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 @@ -123,6 +123,7 @@ export const AmountScreen: React.FC = () => { className="w-full mb-0 max-w-full" placeholder="0" /> +
From c410fcc11d5ebc02034e14841fa7d466f2ffaab0 Mon Sep 17 00:00:00 2001 From: Tomas Tilnak Date: Wed, 7 Jan 2026 08:51:11 +0200 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();