diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx index 1d6c439b05..8bfb0a7568 100644 --- a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx +++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx @@ -195,11 +195,29 @@ export function Review({ [route], ); + const openFeeBreakdown = () => { + const feesToken = route?.route.estimate.feeCosts?.[0]?.token; + track({ + userJourney: UserJourney.ADD_TOKENS, + screen: 'Review', + control: 'FeeBreakdown', + controlType: 'Button', + extras: { + contextId: id, + feesToken: feesToken?.symbol, + totalAmount: feesToken ? getFormattedNumber(totalFees, feesToken.decimals) : null, + totalFiatAmount: getFormattedAmounts(totalFeesUsd), + }, + }); + + setShowFeeBreakdown(true); + }; + const routeFees = useMemo(() => { if (totalFeesUsd) { return ( setShowFeeBreakdown(true)} + onClick={() => openFeeBreakdown()} size="small" sx={{ ...hFlex,