@imtbl/sdk 1.78.0-alpha.3 → 1.78.0

package/dist/browser/checkout/{AddTokensWidget-phRi8isq.js → AddTokensWidget-TbB4PmLW.js}

@@ -1,6 +1,8 @@
-import { r as reactExports, I as IMTBLWidgetEvents, A as AddTokensEventType, y as commonjsGlobal, z as getDefaultExportFromCjs, p as jsx, q as jsxs, D as Box, u as useTranslation, F as Drawer, G as Divider, H as Heading, J as Button, K as useProvidersContext, M as useAnalytics, N as WalletDrawer, U as UnableToConnectDrawer, Q as Fragment, R as WalletProviderRdns, T as UserJourney, X as removeSpace, Y as getProviderSlugFromRdns, Z as Web3Provider, _ as isPassportProvider, $ as connectEIP6963Provider, a0 as identifyUser, a1 as ConnectEIP6963ProviderError, a2 as ProvidersContextActions, a3 as MenuItem, a4 as SQUID_NATIVE_TOKEN, k as ChainId, a5 as commonjsRequire, a6 as getRemoteImage, a7 as vFlex, a8 as OnboardingPagination, a9 as ViewContext, aa as useHandover, ab as HandoverTarget, ac as EventTargetContext, V as ViewActions, ad as getRemoteRive, ae as APPROVE_TXN_ANIMATION, af as RiveStateMachineInput, ag as HandoverContent, ah as keyframes, ai as getDefaultTokenImage, aj as TokenFilterTypes, i as getL2ChainId, ak as isNativeToken, al as getTokenImageByAddress, am as TOKEN_PRIORITY_ORDER, an as SmartClone, ao as FramedImage, ap as FramedIcon, aq as ButtCon, ar as TextInput, as as VerticalMenu, at as Body, au as EllipsizedText, av as Tooltip, aw as Sticker, ax as getDurationFormatted, ay as getTotalRouteFees, az as getRouteAndTokenBalances, aA as Stack, aB as hFlex, aC as centerFlexChildren, aD as Icon, aE as Badge, aF as getFormattedAmounts, aG as getRemoteVideo, aH as FramedVideo, aI as listVariants, aJ as motion, aK as listItemVariants, aL as Banner, aM as fetchRiskAssessment, aN as isAddressSanctioned, aO as useRoutes, aP as useInjectedProviders, aQ as trackFlow, aR as RouteError, aS as HeroFormControl, aT as SimpleLayout, aU as dist, n as SharedViews, aV as orchestrationEvents, aW as HeroTextInput, aX as SquidFooter, aY as TOOLKIT_SQUID_URL, aZ as merge, a_ as SvgIcon, a$ as WalletWarningHero, b0 as getFormattedNumber, b1 as FIXED_HANDOVER_DURATION, b2 as EXECUTE_TXN_ANIMATION, b3 as Link, b4 as Trans, b5 as useExecute, b6 as getRouteChains, b7 as t, b8 as convertToNetworkChangeableProvider, b9 as verifyAndSwitchChain, ba as PriceDisplay, L as LoadingView, bb as useTheme, bc as viewReducer, bd as initialViewState, be as useSquid, bf as useTokens, bg as v4, bh as Environment, bi as isValidAddress, bj as amountInputValidation, bk as fetchChains, bl as fetchBalances, bm as CloudImage, E as ErrorView, bn as ServiceUnavailableErrorView } from './index-C-4DEd8a.js';
-import { T as TokenImage } from './TokenImage-DtkH2h2e.js';
-import { F as FeesBreakdown } from './FeesBreakdown-BeOGIvgY.js';
+import { r as reactExports, I as IMTBLWidgetEvents, A as AddTokensEventType, y as commonjsGlobal, z as getDefaultExportFromCjs, D as parseUnits, F as BigNumber, G as useProvidersContext, H as dist, J as formatUnits, K as isPassportProvider, M as SQUID_NATIVE_TOKEN, p as jsx, q as jsxs, N as Box, u as useTranslation, Q as Drawer, R as Divider, T as Heading, U as Button, X as useAnalytics, Y as WalletDrawer, Z as UnableToConnectDrawer, _ as Fragment, $ as WalletProviderRdns, a0 as UserJourney, a1 as removeSpace, a2 as getProviderSlugFromRdns, a3 as Web3Provider, a4 as connectEIP6963Provider, a5 as identifyUser, a6 as ConnectEIP6963ProviderError, a7 as ProvidersContextActions, a8 as MenuItem, k as ChainId, a9 as commonjsRequire, aa as getRemoteImage, ab as vFlex, ac as OnboardingPagination, ad as ViewContext, ae as useHandover, af as HandoverTarget, ag as EventTargetContext, ah as AddTokensErrorTypes, V as ViewActions, ai as getRemoteRive, aj as APPROVE_TXN_ANIMATION, ak as keyframes, al as getDefaultTokenImage, am as TokenFilterTypes, i as getL2ChainId, an as isNativeToken, ao as getTokenImageByAddress, ap as TOKEN_PRIORITY_ORDER, aq as AddTokensActions, ar as SmartClone, as as FramedImage, at as FramedIcon, au as ButtCon, av as TextInput, aw as VerticalMenu, ax as Body, ay as EllipsizedText, az as Tooltip, aA as Sticker, aB as getRouteAndTokenBalances, aC as getRemoteVideo, aD as Stack, aE as fetchRiskAssessment, aF as isAddressSanctioned, aG as AddTokensContext, aH as useInjectedProviders, aI as trackFlow, aJ as AddTokensExperiments, aK as HeroFormControl, aL as getFormattedAmounts, aM as SimpleLayout, n as SharedViews, aN as orchestrationEvents, aO as HeroTextInput, aP as SquidFooter, aQ as RouteOptionsDrawer, aR as TOOLKIT_SQUID_URL, aS as merge, aT as SvgIcon, aU as trackError, aV as MaxUint256, aW as WalletWarningHero, aX as getFormattedNumber, aY as FIXED_HANDOVER_DURATION, aZ as EXECUTE_TXN_ANIMATION, a_ as Link, a$ as Trans, b0 as getTotalRouteFees, b1 as hFlex, b2 as t, b3 as getDurationFormatted, b4 as PriceDisplay, L as LoadingView, b5 as Icon, b6 as useTheme, b7 as viewReducer, b8 as initialViewState, b9 as addTokensReducer, ba as initialAddTokensState, bb as useSquid, bc as useTokens, bd as v4, be as Environment, bf as isValidAddress, bg as amountInputValidation, bh as fetchChains, bi as CloudImage, E as ErrorView, bj as ServiceUnavailableErrorView } from './index-uoFT0va2.js';
+import { r as retry, T as TokenImage } from './TokenImage-BKsKixKT.js';
+import { H as HandoverContent } from './HandoverContent-DB23bXer.js';
+import { C as Contract } from './index-Smb16jHM.js';
+import { F as FeesBreakdown } from './FeesBreakdown-Ck9YzdSC.js';
 
 /**
  * The function `useInterval` sets up an interval that repeatedly calls a given callback function with
@@ -89,108 +91,6 @@ const sendAddTokensFailedEvent = (eventTarget, reason) => {
         eventTarget.dispatchEvent(failedEvent);
 };
 
-const initialAddTokensState = {
-    id: '',
-    allowedTokens: null,
-    squid: null,
-    chains: null,
-    balances: null,
-    tokens: null,
-    routes: [],
-    selectedRouteData: undefined,
-    selectedToken: undefined,
-    selectedAmount: '',
-    isSwapAvailable: undefined,
-    experiments: undefined,
-};
-var AddTokensActions;
-(function (AddTokensActions) {
-    AddTokensActions["SET_ID"] = "SET_ID";
-    AddTokensActions["SET_ALLOWED_TOKENS"] = "SET_ALLOWED_TOKENS";
-    AddTokensActions["SET_SQUID"] = "SET_SQUID";
-    AddTokensActions["SET_CHAINS"] = "SET_CHAINS";
-    AddTokensActions["SET_BALANCES"] = "SET_BALANCES";
-    AddTokensActions["SET_TOKENS"] = "SET_TOKENS";
-    AddTokensActions["SET_ROUTES"] = "SET_ROUTES";
-    AddTokensActions["SET_SELECTED_ROUTE_DATA"] = "SET_SELECTED_ROUTE_DATA";
-    AddTokensActions["SET_SELECTED_TOKEN"] = "SET_SELECTED_TOKEN";
-    AddTokensActions["SET_SELECTED_AMOUNT"] = "SET_SELECTED_AMOUNT";
-    AddTokensActions["SET_IS_SWAP_AVAILABLE"] = "SET_IS_SWAP_AVAILABLE";
-    AddTokensActions["SET_EXPERIMENTS"] = "SET_EXPERIMENTS";
-})(AddTokensActions || (AddTokensActions = {}));
-// eslint-disable-next-line @typescript-eslint/naming-convention
-const AddTokensContext = reactExports.createContext({
-    addTokensState: initialAddTokensState,
-    addTokensDispatch: () => { },
-});
-AddTokensContext.displayName = 'AddTokensContext';
-const addTokensReducer = (state, action) => {
-    switch (action.payload.type) {
-        case AddTokensActions.SET_ID:
-            return {
-                ...state,
-                id: action.payload.id,
-            };
-        case AddTokensActions.SET_ALLOWED_TOKENS:
-            return {
-                ...state,
-                allowedTokens: action.payload.allowedTokens,
-            };
-        case AddTokensActions.SET_SQUID:
-            return {
-                ...state,
-                squid: action.payload.squid,
-            };
-        case AddTokensActions.SET_CHAINS:
-            return {
-                ...state,
-                chains: action.payload.chains,
-            };
-        case AddTokensActions.SET_BALANCES:
-            return {
-                ...state,
-                balances: action.payload.balances,
-            };
-        case AddTokensActions.SET_TOKENS:
-            return {
-                ...state,
-                tokens: action.payload.tokens,
-            };
-        case AddTokensActions.SET_ROUTES:
-            return {
-                ...state,
-                routes: action.payload.routes,
-            };
-        case AddTokensActions.SET_SELECTED_ROUTE_DATA:
-            return {
-                ...state,
-                selectedRouteData: action.payload.selectedRouteData,
-            };
-        case AddTokensActions.SET_SELECTED_TOKEN:
-            return {
-                ...state,
-                selectedToken: action.payload.selectedToken,
-            };
-        case AddTokensActions.SET_SELECTED_AMOUNT:
-            return {
-                ...state,
-                selectedAmount: action.payload.selectedAmount,
-            };
-        case AddTokensActions.SET_IS_SWAP_AVAILABLE:
-            return {
-                ...state,
-                isSwapAvailable: action.payload.isSwapAvailable,
-            };
-        case AddTokensActions.SET_EXPERIMENTS:
-            return {
-                ...state,
-                experiments: action.payload.experiments,
-            };
-        default:
-            return state;
-    }
-};
-
 var AddTokensWidgetViews;
 (function (AddTokensWidgetViews) {
     AddTokensWidgetViews["ADD_TOKENS"] = "ADD_TOKENS";
@@ -578,30 +478,290 @@ var lodash_debounce = debounce;
 
 var debounce$1 = /*@__PURE__*/getDefaultExportFromCjs(lodash_debounce);
 
