@imtbl/checkout-widgets 2.24.7 → 2.24.9-0

package/dist/browser/{AddTokensWidget-aAZMavtt.js → AddTokensWidget-CIR8BF_I.js}

@@ -1,6 +1,6 @@
-import { r as reactExports, ac as hFlex, ad as _defineProperty, ae as _objectWithoutProperties, af as useForwardLocalDomRef, ag as _slicedToArray, ah as useResizeObserver, Q as useTheme, ai as usePrevious, aj as useGetMotionProfile, ak as useBrowserEffect, al as merge, am as getHeadingTextStyles, an as getMotionProfileSx, ao as useConvertSxToEmotionStyles, ap as DUMMY_WIDTH_PUSHER_TEXT, s as jsxs, q as jsx, t as Box, aq as useGetSubcomponentChild, ar as flattenChildren, as as vFlex, at as centerFlexChildren, au as SmartClone, av as FormControlLabel, aw as FormControlValidation, ax as FormControlCaption, I as IMTBLWidgetEvents, A as AddTokensEventType, ay as getDefaultExportFromCjs, az as commonjsGlobal, u as useTranslation, aA as Drawer, aB as Divider, H as Heading, v as Button, aC as useProvidersContext, z as useAnalytics, aD as WalletDrawer, aE as UnableToConnectDrawer, aF as Fragment, aG as WalletProviderRdns, U as UserJourney, aH as removeSpace, aI as getProviderSlugFromRdns, aJ as WrappedBrowserProvider, aK as isPassportProvider, aL as connectEIP6963Provider, aM as identifyUser, aN as ConnectEIP6963ProviderError, aO as ProvidersContextActions, aP as MenuItem, aQ as ChainId, aR as SQUID_NATIVE_TOKEN, aS as commonjsRequire, X as getRemoteImage, aT as OnboardingPagination, aU as ViewContext, aV as useHandover, E as EventTargetContext, aW as HandoverTarget, V as ViewActions, n as getRemoteRive, aX as APPROVE_TXN_ANIMATION, aY as RiveStateMachineInput, aZ as HandoverContent, a_ as keyframes, l as TokenFilterTypes, a$ as isNativeToken, b0 as getTokenImageByAddress, b1 as FramedImage, b2 as FramedIcon, b3 as ButtCon, b4 as TextInput, b5 as VerticalMenu, G as getDefaultTokenImage, b6 as TOKEN_PRIORITY_ORDER, y as Body, b7 as EllipsizedText, b8 as Tooltip, b9 as Sticker, ba as getDurationFormatted, bb as getTotalRouteFees, bc as getRouteAndTokenBalances, w as Stack, bd as Icon, be as Badge, bf as getFormattedAmounts, bg as getRemoteVideo, bh as FramedVideo, bi as listVariants, bj as motion, bk as listItemVariants, bl as Banner, bm as useRoutes, bn as useInjectedProviders, bo as X, bp as RouteError, x as SimpleLayout, bq as dist, M as orchestrationEvents, p as parseUnits, a5 as SharedViews, br as SquidFooter, bs as TOOLKIT_SQUID_URL, bt as merge$1, bu as SvgIcon, bv as WalletWarningHero, bw as getFormattedNumber, bx as FIXED_HANDOVER_DURATION, by as EXECUTE_TXN_ANIMATION, L as Link, bz as Trans, bA as useExecute, bB as getRouteChains, bC as t, bD as convertToNetworkChangeableProvider, bE as verifyAndSwitchChain, bF as PriceDisplay, a0 as LoadingView, bG as getFromAmountData, bH as viewReducer, bI as initialViewState, bJ as useSquid, bK as useTokens, bL as v4, bM as r, bN as isValidAddress, N as amountInputValidation, bO as fetchChains, bP as fetchBalances, R as CloudImage, a6 as ErrorView, bQ as ServiceUnavailableErrorView } from './index-WfurfROg.js';
-import { T as TokenImage } from './TokenImage-EqfdG328.js';
-import { f as fetchRiskAssessmentV2, r as resultHasSanctionedWallets, F as FeesBreakdown } from './FeesBreakdown-WeqZxAT6.js';
+import { r as reactExports, aa as hFlex, ab as _defineProperty, ac as _objectWithoutProperties, ad as useForwardLocalDomRef, ae as _slicedToArray, af as useResizeObserver, N as useTheme, ag as usePrevious, ah as useGetMotionProfile, ai as useBrowserEffect, aj as merge, ak as getHeadingTextStyles, al as getMotionProfileSx, am as useConvertSxToEmotionStyles, an as DUMMY_WIDTH_PUSHER_TEXT, s as jsxs, q as jsx, t as Box, ao as useGetSubcomponentChild, ap as flattenChildren, aq as vFlex, ar as centerFlexChildren, as as SmartClone, at as FormControlLabel, au as FormControlValidation, av as FormControlCaption, I as IMTBLWidgetEvents, A as AddTokensEventType, aw as getDefaultExportFromCjs, ax as commonjsGlobal, u as useTranslation, ay as Drawer, az as Divider, H as Heading, v as Button, aA as useProvidersContext, aB as WalletDrawer, aC as UnableToConnectDrawer, aD as Fragment, aE as WalletProviderRdns, aF as WrappedBrowserProvider, aG as isPassportProvider, aH as connectEIP6963Provider, aI as ConnectEIP6963ProviderError, aJ as ProvidersContextActions, aK as MenuItem, aL as ChainId, aM as SQUID_NATIVE_TOKEN, aN as commonjsRequire, R as getRemoteImage, aO as OnboardingPagination, aP as ViewContext, aQ as useHandover, E as EventTargetContext, aR as HandoverTarget, V as ViewActions, n as getRemoteRive, aS as APPROVE_TXN_ANIMATION, aT as RiveStateMachineInput, aU as HandoverContent, aV as keyframes, l as TokenFilterTypes, aW as isNativeToken, aX as getTokenImageByAddress, aY as FramedImage, aZ as FramedIcon, a_ as ButtCon, a$ as TextInput, b0 as VerticalMenu, F as getDefaultTokenImage, b1 as TOKEN_PRIORITY_ORDER, y as Body, b2 as EllipsizedText, b3 as Tooltip, b4 as Sticker, b5 as getDurationFormatted, b6 as getTotalRouteFees, b7 as getRouteAndTokenBalances, w as Stack, b8 as Icon, b9 as Badge, ba as getFormattedAmounts, bb as getRemoteVideo, bc as FramedVideo, bd as listVariants, be as motion, bf as listItemVariants, bg as Banner, bh as useRoutes, bi as useInjectedProviders, bj as getProviderSlugFromRdns, bk as X, bl as v4, x as SimpleLayout, K as orchestrationEvents, p as parseUnits, a3 as SharedViews, bm as SquidFooter, bn as TOOLKIT_SQUID_URL, bo as merge$1, bp as SvgIcon, bq as WalletWarningHero, br as getFormattedNumber, bs as FIXED_HANDOVER_DURATION, bt as EXECUTE_TXN_ANIMATION, L as Link, bu as Trans, bv as getRouteChains, bw as t, bx as convertToNetworkChangeableProvider, by as verifyAndSwitchChain, bz as PriceDisplay, _ as LoadingView, bA as useExecute, bB as getFromAmountData, bC as viewReducer, bD as initialViewState, bE as useSquid, bF as useTokens, bG as r, bH as isValidAddress, M as amountInputValidation, bI as fetchChains, bJ as fetchBalances, Q as CloudImage, a4 as ErrorView, bK as ServiceUnavailableErrorView } from './index-CcxHW36j.js';
+import { T as TokenImage } from './TokenImage-BeUf_Ulv.js';
+import { f as fetchRiskAssessmentV2, r as resultHasSanctionedWallets, F as FeesBreakdown } from './FeesBreakdown-BU4haotD.js';
 
 /**
  * The function `useInterval` sets up an interval that repeatedly calls a given callback function with
@@ -884,9 +884,8 @@ function EOAWarningDrawer({ visible, onProceedClick, onCloseDrawer, }) {
                         }, children: [jsx(Button, { sx: { width: '100%', mb: 'base.spacing.x2' }, testId: "non-passport-cta-button", variant: "primary", size: "large", onClick: onCloseDrawer, children: t('drawers.eoaWarning.passportButtonText') }), jsx(Button, { sx: { width: '100%', marginBottom: 'base.spacing.x10' }, testId: "non-passport-cta-button", variant: "tertiary", size: "large", onClick: onProceedClick, children: t('drawers.eoaWarning.proceedButtonText') })] })] }) }) }));
 }
 
-function ConnectWalletDrawer({ heading, visible, onClose, onConnect, onError, providerType, walletOptions, bottomSlot, menuItemSize = 'small', disabledOptions = [], getShouldRequestWalletPermissions, shouldIdentifyUser = true, drawerBackground, }) {
+function ConnectWalletDrawer({ heading, visible, onClose, onConnect, onError, providerType, walletOptions, bottomSlot, menuItemSize = 'small', disabledOptions = [], getShouldRequestWalletPermissions, drawerBackground, }) {
     const { providersState: { checkout, fromProvider, lockedToProvider }, providersDispatch, } = useProvidersContext();
-    const { identify, track, user } = useAnalytics();
     const prevWalletChangeEvent = reactExports.useRef();
     const [showUnableToConnectDrawer, setShowUnableToConnectDrawer] = reactExports.useState(false);
     const [showEOAWarningDrawer, setShowEOAWarningDrawer] = reactExports.useState(false);
@@ -917,18 +916,6 @@ function ConnectWalletDrawer({ heading, visible, onClose, onConnect, onError, pr
     const handleWalletConnection = async (event) => {
         const { providerDetail } = event;
         const { info } = providerDetail;
-        // Trigger analytics connect wallet, menu item, with wallet details
-        track({
-            userJourney: UserJourney.CONNECT,
-            screen: 'ConnectWallet',
-            control: removeSpace(info.name),
-            controlType: 'MenuItem',
-            extras: {
-                providerType,
-                wallet: getProviderSlugFromRdns(info.rdns),
-                walletRdns: info.rdns,
-            },
-        });
         if (info.rdns === WalletProviderRdns.PASSPORT) {
             const { isConnected } = await checkout.checkIsWalletConnected({
                 provider: new WrappedBrowserProvider(providerDetail.provider),
@@ -945,12 +932,6 @@ function ConnectWalletDrawer({ heading, visible, onClose, onConnect, onError, pr
         const shouldRequestWalletPermissions = getShouldRequestWalletPermissions?.(info);
         try {
             const { provider } = await connectEIP6963Provider(providerDetail, checkout, shouldRequestWalletPermissions);
-            // Identify connected wallet, retaining current anonymousId
-            if (shouldIdentifyUser) {
-                const userData = user ? await user() : undefined;
-                const anonymousId = userData?.anonymousId();
-                await identifyUser(identify, provider, { anonymousId });
-            }
             // Store selected provider as fromProvider in context
             address = await setProviderInContext(provider, providerDetail.info);
             // Notify successful connection
@@ -1037,7 +1018,7 @@ function PayWithWalletDrawer({ visible, onClose, onConnect, onPayWithCard, walle
     }, [onClose, onPayWithCard]);
     return (jsx(ConnectWalletDrawer, { heading: insufficientBalance
             ? t('drawers.wallet.payWithHeadingInsufficientBalance')
-            : t('drawers.wallet.payWithHeading'), visible: visible, onClose: onClose, providerType: "from", walletOptions: walletOptions, disabledOptions: disabledOptions, bottomSlot: payWithCardItem, onConnect: handleOnConnect, shouldIdentifyUser: false, drawerBackground: drawerBackground }));
+            : t('drawers.wallet.payWithHeading'), visible: visible, onClose: onClose, providerType: "from", walletOptions: walletOptions, disabledOptions: disabledOptions, bottomSlot: payWithCardItem, onConnect: handleOnConnect, drawerBackground: drawerBackground }));
 }
 
 function convertToUsd(tokens, amount, token) {
@@ -3958,7 +3939,6 @@ function OnboardingDrawer({ environment }) {
 
 const useError = (environment) => {
     const { viewDispatch } = reactExports.useContext(ViewContext);
-    const { page } = useAnalytics();
     const { t } = useTranslation();
     const { addHandover, closeHandover } = useHandover({
         id: HandoverTarget.GLOBAL,
@@ -4066,15 +4046,7 @@ const useError = (environment) => {
         },
     };
     const getErrorConfig = (errorType) => errorConfig[errorType];
-    const showErrorHandover = (errorType, data) => {
-        page({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'Error',
-            extras: {
-                errorType,
-                ...data,
-            },
-        });
+    const showErrorHandover = (errorType) => {
         addHandover({
             animationUrl: getRemoteRive(environment, APPROVE_TXN_ANIMATION),
             inputValue: RiveStateMachineInput.ERROR,
@@ -4103,7 +4075,6 @@ function TokenDrawerMenu({ checkout, config, toTokenAddress, addTokensState, add
     const [visible, setVisible] = reactExports.useState(false);
     const [searchValue, setSearchValue] = reactExports.useState('');
     const defaultTokenImage = getDefaultTokenImage(checkout?.config.environment, config.theme);
-    const { track } = useAnalytics();
     const { t } = useTranslation();
     const setSelectedToken = (token) => {
         addTokensDispatch({
@@ -4114,16 +4085,6 @@ function TokenDrawerMenu({ checkout, config, toTokenAddress, addTokensState, add
         });
     };
     const handleTokenChange = reactExports.useCallback((token) => {
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            control: 'TokensMenu',
-            controlType: 'MenuItem',
-            extras: {
-                contextId: addTokensState.id,
-                tokenAddress: token?.address,
-            },
-        });
         setSelectedToken(token);
         setVisible(false);
         setSearchValue('');
@@ -4199,7 +4160,7 @@ function TokenDrawerMenu({ checkout, config, toTokenAddress, addTokensState, add
                 }
             }
             catch (error) {
-                showErrorHandover(AddTokensErrorTypes.SERVICE_BREAKDOWN, { contextId: addTokensState.id, error });
+                showErrorHandover(AddTokensErrorTypes.SERVICE_BREAKDOWN);
             }
         })();
     }, [addTokensState.tokens, checkout, toTokenAddress]);
@@ -4362,33 +4323,13 @@ showSwapOption,
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 showBridgeOption, insufficientBalance, }) {
     const { t } = useTranslation();
-    const { track } = useAnalytics();
-    const { addTokensState: { id, chains }, } = reactExports.useContext(AddTokensContext);
+    const { addTokensState: { chains }, } = reactExports.useContext(AddTokensContext);
     const { providersState: { fromProviderInfo, fromAddress }, } = useProvidersContext();
     const selectedRouteIndex = reactExports.useRef(0);
     const handleOnRouteClick = (route, index) => {
         selectedRouteIndex.current = index;
         onRouteClick(route);
     };
-    reactExports.useEffect(() => {
-        if (!visible) {
-            return;
-        }
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            control: 'RoutesMenu',
-            controlType: 'MenuItem',
-            action: 'Opened',
-            extras: {
-                contextId: id,
-                showOnrampOption: Boolean(showOnrampOption),
-                showSwapOption: Boolean(showSwapOption),
-                insufficientBalance: Boolean(insufficientBalance),
-                routesAvailable: routes?.length ?? 0,
-            },
-        });
-    }, [visible]);
     return (jsx(Drawer, { size: "full", visible: visible, showHeaderBar: false, onCloseDrawer: onClose, children: jsxs(Drawer.Content, { rc: jsx(motion.div, { variants: listVariants, initial: "hidden", animate: "show" }), sx: {
                 pt: 'base.spacing.x3',
                 px: 'base.spacing.x3',
@@ -4454,8 +4395,7 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
     const { fetchRoutes } = useRoutes();
     const { showErrorHandover } = useError(config.environment);
     const { addTokensState, addTokensDispatch, } = reactExports.useContext(AddTokensContext);
-    const { id, squid, chains, balances, tokens, selectedAmount, routes, selectedRouteData, selectedToken, isSwapAvailable, experiments, } = addTokensState;
-    const { track, page, identify, user, } = useAnalytics();
+    const { id, squid, chains, balances, tokens, selectedAmount, routes, selectedRouteData, selectedToken, isSwapAvailable, } = addTokensState;
     const { viewDispatch } = reactExports.useContext(ViewContext);
     const { t } = useTranslation();
     const { eventTargetState: { eventTarget }, } = reactExports.useContext(EventTargetContext);
@@ -4496,29 +4436,6 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
         }
     }, [selectedAmount, inputValue]);
     const setSelectedRouteData = (route) => {
-        if (route) {
-            track({
-                userJourney: UserJourney.ADD_TOKENS,
-                screen: 'InputScreen',
-                control: 'RoutesMenu',
-                controlType: 'MenuItem',
-                extras: {
-                    contextId: id,
-                    toTokenAddress: route.amountData.toToken.address,
-                    toTokenChainId: route.amountData.toToken.chainId,
-                    toTokenSymbol: route.amountData.toToken.symbol,
-                    fromTokenAddress: route.amountData.fromToken.address,
-                    fromTokenChainId: route.amountData.fromToken.chainId,
-                    fromTokenSymbol: route.amountData.fromToken.symbol,
-                    toAmount: route.amountData.toAmount,
-                    fromAmount: route.amountData.fromAmount,
-                    isBridge: route.amountData.toToken.chainId !== route.amountData.fromToken.chainId,
-                    isSwap: route.amountData.toToken.chainId === route.amountData.fromToken.chainId,
-                    hasEmbeddedSwap: !!route.route.route.estimate.actions.find((action) => action.type === dist.ActionType.SWAP),
-                    isInsufficientGas: route.isInsufficientGas,
-                },
-            });
-        }
         addTokensDispatch({
             payload: {
                 type: AddTokensActions.SET_SELECTED_ROUTE_DATA,
@@ -4532,16 +4449,6 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
             setInputValue(value);
             if (amount > 0) {
                 setSelectedAmount(value);
-                track({
-                    userJourney: UserJourney.ADD_TOKENS,
-                    screen: 'InputScreen',
-                    control: 'AmountInput',
-                    controlType: 'TextInput',
-                    extras: {
-                        contextId: id,
-                        toAmount: value,
-                    },
-                });
             }
             else {
                 setSelectedAmount('');
@@ -4568,29 +4475,13 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
         if (!lockedToProvider) {
             return;
         }
-        (async () => {
-            const userData = user ? await user() : undefined;
-            const anonymousId = userData?.anonymousId();
-            await identifyUser(identify, toProvider, { anonymousId });
-        })();
+        (async () => { })();
     }, [toProvider, lockedToProvider]);
     const toChain = reactExports.useMemo(() => chains?.find((chain) => chain.id === ChainId.IMTBL_ZKEVM_MAINNET.toString()), [chains]);
     reactExports.useEffect(() => {
-        if (!id || isSwapAvailable === undefined) {
+        if (!id || isSwapAvailable === undefined)
             return;
-        }
-        page({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            extras: {
-                contextId: id,
-                toAmount,
-                toTokenAddress,
-                geoBlocked: !isSwapAvailable,
-            },
-        }).then((ctx) => {
-            X('commerce', `addTokensLoaded_${ctx.event.messageId}`);
-        });
+        X('commerce', `addTokensLoaded_${v4()}`);
     }, [id, isSwapAvailable]);
     reactExports.useEffect(() => {
         if (!toAmount)
@@ -4627,32 +4518,9 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
                     if (availableRoutes.length === 0) {
                         setInsufficientBalance(true);
                     }
-                    track({
-                        userJourney: UserJourney.ADD_TOKENS,
-                        screen: 'InputScreen',
-                        control: 'RoutesMenu',
-                        controlType: 'MenuItem',
-                        action: 'Request',
-                        extras: {
-                            contextId: id,
-                            routesAvailable: availableRoutes.length,
-                            geoBlocked: !isSwapAvailable,
-                        },
-                    });
                 }
-                catch (error) {
-                    if (error instanceof RouteError && error.data) {
-                        track({
-                            userJourney: UserJourney.ADD_TOKENS,
-                            screen: 'Routes',
-                            action: 'Failed',
-                            extras: {
-                                contextId: id,
-                                message: error.message,
-                                ...error.data,
-                            },
-                        });
-                    }
+                catch {
+                    // Route errors are reflected by the empty routes state.
                 }
                 setFetchingRoutes(false);
             }
@@ -4677,23 +4545,12 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
                 }
             }
             catch (error) {
-                showErrorHandover(AddTokensErrorTypes.SERVICE_BREAKDOWN, { contextId: id, error });
+                showErrorHandover(AddTokensErrorTypes.SERVICE_BREAKDOWN);
             }
         };
         fetchOnRampTokens();
     }, [checkout, id]);
     const sendRequestOnRampEvent = async () => {
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            control: 'PayWithCardMenu',
-            controlType: 'MenuItem',
-            extras: {
-                contextId: id,
-                tokenAddress: selectedToken?.address ?? '',
-                amount: selectedAmount ?? '',
-            },
-        });
         const data = {
             tokenAddress: selectedToken?.address ?? '',
             amount: selectedAmount ?? '',
@@ -4744,21 +4601,6 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
             });
             return;
         }
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            control: 'Review',
-            controlType: 'Button',
-            extras: {
-                contextId: id,
-                toTokenAddress: selectedRouteData.amountData.toToken.address,
-                toTokenChainId: selectedRouteData.amountData.toToken.chainId,
-                fromTokenAddress: selectedRouteData.amountData.fromToken.address,
-                fromTokenChainId: selectedRouteData.amountData.fromToken.chainId,
-                toAmount: selectedRouteData.amountData.toAmount,
-                fromAmount: selectedRouteData.amountData.fromAmount,
-            },
-        });
         viewDispatch({
             payload: {
                 type: ViewActions.UPDATE_VIEW,
@@ -4802,19 +4644,6 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
         && !selectedRouteData.isInsufficientGas
         && !loading;
     const handleWalletConnected = (providerType, provider, providerInfo) => {
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'InputScreen',
-            control: 'WalletsMenu',
-            controlType: 'MenuItem',
-            extras: {
-                contextId: id,
-                providerType,
-                providerName: providerInfo.name,
-                providerRdns: providerInfo.rdns,
-                providerUuid: providerInfo.uuid,
-            },
-        });
         sendConnectProviderSuccessEvent(eventTarget, providerType, provider, providerInfo);
     };
     const getChainInfo = () => {
@@ -4826,19 +4655,6 @@ function AddTokens({ checkout, toAmount, config, toTokenAddress, showOnrampOptio
         }
         return undefined;
     };
-    reactExports.useEffect(() => {
-        if (!id || !experiments)
-            return;
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'Experiments',
-            action: 'Started',
-            extras: {
-                contextId: id,
-                preselectedToken: experiments[AddTokensExperiments.PRESELECTED_TOKEN] || 'none',
-            },
-        });
-    }, [id, experiments]);
     reactExports.useEffect(() => {
         if (selectedRouteData?.isInsufficientGas) {
             setShowNotEnoughGasDrawer(true);
@@ -4961,7 +4777,6 @@ function RouteFees({ visible, onClose, routeData, totalAmount, totalFiatAmount,
 }
 
 const useErrorHandler = () => {
-    const { addTokensState: { id: contextId }, } = reactExports.useContext(AddTokensContext);
     const { providersState: { checkout, }, } = useProvidersContext();
     const { showErrorHandover } = useError(checkout.config.environment);
     const { eventTargetState: { eventTarget }, } = reactExports.useContext(EventTargetContext);
@@ -4986,11 +4801,7 @@ const useErrorHandler = () => {
         if (reason.includes('unrecognized chain')) {
             errorType = AddTokensErrorTypes.UNRECOGNISED_CHAIN;
         }
-        const error = {
-            type: errorType,
-            data: { error: err },
-        };
-        showErrorHandover(errorType, { contextId, error });
+        showErrorHandover(errorType);
     };
     return { onTransactionError };
 };
@@ -5140,13 +4951,11 @@ const dividerSx = {
 };
 function Review({ data, showBackButton = false, onBackButtonClick, onCloseButtonClick, }) {
     const { viewDispatch } = reactExports.useContext(ViewContext);
-    const { track, page } = useAnalytics();
-    const { addTokensState: { id, squid, chains, tokens, }, } = reactExports.useContext(AddTokensContext);
+    const { addTokensState: { squid, chains, tokens, }, } = reactExports.useContext(AddTokensContext);
     const { providersState: { checkout, fromProvider, fromAddress, toAddress, fromProviderInfo, }, } = useProvidersContext();
     const { showErrorHandover } = useError(checkout.config.environment);
     const { eventTargetState: { eventTarget }, } = reactExports.useContext(EventTargetContext);
     const [route, setRoute] = reactExports.useState();
-    const [amountData, setAmountData] = reactExports.useState();
     const [proceedDisabled, setProceedDisabled] = reactExports.useState(true);
     const [showFeeBreakdown, setShowFeeBreakdown] = reactExports.useState(false);
     const [showSecuringQuote, setShowSecuringQuote] = reactExports.useState(false);
@@ -5154,19 +4963,7 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
     const { getRoute } = useRoutes();
     const { showHandover } = useHandoverConfig(checkout.config.environment);
     const { onTransactionError } = useErrorHandler();
-    const { getAllowance, approve, execute, getStatus, } = useExecute(UserJourney.ADD_TOKENS, onTransactionError);
-    reactExports.useEffect(() => {
-        page({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'Review',
-            extras: {
-                contextId: id,
-                toAmount: data.toAmount,
-                toChainId: data.toChainId,
-                toTokenAddress: data.toTokenAddress,
-            },
-        });
-    }, [id]);
+    const { getAllowance, approve, execute, getStatus, } = useExecute('AddTokens', onTransactionError);
     const getFromAmountAndRoute = async () => {
         if (!squid || !tokens)
             return;
@@ -5180,14 +4977,10 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
             return;
         const routeResponse = await getRoute(squid, updatedAmountData?.fromToken, updatedAmountData?.toToken, toAddress, updatedAmountData.fromAmount, updatedAmountData.toAmount, fromAddress, false);
         setRoute(routeResponse.route);
-        setAmountData(updatedAmountData);
         setProceedDisabled(false);
         setShowSecuringQuote(false);
         if (routeResponse?.route === undefined) {
-            showErrorHandover(AddTokensErrorTypes.ROUTE_ERROR, {
-                contextId: id,
-                error: 'Failed to obtain final route',
-            });
+            showErrorHandover(AddTokensErrorTypes.ROUTE_ERROR);
         }
     };
     const { fromChain, toChain } = reactExports.useMemo(() => getRouteChains(chains, route), [chains, route]);
@@ -5197,19 +4990,6 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
     }, []);
     const { totalFees, totalFeesUsd } = reactExports.useMemo(() => getTotalRouteFees(route), [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 = reactExports.useMemo(() => {
@@ -5235,32 +5015,11 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
             return;
         }
         let currentFromAddress = '';
-        track({
-            userJourney: UserJourney.ADD_TOKENS,
-            screen: 'Review',
-            control: 'Proceed',
-            controlType: 'Button',
-            extras: {
-                contextId: id,
-                toTokenAddress: route.route.params.toToken,
-                toTokenChainId: route.route.params.toChain,
-                fromTokenAddress: route.route.params.fromToken,
-                fromTokenChainId: route.route.params.fromChain,
-                fromAddress: route.route.params.fromAddress,
-                toAddress: route.route.params.toAddress,
-                estimatedRouteDuration: route.route.estimate.estimatedRouteDuration,
-                fromAmount: amountData?.fromAmount,
-                toAmount: amountData?.toAmount,
-            },
-        });
         try {
             currentFromAddress = await (await fromProvider.getSigner()).getAddress();
         }
         catch (error) {
-            showErrorHandover(AddTokensErrorTypes.PROVIDER_ERROR, {
-                contextId: id,
-                error,
-            });
+            showErrorHandover(AddTokensErrorTypes.PROVIDER_ERROR);
             return;
         }
         if (currentFromAddress !== fromAddress) {
@@ -5288,30 +5047,7 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
         showHandover(AddTokensHandoverStep.REQUEST_EXECUTION, {});
         const executeTxnReceipt = await execute(squid, fromProviderInfo, changeableProvider, route);
         if (executeTxnReceipt) {
-            track({
-                userJourney: UserJourney.ADD_TOKENS,
-                screen: 'FundsAdded',
-                action: 'Succeeded',
-                extras: {
-                    contextId: id,
-                    ...(route.route.params.fromChain !== ChainId.IMTBL_ZKEVM_MAINNET.toString()
-                        && { txHash: executeTxnReceipt.hash }),
-                    ...(route.route.params.fromChain === ChainId.IMTBL_ZKEVM_MAINNET.toString()
-                        && { immutableZkEVMTxHash: executeTxnReceipt.hash }),
-                    toTokenAddress: route.route.params.toToken,
-                    toTokenChainId: route.route.params.toChain,
-                    fromTokenAddress: route.route.params.fromToken,
-                    fromTokenChainId: route.route.params.fromChain,
-                    fromAmount: amountData?.fromAmount,
-                    fromAddress: route.route.params.fromAddress,
-                    toAddress: route.route.params.toAddress,
-                    toAmount: amountData?.toAmount,
-                    fromTokenSymbol: amountData?.fromToken.symbol,
-                    toTokenSymbol: amountData?.toToken.symbol,
-                },
-            }).then((ctx) => {
-                X('commerce', `addTokensFundsAdded_${ctx.event.messageId}`);
-            });
+            X('commerce', `addTokensFundsAdded_${v4()}`);
             sendAddTokensSuccessEvent(eventTarget, executeTxnReceipt.hash);
             if (toChain === fromChain) {
                 showHandover(AddTokensHandoverStep.SUCCESS_ZKEVM, { transactionHash: executeTxnReceipt.hash });
@@ -5420,7 +5156,6 @@ function AddTokensWidget({ showOnrampOption = true, showSwapOption = true, showB
         history: [{ type: AddTokensWidgetViews.ADD_TOKENS }],
     });
     const { t } = useTranslation();
-    const { page } = useAnalytics();
     const viewReducerValues = reactExports.useMemo(() => ({
         viewState,
         viewDispatch,
@@ -5462,7 +5197,7 @@ function AddTokensWidget({ showOnrampOption = true, showSwapOption = true, showB
     }, [experiments, toTokenAddressParameter]);
     reactExports.useEffect(() => {
         if (config.environment !== r.PRODUCTION) {
-            showErrorHandover(AddTokensErrorTypes.ENVIRONMENT_ERROR, { contextId: id });
+            showErrorHandover(AddTokensErrorTypes.ENVIRONMENT_ERROR);
         }
     }, [config, id]);
     reactExports.useEffect(() => {
@@ -5481,7 +5216,7 @@ function AddTokensWidget({ showOnrampOption = true, showSwapOption = true, showB
         const isInvalidToTokenAddress = toTokenAddress && !isValidAddress(toTokenAddress);
         const isInvalidToAmount = toAmount && !amountInputValidation(toAmount);
         if (isInvalidToTokenAddress || isInvalidToAmount) {
-            showErrorHandover(AddTokensErrorTypes.INVALID_PARAMETERS, { contextId: id });
+            showErrorHandover(AddTokensErrorTypes.INVALID_PARAMETERS);
         }
     }, [toTokenAddress, toAmount, id]);
     reactExports.useEffect(() => {
@@ -5556,15 +5291,7 @@ function AddTokensWidget({ showOnrampOption = true, showSwapOption = true, showB
                                     type: ViewActions.GO_BACK,
                                 },
                             });
-                        }, showBackButton: true })), viewState.view.type === SharedViews.ERROR_VIEW && (jsx(ErrorView, { actionText: t('views.ERROR_VIEW.actionText'), onActionClick: errorAction, onCloseClick: () => sendAddTokensCloseEvent(eventTarget), errorEventAction: () => {
-                            page({
-                                userJourney: UserJourney.ADD_TOKENS,
-                                screen: 'Error',
-                                extras: {
-                                    contextId: id,
-                                },
-                            });
-                        } })), viewState.view.type
+                        }, showBackButton: true })), viewState.view.type === SharedViews.ERROR_VIEW && (jsx(ErrorView, { actionText: t('views.ERROR_VIEW.actionText'), onActionClick: errorAction, onCloseClick: () => sendAddTokensCloseEvent(eventTarget) })), viewState.view.type
                         === SharedViews.SERVICE_UNAVAILABLE_ERROR_VIEW && (jsx(ServiceUnavailableErrorView, { onCloseClick: () => sendAddTokensCloseEvent(eventTarget), onBackButtonClick: () => {
                             viewDispatch({
                                 payload: {