From 34f69f926dd7f708488195da1f956243de70201a Mon Sep 17 00:00:00 2001
From: Arush <arush.kapoor@juspay.in>
Date: Wed, 20 Mar 2024 13:15:27 +0530
Subject: [PATCH] fix: saved Payment Method stuck in loading state and Card
 Holder Name for every saved card

---
 src/Components/DynamicFields.res |  6 +++---
 src/Components/SavedCardItem.res |  3 +--
 src/Components/SavedMethods.res  |  1 -
 src/PaymentElement.res           |  5 -----
 src/Types/PaymentType.res        | 12 ++----------
 5 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/src/Components/DynamicFields.res b/src/Components/DynamicFields.res
index bafd1a6e..343b2896 100644
--- a/src/Components/DynamicFields.res
+++ b/src/Components/DynamicFields.res
@@ -7,7 +7,7 @@ let make = (
   ~paymentMethodType,
   ~setRequiredFieldsBody,
   ~isSavedCardFlow=false,
-  ~savedCards=[]: array<PaymentType.customerMethods>,
+  ~savedMethod=PaymentType.defaultCustomerMethods,
   ~cardProps=None,
   ~expiryProps=None,
   ~cvcProps=None,
@@ -46,8 +46,8 @@ let make = (
   }, [requiredFieldsWithBillingDetails])
 
   let isAllStoredCardsHaveName = React.useMemo1(() => {
-    PaymentType.getIsAllStoredCardsHaveName(savedCards)
-  }, [savedCards])
+    PaymentType.getIsStoredPaymentMethodHasName(savedMethod)
+  }, [savedMethod])
 
   //<...>//
   let fieldsArr = React.useMemo3(() => {
diff --git a/src/Components/SavedCardItem.res b/src/Components/SavedCardItem.res
index 9dff89ff..88cb9486 100644
--- a/src/Components/SavedCardItem.res
+++ b/src/Components/SavedCardItem.res
@@ -9,7 +9,6 @@ let make = (
   ~cvcProps,
   ~paymentType,
   ~list,
-  ~savedMethods,
   ~setRequiredFieldsBody,
 ) => {
   let {themeObj, config} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
@@ -162,7 +161,7 @@ let make = (
                 paymentMethodType
                 setRequiredFieldsBody
                 isSavedCardFlow=true
-                savedCards=savedMethods
+                savedMethod=paymentItem
               />
               <Surcharge
                 list
diff --git a/src/Components/SavedMethods.res b/src/Components/SavedMethods.res
index 29e63259..2f6df950 100644
--- a/src/Components/SavedMethods.res
+++ b/src/Components/SavedMethods.res
@@ -57,7 +57,6 @@ let make = (
         cvcProps
         paymentType
         list
-        savedMethods
         setRequiredFieldsBody
       />
     })
diff --git a/src/PaymentElement.res b/src/PaymentElement.res
index 2a2a87a4..b38b99f6 100644
--- a/src/PaymentElement.res
+++ b/src/PaymentElement.res
@@ -388,11 +388,6 @@ let make = (
     </ErrorBoundary>
   }
 
-  React.useEffect(() => {
-    setShowFields(_ => !displaySavedPaymentMethods)
-    None
-  }, [displaySavedPaymentMethods])
-
   let paymentLabel = if displaySavedPaymentMethods {
     showFields
       ? optionAtomValue.paymentMethodsHeaderText
diff --git a/src/Types/PaymentType.res b/src/Types/PaymentType.res
index 7b031ebf..98fc092a 100644
--- a/src/Types/PaymentType.res
+++ b/src/Types/PaymentType.res
@@ -974,14 +974,6 @@ let itemToObjMapper = (dict, logger) => {
 
 type loadType = Loading | Loaded(JSON.t) | SemiLoaded | LoadError(JSON.t)
 
-let getIsAllStoredCardsHaveName = (savedCards: array<customerMethods>) => {
-  savedCards
-  ->Array.filter(savedCard => {
-    switch savedCard.card.cardHolderName {
-    | None
-    | Some("") => false
-    | _ => true
-    }
-  })
-  ->Array.length === savedCards->Array.length
+let getIsStoredPaymentMethodHasName = (savedMethod: customerMethods) => {
+  savedMethod.card.cardHolderName->Option.getOr("")->String.length > 0
 }