-var FiatOptionType;
-(function (FiatOptionType) {
-    FiatOptionType["CREDIT"] = "credit";
-    FiatOptionType["DEBIT"] = "debit";
-})(FiatOptionType || (FiatOptionType = {}));
-var AddTokensErrorTypes;
-(function (AddTokensErrorTypes) {
-    AddTokensErrorTypes["DEFAULT"] = "DEFAULT_ERROR";
-    AddTokensErrorTypes["INVALID_PARAMETERS"] = "INVALID_PARAMETERS";
-    AddTokensErrorTypes["SERVICE_BREAKDOWN"] = "SERVICE_BREAKDOWN";
-    AddTokensErrorTypes["TRANSACTION_FAILED"] = "TRANSACTION_FAILED";
-    AddTokensErrorTypes["UNRECOGNISED_CHAIN"] = "UNRECOGNISED_CHAIN";
-    AddTokensErrorTypes["PROVIDER_ERROR"] = "PROVIDER_ERROR";
-    AddTokensErrorTypes["WALLET_FAILED"] = "WALLET_FAILED";
-    AddTokensErrorTypes["WALLET_REJECTED"] = "WALLET_REJECTED";
-    AddTokensErrorTypes["WALLET_REJECTED_NO_FUNDS"] = "WALLET_REJECTED_NO_FUNDS";
-    AddTokensErrorTypes["WALLET_POPUP_BLOCKED"] = "WALLET_POPUP_BLOCKED";
-    AddTokensErrorTypes["ENVIRONMENT_ERROR"] = "ENVIRONMENT_ERROR";
-    AddTokensErrorTypes["ROUTE_ERROR"] = "ROUTE_ERROR";
-})(AddTokensErrorTypes || (AddTokensErrorTypes = {}));
-var AddTokensExperiments;
-(function (AddTokensExperiments) {
-    AddTokensExperiments["PRESELECTED_TOKEN"] = "addTokensPreselectedToken";
-})(AddTokensExperiments || (AddTokensExperiments = {}));
+const delay = (ms) => new Promise((resolve) => {
+    setTimeout(resolve, ms);
+});
+
+const sortRoutesByFastestTime = (routes) => {
+    if (!routes)
+        return [];
+    return routes.slice().sort((a, b) => {
+        // Prioritize isInsufficientGas = false
+        if (a.isInsufficientGas !== b.isInsufficientGas) {
+            return a.isInsufficientGas ? 1 : -1;
+        }
+        // Sort by estimatedRouteDuration if isInsufficientGas is the same
+        const timeA = a.route.route.estimate.estimatedRouteDuration;
+        const timeB = b.route.route.estimate.estimatedRouteDuration;
+        return timeA - timeB;
+    });
+};
+
+const findToken = (tokens, address, chainId) => tokens.find((value) => value.address.toLowerCase() === address.toLowerCase()
+    && value.chainId === chainId);
+
+const isRouteToAmountGreaterThanToAmount = (routeResponse, toAmount) => {
+    if (!routeResponse?.route?.estimate?.toAmount || !routeResponse?.route?.estimate?.toToken?.decimals) {
+        throw new Error('Invalid route response or token decimals');
+    }
+    const toAmountInBaseUnits = parseUnits(toAmount, routeResponse?.route.estimate.toToken.decimals);
+    const routeToAmountInBaseUnits = BigNumber.from(routeResponse.route.estimate.toAmount);
+    return routeToAmountInBaseUnits.gt(toAmountInBaseUnits);
+};
+
+const BASE_SLIPPAGE_HIGH_TIER = 0.005;
+const BASE_SLIPPAGE_MEDIUM_TIER = 0.01;
+const BASE_SLIPPAGE_LOW_TIER = 0.015;
+const SLIPPAGE_TIERS = {
+    high: {
+        threshold: 999,
+        value: BASE_SLIPPAGE_HIGH_TIER,
+    },
+    medium: {
+        threshold: 99,
+        value: BASE_SLIPPAGE_MEDIUM_TIER,
+    },
+    low: {
+        threshold: 0,
+        value: BASE_SLIPPAGE_LOW_TIER,
+    },
+};
+/**
+ * Hook to calculate slippage based on thresholds
+ */
+const useSlippage = () => {
+    const getSlippageTier = (usdAmount) => {
+        if (usdAmount >= SLIPPAGE_TIERS.high.threshold)
+            return SLIPPAGE_TIERS.high.value;
+        if (usdAmount >= SLIPPAGE_TIERS.medium.threshold)
+            return SLIPPAGE_TIERS.medium.value;
+        return SLIPPAGE_TIERS.low.value;
+    };
+    const calculateAdjustedAmount = (baseAmount, usdAmount, additionalBuffer = 0) => {
+        const slippage = getSlippageTier(usdAmount);
+        return baseAmount * (1 + slippage + additionalBuffer);
+    };
+    return reactExports.useMemo(() => ({
+        getSlippageTier,
+        calculateAdjustedAmount,
+    }), []);
+};
+
+/**
+ * Hook to handle route amount calculations.
+ */
+const useRouteCalculation = () => {
+    const { calculateAdjustedAmount } = useSlippage();
+    /**
+       * Calculate the fromAmount based on USD prices and slippage.
+       */
+    const calculateFromAmount = (fromToken, toToken, toAmount, additionalBuffer = 0) => {
+        const toAmountNumber = parseFloat(toAmount);
+        // Calculate the USD value of the toAmount
+        const toAmountInUsd = toAmountNumber * toToken.usdPrice;
+        // Calculate the amount of fromToken needed to match this USD value
+        const baseFromAmount = toAmountInUsd / fromToken.usdPrice;
+        // Add a buffer for price fluctuations and fees
+        const fromAmountWithBuffer = calculateAdjustedAmount(baseFromAmount, toAmountInUsd, additionalBuffer);
+        return fromAmountWithBuffer.toString();
+    };
+    /**
+       * Calculate the fromAmount using exchange rate returned from the route.
+       */
+    const calculateFromAmountFromRoute = (exchangeRate, toAmount, toAmountUSD) => {
+        const toAmountUSDNumber = toAmountUSD ? parseFloat(toAmountUSD) : 0;
+        const fromAmount = parseFloat(toAmount) / parseFloat(exchangeRate);
+        const fromAmountWithBuffer = calculateAdjustedAmount(fromAmount, toAmountUSDNumber);
+        return fromAmountWithBuffer.toString();
+    };
+    /**
+       * Convert a string amount to a formatted amount with the specified number of decimals.
+       */
+    const convertToFormattedFromAmount = (amount, decimals) => {
+        const parsedFromAmount = parseFloat(amount).toFixed(decimals);
+        const formattedFromAmount = parseUnits(parsedFromAmount, decimals);
+        return formattedFromAmount.toString();
+    };
+    return reactExports.useMemo(() => ({
+        calculateFromAmount,
+        calculateFromAmountFromRoute,
+        convertToFormattedFromAmount,
+    }), []);
+};
+
+class RouteError extends Error {
+    message;
+    data;
+    constructor(message, data) {
+        super(message);
+        this.message = message;
+        this.data = data;
+        Object.setPrototypeOf(this, RouteError.prototype);
+    }
+}
+
+const useRoutes = () => {
+    const latestRequestIdRef = reactExports.useRef(0);
+    const { providersState: { toProvider, }, } = useProvidersContext();
+    const { calculateFromAmount, calculateFromAmountFromRoute, convertToFormattedFromAmount } = useRouteCalculation();
+    const getFromAmountData = (tokens, balance, toAmount, toChainId, toTokenAddress, additionalBuffer = 0) => {
+        const fromToken = findToken(tokens, balance.address, balance.chainId.toString());
+        const toToken = findToken(tokens, toTokenAddress, toChainId);
+        if (!fromToken || !toToken) {
+            return undefined;
+        }
+        return {
+            fromToken,
+            fromAmount: calculateFromAmount(fromToken, toToken, toAmount, additionalBuffer),
+            toToken,
+            toAmount,
+            balance,
+            additionalBuffer,
+        };
+    };
+    const getSufficientFromAmounts = (tokens, balances, toChainId, toTokenAddress, toAmount) => {
+        const filteredBalances = balances.filter((balance) => !(balance.address.toLowerCase() === toTokenAddress.toLowerCase()
+            && balance.chainId === toChainId));
+        const fromAmountDataArray = filteredBalances
+            .map((balance) => getFromAmountData(tokens, balance, toAmount, toChainId, toTokenAddress))
+            .filter((value) => value !== undefined);
+        return fromAmountDataArray.filter((data) => {
+            const formattedBalance = formatUnits(data.balance.balance, data.balance.decimals);
+            return (parseFloat(formattedBalance.toString()) > parseFloat(data.fromAmount));
+        });
+    };
+    const getRouteWithRetry = async (squid, fromToken, toToken, toAddress, fromAmount, fromAddress, quoteOnly = true, postHook) => retry(() => squid.getRoute({
+        fromChain: fromToken.chainId,
+        fromToken: fromToken.address,
+        fromAmount: convertToFormattedFromAmount(fromAmount, fromToken.decimals),
+        toChain: toToken.chainId,
+        toToken: toToken.address,
+        fromAddress,
+        toAddress,
+        quoteOnly,
+        enableBoost: true,
+        receiveGasOnDestination: !isPassportProvider(toProvider),
+        postHook,
+    }), {
+        retryIntervalMs: 1000,
+        retries: 5,
+        nonRetryable: (err) => err.response?.status !== 429,
+    });
+    const getRoute = async (squid, fromToken, toToken, toAddress, fromAmount, toAmount, fromAddress, quoteOnly = true, postHook) => {
+        const routeResponse = await getRouteWithRetry(squid, fromToken, toToken, toAddress, fromAmount, fromAddress, quoteOnly, postHook);
+        if (!routeResponse?.route) {
+            return {};
+        }
+        if (isRouteToAmountGreaterThanToAmount(routeResponse, toAmount)) {
+            return { route: routeResponse };
+        }
+        const newFromAmount = calculateFromAmountFromRoute(routeResponse.route.estimate.exchangeRate, toAmount, routeResponse.route.estimate.toAmountUSD);
+        const newRoute = await getRouteWithRetry(squid, fromToken, toToken, toAddress, newFromAmount, fromAddress, quoteOnly, postHook);
+        if (!newRoute?.route) {
+            return {};
+        }
+        if (isRouteToAmountGreaterThanToAmount(newRoute, toAmount)) {
+            return { route: newRoute };
+        }
+        throw new Error('Unable to find a route with sufficient toAmount');
+    };
+    const getRoutesWithFeesValidation = async (squid, toTokenAddress, balances, fromAmountArray, postHook) => {
+        const getGasCost = (route, chainId) => (route.route?.route.estimate.gasCosts || [])
+            .filter((gasCost) => gasCost.token.chainId === chainId.toString())
+            .reduce((sum, gasCost) => sum + parseFloat(formatUnits(gasCost.amount, gasCost.token.decimals)), 0);
+        const getTotalFees = (route, chainId) => (route.route?.route.estimate.feeCosts || [])
+            .filter((fee) => fee.token.chainId === chainId.toString())
+            .reduce((sum, fee) => sum + parseFloat(formatUnits(fee.amount, fee.token.decimals)), 0);
+        const findUserGasBalance = (chainId) => balances.find((balance) => balance.address.toLowerCase() === SQUID_NATIVE_TOKEN.toLowerCase()
+            && balance.chainId.toString() === chainId.toString());
+        const hasSufficientNativeTokenBalance = (userGasBalance, fromAmount, fromToken, totalGasCost, totalFeeCost) => {
+            if (!userGasBalance)
+                return false;
+            const userBalance = parseFloat(formatUnits(userGasBalance.balance, userGasBalance.decimals));
+            // If the fromToken is the native token, validate balance for both fromAmount and gas + fee costs
+            // Otherwise, only validate balance for gas + fee costs
+            const requiredAmount = fromToken.address.toLowerCase() === SQUID_NATIVE_TOKEN.toLowerCase()
+                ? parseFloat(fromAmount) + totalGasCost + totalFeeCost
+                : totalGasCost + totalFeeCost;
+            return userBalance >= requiredAmount;
+        };
+        const routePromises = fromAmountArray.map(async (data) => {
+            const routeResponse = await getRoute(squid, data.fromToken, data.toToken, toTokenAddress, data.fromAmount, data.toAmount, undefined, true, postHook);
+            if (!routeResponse?.route)
+                return null;
+            const gasCost = getGasCost(routeResponse, data.balance.chainId);
+            const feeCost = getTotalFees(routeResponse, data.balance.chainId);
+            const userGasBalance = findUserGasBalance(data.balance.chainId);
+            return {
+                amountData: data,
+                route: routeResponse.route,
+                isInsufficientGas: !hasSufficientNativeTokenBalance(userGasBalance, data.fromAmount, data.fromToken, gasCost, feeCost),
+            };
+        });
+        const routesData = (await Promise.allSettled(routePromises))
+            .filter((result) => result.status === 'fulfilled')
+            .map((result) => result.value)
+            .filter((route) => route !== null);
+        return routesData;
+    };
+    const fetchRoutes = async (squid, tokens, balances, toChainId, toTokenAddress, toAmount, bulkNumber = 5, delayMs = 1000, isSwapAllowed = true) => {
+        const currentRequestId = ++latestRequestIdRef.current;
+        try {
+            let fromAmountDataArray = getSufficientFromAmounts(tokens, balances, toChainId, toTokenAddress, toAmount);
+            if (!isSwapAllowed) {
+                fromAmountDataArray = fromAmountDataArray.filter((amountData) => amountData.balance.chainId !== toChainId);
+            }
+            let allRoutes = [];
+            await Promise.all(fromAmountDataArray
+                .reduce((acc, _, i) => {
+                if (i % bulkNumber === 0) {
+                    acc.push(fromAmountDataArray.slice(i, i + bulkNumber));
+                }
+                return acc;
+            }, [])
+                .map(async (slicedFromAmountDataArray) => {
+                allRoutes.push(...(await getRoutesWithFeesValidation(squid, toTokenAddress, balances, slicedFromAmountDataArray)));
+                await delay(delayMs);
+            }));
+            if (!isSwapAllowed) {
+                allRoutes = allRoutes.filter((routeData) => !routeData.route.route.estimate.actions.find((action) => action.type === dist.ActionType.SWAP));
+            }
+            const sortedRoutes = sortRoutesByFastestTime(allRoutes);
+            // Only return routes if the request is the latest one
+            if (currentRequestId === latestRequestIdRef.current) {
+                return sortedRoutes;
+            }
+            return [];
+        }
+        catch (error) {
+            throw new RouteError('Failed to fetch routes', {
+                fromToken: tokens.find((token) => token.address === toTokenAddress)?.symbol,
+                toToken: tokens.find((token) => token.address === toTokenAddress)?.symbol,
+                toChain: toChainId,
+                errorStatus: error.response?.status,
+                errorMessage: error.response?.data?.message,
+                errorStack: error.stack,
+            });
+        }
+    };
+    const hasSufficientBalance = (balances, toTokenAddress, toChainId, toAmount) => {
+        const matchingTokens = balances.filter((balance) => balance.address.toLowerCase() === toTokenAddress.toLowerCase()
+            && balance.chainId.toString() === toChainId.toString());
+        if (matchingTokens.length > 0) {
+            return matchingTokens.some((balance) => {
+                const tokenAmount = parseFloat(formatUnits(balance.balance, balance.decimals));
+                return tokenAmount >= parseFloat(toAmount);
+            });
+        }
+        return false;
+    };
+    return {
+        hasSufficientBalance,
+        fetchRoutes,
+        getFromAmountData,
+        getRoute,
+    };
+};
 
 function WarningHero() {
     return (jsx(Box, { testId: "warning-hero", sx: {
@@ -3695,6 +3855,15 @@ function OnboardingDrawer({ environment }) {
                     }, children: t(`views.ADD_TOKENS.onboarding.screen${screenIndex}.title`) }), jsx(OnboardingPagination, { disabled: true, size: "small", currentPage: screenIndex, totalPages: 3, sx: { mt: 'base.spacing.x11', mb: 'base.spacing.x8' } }), jsx(Button, { variant: screenIndex === 3 ? 'primary' : 'tertiary', onClick: handleCtaOnClick, size: "large", sx: { alignSelf: 'stretch' }, children: t(`views.ADD_TOKENS.onboarding.screen${screenIndex}.buttonText`) })] }) }));
 }
 
