@rango-dev/widget-embedded 0.17.1-next.3 → 0.17.1-next.31

package/src/utils/meta.ts

@@ -1,4 +1,4 @@
-import type { Asset, BlockchainMeta, Token } from 'rango-sdk';
+import type { Asset, BlockchainMeta, SwapperMeta, Token } from 'rango-sdk';
 
 import { tokensAreEqual } from './wallets';
 
@@ -17,6 +17,13 @@ export function getBlockchainShortNameFor(
     ?.shortName;
 }
 
+export function getSwapperDisplayName(
+  swapperId: string,
+  swappers: SwapperMeta[]
+) {
+  return swappers.find((swapper) => swapper.id === swapperId)?.swapperGroup;
+}
+
 export function findToken(t: Asset, tokens: Token[]) {
   return tokens.find((token) => tokensAreEqual(token, t)) ?? null;
 }

package/src/utils/providers.ts

@@ -1,6 +1,7 @@
+import type { WidgetConfig } from '../types';
+import type { ProviderInterface } from '@rango-dev/wallets-react';
+
 import { allProviders } from '@rango-dev/provider-all';
-import { ProviderInterface } from '@rango-dev/wallets-react';
-import { WidgetConfig } from '../types';
 
 export interface ProvidersOptions {
   walletConnectProjectId?: WidgetConfig['walletConnectProjectId'];
@@ -26,9 +27,11 @@ export function matchAndGenerateProviders(
     const selectedProviders: ProviderInterface[] = [];
 
     providers.forEach((requestedProvider) => {
-      // There are two types of provider we get, the first one is only passing the wallet name
-      // then we will match the wallet name with our providers (@rango-dev/provider-*).
-      // The second way is passing a custom provider which implemented ProviderInterface.
+      /*
+       * There are two types of provider we get, the first one is only passing the wallet name
+       * then we will match the wallet name with our providers (@rango-dev/provider-*).
+       * The second way is passing a custom provider which implemented ProviderInterface.
+       */
       if (typeof requestedProvider === 'string') {
         const result: ProviderInterface | undefined = all.find((provider) => {
           return provider.config.type === requestedProvider;

package/src/utils/queue.ts

@@ -1,5 +1,5 @@
-import { Manager } from '@rango-dev/queue-manager-core';
-import {
+import type { Manager } from '@rango-dev/queue-manager-core';
+import type {
   PendingSwapWithQueueID,
   SwapStorage,
 } from '@rango-dev/queue-manager-rango-preset';

package/src/utils/quote.ts

@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
 import type { QuoteError, QuoteWarning, Wallet } from '../types';
-import type { PendingSwap } from '@rango-dev/queue-manager-rango-preset';
 import type { PriceImpactWarningLevel } from '@rango-dev/ui';
 import type {
   SimulationAssetAndAmount,
@@ -12,6 +11,7 @@ import type {
   BlockchainMeta,
   Token,
 } from 'rango-sdk';
+import type { PendingSwap } from 'rango-types';
 
 import { getLastSuccessfulStep } from '@rango-dev/queue-manager-rango-preset';
 import BigNumber from 'bignumber.js';
@@ -238,11 +238,12 @@ export function generateQuoteWarnings(
   const outputUsdValue = getUsdValue(toToken, quote.result?.outputAmount ?? '');
 
   if (quote.result && inputUsdValue && outputUsdValue) {
-    const priceImpact = getPercentageChange(
+    const priceImpact = getPriceImpact(
       inputUsdValue.toString(),
       outputUsdValue.toString()
     );
-    const highValueLoss = hasHighValueLoss(inputUsdValue, priceImpact);
+    const highValueLoss =
+      !!priceImpact && hasHighValueLoss(inputUsdValue, priceImpact);
 
     if (highValueLoss) {
       const totalFee = getTotalFeeInUsd(quote.result.swaps, tokens);
@@ -320,13 +321,12 @@ export function generateQuoteErrors(
 export function getPriceImpact(
   inputUsdValue: BigNumber | string | null,
   outputUsdValue: BigNumber | string | null
-) {
+): number | null {
   const outputUsdValueIsInvalid =
     typeof outputUsdValue === 'string'
       ? parseFloat(outputUsdValue) <= 0
       : !outputUsdValue?.gt(0);
-
-  const priceImpact =
+  const percentageChange =
     !inputUsdValue || !outputUsdValue || outputUsdValueIsInvalid
       ? null
       : getPercentageChange(
@@ -334,5 +334,5 @@ export function getPriceImpact(
           outputUsdValue.toString()
         );
 
-  return priceImpact;
+  return percentageChange && percentageChange < 0 ? percentageChange : null;
 }

package/src/utils/settings.ts

@@ -1,5 +1,5 @@
-import { useMetaStore } from '../store/meta';
-import { useSettingsStore } from '../store/settings';
+import type { Features } from '../types';
+import type { SwapperMeta } from 'rango-sdk';
 
 import { removeDuplicateFrom } from './common';
 
@@ -14,11 +14,10 @@ export type UniqueSwappersGroupType = {
 };
 
 export function getUniqueSwappersGroups(
-  supportedSwappers?: string[]
+  swappers: SwapperMeta[],
+  disabledLiquiditySources: string[]
 ): UniqueSwappersGroupType[] {
-  const swappers = useMetaStore.use.meta().swappers;
-  const disabledLiquiditySources =
-    useSettingsStore.use.disabledLiquiditySources();
+  const supportedSwappers = swappers.map((swapper) => swapper.swapperGroup);
 
   const uniqueSupportedSwappersGroups: Array<UniqueSwappersGroupType> = [];
 
@@ -57,16 +56,24 @@ export function getUniqueSwappersGroups(
 }
 
 export function sortLiquiditySourcesByGroupTitle(
-  a: UniqueSwappersGroupType,
-  b: UniqueSwappersGroupType
+  a: SwapperMeta,
+  b: SwapperMeta
 ) {
-  if (a.groupTitle < b.groupTitle) {
+  if (a.swapperGroup < b.swapperGroup) {
     return -1;
   }
 
-  if (a.groupTitle > b.groupTitle) {
+  if (a.swapperGroup > b.swapperGroup) {
     return 1;
   }
 
   return 0;
 }
+
+export function isFeatureHidden(feature: keyof Features, features?: Features) {
+  return features?.[feature] === 'hidden';
+}
+
+export function isFeatureEnabled(feature: keyof Features, features?: Features) {
+  return features?.[feature] === 'enabled';
+}

package/src/utils/swap.ts

@@ -1,16 +1,13 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
-import type { LoadingStatus } from '../store/meta';
-import type { ConnectedWallet } from '../store/wallets';
+import type { FetchStatus } from '../store/slices/data';
 import type {
   ConvertedToken,
+  QuoteError,
+  QuoteWarning,
   RecommendedSlippages,
   SwapButtonState,
   Wallet,
 } from '../types';
-import type {
-  PendingSwap,
-  PendingSwapStep,
-} from '@rango-dev/queue-manager-rango-preset';
 import type { WalletType } from '@rango-dev/wallets-shared';
 import type {
   BestRouteRequest,
@@ -20,10 +17,11 @@ import type {
   SwapResult,
   Token,
 } from 'rango-sdk';
+import type { PendingSwap, PendingSwapStep } from 'rango-types';
 
 import { i18n } from '@lingui/core';
-import { PendingSwapNetworkStatus } from '@rango-dev/queue-manager-rango-preset';
 import BigNumber from 'bignumber.js';
+import { PendingSwapNetworkStatus } from 'rango-types';
 
 import { isValidAddress } from '../components/ConfirmWalletsModal/ConfirmWallets.helpers';
 import { errorMessages } from '../constants/errors';
@@ -35,12 +33,11 @@ import {
   TOKEN_AMOUNT_MAX_DECIMALS,
   TOKEN_AMOUNT_MIN_DECIMALS,
 } from '../constants/routing';
-import { useMetaStore } from '../store/meta';
-import { ButtonState } from '../types';
 
 import { removeDuplicateFrom } from './common';
+import { getBlockchainShortNameFor } from './meta';
 import { numberToString } from './numbers';
-import { getRequiredBalanceOfWallet } from './quote';
+import { getPriceImpact, getRequiredBalanceOfWallet } from './quote';
 import { getRequiredChains } from './wallets';
 
 export function getOutputRatio(
@@ -180,63 +177,70 @@ export function getLimitErrorMessage(quote: BestRouteResponse): {
   return { swap, fromAmountRangeError, recommendation };
 }
 
-export function getSwapButtonState(
-  loadingMetaStatus: LoadingStatus,
-  connectedWallets: ConnectedWallet[],
-  loading: boolean,
-  quote: BestRouteResponse | null,
-  hasLimitError: boolean,
-  highValueLoss: boolean,
-  priceImpactCanNotBeComputed: boolean,
-  needsToWarnEthOnPath: boolean,
-  inputAmount: string
-): SwapButtonState {
-  if (loadingMetaStatus !== 'success') {
+export function getSwapButtonState(params: {
+  fetchMetaStatus: FetchStatus;
+  anyWalletConnected: boolean;
+  fetchingQuote: boolean;
+  inputAmount: string;
+  quote: BestRouteResponse | null;
+  warning: QuoteWarning | null;
+  error: QuoteError | null;
+  needsToWarnEthOnPath: boolean;
+}): SwapButtonState {
+  const {
+    fetchMetaStatus,
+    anyWalletConnected,
+    fetchingQuote,
+    inputAmount,
+    quote,
+    warning,
+    error,
+    needsToWarnEthOnPath,
+  } = params;
+  if (fetchMetaStatus !== 'success') {
     return {
       title: swapButtonTitles().connectWallet,
-      state: ButtonState.WAITFORCONNECTING,
+      action: 'connect-wallet',
       disabled: true,
     };
   }
-  if (connectedWallets.length == 0) {
+  if (!anyWalletConnected) {
     return {
       title: swapButtonTitles().connectWallet,
-      state: ButtonState.WAITFORCONNECTING,
+      action: 'connect-wallet',
       disabled: false,
     };
   }
   if (
-    loading ||
+    fetchingQuote ||
     !quote ||
     !quote.result ||
-    hasLimitError ||
+    error ||
     !inputAmount ||
     inputAmount === '0'
   ) {
     return {
       title: swapButtonTitles().swap,
+      action: 'confirm-swap',
       disabled: true,
-      state: ButtonState.SWAP,
     };
-  } else if (highValueLoss || priceImpactCanNotBeComputed) {
+  } else if (warning) {
     return {
       title: swapButtonTitles().swapAnyway,
+      action: 'confirm-warning',
       disabled: false,
-      hasWarning: true,
-      state: ButtonState.NEEDTOCONFIRM,
     };
   } else if (needsToWarnEthOnPath) {
     return {
       title: swapButtonTitles().ethWarning,
+      action: 'confirm-warning',
       disabled: false,
-      hasWarning: true,
-      state: ButtonState.WARNING,
     };
   }
   return {
     title: swapButtonTitles().swap,
+    action: 'confirm-swap',
     disabled: false,
-    state: ButtonState.SWAP,
   };
 }
 
@@ -360,7 +364,7 @@ export function checkSlippageWarnings(
   quote.result?.swaps.forEach((swap, index) => {
     if (
       swap.recommendedSlippage?.slippage &&
-      parseInt(swap.recommendedSlippage?.slippage) > userSlippage
+      parseFloat(swap.recommendedSlippage.slippage) > userSlippage
     ) {
       recommendedSlippages.set(index, swap.recommendedSlippage.slippage);
     }
@@ -441,6 +445,8 @@ export function createQuoteRequestBody(params: {
   inputAmount: string;
   wallets?: Wallet[];
   selectedWallets?: Wallet[];
+  liquiditySources?: string[];
+  excludeLiquiditySources?: boolean;
   disabledLiquiditySources: string[];
   slippage: number;
   affiliateRef: string | null;
@@ -456,6 +462,8 @@ export function createQuoteRequestBody(params: {
     wallets,
     selectedWallets,
     disabledLiquiditySources,
+    liquiditySources,
+    excludeLiquiditySources,
     slippage,
     affiliateRef,
     affiliatePercent,
@@ -531,13 +539,18 @@ export function createQuoteRequestBody(params: {
     selectedWallets: selectedWalletsMap ?? {},
     slippage: slippage.toString(),
     ...(destination && { destination: destination }),
-    ...(disabledLiquiditySources.length > 0 && {
-      swapperGroups: disabledLiquiditySources,
+    ...(excludeLiquiditySources && {
+      swapperGroups: disabledLiquiditySources.concat(liquiditySources ?? []),
       swappersGroupsExclude: true,
     }),
+    ...(!excludeLiquiditySources && {
+      swapperGroups: liquiditySources?.filter(
+        (liquiditySource) => !disabledLiquiditySources.includes(liquiditySource)
+      ),
+      swappersGroupsExclude: false,
+    }),
     ...(checkPrerequisites && { blockchains: filteredBlockchains }),
   };
-
   return requestBody;
 }
 
@@ -582,10 +595,7 @@ export function isOutputAmountChangedALot(
   if (!oldOutputAmount || !newOutputAmount) {
     return false;
   }
-  const percentageChange = getPercentageChange(
-    oldOutputAmount,
-    newOutputAmount
-  );
+  const percentageChange = getPriceImpact(oldOutputAmount, newOutputAmount);
   if (!percentageChange) {
     return true;
   }
@@ -593,9 +603,10 @@ export function isOutputAmountChangedALot(
   return percentageChange <= -1;
 }
 
-export function getBalanceWarnings(
+export function generateBalanceWarnings(
   quote: BestRouteResponse,
-  selectedWallets: Wallet[]
+  selectedWallets: Wallet[],
+  blockchains: BlockchainMeta[]
 ) {
   const fee = quote.validationStatus;
   const requiredWallets = getRequiredChains(quote);
@@ -640,7 +651,10 @@ export function getBalanceWarnings(
           symbol,
           reason,
           currentAmount,
-          blockchain: asset.asset.blockchain,
+          blockchain: getBlockchainShortNameFor(
+            asset.asset.blockchain,
+            blockchains
+          ),
         },
       });
       return warningMessage;
@@ -744,16 +758,6 @@ export function shouldRetrySwap(pendingSwap: PendingSwap) {
     new Date().getTime() - parseInt(pendingSwap.finishTime) < 4 * 3600 * 1000
   );
 }
-export function isValidCustomDestination(
-  blockchain: string,
-  address: string
-): boolean {
-  const blockchains = useMetaStore.getState().meta.blockchains;
-  const regex =
-    blockchains.find((chain) => chain.name === blockchain)?.addressPatterns ||
-    [];
-  return regex.filter((r) => new RegExp(r).test(address)).length > 0;
-}
 
 export function confirmSwapDisabled(
   fetching: boolean,

package/src/utils/time.ts

@@ -1,4 +1,4 @@
-import type { PendingSwap } from '@rango-dev/queue-manager-rango-preset';
+import type { PendingSwap } from 'rango-types';
 
 import { i18n } from '@lingui/core';