@lifi/widget 2.9.3 → 3.0.0-alpha.0

package/cjs/hooks/useAccount.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAccountDisconnect = exports.useAccount = void 0;
+const sdk_1 = require("@lifi/sdk");
+const wallet_adapter_react_1 = require("@solana/wallet-adapter-react");
+const react_1 = require("react");
+const wagmi_1 = require("wagmi");
+const useAccount = () => {
+    const account = (0, wagmi_1.useAccount)();
+    const { wallet } = (0, wallet_adapter_react_1.useWallet)();
+    return (0, react_1.useMemo)(() => {
+        const svm = wallet?.adapter.publicKey
+            ? {
+                address: wallet?.adapter.publicKey.toString(),
+                chainId: sdk_1.ChainId.SOL,
+                chainType: sdk_1.ChainType.SVM,
+                connector: wallet?.adapter,
+                isConnected: Boolean(wallet?.adapter.publicKey),
+                isConnecting: false,
+                isReconnecting: false,
+                isDisconnected: !wallet,
+                status: 'connected',
+            }
+            : {
+                chainType: sdk_1.ChainType.SVM,
+                isConnected: false,
+                isConnecting: false,
+                isReconnecting: false,
+                isDisconnected: true,
+                status: 'disconnected',
+            };
+        const evm = { ...account, chainType: sdk_1.ChainType.EVM };
+        return {
+            account: account.isConnected ? evm : svm,
+            accounts: [evm, svm],
+        };
+    }, [account, wallet]);
+};
+exports.useAccount = useAccount;
+const useAccountDisconnect = () => {
+    const account = (0, wagmi_1.useAccount)();
+    const { disconnect: wagmiDisconnect } = (0, wagmi_1.useDisconnect)();
+    const { wallet, disconnect } = (0, wallet_adapter_react_1.useWallet)();
+    return () => {
+        if (account.isConnected) {
+            wagmiDisconnect();
+        }
+        if (wallet) {
+            disconnect();
+        }
+    };
+};
+exports.useAccountDisconnect = useAccountDisconnect;

package/cjs/hooks/useAvailableChains.d.ts

@@ -0,0 +1,6 @@
+import type { ExtendedChain } from '@lifi/sdk';
+export declare const useAvailableChains: () => {
+    chains: ExtendedChain[] | undefined;
+    getChainById: (chainId?: number, chains?: ExtendedChain[] | undefined) => ExtendedChain | undefined;
+    isLoading: boolean;
+};

package/cjs/hooks/useAvailableChains.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAvailableChains = void 0;
+const sdk_1 = require("@lifi/sdk");
+const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
+const useAvailableChains = () => {
+    const { data, isLoading } = (0, react_query_1.useQuery)({
+        queryKey: ['chains'],
+        queryFn: async () => {
+            const chains = await (0, sdk_1.getChains)({
+                chainTypes: [sdk_1.ChainType.EVM, sdk_1.ChainType.SVM],
+            });
+            sdk_1.config.setChains(chains);
+            return chains;
+        },
+        refetchInterval: 300000,
+        staleTime: 300000,
+    });
+    const getChainById = (0, react_1.useCallback)((chainId, chains = data) => {
+        if (!chainId) {
+            return;
+        }
+        const chain = chains?.find((chain) => chain.id === chainId);
+        // if (!chain) {
+        //   throw new Error('Chain not found or chainId is invalid.');
+        // }
+        return chain;
+    }, [data]);
+    return {
+        chains: data,
+        getChainById,
+        isLoading,
+    };
+};
+exports.useAvailableChains = useAvailableChains;

package/cjs/hooks/useChain.js

@@ -2,13 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useChain = void 0;
 const react_1 = require("react");