+var RiveStateMachineInput;
+(function (RiveStateMachineInput) {
+    RiveStateMachineInput[RiveStateMachineInput["START"] = 0] = "START";
+    RiveStateMachineInput[RiveStateMachineInput["WAITING"] = 1] = "WAITING";
+    RiveStateMachineInput[RiveStateMachineInput["PROCESSING"] = 2] = "PROCESSING";
+    RiveStateMachineInput[RiveStateMachineInput["COMPLETED"] = 3] = "COMPLETED";
+    RiveStateMachineInput[RiveStateMachineInput["ERROR"] = 4] = "ERROR";
+})(RiveStateMachineInput || (RiveStateMachineInput = {}));
+
 const useError = (environment) => {
     const { viewDispatch } = reactExports.useContext(ViewContext);
     const { page } = useAnalytics();
@@ -4026,114 +4195,6 @@ function SelectedWallet({ label, caption, children, onClick, providerInfo, chain
         }, children: [getMenuItemImage(), jsx(MenuItem.Label, { children: label }), providerInfo?.name ? (jsxs(MenuItem.Caption, { children: [providerInfo?.name, ' • ', jsx(EllipsizedText, { text: providerInfo.address ?? '', sx: { c: 'inherit', fontSize: 'inherit' } })] })) : (jsx(MenuItem.Caption, { children: caption })), jsx(MenuItem.BottomSlot, { children: children })] }));
 }
 
