@rango-dev/widget-embedded 0.17.1-next.2 → 0.17.1-next.4

package/src/components/RouteErrors/RouteErrors.types.ts

@@ -1,29 +0,0 @@
-import type BigNumber from 'bignumber.js';
-
-export interface PropTypes {
-  openModal: boolean;
-  onToggle: (open: boolean) => void;
-  totalFeeInUsd: BigNumber | null;
-  outputUsdValue: BigNumber | null;
-  inputUsdValue: BigNumber | null;
-  percentageChange: BigNumber | null;
-  highValueLoss: boolean;
-  priceImpactCanNotBeComputed: boolean;
-  loading: boolean;
-  extraSpace: boolean;
-}
-
-type ModalPropTypesKeys = keyof Omit<
-  PropTypes,
-  'priceImpactCanNotBeComputed' | 'openModal' | 'extraSpace' | 'loading'
->;
-
-export type ModalPropTypes = Pick<PropTypes, ModalPropTypesKeys> & {
-  open: boolean;
-};
-
-export interface ModalContentData {
-  title: string;
-  value: string;
-  valueColor?: string;
-}

package/src/components/RouteErrors/RouteErrorsModal.tsx

@@ -1,129 +0,0 @@
-import type { ModalPropTypes } from './RouteErrors.types';
-
-import { i18n } from '@lingui/core';
-import {
-  Button,
-  Divider,
-  MessageBox,
-  Modal,
-  Typography,
-  WarningIcon,
-} from '@rango-dev/ui';
-import React from 'react';
-import { useNavigate } from 'react-router-dom';
-
-import { errorMessages } from '../../constants/errors';
-import { navigationRoutes } from '../../constants/navigationRoutes';
-import {
-  GAS_FEE_MAX_DECIMALS,
-  GAS_FEE_MIN_DECIMALS,
-  HIGHT_PRICE_IMPACT,
-  PERCENTAGE_CHANGE_MAX_DECIMALS,
-  PERCENTAGE_CHANGE_MIN_DECIMALS,
-  USD_VALUE_MAX_DECIMALS,
-  USD_VALUE_MIN_DECIMALS,
-} from '../../constants/routing';
-import { numberToString } from '../../utils/numbers';
-
-import { Flex } from './RouteErrors.styles';
-import { RouteErrorsModalItem } from './RouteErrorsModalItem';
-
-export function RouteErrorsModal(props: ModalPropTypes) {
-  const {
-    highValueLoss,
-    open,
-    onToggle,
-    percentageChange,
-    inputUsdValue,
-    outputUsdValue,
-    totalFeeInUsd,
-  } = props;
-  const navigate = useNavigate();
-  const type =
-    highValueLoss && !!percentageChange?.lt(HIGHT_PRICE_IMPACT)
-      ? 'error'
-      : 'warning';
-  const highValueLossData = [
-    {
-      title: i18n.t('Swapping'),
-      value: numberToString(
-        inputUsdValue,
-        USD_VALUE_MIN_DECIMALS,
-        USD_VALUE_MAX_DECIMALS
-      ),
-    },
-    {
-      title: i18n.t('Gas cost'),
-      value: numberToString(
-        totalFeeInUsd,
-        GAS_FEE_MIN_DECIMALS,
-        GAS_FEE_MAX_DECIMALS
-      ),
-    },
-    {
-      title: i18n.t('Receiving'),
-      value: numberToString(
-        outputUsdValue,
-        USD_VALUE_MIN_DECIMALS,
-        USD_VALUE_MAX_DECIMALS
-      ),
-    },
-    {
-      title: i18n.t('Price impact'),
-      value: numberToString(
-        percentageChange,
-        PERCENTAGE_CHANGE_MIN_DECIMALS,
-        PERCENTAGE_CHANGE_MAX_DECIMALS
-      ),
-      valueColor: `${type}500`,
-    },
-  ];
-
-  return (
-    <Modal
-      open={open}
-      onClose={() => onToggle(false)}
-      container={document.getElementById('swap-box') || document.body}>
-      {highValueLoss ? (
-        <MessageBox
-          type={type}
-          title={errorMessages().highValueLossError.impactTitle}
-          description={errorMessages().highValueLossError.description}
-        />
-      ) : (
-        <MessageBox
-          type={type}
-          title={errorMessages().unknownPriceError.impactTitle}
-          description={errorMessages().unknownPriceError.description}
-        />
-      )}
-      {highValueLoss && (
-        <Flex>
-          <Divider size={20} />
-          <Typography size="small" variant="title">
-            {i18n.t('Details')}
-          </Typography>
-          <Flex>
-            {highValueLossData.map((item, index) => {
-              const key = index;
-              return <RouteErrorsModalItem key={key} {...item} />;
-            })}
-          </Flex>
-        </Flex>
-      )}
-      <Divider size={32} />
-      <Button
-        type="primary"
-        size="large"
-        prefix={<WarningIcon />}
-        fullWidth
-        onClick={() => {
-          navigate(navigationRoutes.confirmSwap);
-        }}>
-        {highValueLoss
-          ? errorMessages().highValueLossError.confirmMessage
-          : errorMessages().unknownPriceError.confirmMessage}
-      </Button>
-    </Modal>
-  );
-}

