@ledgerhq/live-common 21.5.1 → 21.7.1-patch.1

package/src/exchange/swap/hooks/useProviderRates.ts

@@ -0,0 +1,130 @@
+import { useCallback, useEffect, useReducer, useState } from "react";
+import {
+  OnNoRatesCallback,
+  SetExchangeRateCallback,
+  SwapSelectorStateType,
+} from "./useSwapTransaction";
+import { getExchangeRates } from "..";
+import { Exchange, ExchangeRate } from "../types";
+import { pickExchangeRate } from "../utils";
+import { Transaction } from "../../../generated/types";
+
+export type RatesReducerState = {
+  status?: string | null;
+  value?: ExchangeRate[];
+  error?: Error;
+};
+
+const ratesReducerInitialState: RatesReducerState = {};
+const ratesReducer = (state: RatesReducerState, action): RatesReducerState => {
+  switch (action.type) {
+    case "set":
+      return { value: action.payload, status: null };
+    case "idle":
+      return { ...state, status: null };
+    case "loading":
+      return { ...state, status: "loading" };
+    case "error":
+      return { status: "error", error: action.payload };
+  }
+  return state;
+};
+
+/* Fetch and update provider rates. */
+export const useProviderRates = ({
+  fromState,
+  toState,
+  exchangeRate,
+  transaction,
+  onNoRates,
+  setExchangeRate,
+}: {
+  fromState: SwapSelectorStateType;
+  toState: SwapSelectorStateType;
+  exchangeRate?: ExchangeRate | null | undefined;
+  transaction?: Transaction | null | undefined;
+  onNoRates?: OnNoRatesCallback | null | undefined;
+  setExchangeRate?: SetExchangeRateCallback | null | undefined;
+}): {
+  rates: RatesReducerState;
+  refetchRates: () => void;
+} => {
+  const { account: fromAccount } = fromState;
+  const { currency: toCurrency } = toState;
+  const [rates, dispatchRates] = useReducer(
+    ratesReducer,
+    ratesReducerInitialState
+  );
+  const [getRatesDependency, setGetRatesDependency] = useState<unknown | null>(
+    null
+  );
+  const refetchRates = useCallback(() => setGetRatesDependency({}), []);
+
+  useEffect(
+    () => {
+      let abort = false;
+      async function getRates() {
+        if (
+          !transaction ||
+          !transaction?.amount ||
+          !transaction?.amount.gt(0) ||
+          !toCurrency ||
+          !fromAccount
+        ) {
+          setExchangeRate && setExchangeRate(null);
+          return dispatchRates({ type: "set", payload: [] });
+        }
+        dispatchRates({ type: "loading" });
+        try {
+          let rates: ExchangeRate[] = await getExchangeRates(
+            { fromAccount } as Exchange,
+            transaction,
+            undefined,
+            toCurrency
+          );
+          if (abort) return;
+          if (rates.length === 0) {
+            onNoRates && onNoRates({ fromState, toState });
+          }
+          // Discard bad provider rates
+          let rateError: Error | null | undefined = null;
+          rates = rates.reduce<ExchangeRate[]>((acc, rate) => {
+            rateError = rateError ?? rate.error;
+            return rate.error ? acc : [...acc, rate];
+          }, []);
+          if (rates.length === 0 && rateError) {
+            // If all the rates are in error
+            dispatchRates({ type: "error", payload: rateError });
+          } else {
+            dispatchRates({ type: "set", payload: rates });
+            setExchangeRate &&
+              pickExchangeRate(rates, exchangeRate, setExchangeRate);
+          }
+        } catch (error) {
+          !abort && dispatchRates({ type: "error", payload: error });
+        }
+      }
+
+      getRates();
+
+      return () => {
+        abort = true;
+        dispatchRates({ type: "idle" });
+      };
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [
+      fromAccount,
+      toCurrency,
+      transaction,
+      getRatesDependency,
+      onNoRates,
+      setExchangeRate,
+    ]
+  );
+
+  return {
+    rates,
+    refetchRates,
+  };
+};

package/src/exchange/swap/hooks/useReverseAccounts.test.ts

@@ -0,0 +1,83 @@
+import { getCryptoCurrencyById, getTokenById } from "@ledgerhq/cryptoassets";
+import { renderHook, act } from "@testing-library/react-hooks";
+import { genAccount, genTokenAccount } from "../../../mock/account";
+import { Account } from "../../../types";
+import { useReverseAccounts } from "./useReverseAccounts";
+
+const BTC = getCryptoCurrencyById("bitcoin");
+const ETH = getCryptoCurrencyById("ethereum");
+const USDT = getTokenById("ethereum/erc20/usd_tether__erc20_");
+
+const fromParentAccount = genAccount("mocked-account-2", {
+  currency: ETH,
+});
+const fromAccount = genTokenAccount(1, fromParentAccount, USDT);
+const toAccount = genAccount("mocked-account-1", { currency: BTC });
+const allAccounts = [fromAccount, fromParentAccount, toAccount] as Account[];
+
+describe("useReverseAccounts", () => {
+  const setFromAccount = jest.fn();
+  const setToAccount = jest.fn();
+
+  const defaultProps: Parameters<typeof useReverseAccounts>[0] = {
+    accounts: allAccounts,
+    fromAccount,
+    fromParentAccount,
+    toAccount,
+    fromCurrency: USDT,
+    setFromAccount,
+    setToAccount,
+  };
+
+  it("should tell if the accounts are swappable", () => {
+    const { result, rerender } = renderHook(
+      (props) => useReverseAccounts(props),
+      {
+        initialProps: defaultProps,
+      }
+    );
+
+    expect(result.current.isSwapReversable).toBe(true);
+
+    rerender({ ...defaultProps, toAccount: null });
+    expect(result.current.isSwapReversable).toBe(false);
+
+    rerender({ ...defaultProps, fromCurrency: null });
+    expect(result.current.isSwapReversable).toBe(false);
+
+    rerender({
+      ...defaultProps,
+      // detached account - not in the main accounts list
+      toAccount: genAccount("mocked-account-3", { currency: BTC }),
+    });
+    expect(result.current.isSwapReversable).toBe(false);
+  });
+
+  it("should reverse accounts when 'reverseSwap' is called", () => {
+    const { result, rerender } = renderHook(useReverseAccounts, {
+      initialProps: {
+        setToAccount,
+        setFromAccount,
+      } as any,
+    });
+
+    // if isSwapReversable is false, then reverseSwap should be a no-op
+    expect(result.current.isSwapReversable).toBe(false);
+    act(() => result.current.reverseSwap());
+    expect(setToAccount).toHaveBeenCalledTimes(0);
+    expect(setFromAccount).toHaveBeenCalledTimes(0);
+
+    // Reverse from/to accounts
+    rerender(defaultProps);
+    expect(result.current.isSwapReversable).toBe(true);
+    act(() => result.current.reverseSwap());
+    expect(setToAccount).toHaveBeenCalledTimes(1);
+    expect(setToAccount.mock.calls[0]).toMatchObject([
+      USDT,
+      fromAccount,
+      fromParentAccount,
+    ]);
+    expect(setFromAccount).toHaveBeenCalledTimes(1);
+    expect(setFromAccount.mock.calls[0]).toMatchObject([toAccount]);
+  });
+});

package/src/exchange/swap/hooks/useReverseAccounts.ts

@@ -0,0 +1,56 @@
+import { useCallback, useMemo } from "react";
+import { SwapDataType, SwapSelectorStateType, SwapTransactionType } from ".";
+import { flattenAccounts } from "../../../account";
+import { Account } from "../../../types";
+
+export const useReverseAccounts = ({
+  accounts,
+  toAccount,
+  fromAccount,
+  fromParentAccount,
+  fromCurrency,
+  setFromAccount,
+  setToAccount,
+}: {
+  accounts: Account[] | undefined;
+  toAccount: SwapSelectorStateType["account"];
+  fromAccount: SwapSelectorStateType["account"];
+  fromParentAccount: SwapSelectorStateType["parentAccount"];
+  fromCurrency: SwapSelectorStateType["currency"];
+  setFromAccount: SwapTransactionType["setFromAccount"];
+  setToAccount: SwapTransactionType["setToAccount"];
+}): {
+  isSwapReversable: SwapDataType["isSwapReversable"];
+  reverseSwap: SwapTransactionType["reverseSwap"];
+} => {
+  const isSwapReversable = useMemo(() => {
+    if (!toAccount || !fromCurrency) return false;
+
+    const allAccounstWithSub = accounts ? flattenAccounts(accounts) : [];
+    const isToSwappable = !!allAccounstWithSub.find(
+      (account) => account.id === toAccount?.id
+    );
+
+    return isToSwappable;
+  }, [toAccount, fromCurrency, accounts]);
+
+  const reverseSwap: SwapTransactionType["reverseSwap"] = useCallback(() => {
+    if (isSwapReversable === false) return;
+
+    setFromAccount(toAccount);
+    setToAccount(fromCurrency, fromAccount, fromParentAccount);
+  }, [
+    toAccount,
+    fromCurrency,
+    fromAccount,
+    fromParentAccount,
+    setFromAccount,
+    setToAccount,
+    isSwapReversable,
+  ]);
+
+  return {
+    isSwapReversable,
+    reverseSwap,
+  };
+};

package/src/exchange/swap/hooks/useSelectableCurrencies.test.ts

@@ -0,0 +1,39 @@
+import { renderHook } from "@testing-library/react-hooks";
+
+import { useSelectableCurrencies } from "./useSelectableCurrencies";
+import { getCryptoCurrencyById } from "../../../currencies";
+
+describe("useSelectableCurrencies", () => {
+  test("returns an empty array when empty list are passed", () => {
+    const allCurrencies = [];
+
+    const { result } = renderHook(() =>
+      useSelectableCurrencies({ allCurrencies })
+    );
+
+    expect(result.current).toEqual([]);
+  });
+
+  test("returns an empty array when incorrect ids are passed", () => {
+    const allCurrencies = ["ethercoin", "bitether", "polkamos"];
+
+    const { result } = renderHook(() =>
+      useSelectableCurrencies({ allCurrencies })
+    );
+
+    expect(result.current).toEqual([]);
+  });
+
+  test("returns correct currencies for all correct ids, in the same order", () => {
+    const allCurrencies = ["ethereum", "bitcoin", "polkamos"];
+    const ethereumCurrency = getCryptoCurrencyById("ethereum");
+    const bitcoinCurrency = getCryptoCurrencyById("bitcoin");
+
+    const { result } = renderHook(() =>
+      useSelectableCurrencies({ allCurrencies })
+    );
+
+    expect(result.current).toHaveLength(2);
+    expect(result.current).toEqual([ethereumCurrency, bitcoinCurrency]);
+  });
+});

package/src/exchange/swap/hooks/useSelectableCurrencies.ts

@@ -0,0 +1,26 @@
+import { useMemo } from "react";
+import {
+  CryptoCurrency,
+  findCryptoCurrencyById,
+  findTokenById,
+  TokenCurrency,
+} from "@ledgerhq/cryptoassets";
+
+export const useSelectableCurrencies = ({
+  allCurrencies,
+}: {
+  allCurrencies: string[];
+}): (TokenCurrency | CryptoCurrency)[] => {
+  const currencies = useMemo(() => {
+    const tokens = allCurrencies.map(findTokenById).filter(Boolean);
+    const cryptoCurrencies = allCurrencies
+      .map(findCryptoCurrencyById)
+      .filter(Boolean);
+    return [...tokens, ...cryptoCurrencies] as (
+      | TokenCurrency
+      | CryptoCurrency
+    )[];
+  }, [allCurrencies]);
+
+  return currencies;
+};

package/src/exchange/swap/hooks/useSwapProviders.test.ts

@@ -0,0 +1,113 @@
+import { renderHook } from "@testing-library/react-hooks";
+import { mocked } from "ts-jest/utils";
+
+import { useSwapProviders } from "./useSwapProviders";
+import { getProviders } from "..";
+
+jest.mock("..");
+
+const mockedGetProviders = mocked(getProviders);
+
+describe("useSwapProviders", () => {
+  const OLD_ENV = process.env;
+  const mockedProviders = [
+    {
+      provider: "changelly",
+      pairs: [
+        { from: "ETH", to: "BTC", tradeMethod: "fixed" },
+        { from: "DOT", to: "BTC", tradeMethod: "fixed" },
+        { from: "EGLD", to: "BTC", tradeMethod: "float" },
+        { from: "LINK", to: "ETH", tradeMethod: "fixed" },
+        { from: "LINK", to: "GRT", tradeMethod: "float" },
+      ],
+    },
+    {
+      provider: "wyre",
+      pairs: [
+        { from: "ETH", to: "BTC", tradeMethod: "fixed" },
+        { from: "BTC", to: "ETH", tradeMethod: "float" },
+      ],
+    },
+  ];
+
+  beforeEach(() => {
+    mockedGetProviders.mockResolvedValue(mockedProviders);
+    // Clear the cache
+    jest.resetModules();
+    // Copy envs already present before running this test to process.env
+    process.env = { ...OLD_ENV };
+  });
+
+  afterEach(() => {
+    mockedGetProviders.mockClear();
+  });
+
+  afterAll(() => {
+    // Restore the old envs
+    process.env = OLD_ENV;
+  });
+
+  test("returns the initial state on mount", () => {
+    const { result, unmount } = renderHook(() => useSwapProviders());
+
+    // interrupt the useEffect function by unmounting the component
+    unmount();
+
+    expect(result.current.isLoading).toBeTruthy();
+    expect(result.current.error).toBeNull();
+    expect(result.current.providers).toBeNull();
+    // automatically fired on mount
+    expect(mockedGetProviders).toHaveBeenCalledTimes(1);
+  });
+
+  test("returns the fetched providers", async () => {
+    const { result, waitForNextUpdate } = renderHook(() => useSwapProviders());
+
+    await waitForNextUpdate();
+
+    expect(mockedGetProviders).toHaveBeenCalledTimes(1);
+    expect(result.current.isLoading).toBeFalsy();
+    expect(result.current.error).toBeNull();
+    expect(result.current.providers).toEqual(mockedProviders);
+  });
+
+  test("only returns no-filtered fetched providers", async () => {
+    // set the SWAP_DISABLED_PROVIDERS env variable for this test
+    process.env.SWAP_DISABLED_PROVIDERS = "wyre";
+    const { result, waitForNextUpdate } = renderHook(() => useSwapProviders());
+
+    await waitForNextUpdate();
+
+    expect(mockedGetProviders).toHaveBeenCalledTimes(1);
+    expect(result.current.isLoading).toBeFalsy();
+    expect(result.current.error).toBeNull();
+    expect(result.current.providers).toEqual(
+      mockedProviders.filter((provider) => provider.provider !== "wyre")
+    );
+  });
+
+  test("returns the fetched error", async () => {
+    const error = new Error("test error");
+    mockedGetProviders.mockRejectedValueOnce(error);
+
+    const { result, waitForNextUpdate } = renderHook(() => useSwapProviders());
+
+    await waitForNextUpdate();
+
+    expect(mockedGetProviders).toHaveBeenCalledTimes(1);
+    expect(result.current.isLoading).toBeFalsy();
+    expect(result.current.error).toEqual(error);
+    expect(result.current.providers).toBeNull();
+  });
+
+  test("only fetch providers on mount", async () => {
+    const { rerender, waitForNextUpdate } = renderHook(() =>
+      useSwapProviders()
+    );
+
+    await waitForNextUpdate();
+    rerender();
+
+    expect(mockedGetProviders).toHaveBeenCalledTimes(1);
+  });
+});

package/src/exchange/swap/hooks/useSwapProviders.ts

@@ -0,0 +1,57 @@
+import { useEffect, useReducer } from "react";
+import { getProviders } from "..";
+import { AvailableProviderV3 } from "../types";
+
+type State = {
+  isLoading: boolean;
+  error: Error | null | undefined;
+  providers: AvailableProviderV3[] | null | undefined;
+};
+
+type ActionType =
+  | { type: "SAVE_DATA"; payload: State["providers"] }
+  | { type: "SAVE_ERROR"; payload: State["error"] };
+
+const reducer = (_state: State, action: ActionType): State => {
+  switch (action.type) {
+    case "SAVE_DATA":
+      return { error: null, providers: action.payload, isLoading: false };
+    case "SAVE_ERROR":
+      return { error: action.payload, providers: null, isLoading: false };
+    default:
+      throw new Error("Uncorrect action type");
+  }
+};
+
+export const initialState = { isLoading: true, error: null, providers: null };
+
+const filterDisabledProviders = (provider: AvailableProviderV3) =>
+  !process.env.SWAP_DISABLED_PROVIDERS?.includes(provider.provider);
+
+export const useSwapProviders = (): State => {
+  const [state, dispatch] = useReducer(reducer, initialState);
+
+  useEffect(() => {
+    let isMounted = true;
+
+    const saveProviders = async () => {
+      try {
+        const allProviders = (await getProviders()) as AvailableProviderV3[];
+        const providers = allProviders.filter(filterDisabledProviders);
+
+        if (isMounted) dispatch({ type: "SAVE_DATA", payload: providers });
+      } catch (error) {
+        if (isMounted && error instanceof Error)
+          dispatch({ type: "SAVE_ERROR", payload: error });
+      }
+    };
+
+    saveProviders();
+
+    return () => {
+      isMounted = false;
+    };
+  }, []);
+
+  return state;
+};

package/src/exchange/swap/hooks/useSwapTransaction.test.ts

@@ -0,0 +1,54 @@
+import { renderHook } from "@testing-library/react-hooks";
+
+import { AmountRequired } from "@ledgerhq/errors";
+import { useFromAmountError } from "./useSwapTransaction";
+
+/**
+ * @DEV: The useSwapTransaction hook is a composition hook. It doesn't own specific
+ * logic, but it's composed of other hooks. That's why only the useFromAmountError
+ * logic is tested here, it's the only logic owned by the useSwapTransaction hook.
+ * All other lines are covered by other hooks tests.
+ */
+describe("useSwapTransaction", () => {
+  test("useFromAmountError - returns nothing when no errors are caught", () => {
+    const { result } = renderHook(() =>
+      useFromAmountError({ gasPrice: undefined, amount: undefined })
+    );
+
+    expect(result.current).toBeUndefined();
+  });
+
+  test("useFromAmountError - returns the first error caught", () => {
+    const gasPriceError = new Error("Gas price is too high");
+    const amountError = new Error("Amount is too low");
+    const tests = [
+      {
+        input: { gasPrice: gasPriceError, amount: undefined },
+        output: gasPriceError,
+      },
+      {
+        input: { gasPrice: undefined, amount: amountError },
+        output: amountError,
+      },
+      {
+        input: { gasPrice: gasPriceError, amount: amountError },
+        output: gasPriceError,
+      },
+    ];
+
+    tests.forEach(({ input, output }) => {
+      const { result } = renderHook(() => useFromAmountError(input));
+      expect(result.current).toEqual(output);
+    });
+  });
+
+  test("useFromAmountError - do not return AmountRequired error", () => {
+    const amountError = new AmountRequired("This error will be filtered");
+
+    const { result } = renderHook(() =>
+      useFromAmountError({ gasPrice: undefined, amount: amountError })
+    );
+
+    expect(result.current).toBeUndefined();
+  });
+});