-function RouteOption({ routeData, onClick, chains, disabled = false, isFastest = false, size = 'small', rc = jsx("span", {}), selected = false, }) {
-    const { t } = useTranslation();
-    const { fromToken } = routeData.amountData;
-    const { estimate } = routeData.route.route;
-    const chain = chains?.find((c) => c.id === fromToken.chainId);
-    const estimatedDurationFormatted = getDurationFormatted(estimate.estimatedRouteDuration, t('views.ADD_TOKENS.routeSelection.minutesText'), t('views.ADD_TOKENS.routeSelection.minuteText'), t('views.ADD_TOKENS.routeSelection.secondsText'));
-    const { totalFeesUsd } = reactExports.useMemo(() => getTotalRouteFees(routeData.route), [routeData]);
-    const { routeBalanceUsd, fromAmount, fromAmountUsd } = reactExports.useMemo(() => getRouteAndTokenBalances(routeData), [routeData]);
-    const handleClick = () => {
-        onClick(routeData);
-    };
-    const menuItemProps = {
-        selected,
-        disabled,
-        emphasized: true,
-        rc,
-        size,
-        onClick: disabled ? undefined : handleClick,
-    };
-    return (jsxs(MenuItem, { ...menuItemProps, children: [jsx(MenuItem.Label, { children: fromToken.name }), chain && (jsxs(Sticker, { position: { x: 'right', y: 'bottom' }, children: [jsx(Sticker.FramedImage, { use: jsx("img", { src: chain.iconUrl, alt: chain.name }), size: "xSmall" }), jsx(MenuItem.FramedImage, { circularFrame: true, use: jsx("img", { src: fromToken.iconUrl, alt: fromToken.name }) })] })), jsxs(MenuItem.Caption, { children: [`${t('views.ADD_TOKENS.fees.balance')} ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${routeBalanceUsd}`, routeData.isInsufficientGas && (jsxs(Fragment, { children: [jsx("br", {}), jsx("span", { style: { color: '#FF637F' }, children: t('views.ADD_TOKENS.noGasRouteMessage', {
-                                    token: routeData.route.route.estimate.gasCosts[0].token.symbol,
-                                }) })] }))] }), jsx(MenuItem.PriceDisplay, { price: fromAmount, children: jsx(MenuItem.PriceDisplay.Caption, { children: `${t('views.ADD_TOKENS.fees.fiatPricePrefix')} $${fromAmountUsd}` }) }), jsxs(MenuItem.BottomSlot, { children: [jsx(MenuItem.BottomSlot.Divider, {}), jsxs(Stack, { rc: jsx("span", {}), direction: "row", justifyContent: "space-between", sx: {
-                            w: '100%',
-                        }, children: [jsxs(Body, { sx: {
-                                    ...hFlex,
-                                    ...centerFlexChildren,
-                                    gap: 'base.spacing.x1',
-                                    c: 'base.color.text.body.secondary',
-                                }, size: "xSmall", children: [jsx(Icon, { icon: "Countdown", sx: {
-                                            w: 'base.icon.size.200',
-                                            fill: 'base.color.text.body.secondary',
-                                        }, variant: "bold" }), estimatedDurationFormatted] }), jsxs(Body, { size: "xSmall", sx: { ...hFlex, ...centerFlexChildren }, children: [isFastest && (jsx(Badge, { badgeContent: t('views.ADD_TOKENS.routeSelection.fastestBadge'), variant: "emphasis", sx: { mr: 'base.spacing.x2' } })), `${t('views.ADD_TOKENS.fees.fee')} ${t('views.ADD_TOKENS.fees.fiatPricePrefix')} 
-              $${getFormattedAmounts(totalFeesUsd)}`] })] })] })] }));
-}
-
-function FiatOption({ type, onClick, disabled = false, size = 'small', rc = jsx("span", {}), }) {
-    const { t } = useTranslation();
-    const icon = {
-        [FiatOptionType.DEBIT]: 'BankCard',
-        [FiatOptionType.CREDIT]: 'Craft',
-    };
-    const handleClick = () => {
-        onClick?.(type);
-    };
-    const menuItemProps = {
-        disabled,
-        emphasized: true,
-        onClick: disabled ? undefined : handleClick,
-        size,
-        rc,
-    };
-    return (jsxs(MenuItem, { ...menuItemProps, children: [jsx(MenuItem.FramedIcon, { icon: icon[type], variant: "bold", emphasized: false }), jsx(MenuItem.Label, { children: t(`views.ADD_TOKENS.drawer.options.${type}.heading`) }), jsx(MenuItem.Caption, { children: t(`views.ADD_TOKENS.drawer.options.${type}.${disabled ? 'disabledCaption' : 'caption'}`) }), !disabled && jsx(MenuItem.IntentIcon, {})] }));
-}
-
-const defaultFiatOptions = [
-    FiatOptionType.DEBIT,
-    FiatOptionType.CREDIT,
-];
-function RouteOptions({ checkout, routes, chains, onCardClick, onRouteClick, size, showOnrampOption, insufficientBalance, selectedIndex, }) {
-    const { t } = useTranslation();
-    // @NOTE: early exit with loading related UI, when the
-    // routes are not yet available
-    if (!routes?.length && !insufficientBalance) {
-        return (jsxs(Stack, { sx: { pt: 'base.spacing.x3' }, alignItems: "stretch", gap: "base.spacing.x1", children: [jsx(MenuItem, { shimmer: "withBottomSlot", size: "small", emphasized: true }), jsx(MenuItem, { shimmer: "withBottomSlot", size: "small", emphasized: true }), jsxs(Body, { sx: { textAlign: 'center', mt: 'base.spacing.x6' }, size: "small", children: [t('views.ADD_TOKENS.drawer.options.loadingText1'), jsx("br", {}), t('views.ADD_TOKENS.drawer.options.loadingText2')] }), jsx(FramedVideo, { mimeType: "video/mp4", videoUrl: getRemoteVideo(checkout.config.environment, '/loading_bubble-small.mp4'), sx: { alignSelf: 'center', mt: 'base.spacing.x2' }, size: "large", circularFrame: true })] }));
-    }
-    const noRoutes = !(!insufficientBalance || routes?.length);
-    return (jsxs(Stack, { sx: { py: 'base.spacing.x3' }, alignItems: "stretch", gap: "base.spacing.x1", testId: "options-list", justifyContent: "center", rc: jsx(motion.div, { variants: listVariants, initial: "hidden", animate: "show" }), children: [routes?.map((routeData, index) => (jsx(RouteOption, { size: size, routeData: routeData, chains: chains, onClick: () => onRouteClick(routeData, index), isFastest: index === 0, selected: index === selectedIndex, rc: jsx(motion.div, { variants: listItemVariants }) }, `route-option-${routeData.amountData.fromToken.chainId}-${routeData.amountData.fromToken.address}`))), noRoutes && (jsxs(Banner, { children: [jsx(Banner.Icon, { icon: "InformationCircle" }), jsx(Banner.Title, { children: t('views.ADD_TOKENS.drawer.options.noRoutes.heading') }), jsx(Banner.Caption, { children: t('views.ADD_TOKENS.drawer.options.noRoutes.caption') })] })), showOnrampOption && (jsxs(Fragment, { children: [jsx(Divider, { size: "xSmall", sx: { my: 'base.spacing.x2' }, children: t('views.ADD_TOKENS.drawer.options.moreOptionsDividerText') }), defaultFiatOptions.map((type, idx) => (jsx(FiatOption, { type: type, size: size, onClick: onCardClick, rc: jsx(motion.div, { custom: idx, variants: listItemVariants }) }, `fiat-option-${type}`)))] }))] }));
-}
-
-function RouteOptionsDrawer({ checkout, routes, visible, onClose, onRouteClick, onCardClick, showOnrampOption, 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-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 { 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',
-            }, children: [jsxs(MenuItem, { size: "xSmall", children: [jsx(MenuItem.FramedImage, { padded: true, emphasized: true, use: (jsx("img", { src: fromProviderInfo?.icon, alt: fromProviderInfo?.name })), sx: { mx: 'base.spacing.x2' } }), jsx(MenuItem.Label, { children: t('views.ADD_TOKENS.drawer.options.heading') }), jsxs(MenuItem.Caption, { children: [fromProviderInfo?.name, ' • ', jsx(EllipsizedText, { text: fromAddress ?? '', sx: { c: 'inherit', fontSize: 'inherit' } })] }), jsx(MenuItem.StatefulButtCon, { icon: "ChevronExpand", onClick: onClose })] }), jsx(RouteOptions, { size: "small", checkout: checkout, routes: routes, chains: chains, onCardClick: onCardClick, onRouteClick: handleOnRouteClick, showOnrampOption: showOnrampOption, insufficientBalance: insufficientBalance, selectedIndex: selectedRouteIndex.current })] }) }));
-}
-
 function SelectedRouteOptionContainer({ children, onClick, selected, }) {
     return (jsx(Stack, { direction: "row", alignItems: "center", gap: "base.spacing.x4", sx: {
             ml: ({ base }) => (selected
@@ -4651,6 +4712,207 @@ function SquidIcon({ sx = {}, className, }) {
                 d: "M23.7183 11.2782C23.8008 10.984 23.8565 10.6787 23.8891 10.3676C23.8891 10.3691 23.8896 10.371 23.8896 10.371C23.7207 9.12732 23.3616 7.94412 22.8423 6.85164C22.9051 7.21308 22.9464 7.61484 22.9738 8.08236C23.0458 9.30588 22.5907 11.2187 21.829 12.267C21.1258 13.2347 19.5394 14.1476 18.0279 13.3417C17.2296 12.916 16.3743 11.2883 17.3319 7.87404C17.8498 6.02796 18.0979 3.95148 16.825 2.19084C15.7546 0.710036 13.7962 0.331317 12.1051 0.793076C9.99025 1.37052 8.81665 3.03948 8.33569 5.10972C7.99345 6.58092 8.22145 8.07132 8.80657 9.4806C9.80833 11.8936 11.1394 12.6486 11.1835 14.7428C11.1979 15.4321 11.1456 16.8059 12.1935 16.7056C13.1856 16.6105 13.0627 15.484 12.8467 14.7865C12.5117 13.7036 11.6357 12.7878 10.8139 11.3776C10.1986 10.322 9.79105 9.54924 9.70369 8.37036C9.61345 7.14684 9.94801 5.80812 10.6618 4.7382C11.3237 3.74604 12.7459 2.80956 14.1999 3.49068C14.7298 3.73884 15.0533 4.19772 15.2055 4.6926C15.6821 6.24588 15.0634 7.76364 14.9079 9.67308C14.6487 12.8526 16.7928 17.2144 20.9165 15.1955C22.2413 14.548 23.2776 12.8521 23.7183 11.2782Z", fill: "black" })] }));
 }
 
