@ledgerhq/live-common 21.26.3 → 21.30.0

package/src/hw/actions/completeExchange.ts

@@ -11,6 +11,7 @@ type State = {
   completeExchangeResult: Transaction | null | undefined;
   completeExchangeError: Error | null | undefined;
   freezeReduxDevice: boolean;
+  completeExchangeRequested: boolean;
   isLoading: boolean;
 };
 
@@ -61,14 +62,19 @@ const mapResult = ({
 const initialState: State = {
   completeExchangeResult: null,
   completeExchangeError: null,
+  completeExchangeRequested: false,
   freezeReduxDevice: false,
-  isLoading: false,
+  isLoading: true,
 };
 
 const reducer = (state: State, e: ExchangeRequestEvent) => {
   switch (e.type) {
     case "complete-exchange":
-      return { ...state, isLoading: true, freezeReduxDevice: true };
+      return {
+        ...state,
+        completeExchangeStarted: true,
+        freezeReduxDevice: true,
+      };
 
     case "complete-exchange-error":
       return {
@@ -81,7 +87,7 @@ const reducer = (state: State, e: ExchangeRequestEvent) => {
       return {
         ...state,
         completeExchangeRequested: true,
-        isLoading: true,
+        isLoading: false,
       };
     case "complete-exchange-result":
       return {

package/src/hw/connectApp.ts

@@ -1,5 +1,5 @@
 import semver from "semver";
-import { Observable, concat, from, of, throwError, defer } from "rxjs";
+import { Observable, concat, from, of, throwError, defer, merge } from "rxjs";
 import { mergeMap, concatMap, map, catchError, delay } from "rxjs/operators";
 import {
   TransportStatusError,
@@ -55,6 +55,11 @@ export type ConnectAppEvent =
       type: "disconnected";
       expected?: boolean;
     }
+  | {
+      type: "device-update-last-seen";
+      deviceInfo: DeviceInfo;
+      latestFirmware: FirmwareUpdateContext | null | undefined;
+    }
   | {
       type: "device-permission-requested";
       wording: string;
@@ -102,37 +107,54 @@ export const openAppFromDashboard = (
   transport: Transport,
   appName: string
 ): Observable<ConnectAppEvent> =>
-  concat(
-    of<ConnectAppEvent>({
-      type: "ask-open-app",
-      appName,
-    }),
-    defer(() => from(openApp(transport, appName))).pipe(
-      concatMap(() =>
-        of<ConnectAppEvent>({
-          type: "device-permission-granted",
-        })
-      ),
-      catchError((e) => {
-        if (e && e instanceof TransportStatusError) {
-          // @ts-expect-error TransportStatusError to be typed on ledgerjs
-          switch (e.statusCode) {
-            case 0x6984:
-            case 0x6807:
-              return streamAppInstall({
-                transport,
-                appNames: [appName],
-                onSuccessObs: () =>
-                  from(openAppFromDashboard(transport, appName)),
-              }) as Observable<ConnectAppEvent>;
-            case 0x6985:
-            case 0x5501:
-              return throwError(new UserRefusedOnDevice());
-          }
-        }
+  from(getDeviceInfo(transport)).pipe(
+    mergeMap((deviceInfo) =>
+      merge(
+        // Nb Allows LLD/LLM to update lastSeenDevice, this can run in parallel
+        // since there are no more device exchanges.
+        from(manager.getLatestFirmwareForDevice(deviceInfo)).pipe(
+          concatMap((latestFirmware) =>
+            of<ConnectAppEvent>({
+              type: "device-update-last-seen",
+              deviceInfo,
+              latestFirmware,
+            })
+          )
+        ),
+        concat(
+          of<ConnectAppEvent>({
+            type: "ask-open-app",
+            appName,
+          }),
+          defer(() => from(openApp(transport, appName))).pipe(
+            concatMap(() =>
+              of<ConnectAppEvent>({
+                type: "device-permission-granted",
+              })
+            ),
+            catchError((e) => {
+              if (e && e instanceof TransportStatusError) {
+                // @ts-expect-error TransportStatusError to be typed on ledgerjs
+                switch (e.statusCode) {
+                  case 0x6984:
+                  case 0x6807:
+                    return streamAppInstall({
+                      transport,
+                      appNames: [appName],
+                      onSuccessObs: () =>
+                        from(openAppFromDashboard(transport, appName)),
+                    }) as Observable<ConnectAppEvent>;
+                  case 0x6985:
+                  case 0x5501:
+                    return throwError(new UserRefusedOnDevice());
+                }
+              }
 
-        return throwError(e);
-      })
+              return throwError(e);
+            })
+          )
+        )
+      )
     )
   );
 

package/src/market/MarketDataProvider.tsx

@@ -0,0 +1,440 @@
+/* eslint-disable @typescript-eslint/no-empty-function */
+// @flow
+import React, {
+  createContext,
+  useCallback,
+  useContext,
+  ReactElement,
+  useReducer,
+  useEffect,
+  useState,
+} from "react";
+
+import { useDebounce } from "../hooks/useDebounce";
+import { Currency } from "../types";
+import {
+  State,
+  MarketDataApi,
+  MarketListRequestParams,
+  MarketCurrencyChartDataRequestParams,
+  CurrencyData,
+  SingleCoinState,
+} from "./types";
+import defaultFetchApi from "./api/api";
+
+type Props = {
+  children: React.ReactNode;
+  fetchApi?: MarketDataApi;
+  countervalue?: Currency;
+  initState?: Partial<State>;
+};
+type API = {
+  refresh: (param?: MarketListRequestParams) => void;
+  refreshChart: (param?: MarketCurrencyChartDataRequestParams) => void;
+  selectCurrency: (key: string) => void;
+  loadNextPage: () => Promise<boolean>;
+  setCounterCurrency: (counterCurrency: string) => void;
+};
+
+export type MarketDataContextType = State & API;
+
+const initialState: State = {
+  ready: false,
+  marketData: [],
+  selectedCurrency: undefined,
+  requestParams: {
+    range: "24h",
+    limit: 50,
+    ids: [],
+    starred: [],
+    orderBy: "market_cap",
+    order: "desc",
+    search: "",
+    liveCompatible: false,
+  },
+  page: 1,
+  chartRequestParams: {
+    range: "24h",
+  },
+  loading: false,
+  loadingChart: false,
+  endOfList: false,
+  error: undefined,
+  totalCoinsAvailable: 0,
+  supportedCounterCurrencies: [],
+  selectedCoinData: undefined,
+  counterCurrency: undefined,
+};
+
+const MarketDataContext = createContext<MarketDataContextType>({
+  ...initialState,
+  refresh: () => {},
+  refreshChart: () => {},
+  selectCurrency: () => {},
+  loadNextPage: () => Promise.resolve(true),
+  setCounterCurrency: () => {},
+});
+
+const ACTIONS = {
+  IS_READY: "IS_READY",
+
+  UPDATE_MARKET_DATA: "UPDATE_MARKET_DATA",
+  UPDATE_SINGLE_MARKET_DATA: "UPDATE_SINGLE_MARKET_DATA",
+  UPDATE_SINGLE_CHART_DATA: "UPDATE_SINGLE_CHART_DATA",
+
+  REFRESH_MARKET_DATA: "REFRESH_MARKET_DATA",
+  REFRESH_CHART_DATA: "REFRESH_CHART_DATA",
+
+  SET_LOADING: "SET_LOADING",
+  SET_LOADING_CHART: "SET_LOADING_CHART",
+  SET_ERROR: "SET_ERROR",
+
+  SELECT_CURRENCY: "SELECT_CURRENCY",
+  UPDATE_COUNTERVALUE: "UPDATE_COUNTERVALUE",
+};
+
+function marketDataReducer(state, action) {
+  switch (action.type) {
+    case ACTIONS.IS_READY:
+      return { ...state, ...action.payload, isReady: true };
+    case ACTIONS.UPDATE_MARKET_DATA: {
+      const newData = action.payload.marketData;
+      const page = action.payload.page || state.requestParams.page;
+      const marketData = [...state.marketData.map((data) => ({ ...data }))];
+      if (!newData.length || marketData.some(({ id }) => id === newData[0].id))
+        return { ...state, loading: false };
+
+      return {
+        ...state,
+        marketData: marketData.concat(newData),
+        endOfList: newData.length < state.requestParams.limit,
+        loading: false,
+        page,
+      };
+    }
+    case ACTIONS.UPDATE_SINGLE_MARKET_DATA: {
+      const marketData = [...state.marketData.map((data) => ({ ...data }))];
+      const index = marketData.findIndex(({ id }) => id === action.payload.id);
+      if (index >= 0) {
+        marketData[index] = { ...marketData[index], ...action.payload };
+      }
+      return { ...state, marketData, loading: false };
+    }
+    case ACTIONS.UPDATE_SINGLE_CHART_DATA: {
+      const marketData = [...state.marketData.map((data) => ({ ...data }))];
+      const index = marketData.findIndex(({ id }) => id === action.payload.id);
+      if (index >= 0) {
+        marketData[index].chartData = {
+          ...marketData[index].chartData,
+          ...action.payload.chartData,
+        };
+      }
+      return { ...state, marketData, loading: false };
+    }
+
+    case ACTIONS.REFRESH_MARKET_DATA: {
+      const requestParams = {
+        ...state.requestParams,
+        ...action.payload,
+        lastRequestTime: Date.now(),
+      };
+      return {
+        ...state,
+        marketData: [],
+        requestParams,
+        loading: true,
+        page: 1,
+      };
+    }
+    case ACTIONS.REFRESH_CHART_DATA: {
+      const chartRequestParams = {
+        ...state.chartRequestParams,
+        ...action.payload,
+        loadingChart: true,
+        lastRequestTime: Date.now(),
+      };
+      return { ...state, chartRequestParams };
+    }
+
+    case ACTIONS.UPDATE_COUNTERVALUE: {
+      const requestParams = {
+        ...state.requestParams,
+        lastRequestTime: Date.now(),
+        page: 1,
+        counterCurrency: action.payload,
+      };
+      const chartRequestParams = {
+        ...state.chartRequestParams,
+        lastRequestTime: Date.now(),
+        counterCurrency: action.payload,
+      };
+      return {
+        ...state,
+        counterCurrency: action.payload,
+        marketData: [],
+        requestParams,
+        chartRequestParams,
+        loading: true,
+      };
+    }
+
+    case ACTIONS.SET_LOADING:
+      return { ...state, loading: action.payload };
+    case ACTIONS.SET_LOADING_CHART:
+      return { ...state, loadingChart: action.payload };
+    case ACTIONS.SET_ERROR:
+      return { ...state, error: action.payload, loading: false };
+    case ACTIONS.SELECT_CURRENCY:
+      return {
+        ...state,
+        selectedCurrency: action.payload,
+        loading: !!action.payload,
+      };
+    default:
+      return state;
+  }
+}
+
+export const MarketDataProvider = ({
+  children,
+  fetchApi,
+  countervalue,
+  initState = {},
+}: Props): ReactElement => {
+  const [state, dispatch] = useReducer(marketDataReducer, {
+    ...initialState,
+    ...initState,
+  });
+  const api = fetchApi || defaultFetchApi;
+  const {
+    marketData,
+    requestParams,
+    chartRequestParams,
+    loading,
+    loadingChart,
+    page,
+  } = useDebounce(state, 300);
+
+  const handleError = useCallback((payload) => {
+    dispatch({ type: ACTIONS.SET_ERROR, payload });
+  }, []);
+
+  useEffect(() => {
+    if (countervalue)
+      api.supportedCounterCurrencies().then(
+        (supportedCounterCurrencies) =>
+          api.setSupportedCoinsList().then((coins) => {
+            dispatch({
+              type: ACTIONS.IS_READY,
+              payload: {
+                totalCoinsAvailable: coins.length,
+                supportedCounterCurrencies,
+              },
+            });
+            dispatch({
+              type: ACTIONS.UPDATE_COUNTERVALUE,
+              payload: supportedCounterCurrencies.includes(countervalue.ticker)
+                ? countervalue.ticker
+                : "usd",
+            });
+          }, handleError),
+        handleError
+      );
+  }, [api, countervalue, handleError]);
+
+  useEffect(() => {
+    if (
+      chartRequestParams?.id &&
+      chartRequestParams?.counterCurrency &&
+      !loadingChart
+    ) {
+      const currentMarketData = marketData.find(
+        ({ id }: CurrencyData) => id === chartRequestParams.id
+      );
+      const range = chartRequestParams.range;
+
+      if (currentMarketData && !currentMarketData?.chartData?.[range]) {
+        api.currencyChartData(chartRequestParams).then(
+          (chartData) =>
+            dispatch({
+              type: ACTIONS.UPDATE_SINGLE_CHART_DATA,
+              payload: { id: chartRequestParams.id, chartData },
+            }),
+          handleError
+        );
+      } else
+        dispatch({
+          type: ACTIONS.SET_LOADING_CHART,
+          payload: false,
+        });
+    }
+  }, [chartRequestParams, marketData, loadingChart, api, handleError]);
+
+  useEffect(() => {
+    if (
+      chartRequestParams?.id &&
+      chartRequestParams?.counterCurrency &&
+      !loading
+    ) {
+      dispatch({ type: ACTIONS.SET_LOADING, payload: true });
+      api
+        .listPaginated({
+          ...chartRequestParams,
+          search: "",
+          starred: [],
+          liveCompatible: false,
+          ids: [chartRequestParams.id],
+          limit: 1,
+          page: 1,
+        })
+        .then(
+          ([{ chartData: _, ...marketData }]) =>
+            dispatch({
+              type: ACTIONS.UPDATE_SINGLE_MARKET_DATA,
+              payload: marketData,
+            }),
+          handleError
+        );
+    }
+  }, [api, chartRequestParams, handleError, loading]);
+
+  useEffect(() => {
+    if (requestParams?.counterCurrency) {
+      api.listPaginated(requestParams).then(
+        (marketData) =>
+          dispatch({
+            type: ACTIONS.UPDATE_MARKET_DATA,
+            payload: { marketData },
+          }),
+        handleError
+      );
+    }
+  }, [api, handleError, requestParams]);
+
+  const refresh = useCallback((payload = {}) => {
+    dispatch({ type: ACTIONS.REFRESH_MARKET_DATA, payload });
+  }, []);
+
+  const refreshChart = useCallback((payload = {}) => {
+    dispatch({ type: ACTIONS.REFRESH_CHART_DATA, payload });
+  }, []);
+
+  const selectCurrency = useCallback((id) => {
+    dispatch({
+      type: ACTIONS.REFRESH_CHART_DATA,
+      payload: {
+        id,
+      },
+    });
+  }, []);
+
+  const loadNextPage = useCallback(() => {
+    return new Promise((resolve, reject) => {
+      if (loading) {
+        reject(new Error());
+      } else {
+        const newPage = page + 1;
+        api.listPaginated({ ...requestParams, page: newPage }).then(
+          (marketData) => {
+            dispatch({
+              type: ACTIONS.UPDATE_MARKET_DATA,
+              payload: { marketData, page: newPage },
+            });
+            resolve(true);
+          },
+          (err) => {
+            handleError(err);
+            reject(new Error(err));
+          }
+        );
+      }
+    });
+  }, [loading, page, api, requestParams, handleError]);
+
+  const setCounterCurrency = useCallback(
+    (payload) => dispatch({ type: ACTIONS.UPDATE_COUNTERVALUE, payload }),
+    [dispatch]
+  );
+
+  const value = {
+    ...state,
+    refresh,
+    refreshChart,
+    selectCurrency,
+    loadNextPage,
+    setCounterCurrency,
+  };
+
+  return (
+    <MarketDataContext.Provider value={value}>
+      {children}
+    </MarketDataContext.Provider>
+  );
+};
+
+export function useMarketData(): MarketDataContextType {
+  return useContext(MarketDataContext);
+}
+
+type SingleCoinProviderData = SingleCoinState & {
+  refreshChart: (param?: MarketCurrencyChartDataRequestParams) => void;
+  setCounterCurrency: (counterCurrency: string) => void;
+};
+
+export function useSingleCoinMarketData(
+  currencyId: string
+): SingleCoinProviderData {
+  const {
+    marketData,
+    selectedCurrency,
+    chartRequestParams,
+    loading,
+    loadingChart,
+    error,
+    counterCurrency,
+    refreshChart,
+    setCounterCurrency,
+    supportedCounterCurrencies,
+  } = useContext(MarketDataContext);
+
+  const [state, setState] = useState<SingleCoinProviderData>({
+    selectedCoinData: undefined,
+    selectedCurrency,
+    chartRequestParams,
+    loading,
+    loadingChart,
+    error,
+    counterCurrency,
+    refreshChart,
+    setCounterCurrency,
+    supportedCounterCurrencies,
+  });
+
+  useEffect(() => {
+    if (marketData)
+      setState((s) => ({
+        ...s,
+        selectedCoinData:
+          marketData.find(({ id }) => id === currencyId) || s.selectedCoinData,
+        selectedCurrency,
+        chartRequestParams,
+        loading,
+        loadingChart,
+        error,
+        counterCurrency,
+        supportedCounterCurrencies,
+      }));
+  }, [
+    marketData,
+    currencyId,
+    selectedCurrency,
+    chartRequestParams,
+    loading,
+    loadingChart,
+    error,
+    counterCurrency,
+    supportedCounterCurrencies,
+  ]);
+
+  return state;
+}