fix(recurring buy): fixes issue to support recurring buys for credit …

…cards (#3710)
blockchain · Oct 5, 2021 · d21108d · d21108d
1 parent a983077
commit d21108d
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 6 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/data/components/recurringBuy/selectors.ts b/packages/blockchain-wallet-v4-frontend/src/data/components/recurringBuy/selectors.ts
@@ -1,4 +1,5 @@
 import { createSelector } from '@reduxjs/toolkit'
+import { buyPaymentMethodSelectedPaymentTypeDictionary } from 'middleware/analyticsMiddleware/utils'
 import { compose, flatten, uniq } from 'ramda'
 
 import { SBPaymentMethodType, SBPaymentTypes } from '@core/types'
@@ -23,7 +24,13 @@ export const isAvailableMethod = (period: RecurringBuyPeriods, method?: SBPaymen
     if (!method) return false
     // All periods support ONE_TIME buys
     if (period === RecurringBuyPeriods.ONE_TIME) return true
-    return (paymentInfoPeriod && paymentInfoPeriod.eligibleMethods.includes(method.type)) || false
+    // Card type can be PAYMENT_CARD or USER_CARD, but backend doesn't support USER_CARD
+    // for recurring buy eligible payment methods. We may want to refactor cards code to
+    // remove the need for USER_CARD
+    const methodType = buyPaymentMethodSelectedPaymentTypeDictionary(
+      method.type
+    ) as unknown as SBPaymentTypes
+    return (paymentInfoPeriod && paymentInfoPeriod.eligibleMethods.includes(methodType)) || false
   })
 
 export const availableMethods = createSelector(getPaymentInfo, (paymentInfoR) => {
@@ -40,7 +47,10 @@ export const hasAvailablePeriods = (method?: SBPaymentMethodType) =>
     if (!method) return false
 
     const paymentInfo = paymentInfoR.getOrElse([]).filter((pi) => {
-      return pi.eligibleMethods.includes(method.type)
+      const methodType = buyPaymentMethodSelectedPaymentTypeDictionary(
+        method.type
+      ) as unknown as SBPaymentTypes
+      return pi.eligibleMethods.includes(methodType)
     })
 
     return paymentInfo.length > 0

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/RecurringBuys/Frequency/index.tsx b/packages/blockchain-wallet-v4-frontend/src/modals/RecurringBuys/Frequency/index.tsx
@@ -1,12 +1,13 @@
 import React, { useEffect } from 'react'
 import { FormattedMessage } from 'react-intl'
 import { connect, ConnectedProps } from 'react-redux'
+import { buyPaymentMethodSelectedPaymentTypeDictionary } from 'middleware/analyticsMiddleware/utils'
 import { bindActionCreators, Dispatch } from 'redux'
 
 import { Remote } from '@core'
+import { SBOrderType, SBPaymentTypes } from '@core/types'
 import DataError from 'components/DataError'
 import { FrequencyScreen } from 'components/Flyout'
-import { SBOrderType } from '@core/types'
 import { actions, selectors } from 'data'
 import { getBaseAmount } from 'data/components/simpleBuy/model'
 import { RootState } from 'data/rootReducer'
@@ -43,7 +44,11 @@ const Frequency = ({ data, order, recurringBuyActions }: Props) => {
       <>
         {order.paymentType ? (
           <FrequencyScreen
-            method={order.paymentType}
+            method={
+              buyPaymentMethodSelectedPaymentTypeDictionary(
+                order.paymentType
+              ) as unknown as SBPaymentTypes
+            }
             headerAction={backToGetStarted}
             headerMode='back'
             paymentInfo={val.paymentInfo}

diff --git a/packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/Frequency/index.tsx b/packages/blockchain-wallet-v4-frontend/src/modals/SimpleBuy/Frequency/index.tsx
@@ -1,8 +1,9 @@
 import React, { PureComponent } from 'react'
 import { connect, ConnectedProps } from 'react-redux'
+import { buyPaymentMethodSelectedPaymentTypeDictionary } from 'middleware/analyticsMiddleware/utils'
 import { bindActionCreators, Dispatch } from 'redux'
 
-import { RemoteDataType, SBPaymentMethodType } from '@core/types'
+import { RemoteDataType, SBPaymentMethodType, SBPaymentTypes } from '@core/types'
 import DataError from 'components/DataError'
 import { FrequencyScreen } from 'components/Flyout'
 import { actions } from 'data'
@@ -38,7 +39,9 @@ class Frequency extends PureComponent<Props> {
             <FrequencyScreen
               headerAction={this.props.backToEnterAmount}
               headerMode='back'
-              method={method}
+              method={
+                buyPaymentMethodSelectedPaymentTypeDictionary(method) as unknown as SBPaymentTypes
+              }
               paymentInfo={val.paymentInfo}
               setPeriod={this.handleFrequencySelection}
             />