@rango-dev/widget-embedded 0.1.10-next.76 → 0.1.10-next.80

package/dist/widget-embedded.esm.js

@@ -8,7 +8,7 @@ import BigNumber, { BigNumber as BigNumber$1 } from 'bignumber.js';
 import { RangoClient, TransactionType } from 'rango-sdk';
 import { readAccountAddress, useWallets, Provider, Events } from '@rango-dev/wallets-core';
 import { allProviders } from '@rango-dev/provider-all';
-import { Network, isEvmAddress, WalletType, isEvmBlockchain } from '@rango-dev/wallets-shared';
+import { Network, isEvmAddress, KEPLR_COMPATIBLE_WALLETS, WalletType, getCosmosExperimentalChainInfo, isCosmosBlockchain, isEvmBlockchain } from '@rango-dev/wallets-shared';
 import { persist } from 'zustand/middleware';
 import { styled as styled$1 } from '@rango-dev/ui/src/theme';
 
@@ -375,10 +375,11 @@ function getSelectableWallets(accounts, selectedWallets, getWalletInfo, required
     name: getWalletInfo(account.walletType).name,
     selected: !!selectedWallets.find(wallet => wallet.chain === account.chain && wallet.walletType === account.walletType)
   }));
-  return requiredChains ? connectedWallets.filter(wallet => requiredChains.includes(wallet.chain)) : removeDuplicateWallets(connectedWallets, 'walletType');
+  return requiredChains ? connectedWallets.filter((wallet, index, array) => requiredChains.includes(wallet.chain) && array.findIndex(w => w.address === wallet.address) === index) : removeDuplicateWallets(connectedWallets, 'walletType');
 }
 const removeDuplicateWallets = (arr, key) => {
-  return [...new Map(arr.map(item => [item[key], item])).values()];
+  const map = new Map(arr.map(item => [item[key], item]));
+  return Array.from(map.values());
 };
 function getBalanceFromWallet(balances, chain, symbol, address) {
   if (balances.length === 0) return null;
@@ -442,8 +443,6 @@ const calculateWalletUsdValue = balance => {
     return modifiedWalletBlockchain;
   });
   const total = numberToString(modifiedWalletBlockchains?.flatMap(b => b.accounts)?.flatMap(a => a?.balances)?.map(b => new BigNumber(b?.amount || ZERO).multipliedBy(b?.usdPrice || 0))?.reduce((a, b) => a.plus(b), ZERO) || ZERO).toString();
