Pull request #231: hotfix - Card cvc empty

Merge in EXC/orca-elements from hotfix/card_cvc_empty to master

* commit '249d23aa96e1a0de4edb5edff9bc3a68f14204b3':
  Applied suggestion
  hotfix - card cvc empty

src/Components/SavedCardItem.res

@@ -65,7 +65,7 @@ let make = (
       ~boxShadow="none",
       (),
     )}
-    onClick={_ => setPaymentToken(_ => (paymentItem.paymentToken, paymentItem.customerId))}>
+    onClick={_ => setPaymentToken(._ => (paymentItem.paymentToken, paymentItem.customerId))}>
     <div className="w-full">
       <div>
         <div className="flex flex-row justify-between items-center">

src/Payment.res

@@ -14,6 +14,8 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
   let keys = Recoil.useRecoilValueFromAtom(keys)
   let cardScheme = Recoil.useRecoilValueFromAtom(RecoilAtoms.cardBrand)
   let showFeilds = Recoil.useRecoilValueFromAtom(RecoilAtoms.showCardFeildsAtom)
+  let paymentToken = Recoil.useRecoilValueFromAtom(RecoilAtoms.paymentTokenAtom)
+  let (token, _) = paymentToken
 
   let {iframeId} = keys
 
@@ -200,6 +202,14 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
   let submitAPICall = (body, confirmParam) => {
     intent(~bodyArr=body, ~confirmParam, ~handleUserError=false, ())
   }
+  React.useEffect2(() => {
+    setCvcNumber(_ => "")
+    setIsCVCValid(_ => None)
+    setCvcError(_ => "")
+    setCardError(_ => "")
+    setExpiryError(_ => "")
+    None
+  }, (token, showFeilds))
 
   let submitValue = (_ev, confirmParam) => {
     let validFormat = switch paymentMode->getPaymentMode {

src/Payments/CardPayment.res

@@ -47,7 +47,7 @@ let make = (
     isCVCValid,
     setIsCVCValid,
     cvcNumber,
-    setCvcNumber,
+    _,
     changeCVCNumber,
     handleCVCBlur,
     cvcRef,
@@ -63,7 +63,7 @@ let make = (
   let intent = PaymentHelpers.usePaymentIntent(Some(loggerState), Card)
   let (savedMethods, setSavedMethods) = React.useState(_ => [])
   let (showFeilds, setShowFeilds) = Recoil.useRecoilState(RecoilAtoms.showCardFeildsAtom)
-  let (paymentToken, setPaymentToken) = React.useState(_ => ("", ""))
+  let (paymentToken, setPaymentToken) = Recoil.useRecoilState(RecoilAtoms.paymentTokenAtom)
   let (token, _) = paymentToken
   let cardHolderName = Recoil.useRecoilValueFromAtom(RecoilAtoms.userFullName)
   let setComplete = Recoil.useSetRecoilState(RecoilAtoms.fieldsComplete)
@@ -81,13 +81,6 @@ let make = (
   //   ~billingDetails=fields.billingDetails,
   //   ~logger=loggerState,
   // )
-  React.useEffect2(() => {
-    setCvcNumber(_ => "")
-    setCvcError(_ => "")
-    setCardError(_ => "")
-    setExpiryError(_ => "")
-    None
-  }, (token, showFeilds))
   React.useEffect1(() => {
     switch customerPaymentMethods {
     | LoadingSavedCards => ()
@@ -123,12 +116,11 @@ let make = (
       savedMethods->Js.Array2.length > 0
         ? Some(savedMethods->Belt.Array.get(0)->Belt.Option.getWithDefault(defaultCustomerMethods))
         : None
-    setPaymentToken(_ =>
-      switch tokenobj {
-      | Some(obj) => (obj.paymentToken, obj.customerId)
-      | None => ("", "")
-      }
-    )
+
+    switch tokenobj {
+    | Some(obj) => setPaymentToken(._ => (obj.paymentToken, obj.customerId))
+    | None => ()
+    }
     None
   }, [savedMethods])
 

src/Utilities/RecoilAtoms.res

@@ -10,6 +10,7 @@ let list = Recoil.atom(. "paymentMethodList", PaymentType.Loading)
 let loggerAtom = Recoil.atom(. "component", OrcaLogger.defaultLoggerConfig)
 let sessionId = Recoil.atom(. "sessionId", "")
 let selectedOptionAtom = Recoil.atom(. "selectedOption", "")
+let paymentTokenAtom = Recoil.atom(. "paymentToken", ("", ""))
 let showCardFeildsAtom = Recoil.atom(. "showCardFeilds", false)
 let phoneJson = Recoil.atom(. "phoneJson", Loading)
 let cardBrand = Recoil.atom(. "cardBrand", "")