+const isSquidNativeToken = (token) => token.toLowerCase() === SQUID_NATIVE_TOKEN.toLowerCase();
+
+const withMetricsAsync = async (fn, flowName, anonymousId, errorType) => {
+    const flow = trackFlow('commerce', flowName);
+    if (anonymousId) {
+        flow.addEvent(`anonymousId_${anonymousId}`);
+    }
+    try {
+        return await fn(flow);
+    }
+    catch (error) {
+        if (error instanceof Error) {
+            trackError('commerce', flowName, error);
+        }
+        if (errorType && errorType(error)) {
+            flow.addEvent(`errored_${errorType(error)}`);
+        }
+        else {
+            flow.addEvent('errored');
+        }
+        throw error;
+    }
+    finally {
+        flow.addEvent('End');
+    }
+};
+
+function isRejectedError(err) {
+    const reason = `${err?.reason || err?.message || ''}`.toLowerCase();
+    return reason.includes('rejected') && reason.includes('user');
+}
+
+const TRANSACTION_NOT_COMPLETED = 'transaction not completed';
+const useExecute = (userJourney, onTransactionError) => {
+    const { user } = useAnalytics();
+    const waitForReceipt = async (provider, txHash, maxAttempts = 120) => {
+        const result = await retry(async () => {
+            const receipt = await provider.getTransactionReceipt(txHash);
+            if (!receipt) {
+                throw new Error('receipt not found');
+            }
+            if (receipt.status === 0) {
+                throw new Error('status failed');
+            }
+            return receipt;
+        }, {
+            retries: maxAttempts,
+            retryIntervalMs: 1000,
+            nonRetryable: (error) => error.message === 'status failed',
+        });
+        if (!result) {
+            throw new Error(`Transaction receipt not found after ${maxAttempts} attempts`);
+        }
+        return result;
+    };
+    const getAllowance = async (provider, routeResponse) => {
+        try {
+            if (!isSquidNativeToken(routeResponse?.route?.params.fromToken)) {
+                const erc20Abi = [
+                    'function allowance(address owner, address spender) public view returns (uint256)',
+                ];
+                const fromToken = routeResponse?.route.params.fromToken;
+                const signer = provider.getSigner();
+                const tokenContract = new Contract(fromToken, erc20Abi, signer);
+                const ownerAddress = await signer.getAddress();
+                const transactionRequestTarget = routeResponse?.route?.transactionRequest?.target;
+                if (!transactionRequestTarget) {
+                    throw new Error('transactionRequest target is undefined');
+                }
+                return await tokenContract.allowance(ownerAddress, transactionRequestTarget);
+            }
+            return MaxUint256; // no approval is needed for native tokens
+        }
+        catch (error) {
+            onTransactionError?.(error);
+            return undefined;
+        }
+    };
+    const callApprove = async (flow, fromProviderInfo, provider, routeResponse) => {
+        flow.addEvent(`provider_${fromProviderInfo.name}`);
+        const erc20Abi = [
+            'function approve(address spender, uint256 amount) public returns (bool)',
+        ];
+        const fromToken = routeResponse?.route.params.fromToken;
+        const signer = provider.getSigner();
+        const tokenContract = new Contract(fromToken, erc20Abi, signer);
+        const fromAmount = routeResponse?.route.params.fromAmount;
+        if (!fromAmount) {
+            throw new Error('fromAmount is undefined');
+        }
+        const transactionRequestTarget = routeResponse?.route?.transactionRequest?.target;
+        if (!transactionRequestTarget) {
+            throw new Error('transactionRequest target is undefined');
+        }
+        const tx = await tokenContract.approve(transactionRequestTarget, fromAmount);
+        flow.addEvent('transactionSent');
+        return await waitForReceipt(provider, tx.hash);
+    };
+    const getAnonymousId = async () => {
+        try {
+            const userData = await user();
+            return userData?.anonymousId() ?? undefined;
+        }
+        catch (error) {
+            return undefined;
+        }
+    };
+    const approve = async (fromProviderInfo, provider, routeResponse) => {
+        try {
+            if (!isSquidNativeToken(routeResponse?.route?.params.fromToken)) {
+                return await withMetricsAsync((flow) => callApprove(flow, fromProviderInfo, provider, routeResponse), `${userJourney}_Approve`, await getAnonymousId(), (error) => (isRejectedError(error) ? 'rejected' : ''));
+            }
+            return undefined;
+        }
+        catch (error) {
+            onTransactionError?.(error);
+            return undefined;
+        }
+    };
+    const callExecute = async (flow, squid, fromProviderInfo, provider, routeResponse) => {
+        flow.addEvent(`provider_${fromProviderInfo.name}`);
+        const tx = (await squid.executeRoute({
+            signer: provider.getSigner(),
+            route: routeResponse.route,
+        }));
+        flow.addEvent('transactionSent');
+        return await waitForReceipt(provider, tx.hash);
+    };
+    const execute = async (squid, fromProviderInfo, provider, routeResponse) => {
+        if (!provider.provider.request) {
+            throw new Error('provider does not have request method');
+        }
+        try {
+            return await withMetricsAsync((flow) => callExecute(flow, squid, fromProviderInfo, provider, routeResponse), `${userJourney}_Execute`, await getAnonymousId(), (error) => (isRejectedError(error) ? 'rejected' : ''));
+        }
+        catch (error) {
+            onTransactionError?.(error);
+            return undefined;
+        }
+    };
+    const getStatus = async (squid, transactionHash) => {
+        const completedTransactionStatus = [
+            'success',
+            'partial_success',
+            'needs_gas',
+            'not_found',
+        ];
+        try {
+            return await retry(async () => {
+                const result = await squid.getStatus({
+                    transactionId: transactionHash,
+                });
+                if (completedTransactionStatus.includes(result.squidTransactionStatus ?? '')) {
+                    return result;
+                }
+                return Promise.reject(TRANSACTION_NOT_COMPLETED);
+            }, {
+                retries: 240,
+                retryIntervalMs: 5000,
+                nonRetryable: (err) => {
+                    if (err.response) {
+                        return err.response.status === 400 || err.response.status === 500;
+                    }
+                    return err !== TRANSACTION_NOT_COMPLETED;
+                },
+            });
+        }
+        catch (error) {
+            onTransactionError?.(error);
+            return undefined;
+        }
+    };
+    return {
+        getAllowance,
+        approve,
+        execute,
+        getStatus,
+        waitForReceipt,
+    };
+};
+
+/**
+ * Find a chain by its id
+ * @param chainId - The id of the chain to find
+ * @param chains - The chains to search through
+ * @returns The chain with the matching id, or undefined if no chain is found
+ */
+function findChainById(chainId, chains) {
+    return chains?.find((chain) => chain.id === chainId);
+}
+/**
+ * Get the chains from the route
+ * @param chains - The chains to search through
+ * @param route - The route to get the chains from
+ * @returns The chains from the route
+ */
+const getRouteChains = (chains, route) => ({
+    fromChain: findChainById(route?.route.estimate.fromToken.chainId, chains),
+    toChain: findChainById(route?.route.estimate.toToken.chainId, chains),
+});
+
 function AddressMissmatchDrawer({ visible, onClick, }) {
     const { t } = useTranslation();
     return (jsx(Drawer, { size: "full", visible: visible, showHeaderBar: false, children: jsxs(Drawer.Content, { children: [jsx(WalletWarningHero, {}), jsxs(Box, { sx: { px: 'base.spacing.x6' }, children: [jsx(Heading, { sx: {
@@ -4707,6 +4969,45 @@ function RouteFees({ visible, onClose, routeData, totalAmount, totalFiatAmount,
     return (jsx(FeesBreakdown, { visible: visible, loading: !routeData, fees: [...feeCosts, ...gasCosts], tokenSymbol: tokenSymbol, totalAmount: getFormattedNumber(totalAmount, feesToken?.decimals), totalFiatAmount: getFormattedAmounts(totalFiatAmount), onCloseDrawer: onClose }));
 }
 
+const convertToNetworkChangeableProvider = async (provider) => new Web3Provider(provider.provider, 'any');
+
+/**
+ * Ensure the provider is connected to the correct chain.
+ * If not, attempts to switch to the desired chain.
+ */
+const verifyAndSwitchChain = async (provider, chainId) => {
+    if (!provider.provider.request) {
+        return {
+            isChainCorrect: false,
+            error: 'Provider does not support the request method.',
+        };
+    }
+    try {
+        const targetChainHex = `0x${parseInt(chainId, 10).toString(16)}`;
+        const currentChainId = await provider.provider.request({
+            method: 'eth_chainId',
+        });
+        if (targetChainHex !== currentChainId) {
+            await provider.provider.request({
+                method: 'wallet_switchEthereumChain',
+                params: [
+                    {
+                        chainId: targetChainHex,
+                    },
+                ],
+            });
+        }
+        return { isChainCorrect: true };
+    }
+    catch (error) {
+        const errorMessage = error instanceof Error ? error.message : 'Unknown error occurred';
+        return {
+            isChainCorrect: false,
+            error: errorMessage,
+        };
+    }
+};
+
 const useErrorHandler = () => {
     const { addTokensState: { id: contextId }, } = reactExports.useContext(AddTokensContext);
     const { providersState: { checkout, }, } = useProvidersContext();
@@ -5158,6 +5459,23 @@ function Review({ data, showBackButton = false, onBackButtonClick, onCloseButton
                 } })] }));
 }
 
+const fetchBalances = async (squid, chains, provider) => {
+    const chainIds = chains.map((chain) => chain.id);
+    const address = await provider?.getSigner().getAddress();
+    const promises = [];
+    for (const chainId of chainIds) {
+        const balancePromise = squid.getEvmBalances({
+            chains: [chainId],
+            userAddress: address,
+        });
+        promises.push(balancePromise);
+    }
+    const balances = await Promise.all(promises);
+    return balances
+        .flatMap((balance) => balance)
+        .filter((balance) => balance.balance !== '0');
+};
+
 function AddTokensWidget({ showOnrampOption = true, showSwapOption = true, showBridgeOption = true, toTokenAddress: toTokenAddressParameter, toAmount, showBackButton, config, experiments, }) {
     const fetchingBalances = reactExports.useRef(false);
     const { base: { colorMode } } = useTheme();