package/src/components/RouteErrors/index.ts

@@ -1 +0,0 @@
-export { RouteErrors } from './RouteErrors';

package/src/hooks/useConfirmSwap.ts

@@ -1,303 +0,0 @@
-/* eslint-disable @typescript-eslint/no-magic-numbers */
-import type {
-  ConfirmSwapError,
-  ConfirmSwapWarnings,
-  PendingSwapSettings,
-  Wallet,
-} from '../types';
-import type { PendingSwap } from '@rango-dev/queue-manager-rango-preset';
-import type { BestRouteResponse } from 'rango-sdk';
-
-import { calculatePendingSwap } from '@rango-dev/queue-manager-rango-preset';
-import BigNumber from 'bignumber.js';
-import { useEffect } from 'react';
-
-import { errorMessages } from '../constants/errors';
-import { HIGH_SLIPPAGE } from '../constants/swapSettings';
-import { useBestRouteStore } from '../store/bestRoute';
-import { useMetaStore } from '../store/meta';
-import { useSettingsStore } from '../store/settings';
-import { useWalletsStore } from '../store/wallets';
-import {
-  ConfirmSwapErrorTypes,
-  RouteWarningType,
-  SlippageWarningType,
-} from '../types';
-import { numberToString } from '../utils/numbers';
-import {
-  isNumberOfSwapsChanged,
-  isRouteChanged,
-  isRouteInternalCoinsUpdated,
-  isRouteSwappersUpdated,
-} from '../utils/routing';
-import {
-  createBestRouteRequestBody,
-  getBalanceWarnings,
-  getMinRequiredSlippage,
-  getOutputRatio,
-  getPercentageChange,
-  getRouteOutputAmount,
-  getWalletsForNewSwap,
-  hasProperSlippage,
-  isOutputAmountChangedALot,
-  outputRatioHasWarning,
-} from '../utils/swap';
-
-import { useFetchBestRoute } from './useFetchBestRoute';
-
-export type ConfirmSwapFetchResult = {
-  swap: PendingSwap | null;
-  error: ConfirmSwapError | null;
-  warnings: ConfirmSwapWarnings | null;
-};
-
-export type ConfirmSwap = {
-  loading: boolean;
-  fetch: (params: Params) => Promise<ConfirmSwapFetchResult>;
-  cancelFetch: () => void;
-};
-
-type Params = {
-  selectedWallets: Wallet[];
-  customDestination?: string;
-};
-
-/**
- * A request can be successful but in body of the response, it can be some case which is considered as failed.
- */
-function throwErrorIfResponseIsNotValid(
-  response: BestRouteResponse,
-  params: { inputUsdValue: BigNumber | null; outputUsdValue: number | null }
-) {
-  if (!response.result) {
-    throw new Error(errorMessages().noRoutesError.title, {
-      cause: {
-        type: ConfirmSwapErrorTypes.NO_ROUTE,
-        diagnosisMessage: response.diagnosisMessages?.[0],
-      },
-    });
-  }
-
-  const newRouteOutputUsdValue = new BigNumber(
-    response.result?.outputAmount || '0'
-  ).multipliedBy(params.outputUsdValue || 0);
-
-  const outputRatio = getOutputRatio(
-    params.inputUsdValue,
-    newRouteOutputUsdValue
-  );
-  const highValueLoss = outputRatioHasWarning(
-    params.inputUsdValue,
-    outputRatio
-  );
-
-  if (highValueLoss) {
-    throw new Error('High value loss for route', {
-      cause: {
-        type: ConfirmSwapErrorTypes.ROUTE_UPDATED_WITH_HIGH_VALUE_LOSS,
-      },
-    });
-  }
-
-  return response;
-}
-
-function generateWarnings(
-  previousRoute: BestRouteResponse,
-  currentRoute: BestRouteResponse,
-  params: {
-    selectedWallets: Wallet[];
-    userSlippage: number;
-  }
-): ConfirmSwapWarnings {
-  const routeChanged = isRouteChanged(previousRoute, currentRoute);
-  const output: ConfirmSwapWarnings = {
-    balance: null,
-    route: null,
-    slippage: null,
-  };
-
-  if (routeChanged) {
-    if (isOutputAmountChangedALot(previousRoute, currentRoute)) {
-      output.route = {
-        type: RouteWarningType.ROUTE_AND_OUTPUT_AMOUNT_UPDATED,
-        newOutputAmount: numberToString(getRouteOutputAmount(currentRoute)),
-        percentageChange: numberToString(
-          getPercentageChange(
-            getRouteOutputAmount(previousRoute),
-            getRouteOutputAmount(currentRoute)
-          ),
-          null,
-          2
-        ),
-      };
-    } else if (isNumberOfSwapsChanged(previousRoute, currentRoute)) {
-      output.route = {
-        type: RouteWarningType.ROUTE_UPDATED,
-      };
-    } else if (isRouteSwappersUpdated(previousRoute, currentRoute)) {
-      output.route = {
-        type: RouteWarningType.ROUTE_SWAPPERS_UPDATED,
-      };
-    } else if (isRouteInternalCoinsUpdated(previousRoute, currentRoute)) {
-      output.route = {
-        type: RouteWarningType.ROUTE_COINS_UPDATED,
-      };
-    }
-  }
-
-  const balanceWarnings = getBalanceWarnings(
-    currentRoute,
-    params.selectedWallets
-  );
-  const enoughBalance = balanceWarnings.length === 0;
-
-  if (!enoughBalance) {
-    output.balance = {
-      messages: balanceWarnings,
-    };
-  }
-
-  const minRequiredSlippage = getMinRequiredSlippage(previousRoute);
-  const highSlippage = params.userSlippage > HIGH_SLIPPAGE;
-
-  if (!hasProperSlippage(params.userSlippage.toString(), minRequiredSlippage)) {
-    output.slippage = {
-      type: SlippageWarningType.INSUFFICIENT_SLIPPAGE,
-      slippage: minRequiredSlippage,
-    };
-  } else if (highSlippage) {
-    output.slippage = {
-      type: SlippageWarningType.HIGH_SLIPPAGE,
-      slippage: params.userSlippage.toString(),
-    };
-  }
-
-  return output;
-}
-
-export function useConfirmSwap(): ConfirmSwap {
-  const {
-    fromToken,
-    toToken,
-    inputAmount,
-    inputUsdValue,
-    setRoute,
-    bestRoute: initialRoute,
-    customDestination: customDestinationFromStore,
-  } = useBestRouteStore();
-
-  const {
-    slippage,
-    customSlippage,
-    affiliatePercent,
-    affiliateRef,
-    affiliateWallets,
-    disabledLiquiditySources,
-  } = useSettingsStore();
-  const { connectedWallets } = useWalletsStore();
-
-  const { meta } = useMetaStore();
-
-  const userSlippage = customSlippage || slippage;
-
-  const { fetch: fetchBestRoute, cancelFetch, loading } = useFetchBestRoute();
-
-  useEffect(() => cancelFetch, []);
-
-  const fetch: ConfirmSwap['fetch'] = async (params: Params) => {
-    const selectedWallets = params.selectedWallets;
-    const customDestination =
-      params?.customDestination ?? customDestinationFromStore;
-
-    if (!fromToken || !toToken || !inputAmount || !initialRoute) {
-      return {
-        route: null,
-        swap: null,
-        error: null,
-        warnings: null,
-      };
-    }
-
-    const requestBody = createBestRouteRequestBody({
-      fromToken,
-      toToken,
-      inputAmount,
-      wallets: connectedWallets,
-      selectedWallets,
-      disabledLiquiditySources,
-      slippage: userSlippage,
-      affiliateRef,
-      affiliatePercent,
-      affiliateWallets,
-      initialRoute,
-      destination: customDestination,
-    });
-
-    let currentRoute: BestRouteResponse;
-    try {
-      currentRoute = await fetchBestRoute(requestBody).then((response) =>
-        throwErrorIfResponseIsNotValid(response, {
-          outputUsdValue: toToken.usdPrice,
-          inputUsdValue,
-        })
-      );
-      setRoute(currentRoute);
-    } catch (error: any) {
-      if (error?.code === 'ERR_CANCELED') {
-        return {
-          swap: null,
-          error: {
-            type: ConfirmSwapErrorTypes.REQUEST_CANCELED,
-          },
-          warnings: null,
-        };
-      }
-
-      if (error.cause) {
-        return {
-          swap: null,
-          error: error.cause,
-          warnings: null,
-        };
-      }
-
-      return {
-        swap: null,
-        error: {
-          type: ConfirmSwapErrorTypes.REQUEST_FAILED,
-        },
-        warnings: null,
-      };
-    }
-
-    const swapSettings: PendingSwapSettings = {
-      slippage: userSlippage.toString(),
-      disabledSwappersGroups: disabledLiquiditySources,
-    };
-    const swap = calculatePendingSwap(
-      inputAmount.toString(),
-      currentRoute,
-      getWalletsForNewSwap(selectedWallets),
-      swapSettings,
-      false,
-      meta
-    );
-
-    return {
-      route: currentRoute,
-      swap,
-      error: null,
-      warnings: generateWarnings(initialRoute, currentRoute, {
-        selectedWallets,
-        userSlippage,
-      }),
-    };
-  };
-
-  return {
-    loading,
-    fetch,
-    cancelFetch,
-  };
-}

