From c8172abc5c052a753b93be8b6c9cfd88ce0dd64a Mon Sep 17 00:00:00 2001 From: mitchellv-ledger <105203468+mitchellv-ledger@users.noreply.github.com> Date: Fri, 1 Dec 2023 15:11:14 +0000 Subject: [PATCH] Feat/moonpay quote display (#5604) * feat: add moonpay quote display flag * feat: refactor useSwapTransaction ptxSwapMoonpayProviderFlag use * feat: filter moonpay by flag in useProviderRates. Track ptxSwapMoonpayProviderFlag in swap form * chore: add changeset * fix: change flag to be positive for moonpay swap flag * fix: improve moonpay track (#5629) * fix: improve moonpay track * refactor: refactor ptxSwapMoonpayProviderFlag boolean * refactor: redefine WEB_PROVIDERS * refactor: move complete ptxSwapMoonpayProviderFlag logic to useGetSwapTrackingProperties * fix: lint --------- Co-authored-by: fstream9 Co-authored-by: sarneijim <38540290+sarneijim@users.noreply.github.com> Co-authored-by: sarneijim --- .changeset/odd-brooms-float.md | 7 +++++++ .../screens/exchange/Swap2/Form/index.tsx | 9 ++++++--- .../screens/exchange/Swap2/utils/index.ts | 5 ++++- .../exchange/swap/hooks/v5/useProviderRates.ts | 18 +++++++++++++++--- .../src/featureFlags/defaultFeatures.ts | 2 ++ .../packages/types-live/src/feature.ts | 2 ++ 6 files changed, 36 insertions(+), 7 deletions(-) create mode 100644 .changeset/odd-brooms-float.md diff --git a/.changeset/odd-brooms-float.md b/.changeset/odd-brooms-float.md new file mode 100644 index 000000000000..d004a27de0af --- /dev/null +++ b/.changeset/odd-brooms-float.md @@ -0,0 +1,7 @@ +--- +"@ledgerhq/types-live": patch +"ledger-live-desktop": patch +"@ledgerhq/live-common": patch +--- + +add ptxSwapMoonpayProvider feature flag. Display moonpay quote in swap form and redirect to moonpay web app on moonpay quote selection. diff --git a/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/Form/index.tsx b/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/Form/index.tsx index 7d3ba8817223..a26279dd16a6 100644 --- a/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/Form/index.tsx +++ b/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/Form/index.tsx @@ -40,6 +40,8 @@ import { OnNoRatesCallback } from "@ledgerhq/live-common/exchange/swap/types"; import { v4 } from "uuid"; import SwapWebView, { SWAP_WEB_MANIFEST_ID, SwapWebProps } from "./SwapWebView"; +const DAPP_PROVIDERS = ["paraswap", "oneinch", "moonpay"]; + const Wrapper = styled(Box).attrs({ p: 20, mt: 12, @@ -59,7 +61,6 @@ const Button = styled(ButtonBase)` `; const SwapForm = () => { - const swapDefaultTrack = useGetSwapTrackingProperties(); const [idleState, setIdleState] = useState(false); const { t } = useTranslation(); const dispatch = useDispatch(); @@ -69,6 +70,7 @@ const SwapForm = () => { const totalListedAccounts = useSelector(flattenAccountsSelector); const exchangeRate = useSelector(rateSelector); const walletApiPartnerList = useFeature("swapWalletApiPartnerList"); + const swapDefaultTrack = useGetSwapTrackingProperties(); const setExchangeRate: SetExchangeRateCallback = useCallback( rate => { @@ -147,6 +149,7 @@ const SwapForm = () => { const fromAccountId = from.parentAccount?.id || from.account?.id; const pathname = `/platform/${getProviderName(provider).toLowerCase()}`; + const account = accounts.find(a => a.id === fromAccountId); if (!account) return; const parentAccount = isTokenAccount(account) @@ -227,7 +230,7 @@ const SwapForm = () => { const onSubmit = () => { if (!exchangeRate) return; - const { provider, providerType } = exchangeRate; + const { provider } = exchangeRate; track("button_clicked", { button: "Request", page: "Page Swap Form", @@ -237,7 +240,7 @@ const SwapForm = () => { partner: provider, }); - if (providerType === "DEX") { + if (DAPP_PROVIDERS.includes(provider)) { redirectToProviderApp(provider); } else { // Fix LIVE-9064, prevent the transaction from being updated when using useAllAmount diff --git a/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/utils/index.ts b/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/utils/index.ts index 9b1c00984a45..64cca5454876 100644 --- a/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/utils/index.ts +++ b/apps/ledger-live-desktop/src/renderer/screens/exchange/Swap2/utils/index.ts @@ -3,16 +3,19 @@ import { useHistory } from "react-router-dom"; import { SwapExchangeRateAmountTooLow } from "@ledgerhq/live-common/errors"; import { NotEnoughBalance } from "@ledgerhq/errors"; import { track } from "~/renderer/analytics/segment"; +import useFeature from "@ledgerhq/live-common/featureFlags/useFeature"; export const SWAP_VERSION = "2.35"; export const useGetSwapTrackingProperties = () => { + const ptxSwapMoonpayProviderFlag = useFeature("ptxSwapMoonpayProvider"); return useMemo( () => ({ swapVersion: SWAP_VERSION, flow: "swap", + ptxSwapMoonpayProviderEnabled: !!ptxSwapMoonpayProviderFlag?.enabled, }), - [], + [ptxSwapMoonpayProviderFlag?.enabled], ); }; diff --git a/libs/ledger-live-common/src/exchange/swap/hooks/v5/useProviderRates.ts b/libs/ledger-live-common/src/exchange/swap/hooks/v5/useProviderRates.ts index bd6236acdd62..847b69f6304e 100644 --- a/libs/ledger-live-common/src/exchange/swap/hooks/v5/useProviderRates.ts +++ b/libs/ledger-live-common/src/exchange/swap/hooks/v5/useProviderRates.ts @@ -2,6 +2,8 @@ import BigNumber from "bignumber.js"; import { OnNoRatesCallback, RatesReducerState, SwapSelectorStateType } from "../../types"; import { useFetchRates } from "./useFetchRates"; import { SetExchangeRateCallback } from "../useSwapTransaction"; +import { useFeature } from "../../../../featureFlags"; +import { useCallback } from "react"; type Props = { fromState: SwapSelectorStateType; @@ -22,15 +24,25 @@ export function useProviderRates({ onNoRates, setExchangeRate, }: Props): UseProviderRatesResponse { + const ptxSwapMoonpayProviderFlag = useFeature("ptxSwapMoonpayProvider"); + const filterMoonpay = useCallback( + rates => { + if (!rates || ptxSwapMoonpayProviderFlag?.enabled) return rates; + return rates.filter(r => r.provider !== "moonpay"); + }, + [ptxSwapMoonpayProviderFlag?.enabled], + ); + const { data, isLoading, error, refetch } = useFetchRates({ fromCurrencyAccount: fromState.account, toCurrency: toState.currency, fromCurrencyAmount: fromState.amount ?? BigNumber(0), onSuccess(data) { - if (data.length === 0) { + const rates = filterMoonpay(data); + if (rates.length === 0) { onNoRates?.({ fromState, toState }); } else { - setExchangeRate?.(data[0]); + setExchangeRate?.(rates[0]); } }, }); @@ -77,7 +89,7 @@ export function useProviderRates({ return { rates: { status: "success", - value: data, + value: filterMoonpay(data), error: undefined, }, refetchRates: refetch, diff --git a/libs/ledger-live-common/src/featureFlags/defaultFeatures.ts b/libs/ledger-live-common/src/featureFlags/defaultFeatures.ts index 856b6f88a658..e25a1b94ae37 100644 --- a/libs/ledger-live-common/src/featureFlags/defaultFeatures.ts +++ b/libs/ledger-live-common/src/featureFlags/defaultFeatures.ts @@ -410,4 +410,6 @@ export const DEFAULT_FEATURES: Features = { ptxSwapLiveApp: { enabled: false, }, + + ptxSwapMoonpayProvider: DEFAULT_FEATURE, }; diff --git a/libs/ledgerjs/packages/types-live/src/feature.ts b/libs/ledgerjs/packages/types-live/src/feature.ts index 95b21433d5ab..60d5db88d32d 100644 --- a/libs/ledgerjs/packages/types-live/src/feature.ts +++ b/libs/ledgerjs/packages/types-live/src/feature.ts @@ -183,6 +183,7 @@ export type Features = CurrencyFeatures & { cexDepositEntryPointsMobile: Feature_CexDepositEntryPointsMobile; fetchAdditionalCoins: Feature_FetchAdditionalCoins; ptxSwapLiveApp: Feature_PtxSwapLiveApp; + ptxSwapMoonpayProvider: Feature_PtxSwapMoonpayProvider; }; /** @@ -494,6 +495,7 @@ export type Feature_ListAppsV2minor1 = DefaultFeature; export type Feature_BrazeLearn = DefaultFeature; export type Feature_LlmNewDeviceSelection = DefaultFeature; export type Feature_LlmWalletQuickActions = DefaultFeature; +export type Feature_PtxSwapMoonpayProvider = DefaultFeature; /** * Utils types.