diff --git a/packages/widget/src/components/StepActions/StepActions.tsx b/packages/widget/src/components/StepActions/StepActions.tsx index e67135ab9..8b330219e 100644 --- a/packages/widget/src/components/StepActions/StepActions.tsx +++ b/packages/widget/src/components/StepActions/StepActions.tsx @@ -121,7 +121,7 @@ export const StepDetailsContent: React.FC<{ step: Step }> = ({ step }) => { {t('format.number', { value: formatTokenAmount( step.execution?.toAmount ?? step.estimate.toAmount, - step.action.toToken.decimals, + step.execution?.toToken?.decimals ?? step.action.toToken.decimals, ), })}{' '} {step.action.toToken.symbol} diff --git a/packages/widget/src/pages/SwapDetailsPage/SwapDetailsPage.tsx b/packages/widget/src/pages/SwapDetailsPage/SwapDetailsPage.tsx index 8f8afd8c2..a6f2087a9 100644 --- a/packages/widget/src/pages/SwapDetailsPage/SwapDetailsPage.tsx +++ b/packages/widget/src/pages/SwapDetailsPage/SwapDetailsPage.tsx @@ -83,29 +83,27 @@ export const SwapDetailsPage: React.FC = () => { }).format(startedAt)} - {routeExecution?.route.steps.map((step, index, steps) => ( - - - {steps.length > 1 && index !== steps.length - 1 ? ( - - ) : null} - - ))} + {routeExecution?.route.steps.map((step, index, steps) => { + const fromToken = + index === 0 + ? { ...step.action.fromToken, amount: step.action.fromAmount } + : undefined; + const toToken = + index === steps.length - 1 + ? { + ...(step.execution?.toToken ?? step.action?.toToken), + amount: step.execution?.toAmount ?? step.estimate.toAmount, + } + : undefined; + return ( + + + {steps.length > 1 && index !== steps.length - 1 ? ( + + ) : null} + + ); + })} { return ( - {route?.steps.map((step, index, steps) => ( - - - {steps.length > 1 && index !== steps.length - 1 ? ( - - ) : null} - - ))} + {route?.steps.map((step, index, steps) => { + const fromToken = + index === 0 + ? { ...step.action.fromToken, amount: step.action.fromAmount } + : undefined; + const toToken = + index === steps.length - 1 + ? { + ...(step.execution?.toToken ?? step.action?.toToken), + amount: step.execution?.toAmount ?? step.estimate.toAmount, + } + : undefined; + return ( + + + {steps.length > 1 && index !== steps.length - 1 ? ( + + ) : null} + + ); + })} {status === 'idle' || status === 'error' ? ( <>