package/src/types/routing.ts

@@ -1,77 +0,0 @@
-/* eslint-disable @typescript-eslint/prefer-enum-initializers */
-import type { RouteState } from '../store/bestRoute';
-import type { SettingsState } from '../store/settings';
-
-interface BestRouteStoreParams {
-  fromBlockchain?: RouteState['fromBlockchain'];
-  toBlockchain?: RouteState['toBlockchain'];
-  fromToken?: RouteState['fromToken'];
-  toToken?: RouteState['toToken'];
-  inputAmount?: RouteState['inputAmount'];
-}
-
-interface SettingsStoreParams {
-  slippage?: SettingsState['slippage'];
-  customSlippage?: SettingsState['customSlippage'];
-  disabledLiquiditySources?: SettingsState['disabledLiquiditySources'];
-  infiniteApprove?: SettingsState['infiniteApprove'];
-}
-
-export type BestRouteEqualityParams =
-  | {
-      store: 'bestRoute';
-      prevState: BestRouteStoreParams;
-      currentState: BestRouteStoreParams;
-    }
-  | {
-      store: 'settings';
-      prevState: SettingsStoreParams;
-      currentState: SettingsStoreParams;
-    };
-
-export enum ConfirmSwapErrorTypes {
-  NO_ROUTE,
-  ROUTE_UPDATED_WITH_HIGH_VALUE_LOSS,
-  REQUEST_FAILED,
-  REQUEST_CANCELED,
-}
-
-export type ConfirmSwapError =
-  | {
-      type: ConfirmSwapErrorTypes.NO_ROUTE;
-      diagnosisMessage?: string;
-    }
-  | {
-      type: Exclude<ConfirmSwapErrorTypes, ConfirmSwapErrorTypes.NO_ROUTE>;
-    };
-
-export enum RouteWarningType {
-  ROUTE_UPDATED,
-  ROUTE_SWAPPERS_UPDATED,
-  ROUTE_COINS_UPDATED,
-  ROUTE_AND_OUTPUT_AMOUNT_UPDATED,
-}
-
-export type RouteWarning =
-  | {
-      type: RouteWarningType.ROUTE_AND_OUTPUT_AMOUNT_UPDATED;
-      newOutputAmount: string;
-      percentageChange: string;
-    }
-  | {
-      type: Exclude<
-        RouteWarningType,
-        RouteWarningType.ROUTE_AND_OUTPUT_AMOUNT_UPDATED
-      >;
-    };
-
-export enum SlippageWarningType {
-  INSUFFICIENT_SLIPPAGE,
-  HIGH_SLIPPAGE,
-}
-
-export type ConfirmSwapWarnings = {
-  route: RouteWarning | null;
-  balance: { messages: string[] } | null;
-  slippage: { type: SlippageWarningType; slippage: string | null } | null;
-};