-const useChains_1 = require("./useChains");
+const useAvailableChains_1 = require("./useAvailableChains");
 const useChain = (chainId) => {
-    const { chains, isLoading } = (0, useChains_1.useChains)();
-    const chain = (0, react_1.useMemo)(() => {
-        const chain = chains?.find((chain) => chain.id === chainId);
-        return chain;
-    }, [chainId, chains]);
+    const { isLoading, getChainById } = (0, useAvailableChains_1.useAvailableChains)();
+    const chain = (0, react_1.useMemo)(() => getChainById(chainId), [chainId, getChainById]);
     return {
         chain,
         isLoading,

package/cjs/hooks/useChains.d.ts

@@ -1,5 +1,5 @@
 export declare const useChains: () => {
     chains: import("@lifi/types").ExtendedChain[] | undefined;
-    getChainById: (chainId: number) => import("@lifi/types").ExtendedChain | undefined;
+    getChainById: (chainId?: number | undefined, chains?: import("@lifi/types").ExtendedChain[] | undefined) => import("@lifi/types").ExtendedChain | undefined;
     isLoading: boolean;
 };

package/cjs/hooks/useChains.js

@@ -1,51 +1,20 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useChains = void 0;
-const react_query_1 = require("@tanstack/react-query");
 const react_1 = require("react");
-const react_hook_form_1 = require("react-hook-form");
 const providers_1 = require("../providers");
-const stores_1 = require("../stores");
+const useAvailableChains_1 = require("./useAvailableChains");
 const useChains = () => {
-    const { chains, keyPrefix } = (0, providers_1.useWidgetConfig)();
-    const lifi = (0, providers_1.useLiFi)();
-    const { getValues, setValue } = (0, react_hook_form_1.useFormContext)();
-    const initializeChains = (0, stores_1.useChainOrderStore)((state) => state.initializeChains);
-    const { data: availableChains, isLoading: isLoadingAvailableChains } = (0, react_query_1.useQuery)(['chains'], async () => lifi.getChains(), {
-        refetchInterval: 300000,
-        staleTime: 300000,
-    });
-    const { data: filteredChains, isLoading: isLoadingFilteredChains } = (0, react_query_1.useQuery)(['filtered-chains', availableChains?.length, keyPrefix], async () => {
-        if (!availableChains) {
-            return;
-        }
-        const filteredChains = availableChains.filter((chain) => (0, providers_1.isItemAllowed)(chain.id, chains));
-        const chainOrder = initializeChains(filteredChains.map((chain) => chain.id));
-        const [fromChainValue, toChainValue] = getValues([
-            providers_1.FormKey.FromChain,
-            providers_1.FormKey.ToChain,
-        ]);
-        if (!fromChainValue) {
-            setValue(providers_1.FormKey.FromChain, chainOrder[0]);
-        }
-        if (!toChainValue) {
-            setValue(providers_1.FormKey.ToChain, chainOrder[0]);
-        }
+    const { chains } = (0, providers_1.useWidgetConfig)();
+    const { chains: availableChains, isLoading: isLoadingAvailableChains, getChainById, } = (0, useAvailableChains_1.useAvailableChains)();
+    const filteredChains = (0, react_1.useMemo)(() => {
+        const filteredChains = availableChains?.filter((chain) => (0, providers_1.isItemAllowed)(chain.id, chains));
         return filteredChains;
-    }, {
-        enabled: Boolean(availableChains),
-    });
-    const getChainById = (0, react_1.useCallback)((chainId) => {
-        const chain = availableChains?.find((chain) => chain.id === chainId);
-        // if (!chain) {
-        //   throw new Error('Chain not found or chainId is invalid.');
-        // }
-        return chain;
-    }, [availableChains]);
+    }, [availableChains, chains]);
     return {
         chains: filteredChains,
         getChainById,
-        isLoading: isLoadingAvailableChains || isLoadingFilteredChains,
+        isLoading: isLoadingAvailableChains,
     };
 };
 exports.useChains = useChains;

package/cjs/hooks/useFromTokenSufficiency.d.ts

@@ -1,5 +1,5 @@
-import type { Route } from '@lifi/sdk';
-export declare const useFromTokenSufficiency: (route?: Route) => {
+import type { RouteExtended } from '@lifi/sdk';
+export declare const useFromTokenSufficiency: (route?: RouteExtended) => {
     insufficientFromToken: boolean | undefined;
-    isInitialLoading: boolean;
+    isLoading: boolean;
 };

package/cjs/hooks/useFromTokenSufficiency.js

@@ -2,16 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFromTokenSufficiency = void 0;
 const react_query_1 = require("@tanstack/react-query");
-const big_js_1 = require("big.js");
 const react_hook_form_1 = require("react-hook-form");
+const viem_1 = require("viem");
 const providers_1 = require("../providers");
 const stores_1 = require("../stores");
-const useGetTokenBalancesWithRetry_1 = require("./useGetTokenBalancesWithRetry");
+const useAccount_1 = require("./useAccount");
 const useTokenAddressBalance_1 = require("./useTokenAddressBalance");
+const useTokenBalance_1 = require("./useTokenBalance");
 const refetchInterval = 30000;
 const useFromTokenSufficiency = (route) => {
-    const { account } = (0, providers_1.useWallet)();
-    const getTokenBalancesWithRetry = (0, useGetTokenBalancesWithRetry_1.useGetTokenBalancesWithRetry)(account.signer?.provider);
+    const { account } = (0, useAccount_1.useAccount)();
     const [fromChainId, fromTokenAddress, fromAmount] = (0, react_hook_form_1.useWatch)({
         name: [providers_1.FormKey.FromChain, providers_1.FormKey.FromToken, providers_1.FormKey.FromAmount],
     });
@@ -21,49 +21,47 @@ const useFromTokenSufficiency = (route) => {
         chainId = route.fromToken.chainId;
         tokenAddress = route.fromToken.address;
     }
-    const { token, isLoading } = (0, useTokenAddressBalance_1.useTokenAddressBalance)(chainId, tokenAddress);
-    const { data: insufficientFromToken, isInitialLoading } = (0, react_query_1.useQuery)([
-        'from-token-sufficiency-check',
-        account.address,
-        chainId,
-        tokenAddress,
-        route?.id ?? fromAmount,
-    ], async () => {
-        if (!account.address || !token) {
-            return;
-        }
-        let currentTokenBalance = (0, big_js_1.default)(token?.amount || 0);
-        if (!route || (0, stores_1.isRouteDone)(route)) {
-            const insufficientFunds = currentTokenBalance.lt((0, big_js_1.default)(fromAmount || 0));
+    const { token, isLoading: isTokenAddressBalanceLoading } = (0, useTokenAddressBalance_1.useTokenAddressBalance)(chainId, tokenAddress);
+    const { data: insufficientFromToken, isLoading } = (0, react_query_1.useQuery)({
+        queryKey: [
+            'from-token-sufficiency-check',
+            account.address,
+            chainId,
+            tokenAddress,
+            route?.id ?? fromAmount,
+        ],
+        queryFn: async () => {
+            if (!account.address || !token) {
+                return;
+            }
+            const parsedFromAmount = (0, viem_1.parseUnits)(fromAmount, token.decimals);
+            let currentTokenBalance = token.amount ?? 0n;
+            if (!route || (0, stores_1.isRouteDone)(route)) {
+                const insufficientFunds = currentTokenBalance < parsedFromAmount;
+                return insufficientFunds;
+            }
+            const currentAction = route.steps.filter((step) => !step.execution || step.execution.status !== 'DONE')[0]?.action;
+            if (token.chainId === currentAction.fromToken.chainId &&
+                token.address === currentAction.fromToken.address &&
+                currentTokenBalance > 0) {
+                const insufficientFunds = BigInt(route.fromAmount) > currentTokenBalance;
+                return insufficientFunds;
+            }
+            const tokenBalances = await (0, useTokenBalance_1.getTokenBalancesWithRetry)(account.address, [
+                currentAction.fromToken,
+            ]);
+            currentTokenBalance = tokenBalances?.[0]?.amount ?? 0n;
+            const insufficientFunds = BigInt(currentAction.fromAmount) > currentTokenBalance;
             return insufficientFunds;
-        }
-        const currentAction = route.steps.filter((step) => !step.execution || step.execution.status !== 'DONE')[0]?.action;
-        if (token.chainId === currentAction.fromToken.chainId &&
-            token.address === currentAction.fromToken.address &&
-            currentTokenBalance.gt(0)) {
-            const insufficientFunds = (0, big_js_1.default)(route.fromAmount)
-                .div(10 ** route.fromToken.decimals)
-                .gt(currentTokenBalance);
-            return insufficientFunds;
-        }
-        const tokenBalances = await getTokenBalancesWithRetry(account.address, [
-            currentAction.fromToken,
-        ]);
-        currentTokenBalance = (0, big_js_1.default)(tokenBalances?.[0]?.amount || 0);
-        const insufficientFunds = (0, big_js_1.default)(currentAction.fromAmount)
-            .div(10 ** currentAction.fromToken.decimals)
-            .gt(currentTokenBalance);
-        return insufficientFunds;
-    }, {
-        enabled: Boolean(account.address && token && !isLoading),
+        },
+        enabled: Boolean(account.address && token && !isTokenAddressBalanceLoading),
         refetchInterval,
         staleTime: refetchInterval,
-        cacheTime: refetchInterval,
-        keepPreviousData: true,
+        placeholderData: react_query_1.keepPreviousData,
     });
     return {
         insufficientFromToken,
-        isInitialLoading,
+        isLoading,
     };
 };
 exports.useFromTokenSufficiency = useFromTokenSufficiency;

package/cjs/hooks/useGasRecommendation.d.ts

@@ -1,2 +1,2 @@
-import type { ChainId } from '@lifi/sdk';
-export declare const useGasRecommendation: (chainId: ChainId, fromChain?: ChainId, fromToken?: string) => import("@tanstack/react-query").UseQueryResult<import("@lifi/sdk").GasRecommendationResponse | null, unknown>;
+import { type ChainId } from '@lifi/sdk';
+export declare const useGasRecommendation: (toChainId: ChainId, fromChain?: ChainId, fromToken?: string) => import("@tanstack/react-query/build/legacy/types").UseQueryResult<import("@lifi/sdk").GasRecommendationResponse | null, Error>;

package/cjs/hooks/useGasRecommendation.js

@@ -1,28 +1,33 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGasRecommendation = void 0;
+const sdk_1 = require("@lifi/sdk");
 const react_query_1 = require("@tanstack/react-query");
-const providers_1 = require("../providers");
-const useChains_1 = require("./useChains");
+const useAvailableChains_1 = require("./useAvailableChains");
 const refetchInterval = 60000;
-const useGasRecommendation = (chainId, fromChain, fromToken) => {
-    const lifi = (0, providers_1.useLiFi)();
-    const { chains } = (0, useChains_1.useChains)();
-    return (0, react_query_1.useQuery)(['gas-recommendation', chainId, fromChain, fromToken], async ({ queryKey: [_, chainId, fromChain, fromToken] }) => {
-        if (!chains?.some((chain) => chain.id === chainId)) {
-            return null;
-        }
-        const gasRecommendation = await lifi.getGasRecommendation({
-            chainId: chainId,
-            fromChain: fromChain,
-            fromToken: fromToken,
-        });
-        return gasRecommendation;
-    }, {
-        enabled: Boolean(chainId),
+const useGasRecommendation = (toChainId, fromChain, fromToken) => {
+    const { chains } = (0, useAvailableChains_1.useAvailableChains)();
+    const checkRecommendationLiFuel = Boolean(toChainId) &&
+        Boolean(fromChain) &&
+        Boolean(fromToken) &&
+        Boolean(chains?.length);
+    const checkRecommendationMaxButton = Boolean(toChainId) && !fromChain && !fromToken && Boolean(chains?.length);
+    return (0, react_query_1.useQuery)({
+        queryKey: ['gas-recommendation', toChainId, fromChain, fromToken],
+        queryFn: async ({ queryKey: [_, toChainId, fromChain, fromToken], signal, }) => {
+            if (!chains?.some((chain) => chain.id === toChainId)) {
+                return null;
+            }
+            const gasRecommendation = await (0, sdk_1.getGasRecommendation)({
+                chainId: toChainId,
+                fromChain: fromChain,
+                fromToken: fromToken,
+            }, { signal });
+            return gasRecommendation;
+        },
+        enabled: checkRecommendationLiFuel || checkRecommendationMaxButton,
         refetchInterval,
         staleTime: refetchInterval,
-        cacheTime: refetchInterval,
     });
 };
 exports.useGasRecommendation = useGasRecommendation;

package/cjs/hooks/useGasRefuel.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGasRefuel = void 0;
-const big_js_1 = require("big.js");
 const react_1 = require("react");
 const react_hook_form_1 = require("react-hook-form");
 const _1 = require(".");
@@ -9,7 +8,7 @@ const providers_1 = require("../providers");
 const useGasRecommendation_1 = require("./useGasRecommendation");
 const useTokenBalance_1 = require("./useTokenBalance");
 const useGasRefuel = () => {
-    const { getChainById } = (0, _1.useChains)();
+    const { getChainById } = (0, _1.useAvailableChains)();
     const [fromChainId, fromTokenAddress, toChainId, toAddress] = (0, react_hook_form_1.useWatch)({
         name: [
             providers_1.FormKey.FromChain,
@@ -19,25 +18,33 @@ const useGasRefuel = () => {
         ],
     });
     const toChain = getChainById(toChainId);
-    const { token: nativeToken } = (0, useTokenBalance_1.useTokenBalance)(toChainId && toChain?.nativeToken, toAddress);
+    const fromChain = getChainById(fromChainId);
+    const { token: nativeToken } = (0, useTokenBalance_1.useTokenBalance)(toAddress, toChainId && toChain?.nativeToken, toChain);
     const { data: gasRecommendation, isLoading } = (0, useGasRecommendation_1.useGasRecommendation)(toChainId, fromChainId, fromTokenAddress);
+    // When we bridge between ecosystems we need to be sure toAddress is set
+    const isChainTypeSatisfied = fromChain?.chainType !== toChain?.chainType ? Boolean(toAddress) : true;
     const enabled = (0, react_1.useMemo)(() => {
         if (
         // We don't allow same chain refuel.
         // If a user runs out of gas, he can't send a source chain transaction.
         fromChainId === toChainId ||
             !gasRecommendation?.available ||
-            !nativeToken) {
+            !nativeToken ||
+            !isChainTypeSatisfied) {
             return false;
         }
-        const tokenBalance = (0, big_js_1.default)(nativeToken.amount ?? 0);
-        // check if the user balance < 50% of the recommended amount
-        const recommendedAmount = (0, big_js_1.default)(gasRecommendation.recommended.amount)
-            .div(10 ** gasRecommendation.recommended.token.decimals)
-            .div(2);
-        const insufficientGas = tokenBalance.lt(recommendedAmount);
+        const tokenBalance = nativeToken.amount ?? 0n;
+        // Check if the user balance < 50% of the recommended amount
+        const recommendedAmount = BigInt(gasRecommendation.recommended.amount) / 2n;
+        const insufficientGas = tokenBalance < recommendedAmount;
         return insufficientGas;
-    }, [fromChainId, gasRecommendation, nativeToken, toChainId]);
+    }, [
+        fromChainId,
+        gasRecommendation,
+        isChainTypeSatisfied,
+        nativeToken,
+        toChainId,
+    ]);
     return {
         enabled: enabled,
         availble: gasRecommendation?.available,

package/cjs/hooks/useGasSufficiency.d.ts

@@ -1,14 +1,13 @@
-import type { EVMChain, Route, Token } from '@lifi/sdk';
-import Big from 'big.js';
+import { type EVMChain, type RouteExtended, type Token } from '@lifi/sdk';
 export interface GasSufficiency {
-    gasAmount: Big;
-    tokenAmount?: Big;
-    insufficientAmount?: Big;
+    gasAmount: bigint;
+    tokenAmount?: bigint;
+    insufficientAmount?: bigint;
     insufficient?: boolean;
     token: Token;
     chain?: EVMChain;
 }
-export declare const useGasSufficiency: (route?: Route) => {
+export declare const useGasSufficiency: (route?: RouteExtended) => {
     insufficientGas: GasSufficiency[] | undefined;
-    isInitialLoading: boolean;
+    isLoading: boolean;
 };

package/cjs/hooks/useGasSufficiency.js

@@ -2,93 +2,90 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGasSufficiency = void 0;
 const react_query_1 = require("@tanstack/react-query");
-const big_js_1 = require("big.js");
 const _1 = require(".");
-const providers_1 = require("../providers");
 const stores_1 = require("../stores");
+const useAccount_1 = require("./useAccount");
 const refetchInterval = 30000;
 const useGasSufficiency = (route) => {
-    const { account } = (0, providers_1.useWallet)();
-    const { getChainById } = (0, _1.useChains)();
-    const getTokenBalancesWithRetry = (0, _1.useGetTokenBalancesWithRetry)(account.signer?.provider);
-    const { sdkConfig } = (0, providers_1.useWidgetConfig)();
-    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
+    const { account } = (0, useAccount_1.useAccount)();
+    const { getChainById } = (0, _1.useAvailableChains)();
     const { enabledAutoRefuel } = (0, stores_1.useSettings)(['enabledAutoRefuel']);
     const { enabled, isLoading: isRefuelLoading } = (0, _1.useGasRefuel)();
     const enabledRefuel = enabled && enabledAutoRefuel;
-    const { data: insufficientGas, isInitialLoading } = (0, react_query_1.useQuery)(['gas-sufficiency-check', account.address, route?.id], async () => {
-        if (!account.address || !route) {
-            return;
-        }
-        // TODO: include LI.Fuel into calculation once steps and tools are properly typed
-        // const refuelSteps = route.steps
-        //   .flatMap((step) => step.includedSteps)
-        //   .filter((includedStep) => includedStep.tool === 'lifuelProtocol');
-        const gasCosts = route.steps
-            .filter((step) => !step.execution || step.execution.status !== 'DONE')
-            .reduce((groupedGasCosts, step) => {
-            if (step.estimate.gasCosts && !isMultisigSigner) {
-                const { token } = step.estimate.gasCosts[0];
-                const gasCostAmount = step.estimate.gasCosts
-                    .reduce((amount, gasCost) => amount.plus((0, big_js_1.default)(gasCost.amount || 0)), (0, big_js_1.default)(0))
-                    .div(10 ** token.decimals);
-                groupedGasCosts[token.chainId] = {
-                    gasAmount: groupedGasCosts[token.chainId]?.gasAmount.plus(gasCostAmount) ?? gasCostAmount,
-                    token,
-                };
+    const { data: insufficientGas, isLoading } = (0, react_query_1.useQuery)({
+        queryKey: ['gas-sufficiency-check', account.address, route?.id],
+        queryFn: async () => {
+            // TODO: include LI.Fuel into calculation once steps and tools are properly typed
+            // const refuelSteps = route.steps
+            //   .flatMap((step) => step.includedSteps)
+            //   .filter((includedStep) => includedStep.tool === 'lifuelProtocol');
+            const gasCosts = route.steps
+                .filter((step) => !step.execution || step.execution.status !== 'DONE')
+                .reduce((groupedGasCosts, step) => {
+                if (step.estimate.gasCosts &&
+                    account.connector?.id !== 'safe') {
+                    const { token } = step.estimate.gasCosts[0];
+                    const gasCostAmount = step.estimate.gasCosts.reduce((amount, gasCost) => amount + BigInt(gasCost.amount), 0n);
+                    groupedGasCosts[token.chainId] = {
+                        gasAmount: groupedGasCosts[token.chainId]
+                            ? groupedGasCosts[token.chainId].gasAmount + gasCostAmount
+                            : gasCostAmount,
+                        token,
+                    };
+                }
+                // Add fees paid in native tokens to gas sufficiency check (included: false)
+                const nonIncludedFeeCosts = step.estimate.feeCosts?.filter((feeCost) => !feeCost.included);
+                if (nonIncludedFeeCosts?.length) {
+                    const { token } = nonIncludedFeeCosts[0];
+                    const feeCostAmount = nonIncludedFeeCosts.reduce((amount, feeCost) => amount + BigInt(feeCost.amount), 0n);
+                    groupedGasCosts[token.chainId] = {
+                        gasAmount: groupedGasCosts[token.chainId]
+                            ? groupedGasCosts[token.chainId].gasAmount + feeCostAmount
+                            : feeCostAmount,
+                        token,
+                    };
+                }
+                return groupedGasCosts;
+            }, {});
+            if (route.fromToken.address === gasCosts[route.fromChainId]?.token.address) {
+                gasCosts[route.fromChainId].tokenAmount =
+                    gasCosts[route.fromChainId]?.gasAmount + BigInt(route.fromAmount);
             }
-            // Add fees paid in native tokens to gas sufficiency check (included: false)
-            const nonIncludedFeeCosts = step.estimate.feeCosts?.filter((feeCost) => !feeCost.included);
-            if (nonIncludedFeeCosts?.length) {
-                const { token } = nonIncludedFeeCosts[0];
-                const feeCostAmount = nonIncludedFeeCosts
-                    .reduce((amount, feeCost) => amount.plus((0, big_js_1.default)(feeCost.amount || 0)), (0, big_js_1.default)(0))
-                    .div(10 ** token.decimals);
-                groupedGasCosts[token.chainId] = {
-                    gasAmount: groupedGasCosts[token.chainId]?.gasAmount.plus(feeCostAmount) ?? feeCostAmount,
-                    token,
-                };
+            const tokenBalances = await (0, _1.getTokenBalancesWithRetry)(account.address, Object.values(gasCosts).map((item) => item.token));
+            if (!tokenBalances?.length) {
+                return [];
             }
-            return groupedGasCosts;
-        }, {});
-        if (route.fromToken.address === gasCosts[route.fromChainId]?.token.address) {
-            gasCosts[route.fromChainId].tokenAmount = gasCosts[route.fromChainId].gasAmount.plus((0, big_js_1.default)(route.fromAmount).div(10 ** route.fromToken.decimals));
-        }
-        const tokenBalances = await getTokenBalancesWithRetry(account.address, Object.values(gasCosts).map((item) => item.token));
-        if (!tokenBalances?.length) {
-            return;
-        }
-        [route.fromChainId, route.toChainId].forEach((chainId) => {
-            if (gasCosts[chainId]) {
-                const gasTokenBalance = (0, big_js_1.default)(tokenBalances?.find((t) => t.chainId === gasCosts[chainId].token.chainId &&
-                    t.address === gasCosts[chainId].token.address)?.amount ?? 0);
-                const insufficient = gasTokenBalance.lte(0) ||
-                    gasTokenBalance.lt(gasCosts[chainId].gasAmount ?? (0, big_js_1.default)(0)) ||
-                    gasTokenBalance.lt(gasCosts[chainId].tokenAmount ?? (0, big_js_1.default)(0));
-                const insufficientAmount = insufficient
-                    ? gasCosts[chainId].tokenAmount?.minus(gasTokenBalance) ??
-                        gasCosts[chainId].gasAmount.minus(gasTokenBalance)
-                    : undefined;
-                gasCosts[chainId] = {
-                    ...gasCosts[chainId],
-                    insufficient,
-                    insufficientAmount: insufficientAmount?.round(5, big_js_1.default.roundUp),
-                    chain: insufficient ? getChainById(chainId) : undefined,
-                };
-            }
-        });
-        const gasCostResult = Object.values(gasCosts).filter((gasCost) => gasCost.insufficient);
-        return gasCostResult;
-    }, {
+            [route.fromChainId, route.toChainId].forEach((chainId) => {
+                if (gasCosts[chainId]) {
+                    const gasTokenBalance = tokenBalances?.find((t) => t.chainId === gasCosts[chainId].token.chainId &&
+                        t.address === gasCosts[chainId].token.address)?.amount ?? 0n;
+                    const insufficient = gasTokenBalance <= 0n ||
+                        gasTokenBalance < gasCosts[chainId].gasAmount ||
+                        gasTokenBalance < (gasCosts[chainId].tokenAmount ?? 0n);
+                    const insufficientAmount = insufficient
+                        ? gasCosts[chainId].tokenAmount
+                            ? gasCosts[chainId].tokenAmount - gasTokenBalance
+                            : gasCosts[chainId].gasAmount - gasTokenBalance
+                        : undefined;
+                    gasCosts[chainId] = {
+                        ...gasCosts[chainId],
+                        insufficient,
+                        insufficientAmount,
+                        chain: insufficient ? getChainById(chainId) : undefined,
+                    };
+                }
+            });
+            const gasCostResult = Object.values(gasCosts).filter((gasCost) => gasCost.insufficient);
+            return gasCostResult;
+        },
         enabled: Boolean(account.address && route),
         refetchInterval,
         staleTime: refetchInterval,
-        cacheTime: refetchInterval,
     });
     const isInsufficientGas = Boolean(insufficientGas?.length) && !isRefuelLoading && !enabledRefuel;
     return {
         insufficientGas: isInsufficientGas ? insufficientGas : undefined,
-        isInitialLoading,
+        isLoading,
     };
 };
 exports.useGasSufficiency = useGasSufficiency;

package/cjs/hooks/useLanguages.d.ts

@@ -0,0 +1,6 @@
+export declare const useLanguages: () => {
+    availableLanguages: string[];
+    selectedLanguageCode: string | undefined;
+    selectedLanguageDisplayName: string;
+    setLanguageWithCode: (code: string) => void;
+};

package/cjs/hooks/useLanguages.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLanguages = void 0;
+const react_i18next_1 = require("react-i18next");
+const providers_1 = require("../providers");
+const stores_1 = require("../stores");
+const useLanguages = () => {
+    const { t, i18n } = (0, react_i18next_1.useTranslation)();
+    const { languages } = (0, providers_1.useWidgetConfig)();
+    const { language } = (0, stores_1.useSettings)(['language']);
+    const setValue = (0, stores_1.useSettingsStore)((state) => state.setValue);
+    const sortedLanguages = Object.keys(i18n.store.data).sort();
+    const selectedLanguageCode = sortedLanguages.includes(language || i18n.resolvedLanguage || '')
+        ? language || i18n.resolvedLanguage
+        : languages?.default || languages?.allow?.[0];
+    return {
+        availableLanguages: sortedLanguages,
+        selectedLanguageCode: selectedLanguageCode,
+        selectedLanguageDisplayName: t('language.name', {
+            lng: selectedLanguageCode,
+        }),
+        setLanguageWithCode: (code) => {
+            setValue('language', code);
+            i18n.changeLanguage(code);
+        },
+    };
+};
+exports.useLanguages = useLanguages;