@rango-dev/widget-embedded 0.19.0 → 0.19.1-next.0

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/store/meta.ts

@@ -1,39 +0,0 @@
-import type { TokenWithBalance } from '../components/TokenList';
-import type { MetaResponse } from 'rango-sdk';
-
-import { create } from 'zustand';
-
-import { useAppStore } from './app';
-import createSelectors from './selectors';
-
-export type LoadingStatus = 'loading' | 'success' | 'failed';
-
-export interface MetaState {
-  meta: MetaResponse & { tokens: TokenWithBalance[] };
-  loadingStatus: LoadingStatus;
-  fetchMeta: () => Promise<void>;
-}
-
-export const useMetaStore = createSelectors(
-  create<MetaState>()((set) => ({
-    meta: { blockchains: [], popularTokens: [], swappers: [], tokens: [] },
-    loadingStatus: 'loading',
-    fetchMeta: async () => {
-      try {
-        await useAppStore.getState().fetch();
-
-        const state = useAppStore.getState();
-        const response: MetaResponse = {
-          blockchains: state.blockchains(),
-          tokens: state.tokens(),
-          popularTokens: state._popularTokens,
-          swappers: state._swappers,
-        };
-
-        set({ meta: response, loadingStatus: 'success' });
-      } catch (error) {
-        set({ loadingStatus: 'failed' });
-      }
-    },
-  }))
-);

package/src/store/settings.ts

@@ -1,158 +0,0 @@
-import { type Language } from '@rango-dev/ui';
-import { create } from 'zustand';
-import { persist, subscribeWithSelector } from 'zustand/middleware';
-
-import { BLOCKCHAIN_LIST_SIZE } from '../constants/configs';
-import { DEFAULT_LANGUAGE } from '../constants/languages';
-import { DEFAULT_SLIPPAGE } from '../constants/swapSettings';
-import { removeDuplicateFrom } from '../utils/common';
-
-import { useMetaStore } from './meta';
-import createSelectors from './selectors';
-
-export type ThemeMode = 'auto' | 'dark' | 'light';
-
-export interface SettingsState {
-  /** Keeping a history of blockchains that user has selected (in Swap process) */
-  preferredBlockchains: string[];
-  slippage: number;
-  customSlippage: number | null;
-  infiniteApprove: boolean;
-  disabledLiquiditySources: string[];
-  theme: ThemeMode;
-  language: Language;
-  affiliateRef: string | null;
-  affiliatePercent: number | null;
-  affiliateWallets: { [key: string]: string } | null;
-
-  setSlippage: (slippage: number) => void;
-  setCustomSlippage: (customSlippage: number | null) => void;
-  toggleInfiniteApprove: () => void;
-  toggleLiquiditySource: (name: string) => void;
-  setTheme: (theme: ThemeMode) => void;
-  setLanguage: (language: Language) => void;
-  toggleAllLiquiditySources: (shouldReset?: boolean) => void;
-  setAffiliateRef: (affiliateRef: string | null) => void;
-  setAffiliatePercent: (affiliatePercent: number | null) => void;
-  setAffiliateWallets: (
-    affiliateWallets: { [key: string]: string } | null
-  ) => void;
-  addPreferredBlockchain: (blockchain: string) => void;
-}
-
-export const useSettingsStore = createSelectors(
-  create<SettingsState>()(
-    persist(
-      subscribeWithSelector((set, get) => ({
-        preferredBlockchains: [],
-        slippage: DEFAULT_SLIPPAGE,
-        customSlippage: null,
-        infiniteApprove: false,
-        affiliateRef: null,
-        affiliatePercent: null,
-        affiliateWallets: null,
-        disabledLiquiditySources: [],
-        theme: 'auto',
-        language: DEFAULT_LANGUAGE,
-        addPreferredBlockchain: (blockchain) => {
-          const currentPreferredBlockchains = get().preferredBlockchains;
-
-          const noNeedToDoAnything = currentPreferredBlockchains.find(
-            (preferredBlockchain, index) => {
-              const isSameBlockchain = preferredBlockchain === blockchain;
-              const isInVisibleList = index <= BLOCKCHAIN_LIST_SIZE - 1;
-
-              return isSameBlockchain && isInVisibleList;
-            }
-          );
-
-          if (noNeedToDoAnything) {
-            return;
-          }
-
-          const nextPreferredBlockchains: string[] =
-            currentPreferredBlockchains.filter((preferredBlockchain) => {
-              const isSameBlockchain = preferredBlockchain === blockchain;
-
-              return !isSameBlockchain;
-            });
-
-          set(() => ({
-            preferredBlockchains: [blockchain, ...nextPreferredBlockchains],
-          }));
-        },
-        setSlippage: (slippage) =>
-          set(() => ({
-            slippage: slippage,
-          })),
-        setCustomSlippage: (customSlippage) =>
-          set(() => ({
-            customSlippage: customSlippage,
-          })),
-        setAffiliateRef: (affiliateRef) =>
-          set(() => ({
-            affiliateRef,
-          })),
-        setAffiliatePercent: (affiliatePercent) =>
-          set(() => ({
-            affiliatePercent,
-          })),
-
-        setAffiliateWallets: (affiliateWallets) =>
-          set(() => ({
-            affiliateWallets,
-          })),
-        toggleAllLiquiditySources: (shouldReset?: boolean) =>
-          set((state) => {
-            if (shouldReset) {
-              return { disabledLiquiditySources: [] };
-            }
-            const { swappers } = useMetaStore.getState().meta;
-            const swappersGroup = removeDuplicateFrom(
-              swappers.map((swapper) => swapper.swapperGroup)
-            );
-
-            if (
-              swappersGroup.length === state.disabledLiquiditySources.length
-            ) {
-              return { disabledLiquiditySources: [] };
-            }
-
-            return {
-              disabledLiquiditySources: swappersGroup,
-            };
-          }),
-        toggleInfiniteApprove: () =>
-          set((state) => ({
-            infiniteApprove: !state.infiniteApprove,
-          })),
-        toggleLiquiditySource: (name) =>
-          set((state) => {
-            if (state.disabledLiquiditySources.includes(name)) {
-              return {
-                disabledLiquiditySources: state.disabledLiquiditySources.filter(
-                  (liquiditySource) => liquiditySource != name
-                ),
-              };
-            }
-            return {
-              disabledLiquiditySources:
-                state.disabledLiquiditySources.concat(name),
-            };
-          }),
-        setTheme: (theme) =>
-          set(() => ({
-            theme,
-          })),
-        setLanguage: (language) =>
-          set(() => ({
-            language,
-          })),
-      })),
-      {
-        name: 'user-settings',
-        skipHydration: true,
-      }
-    )
-  )
-);

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;
-};