-  console.log('total');
-  console.log(total);
   return numberWithThousandSeperator(total);
 };
 function numberWithThousandSeperator(number) {
@@ -468,6 +467,17 @@ const getUsdPrice = (blockchain, symbol, address, allTokens) => {
   const token = allTokens?.find(t => t.blockchain === blockchain && t.symbol?.toUpperCase() === symbol?.toUpperCase() && t.address === address);
   return token?.usdPrice || null;
 };
+const isExperimentalChain = (blockchains, wallet) => {
+  const cosmosExperimentalChainInfo = getCosmosExperimentalChainInfo(Object.entries(blockchains).map(_ref => {
+    let [, blockchainMeta] = _ref;
+    return blockchainMeta;
+  }).filter(isCosmosBlockchain));
+  return cosmosExperimentalChainInfo && !!cosmosExperimentalChainInfo[wallet];
+};
+const getKeplrCompatibleConnectedWallets = selectableWallets => {
+  const connectedWalletTypes = new Set(selectableWallets.map(a => a.walletType.toString()));
+  return KEPLR_COMPATIBLE_WALLETS.filter(compatibleWallet => connectedWalletTypes.has(compatibleWallet));
+};
 
 const useWalletsStore = /*#__PURE__*/createSelectors( /*#__PURE__*/create()(set => ({
   accounts: [],
@@ -596,111 +606,7 @@ const useSettingsStore = /*#__PURE__*/createSelectors( /*#__PURE__*/create()( /*
   name: 'user-settings'
 })));
 
-function getOutputRatio(inputUsdValue, outputUsdValue) {
-  if (inputUsdValue.lte(ZERO) || outputUsdValue.lte(ZERO)) return 0;
-  return outputUsdValue.div(inputUsdValue).minus(1).multipliedBy(100);
-}
-function outputRatioHasWarning(inputUsdValue, outputRatio) {
-  return parseInt(outputRatio.toFixed(2) || '0') <= -10 && inputUsdValue.gte(new BigNumber(400)) || parseInt(outputRatio.toFixed(2) || '0') <= -5 && inputUsdValue.gte(new BigNumber(1000));
-}
-function hasLimitError(bestRoute) {
-  return (bestRoute?.result?.swaps || []).filter(swap => {
-    const minimum = !!swap.fromAmountMinValue ? new BigNumber(swap.fromAmountMinValue) : null;
-    const maximum = !!swap.fromAmountMaxValue ? new BigNumber(swap.fromAmountMaxValue) : null;
-    const isExclusive = swap.fromAmountRestrictionType === 'EXCLUSIVE';
-    if (isExclusive) {
-      return minimum?.gte(swap.fromAmount) || maximum?.lte(swap.fromAmount);
-    } else {
-      return minimum?.gt(swap.fromAmount) || maximum?.lt(swap.fromAmount);
-    }
-  }).length > 0;
-}
-function getSwapButtonTitle(accounts, loading, hasLimitError, highValueLoss, priceImpactCanNotBeComputed, needsToWarnEthOnPath) {
-  if (loading) return 'Finding Best Route...';
-  if (accounts.length == 0) return 'Connect Wallet';else if (hasLimitError) return 'Limit Error';else if (highValueLoss) return 'Price impact is too high!';else if (priceImpactCanNotBeComputed) return 'USD price is unknown, price impact might be high!';else if (needsToWarnEthOnPath) return 'The route goes through Ethereum. Continue?';else return 'Swap';
-}
-function canComputePriceImpact(bestRoute, inputAmount, inputUsdValue, outputUsdValue) {
-  return !((inputUsdValue.lte(ZERO) || outputUsdValue.lte(ZERO)) && !!bestRoute?.result && !!inputAmount && inputAmount !== '0' && parseFloat(inputAmount || '0') !== 0);
-}
-function calculatePendingSwap(inputAmount, bestRoute, wallets, settings, validateBalanceOrFee) {
-  const simulationResult = bestRoute.result;
-  if (!simulationResult) throw Error('Simulation result should not be null');
-  return {
-    creationTime: new Date().getTime().toString(),
-    finishTime: null,
-    requestId: bestRoute.requestId || '',
-    inputAmount: inputAmount,
-    wallets,
-    status: 'running',
-    isPaused: false,
-    extraMessage: null,
-    extraMessageSeverity: null,
-    extraMessageDetail: null,
-    extraMessageErrorCode: null,
-    networkStatusExtraMessage: null,
-    networkStatusExtraMessageDetail: null,
-    lastNotificationTime: null,
-    settings: settings,
-    simulationResult: simulationResult,
-    validateBalanceOrFee,
-    //TODO: finalize PendingSwap type and remove ts-ignore
-    //@ts-ignore
-    steps: bestRoute.result?.swaps?.map((s, i) => ({
-      id: i + 1,
-      fromBlockchain: s.from.blockchain,
-      fromSymbol: s.from.symbol,
-      fromSymbolAddress: s.from.address,
-      fromDecimals: s.from.decimals,
-      fromAmountPrecision: s.fromAmountPrecision,
-      fromAmountMinValue: s.fromAmountMinValue,
-      fromAmountMaxValue: s.fromAmountMaxValue,
-      toBlockchain: s.to.blockchain,
-      fromLogo: s.from.logo,
-      toSymbol: s.to.symbol,
-      toSymbolAddress: s.to.address,
-      toDecimals: s.to.decimals,
-      toLogo: s.to.logo,
-      startTransactionTime: new Date().getTime(),
-      swapperId: s.swapperId,
-      expectedOutputAmountHumanReadable: s.toAmount,
-      outputAmount: null,
-      status: 'created',
-      networkStatus: null,
-      executedTransactionId: null,
-      externalTransactionId: null,
-      explorerUrl: null,
-      trackingCode: null,
-      cosmosTransaction: null,
-      solanaTransaction: null,
-      starknetTransaction: null,
-      starknetApprovalTransaction: null,
-      tronTransaction: null,
-      tronApprovalTransaction: null,
-      evmTransaction: null,
-      evmApprovalTransaction: null,
-      transferTransaction: null,
-      diagnosisUrl: null,
-      internalSteps: null,
-      fromBlockchainLogo: '',
-      toBlockchainLogo: '',
-      swapperLogo: '',
-      swapperType: ''
-    })) || []
-  };
-}
-function requiredWallets(route) {
-  const wallets = [];
-  route?.result?.swaps.forEach(swap => {
-    const currentStepFromBlockchain = swap.from.blockchain;
-    const currentStepToBlockchain = swap.to.blockchain;
-    let lastAddedWallet = wallets[wallets.length - 1];
-    if (currentStepFromBlockchain != lastAddedWallet) wallets.push(currentStepFromBlockchain);
-    lastAddedWallet = wallets[wallets.length - 1];
-    if (currentStepToBlockchain != lastAddedWallet) wallets.push(currentStepToBlockchain);
-  });
-  return wallets;
-}
-
+// import { WalletType } from '@rango-dev/wallets-shared';
 function useConfirmSwap() {
   const fromToken = useBestRouteStore.use.fromToken();
   const toToken = useBestRouteStore.use.toToken();
@@ -802,6 +708,7 @@ function useConfirmSwap() {
     const routeChangeStatus = compareRoutes(bestRoute, r, inputAmount.toString(), fromToken.usdPrice, toToken.usdPrice);
     setBestRoute(r);
     const isChanged = routeChangeStatus.isChanged;
+    // const changeWarningMessage = routeChangeStatus.warningMessage;
     setBestRouteChanged(isChanged);
     setWarning('Best route changed');
     setData(r);
@@ -813,19 +720,34 @@ function useConfirmSwap() {
   const swap = () => {
     if (!bestRoute) return;
     if (inputAmount.toString() === '') return;
-    const wallets = selectedWallets.reduce((selectedWalletsMap, selectedWallet) => (selectedWalletsMap[selectedWallet.chain] = {
-      address: selectedWallet.address,
-      walletType: selectedWallet.walletType
-    }, selectedWalletsMap), {});
+    // const wallets = selectedWallets.reduce(
+    //   (
+    //     selectedWalletsMap: { [p: string]: { address: string; walletType: WalletType } },
+    //     selectedWallet,
+    //   ) => (
+    //     (selectedWalletsMap[selectedWallet.chain] = {
+    //       address: selectedWallet.address,
+    //       walletType: selectedWallet.walletType,
+    //     }),
+    //     selectedWalletsMap
+    //   ),
+    //   {},
+    // );
     const proceedAnyway = enoughBalance !== null;
-    const settings = {
-      slippage: slippage.toString(),
-      disabledSwappersGroups: ['Osmosis'],
-      disabledSwappersIds: []
-    };
-    if (proceedAnyway) {
-      const newSwap = calculatePendingSwap(inputAmount.toString(), bestRoute, wallets, settings, false);
-    }
+    // const settings: SwapSavedSettings = {
+    //   slippage: slippage.toString(),
+    //   disabledSwappersGroups: ['Osmosis'],
+    //   disabledSwappersIds: [],
+    // };
+    // if (proceedAnyway) {
+    //   const newSwap: PendingSwap = calculatePendingSwap(
+    //     inputAmount!.toString(),
+    //     bestRoute,
+    //     wallets,
+    //     settings,
+    //     false,
+    //   );
+    // }
     !proceedAnyway && checkFeeAndBalance(selectedWallets).then(data => {
       if (!data) {
         setError('confirm swap error');
@@ -835,17 +757,15 @@ function useConfirmSwap() {
         setError('confirm swap error');
         return;
       } else {
+        // @ts-ignore
         const {
-          hasEnoughBalanceOrSlippage,
-          bestRoute: newBestRoute
+          hasEnoughBalanceOrSlippage
         } = data;
         if (!hasEnoughBalanceOrSlippage) {
           return;
         }
         setEnoughBalance(hasEnoughBalanceOrSlippage.balance && hasEnoughBalanceOrSlippage.slippage);
-        if (hasEnoughBalanceOrSlippage.balance && hasEnoughBalanceOrSlippage.slippage && !hasEnoughBalanceOrSlippage.routeChanged) {
-          const newSwap = calculatePendingSwap(inputAmount.toString(), newBestRoute, wallets, settings, true);
-        } else if (!hasEnoughBalanceOrSlippage.balance) {
+        if (hasEnoughBalanceOrSlippage.balance && hasEnoughBalanceOrSlippage.slippage && !hasEnoughBalanceOrSlippage.routeChanged) ; else if (!hasEnoughBalanceOrSlippage.balance) {
           setError('not enough balance');
         }
       }
@@ -1875,6 +1795,45 @@ const errorMessages = {
   genericServerError: 'Error connecting server, please reload the app and try again'
 };
 
+function getOutputRatio(inputUsdValue, outputUsdValue) {
+  if (inputUsdValue.lte(ZERO) || outputUsdValue.lte(ZERO)) return 0;
+  return outputUsdValue.div(inputUsdValue).minus(1).multipliedBy(100);
+}
+function outputRatioHasWarning(inputUsdValue, outputRatio) {
+  return parseInt(outputRatio.toFixed(2) || '0') <= -10 && inputUsdValue.gte(new BigNumber(400)) || parseInt(outputRatio.toFixed(2) || '0') <= -5 && inputUsdValue.gte(new BigNumber(1000));
+}
+function hasLimitError(bestRoute) {
+  return (bestRoute?.result?.swaps || []).filter(swap => {
+    const minimum = !!swap.fromAmountMinValue ? new BigNumber(swap.fromAmountMinValue) : null;
+    const maximum = !!swap.fromAmountMaxValue ? new BigNumber(swap.fromAmountMaxValue) : null;
+    const isExclusive = swap.fromAmountRestrictionType === 'EXCLUSIVE';
+    if (isExclusive) {
+      return minimum?.gte(swap.fromAmount) || maximum?.lte(swap.fromAmount);
+    } else {
+      return minimum?.gt(swap.fromAmount) || maximum?.lt(swap.fromAmount);
+    }
+  }).length > 0;
+}
+function getSwapButtonTitle(accounts, loading, hasLimitError, highValueLoss, priceImpactCanNotBeComputed, needsToWarnEthOnPath) {
+  if (loading) return 'Finding Best Route...';
+  if (accounts.length == 0) return 'Connect Wallet';else if (hasLimitError) return 'Limit Error';else if (highValueLoss) return 'Price impact is too high!';else if (priceImpactCanNotBeComputed) return 'USD price is unknown, price impact might be high!';else if (needsToWarnEthOnPath) return 'The route goes through Ethereum. Continue?';else return 'Swap';
+}
+function canComputePriceImpact(bestRoute, inputAmount, inputUsdValue, outputUsdValue) {
+  return !((inputUsdValue.lte(ZERO) || outputUsdValue.lte(ZERO)) && !!bestRoute?.result && !!inputAmount && inputAmount !== '0' && parseFloat(inputAmount || '0') !== 0);
+}
+function requiredWallets(route) {
+  const wallets = [];
+  route?.result?.swaps.forEach(swap => {
+    const currentStepFromBlockchain = swap.from.blockchain;
+    const currentStepToBlockchain = swap.to.blockchain;
+    let lastAddedWallet = wallets[wallets.length - 1];
+    if (currentStepFromBlockchain != lastAddedWallet) wallets.push(currentStepFromBlockchain);
+    lastAddedWallet = wallets[wallets.length - 1];
+    if (currentStepToBlockchain != lastAddedWallet) wallets.push(currentStepToBlockchain);
+  });
+  return wallets;
+}
+
 const Container$2 = /*#__PURE__*/styled('div', {
   display: 'flex',
   flexDirection: 'column',
@@ -2153,7 +2112,8 @@ const ListContainer = /*#__PURE__*/styled('div', {
   gap: '.5rem',
   gridTemplateColumns: ' repeat(2, minmax(0, 1fr))',
   height: '450px',
-  alignContent: 'baseline'
+  alignContent: 'baseline',
+  padding: '0 0.5rem'
 });
 const AlertContainer = /*#__PURE__*/styled('div', {
   paddingBottom: '$16'
@@ -2200,25 +2160,36 @@ function WalletsPage() {
 function ConfirmWalletsPage() {
   const navigate = useNavigate();
   const bestRoute = useBestRouteStore.use.bestRoute();
+  const {
+    blockchains
+  } = useMetaStore.use.meta();
   const accounts = useWalletsStore.use.accounts();
   const selectedWallets = useWalletsStore.use.selectedWallets();
   const initSelectedWallets = useWalletsStore.use.initSelectedWallets();
   const setSelectedWallet = useWalletsStore.use.setSelectedWallet();
   const {
-    getWalletInfo
+    getWalletInfo,
+    connect
   } = useWallets();
   const confirmDisabled = !requiredWallets(bestRoute).every(chain => selectedWallets.map(wallet => wallet.chain).includes(chain));
   useEffect(() => {
     initSelectedWallets();
   }, []);
+  const selectableWallets = getSelectableWallets(accounts, selectedWallets, getWalletInfo, getRequiredChains(bestRoute));
+  const handleConnectChain = wallet => {
+    const network = wallet;
+    getKeplrCompatibleConnectedWallets(selectableWallets).forEach(compatibleWallet => connect?.(compatibleWallet, network));
+  };
   return React.createElement(ConfirmWallets, {
     requiredWallets: getRequiredChains(bestRoute),
-    selectableWallets: getSelectableWallets(accounts, selectedWallets, getWalletInfo, getRequiredChains(bestRoute)),
+    selectableWallets: selectableWallets,
     onBack: () => navigate(-1),
     swap: bestRoute,
     onConfirm: () => navigate(navigationRoutes.confirmSwap),
     onChange: wallet => setSelectedWallet(wallet),
-    confirmDisabled: confirmDisabled
+    confirmDisabled: confirmDisabled,
+    handleConnectChain: wallet => handleConnectChain(wallet),
+    isExperimentalChain: wallet => getKeplrCompatibleConnectedWallets(selectableWallets).length > 0 ? isExperimentalChain(blockchains, wallet) : false
   });
 }