@rango-dev/widget-embedded 0.22.4-next.0 → 0.22.4-next.10

package/src/store/wallets.ts

@@ -38,7 +38,6 @@ export interface ConnectedWallet extends Wallet {
 interface WalletsStore {
   connectedWallets: ConnectedWallet[];
   balances: TokensBalance;
-  customDestination: string;
   loading: boolean;
   connectWallet: (accounts: Wallet[], tokens: Token[]) => void;
   disconnectWallet: (walletType: WalletType) => void;
@@ -57,7 +56,6 @@ export const useWalletsStore = createSelectors(
     subscribeWithSelector((set, get) => ({
       connectedWallets: [],
       balances: {},
-      customDestination: '',
       loading: false,
       connectWallet: (accounts, tokens) => {
         const getWalletsDetails = get().getWalletsDetails;

package/src/types/quote.ts

@@ -2,7 +2,12 @@
 
 import type { PriceImpactWarningLevel } from '@rango-dev/ui';
 import type BigNumber from 'bignumber.js';
-import type { SwapResult } from 'rango-sdk';
+import type {
+  BlockchainValidationStatus,
+  RouteTag,
+  RoutingResultType,
+  SwapResult,
+} from 'rango-sdk';
 
 export enum QuoteErrorType {
   NO_RESULT,
@@ -105,3 +110,24 @@ export type ConfirmSwapWarnings = {
   quoteUpdate: QuoteUpdateWarning | null;
   balance: { messages: string[] } | null;
 };
+
+export type QuoteResponse = {
+  requestId: string;
+  swaps?: SwapResult[];
+  diagnosisMessages: string[] | null;
+};
+
+export type SelectedQuote = {
+  swaps: SwapResult[];
+  requestId: string;
+  outputAmount?: string;
+  resultType?: RoutingResultType;
+  tags?: RouteTag[];
+  validationStatus: BlockchainValidationStatus[] | null;
+  requestAmount: string;
+};
+
+export type QuoteErrorResponse = {
+  message: string;
+  options: QuoteError;
+};

package/src/utils/quote.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
-import type { QuoteError, QuoteWarning, Wallet } from '../types';
+import type { QuoteWarning, SelectedQuote, Wallet } from '../types';
 import type { PriceImpactWarningLevel, Step } from '@rango-dev/ui';
 import type {
   SimulationAssetAndAmount,
@@ -7,8 +7,12 @@ import type {
 } from '@rango-dev/ui/dist/widget/ui/src/types/swaps';
 import type {
   Asset,
-  BestRouteResponse,
   BlockchainMeta,
+  MultiRouteResponse,
+  MultiRouteSimulationResult,
+  PreferenceType,
+  RouteTag,
+  TagValue,
   Token,
 } from 'rango-sdk';
 import type { PendingSwap } from 'rango-types';
@@ -16,65 +20,60 @@ import type { PendingSwap } from 'rango-types';
 import { getLastSuccessfulStep } from '@rango-dev/queue-manager-rango-preset';
 import BigNumber from 'bignumber.js';
 
+import { HIGH_PRIORITY_TAGS } from '../constants/quote';
 import { HIGHT_PRICE_IMPACT, LOW_PRICE_IMPACT } from '../constants/routing';
 import { HIGH_SLIPPAGE } from '../constants/swapSettings';
 import { getUsdValue } from '../store/quote';
-import { QuoteErrorType, QuoteWarningType } from '../types';
+import { QuoteWarningType } from '../types';
 
 import { areEqual } from './common';
 import { findBlockchain, findToken } from './meta';
 import {
-  checkSlippageErrors,
   checkSlippageWarnings,
-  getLimitErrorMessage,
   getMinRequiredSlippage,
   getPercentageChange,
   getTotalFeeInUsd,
   hasHighValueLoss,
-  hasLimitError,
   hasProperSlippage,
 } from './swap';
 
 export function getQuoteToTokenUsdPrice(
-  quote: BestRouteResponse | null
+  quote: SelectedQuote | null
 ): number | null | undefined {
-  return quote?.result?.swaps[quote?.result?.swaps.length - 1].to.usdPrice;
+  const swaps = quote?.swaps || [];
+  return swaps[swaps.length - 1].to.usdPrice;
 }
 
 export function isNumberOfSwapsChanged(
-  quoteA: BestRouteResponse,
-  quoteB: BestRouteResponse
+  quoteA: SelectedQuote,
+  quoteB: SelectedQuote
 ) {
-  const quoteASwaps = quoteA.result?.swaps || [];
-  const quoteBSwaps = quoteB.result?.swaps || [];
+  const quoteASwaps = quoteA?.swaps || [];
+  const quoteBSwaps = quoteB?.swaps || [];
   return quoteASwaps.length !== quoteBSwaps.length;
 }
 
 export function isQuoteSwappersUpdated(
-  quoteA: BestRouteResponse,
-  quoteB: BestRouteResponse
+  quoteA: SelectedQuote,
+  quoteB: SelectedQuote
 ) {
-  const quoteASwappers =
-    quoteA.result?.swaps.map((swap) => swap.swapperId) || [];
-  const quoteBSwappers =
-    quoteB.result?.swaps.map((swap) => swap.swapperId) || [];
+  const quoteASwappers = quoteA?.swaps.map((swap) => swap.swapperId) || [];
+  const quoteBSwappers = quoteB?.swaps.map((swap) => swap.swapperId) || [];
   return !areEqual(quoteASwappers, quoteBSwappers);
 }
 
 export function isQuoteInternalCoinsUpdated(
-  quoteA: BestRouteResponse,
-  quoteB: BestRouteResponse
+  quoteA: SelectedQuote,
+  quoteB: SelectedQuote
 ) {
-  const quoteAInternalCoins =
-    quoteA.result?.swaps.map((swap) => swap.to.symbol) || [];
-  const quoteBInternalCoins =
-    quoteB.result?.swaps.map((swap) => swap.to.symbol) || [];
+  const quoteAInternalCoins = quoteA?.swaps.map((swap) => swap.to.symbol) || [];
+  const quoteBInternalCoins = quoteB?.swaps.map((swap) => swap.to.symbol) || [];
   return !areEqual(quoteAInternalCoins, quoteBInternalCoins);
 }
 
 export function isQuoteChanged(
-  quoteA: BestRouteResponse,
-  quoteB: BestRouteResponse
+  quoteA: SelectedQuote,
+  quoteB: SelectedQuote
 ): boolean {
   return (
     isNumberOfSwapsChanged(quoteA, quoteB) ||
@@ -198,7 +197,7 @@ export function createRetryQuote(
 }
 
 export function generateQuoteWarnings(
-  quote: BestRouteResponse,
+  quote: SelectedQuote,
   params: {
     fromToken: Token;
     toToken: Token;
@@ -208,9 +207,9 @@ export function generateQuoteWarnings(
 ): QuoteWarning | null {
   const { fromToken, toToken, tokens, userSlippage } = params;
   const inputUsdValue = getUsdValue(fromToken, quote.requestAmount);
-  const outputUsdValue = getUsdValue(toToken, quote.result?.outputAmount ?? '');
+  const outputUsdValue = getUsdValue(toToken, quote?.outputAmount ?? '');
 
-  if (quote.result && inputUsdValue && outputUsdValue) {
+  if (!!quote && inputUsdValue && outputUsdValue) {
     const priceImpact = getPriceImpact(
       inputUsdValue.toString(),
       outputUsdValue.toString()
@@ -219,7 +218,7 @@ export function generateQuoteWarnings(
       !!priceImpact && hasHighValueLoss(inputUsdValue, priceImpact);
 
     if (highValueLoss) {
-      const totalFee = getTotalFeeInUsd(quote.result.swaps, tokens);
+      const totalFee = getTotalFeeInUsd(quote?.swaps, tokens);
       const warningLevel = getPriceImpactLevel(priceImpact);
       return {
         type: QuoteWarningType.HIGH_VALUE_LOSS,
@@ -230,11 +229,11 @@ export function generateQuoteWarnings(
         warningLevel,
       };
     }
-  } else if (quote.result && (!inputUsdValue || !outputUsdValue)) {
+  } else if (quote && (!inputUsdValue || !outputUsdValue)) {
     return { type: QuoteWarningType.UNKNOWN_PRICE };
   }
 
-  const minRequiredSlippage = getMinRequiredSlippage(quote);
+  const minRequiredSlippage = getMinRequiredSlippage(quote.swaps);
   const highSlippage = userSlippage > HIGH_SLIPPAGE;
 
   if (!hasProperSlippage(params.userSlippage.toString(), minRequiredSlippage)) {
@@ -256,41 +255,6 @@ export function generateQuoteWarnings(
   return null;
 }
 
-export function generateQuoteErrors(
-  quote: BestRouteResponse
-): QuoteError | null {
-  if (!quote.result) {
-    return {
-      type: QuoteErrorType.NO_RESULT,
-      diagnosisMessage: quote.diagnosisMessages?.[0],
-    };
-  }
-  const limitError = hasLimitError(quote);
-  if (limitError) {
-    const { swap, recommendation, fromAmountRangeError } =
-      getLimitErrorMessage(quote);
-    return {
-      type: QuoteErrorType.BRIDGE_LIMIT,
-      swap: swap,
-      recommendation,
-      fromAmountRangeError,
-    };
-  }
-
-  const recommendedSlippages = checkSlippageErrors(quote);
-
-  if (recommendedSlippages) {
-    const minRequiredSlippage = getMinRequiredSlippage(quote);
-    return {
-      type: QuoteErrorType.INSUFFICIENT_SLIPPAGE,
-      recommendedSlippages,
-      minRequiredSlippage,
-    };
-  }
-
-  return null;
-}
-
 export function getPriceImpact(
   inputUsdValue: BigNumber | string | null,
   outputUsdValue: BigNumber | string | null
@@ -326,3 +290,101 @@ export const getUniqueBlockchains = (steps: Step[]) => {
 
   return result;
 };
+
+export const sortQuotesBy = (
+  strategy: PreferenceType,
+  quotes: MultiRouteResponse['results']
+): MultiRouteResponse['results'] => {
+  return quotes.sort((quote1, quote2) => {
+    const getScore = (route: MultiRouteSimulationResult) =>
+      route.scores?.find((score) => score.preferenceType === strategy)?.score ??
+      0;
+
+    const quote1Score = getScore(quote1);
+    const quote2Score = getScore(quote2);
+
+    if (quote1Score !== quote2Score) {
+      return quote2Score - quote1Score;
+    }
+
+    const lowerQuoteId1 = quote1.requestId.toLowerCase();
+    const lowerQuoteId2 = quote2.requestId.toLowerCase();
+
+    return lowerQuoteId1.localeCompare(lowerQuoteId2);
+  });
+};
+
+export const getDefaultQuote = (
+  currentQuote: SelectedQuote | null,
+  quotes: MultiRouteSimulationResult[],
+  requestAmount: string
+): SelectedQuote | null => {
+  if (!quotes.length) {
+    return null;
+  }
+  if (!currentQuote) {
+    // Handle the case where currentQuote is null
+    return {
+      requestAmount: requestAmount,
+      ...quotes[0], // Return the first quote from the quotes array
+    };
+  }
+  // Create a set of swapperIds from the currentQuote swaps
+  const currentQuoteSwapperIds = new Set(
+    currentQuote.swaps.map((swap) => swap.swapperId)
+  );
+
+  // Find a quote that matches the currentQuote's swapperIds
+  const matchedQuote = quotes.find((quote) => {
+    // Create a set of swapperIds from the quote swaps
+    const quoteSwapperIds = new Set(quote.swaps.map((swap) => swap.swapperId));
+
+    // Check if all swapperIds from the currentQuote are present in the quoteSwapperIds
+    return Array.from(currentQuoteSwapperIds).every((swapperId) =>
+      quoteSwapperIds.has(swapperId)
+    );
+  });
+
+  // Return the matchedQuote if found, otherwise return the first quote from the quotes array
+  return {
+    requestAmount: requestAmount,
+    ...(matchedQuote || quotes[0]),
+  };
+};
+
+export const sortTags = (tags: RouteTag[]): RouteTag[] => {
+  const customSort = (a: RouteTag, b: RouteTag) => {
+    const indexA = HIGH_PRIORITY_TAGS.indexOf(a.value);
+    const indexB = HIGH_PRIORITY_TAGS.indexOf(b.value);
+
+    if (indexA !== -1 && indexB !== -1) {
+      return indexA - indexB;
+    }
+
+    if (indexA !== -1) {
+      return -1;
+    } else if (indexB !== -1) {
+      return 1;
+    }
+
+    return 0;
+  };
+
+  return tags.sort(customSort);
+};
+
+export const getRouteTagColor = (tag: TagValue): string => {
+  switch (tag) {
+    case 'FASTEST':
+      return '#06C270';
+    case 'RECOMMENDED':
+      return '#469BF5';
+    case 'LOWEST_FEE':
+      return '#FF4DAD';
+    case 'HIGH_IMPACT':
+      return '#FF3B3B';
+    case 'CENTRALIZED':
+    default:
+      return '#FFF1D4';
+  }
+};

package/src/utils/settings.ts

@@ -1,15 +1,13 @@
 import type { Features } from '../types';
-import type { SwapperMeta } from 'rango-sdk';
+import type { SwapperMeta, SwapperType } from 'rango-sdk';
 
 import { removeDuplicateFrom } from './common';
 
-export type LiquiditySourceType = 'BRIDGE' | 'AGGREGATOR' | 'DEX';
-
 export type UniqueSwappersGroupType = {
   id: string;
   groupTitle: string;
   logo: string;
-  type: LiquiditySourceType;
+  type: SwapperType;
   selected: boolean;
 };
 

package/src/utils/swap.ts

@@ -1,18 +1,19 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
 import type { FeesGroup, NameOfFees } from '../constants/quote';
 import type { FetchStatus } from '../store/slices/data';
+import type { ConnectedWallet } from '../store/wallets';
 import type {
   ConvertedToken,
   QuoteError,
   QuoteWarning,
   RecommendedSlippages,
+  SelectedQuote,
   SwapButtonState,
   Wallet,
 } from '../types';
 import type { WalletType } from '@rango-dev/wallets-shared';
 import type {
   BestRouteRequest,
-  BestRouteResponse,
   BlockchainMeta,
   RecommendedSlippage,
   SwapFee,
@@ -36,7 +37,6 @@ import {
   TOKEN_AMOUNT_MIN_DECIMALS,
 } from '../constants/routing';
 
-import { removeDuplicateFrom } from './common';
 import { getBlockchainShortNameFor } from './meta';
 import { numberToString } from './numbers';
 import { getPriceImpact, getRequiredBalanceOfWallet } from './quote';
@@ -74,9 +74,9 @@ export function hasHighValueLoss(
   );
 }
 
-export function hasLimitError(quote: BestRouteResponse | null): boolean {
+export function hasLimitError(swaps: SwapResult[]): boolean {
   return (
-    (quote?.result?.swaps || []).filter((swap) => {
+    (swaps || []).filter((swap) => {
       const minimum = !!swap.fromAmountMinValue
         ? new BigNumber(swap.fromAmountMinValue)
         : null;
@@ -91,12 +91,13 @@ export function hasLimitError(quote: BestRouteResponse | null): boolean {
     }).length > 0
   );
 }
-export function getLimitErrorMessage(quote: BestRouteResponse): {
+
+export function getLimitErrorMessage(swaps: SwapResult[]): {
   swap: SwapResult;
   fromAmountRangeError: string;
   recommendation: string;
 } {
-  const swap = (quote.result?.swaps || []).filter((swap) => {
+  const swap = (swaps || []).filter((swap) => {
     const minimum = !!swap.fromAmountMinValue
       ? new BigNumber(swap.fromAmountMinValue)
       : null;
@@ -184,7 +185,7 @@ export function getSwapButtonState(params: {
   anyWalletConnected: boolean;
   fetchingQuote: boolean;
   inputAmount: string;
-  quote: BestRouteResponse | null;
+  quote: SelectedQuote | null;
   warning: QuoteWarning | null;
   error: QuoteError | null;
   needsToWarnEthOnPath: boolean;
@@ -213,14 +214,7 @@ export function getSwapButtonState(params: {
       disabled: false,
     };
   }
-  if (
-    fetchingQuote ||
-    !quote ||
-    !quote.result ||
-    error ||
-    !inputAmount ||
-    inputAmount === '0'
-  ) {
+  if (fetchingQuote || !quote || error || !inputAmount || inputAmount === '0') {
     return {
       title: swapButtonTitles().swap,
       action: 'confirm-swap',
@@ -247,24 +241,24 @@ export function getSwapButtonState(params: {
 }
 
 export function canComputePriceImpact(
-  quote: BestRouteResponse | null,
+  quote: SelectedQuote | null,
   inputAmount: string,
   usdValue: BigNumber | null
 ) {
   return !(
     (!usdValue || usdValue.lte(ZERO)) &&
-    !!quote?.result &&
+    !!quote &&
     !!inputAmount &&
     inputAmount !== '0' &&
     parseFloat(inputAmount || '0') !== 0 &&
-    !!quote.result
+    !!quote
   );
 }
 
-export function requiredWallets(quote: BestRouteResponse | null) {
+export function requiredWallets(quote: SelectedQuote | null) {
   const wallets: string[] = [];
 
-  quote?.result?.swaps.forEach((swap) => {
+  quote?.swaps.forEach((swap) => {
     const currentStepFromBlockchain = swap.from.blockchain;
     const currentStepToBlockchain = swap.to.blockchain;
     let lastAddedWallet = wallets[wallets.length - 1];
@@ -377,10 +371,10 @@ export function hasSlippageError(
 }
 
 export function checkSlippageErrors(
-  quote: BestRouteResponse
+  swaps: SwapResult[]
 ): RecommendedSlippages | null {
   const recommendedSlippages: RecommendedSlippages = new Map();
-  quote.result?.swaps.forEach((swap, index) => {
+  swaps.forEach((swap, index) => {
     if (swap.recommendedSlippage?.error) {
       recommendedSlippages.set(index, swap.recommendedSlippage.slippage);
     }
@@ -392,11 +386,11 @@ export function checkSlippageErrors(
 }
 
 export function checkSlippageWarnings(
-  quote: BestRouteResponse,
+  quote: SelectedQuote,
   userSlippage: number
 ): RecommendedSlippages | null {
   const recommendedSlippages: RecommendedSlippages = new Map();
-  quote.result?.swaps.forEach((swap, index) => {
+  quote?.swaps.forEach((swap, index) => {
     if (
       swap.recommendedSlippage?.slippage &&
       parseFloat(swap.recommendedSlippage.slippage) > userSlippage
@@ -410,12 +404,8 @@ export function checkSlippageWarnings(
   return null;
 }
 
-export function getMinRequiredSlippage(
-  quote: BestRouteResponse
-): string | null {
-  const slippages = quote.result?.swaps.map(
-    (slippage) => slippage.recommendedSlippage
-  );
+export function getMinRequiredSlippage(swaps: SwapResult[]): string | null {
+  const slippages = swaps.map((slippage) => slippage.recommendedSlippage);
   return (
     slippages
       ?.map((s) => s?.slippage || '0')
@@ -436,7 +426,7 @@ export function hasProperSlippage(
 }
 
 export function hasEnoughBalance(
-  quote: BestRouteResponse,
+  quote: SelectedQuote,
   selectedWallets: Wallet[]
 ) {
   const fee = quote.validationStatus;
@@ -463,7 +453,7 @@ export function hasEnoughBalance(
 }
 
 export function hasEnoughBalanceAndProperSlippage(
-  quote: BestRouteResponse,
+  quote: SelectedQuote,
   selectedWallets: Wallet[],
   userSlippage: string,
   minRequiredSlippage: string | null
@@ -478,7 +468,7 @@ export function createQuoteRequestBody(params: {
   fromToken: Token;
   toToken: Token;
   inputAmount: string;
-  wallets?: Wallet[];
+  wallets?: ConnectedWallet[];
   selectedWallets?: Wallet[];
   liquiditySources?: string[];
   excludeLiquiditySources?: boolean;
@@ -487,7 +477,6 @@ export function createQuoteRequestBody(params: {
   affiliateRef: string | null;
   affiliatePercent: number | null;
   affiliateWallets: { [key: string]: string } | null;
-  initialQuote?: BestRouteResponse;
   destination?: string;
 }): BestRouteRequest {
   const {
@@ -503,7 +492,6 @@ export function createQuoteRequestBody(params: {
     affiliateRef,
     affiliatePercent,
     affiliateWallets,
-    initialQuote,
     destination,
   } = params;
   const selectedWalletsMap = selectedWallets?.reduce(
@@ -520,46 +508,18 @@ export function createQuoteRequestBody(params: {
   const connectedWallets: BestRouteRequest['connectedWallets'] = [];
 
   wallets?.forEach((wallet) => {
-    const chainAndAccounts = connectedWallets.find(
-      (connectedWallet) => connectedWallet.blockchain === wallet.chain
-    );
-    if (!!chainAndAccounts) {
-      chainAndAccounts.addresses.push(wallet.address);
-    } else {
-      connectedWallets.push({
-        blockchain: wallet.chain,
-        addresses: [wallet.address],
-      });
-    }
+    connectedWallets.push({
+      blockchain: wallet.chain,
+      addresses: [wallet.address],
+    });
   });
-
-  const checkPrerequisites = !!initialQuote;
-
-  const filteredBlockchains = removeDuplicateFrom(
-    (initialQuote?.result?.swaps || []).reduce(
-      (blockchains: string[], swap) => {
-        blockchains.push(swap.from.blockchain, swap.to.blockchain);
-        // Check if internalSwaps array exists
-        if (swap.internalSwaps && Array.isArray(swap.internalSwaps)) {
-          swap.internalSwaps.map((internalSwap) => {
-            blockchains.push(
-              internalSwap.from.blockchain,
-              internalSwap.to.blockchain
-            );
-          });
-        }
-        return blockchains;
-      },
-      []
-    )
-  );
-
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore
   const requestBody: BestRouteRequest = {
     amount: inputAmount.toString(),
     affiliateRef: affiliateRef ?? undefined,
     affiliatePercent: affiliatePercent ?? undefined,
     affiliateWallets: affiliateWallets ?? undefined,
-    checkPrerequisites,
     from: {
       address: fromToken.address,
       blockchain: fromToken.blockchain,
@@ -584,7 +544,6 @@ export function createQuoteRequestBody(params: {
       ),
       swappersGroupsExclude: false,
     }),
-    ...(checkPrerequisites && { blockchains: filteredBlockchains }),
   };
   return requestBody;
 }
@@ -609,8 +568,8 @@ export function getWalletsForNewSwap(selectedWallets: Wallet[]) {
   return wallets;
 }
 
-export function getQuoteOutputAmount(quote: BestRouteResponse) {
-  return quote.result?.outputAmount || null;
+export function getQuoteOutputAmount(quote: SelectedQuote) {
+  return quote?.outputAmount || null;
 }
 
 export function getPercentageChange(input: string, output: string) {
@@ -622,8 +581,8 @@ export function getPercentageChange(input: string, output: string) {
 }
 
 export function isOutputAmountChangedALot(
-  oldQuote: BestRouteResponse,
-  newQuote: BestRouteResponse
+  oldQuote: SelectedQuote,
+  newQuote: SelectedQuote
 ) {
   const oldOutputAmount = getQuoteOutputAmount(oldQuote);
   const newOutputAmount = getQuoteOutputAmount(newQuote);
@@ -639,7 +598,7 @@ export function isOutputAmountChangedALot(
 }
 
 export function generateBalanceWarnings(
-  quote: BestRouteResponse,
+  quote: SelectedQuote,
   selectedWallets: Wallet[],
   blockchains: BlockchainMeta[]
 ) {
@@ -650,6 +609,7 @@ export function generateBalanceWarnings(
       requiredWallets.indexOf(selectedWallet1.chain) -
       requiredWallets.indexOf(selectedWallet2.chain)
   );
+
   return walletsSortedByRequiredWallets
     .flatMap((wallet) => getRequiredBalanceOfWallet(wallet, fee) || [])
     .filter((asset) => !asset.ok)
@@ -797,8 +757,8 @@ export function shouldRetrySwap(pendingSwap: PendingSwap) {
 export function confirmSwapDisabled(
   fetching: boolean,
   showCustomDestination: boolean,
-  customDestination: string,
-  quote: BestRouteResponse | null,
+  customDestination: string | null,
+  quote: SelectedQuote | null,
   selectedWallets: { walletType: string; chain: string }[],
   lastStepToBlockchain?: BlockchainMeta
 ) {