feat: added samsung pay

package.json

@@ -36,6 +36,7 @@
     "@sentry/react-native": "^5.9.1",
     "react-native-code-push": "^8.3.1",
     "react-native-hyperswitch-netcetera-3ds": "^0.1.1",
+    "react-native-hyperswitch-samsung-pay": "^0.1.0",
     "react-native-hyperswitch-scancard": "^0.3.1",
     "react-native-inappbrowser-reborn": "^3.7.0",
     "react-native-klarna-inapp-sdk": "^2.1.13",

src/components/elements/ButtonElement.res

@@ -35,6 +35,7 @@ let make = (
     applePayButtonColor,
     buttonBorderRadius,
     primaryButtonHeight,
+    samsungPayButtonColor,
   } = ThemebasedStyle.useThemeBasedStyle()
 
   let fetchAndRedirect = AllPaymentHooks.useRedirectHook()
@@ -267,6 +268,37 @@ let make = (
     }
   }
 
+  let confirmSamsungPay = status => {
+    if status->ThreeDsUtils.isStatusSuccess {
+      let response =
+        status.message
+        ->JSON.parseExn
+        ->JSON.Decode.object
+        ->Option.getOr(Dict.make())
+
+      let obj = response->SamsungPayType.itemToObjMapper
+
+      let payment_method_data =
+        [
+          (
+            walletType.payment_method,
+            [(walletType.payment_method_type, obj->Utils.getJsonObjectFromRecord)]
+            ->Dict.fromArray
+            ->JSON.Encode.object,
+          ),
+        ]
+        ->Dict.fromArray
+        ->JSON.Encode.object
+      processRequest(~payment_method_data, ())
+    } else {
+      setLoading(FillingDetails)
+      showAlert(
+        ~errorType="warning",
+        ~message=`Samsung Pay Error, Please try again ${status.message}`,
+      )
+    }
+  }
+
   let confirmApplePay = (var: dict<JSON.t>) => {
     logger(
       ~logType=DEBUG,
@@ -494,6 +526,7 @@ let make = (
               },
             )
           }
+        | SAMSUNG_PAY => SamsungPayModule.presentSamsungPayPaymentSheet(confirmSamsungPay)
         | _ => {
             logger(
               ~logType=DEBUG,
@@ -557,9 +590,13 @@ let make = (
       borderRadius=buttonBorderRadius
       linearGradientColorTuple=?{switch walletType.payment_method_type_wallet {
       | PAYPAL => Some(Some(paypalButonColor))
+      | SAMSUNG_PAY => {
+          Console.log2("HERE", walletType.payment_method_type)
+          Some(Some(samsungPayButtonColor))
+        }
       | _ => None
       }}
-      leftIcon=CustomIcon(<Icon name=walletType.payment_method_type width=24. height=32. />)
+      leftIcon=CustomIcon(<Icon name=walletType.payment_method_type width=120. height=115. />)
       onPress={_ => pressHandler()}
       name=walletType.payment_method_type>
       {switch walletType.payment_method_type_wallet {

src/components/modules/SamsungPayModule.res

@@ -0,0 +1,18 @@
+open ExternalThreeDsTypes
+
+type module_ = {
+  checkSamsungPayValidity: (string, statusType => unit) => unit,
+  presentSamsungPayPaymentSheet: (statusType => unit) => unit,
+  isAvailable: bool,
+}
+
+@val external require: string => module_ = "require"
+
+let (checkSamsungPayValidity, presentSamsungPayPaymentSheet, isAvailable) = switch try {
+  require("react-native-hyperswitch-samsung-pay")->Some
+} catch {
+| _ => None
+} {
+| Some(mod) => (mod.checkSamsungPayValidity, mod.presentSamsungPayPaymentSheet, mod.isAvailable)
+| None => ((_, _) => (), _ => (), false)
+}

src/hooks/PMListModifier.res

@@ -294,6 +294,13 @@ let useListModifier = () => {
                   exp
                 }
               : None
+          | SAMSUNG_PAY =>
+            exp->Option.isSome &&
+            SamsungPayModule.isAvailable &&
+            SamsungPay.val.contents == SamsungPay.Valid
+              ? exp
+              : None
+
           | PAYPAL =>
             exp->Option.isSome && PaypalModule.payPalModule->Option.isSome
               ? exp

src/hooks/SamsungPay.res

@@ -0,0 +1,60 @@
+open SamsungPayType
+
+type samsungPayWalletValidity = Checking | Valid | Invalid | Not_Started
+let val = ref(Not_Started)
+
+let isSamsungPayValid = state => {
+  state != Checking && state != Not_Started
+}
+
+let useSamsungPayValidityHook = () => {
+  let (state, setState) = React.useState(_ => val.contents)
+  let isSamsungPayAvailable = SamsungPayModule.isAvailable
+  let (allApiData, _) = React.useContext(AllApiDataContext.allApiDataContext)
+  let sessionToken = allApiData.sessions->getSamsungPaySessionObject
+
+  let stringifiedSessionToken =
+    sessionToken
+    ->Utils.getJsonObjectFromRecord
+    ->JSON.stringify
+
+  React.useEffect2(() => {
+    switch (val.contents, isSamsungPayAvailable, allApiData.sessions) {
+    | (_, false, _) =>
+      setState(_ => {
+        val := Invalid
+        Invalid
+      })
+    | (Not_Started, true, Some(_)) => {
+        setState(_ => {
+          val := Checking
+          Checking
+        })
+        if isSamsungPayAvailable {
+          SamsungPayModule.checkSamsungPayValidity(stringifiedSessionToken, status => {
+            if status->ThreeDsUtils.isStatusSuccess {
+              setState(
+                _ => {
+                  val := Valid
+                  Valid
+                },
+              )
+            } else {
+              setState(
+                _ => {
+                  val := Invalid
+                  Invalid
+                },
+              )
+            }
+          })
+        }
+      }
+
+    | (_, _, _) => ()
+    }->ignore
+    None
+  }, (isSamsungPayAvailable, allApiData.sessions))
+
+  state
+}

src/hooks/ThemebasedStyle.res

@@ -159,6 +159,7 @@ type themeBasedStyleObj = {
   modalTextSizeAdjust: float,
   cardTextSizeAdjust: float,
   paypalButonColor: buttonColorConfig,
+  samsungPayButtonColor: buttonColorConfig,
   applePayButtonColor: SdkTypes.applePayButtonStyle,
   googlePayButtonColor: Appearance.t,
   payNowButtonColor: buttonColorConfig,
@@ -237,6 +238,7 @@ let darkRecord = {
   modalTextSizeAdjust: 0.,
   cardTextSizeAdjust: 0.,
   paypalButonColor: ("#ffffff", "#ffffff"),
+  samsungPayButtonColor: ("#000000", "#000000"),
   payNowButtonTextColor: "#FFFFFF",
   applePayButtonColor: #white,
   googlePayButtonColor: #light,
@@ -314,6 +316,7 @@ let lightRecord = {
   cardTextSizeAdjust: 0.,
   paypalButonColor: ("#F6C657", "#F6C657"),
   applePayButtonColor: #black,
+  samsungPayButtonColor: ("#000000", "#000000"),
   googlePayButtonColor: #dark,
   payNowButtonColor: ("#006DF9", "#006DF9"),
   payNowButtonTextColor: "#FFFFFF",
@@ -390,6 +393,7 @@ let minimal = {
   modalTextSizeAdjust: 0.,
   cardTextSizeAdjust: 0.,
   paypalButonColor: ("#ffc439", "#ffc439"),
+  samsungPayButtonColor: ("#000000", "#000000"),
   applePayButtonColor: #black,
   googlePayButtonColor: #dark,
   payNowButtonColor: ("#0570de", "#0080FE"),
@@ -469,6 +473,7 @@ let flatMinimal = {
   paypalButonColor: ("#ffc439", "#ffc439"),
   applePayButtonColor: #black,
   googlePayButtonColor: #dark,
+  samsungPayButtonColor: ("#000000", "#000000"),
   payNowButtonColor: ("#0570de", "#0080FE"),
   payNowButtonTextColor: "#000000",
   payNowButtonBorderColor: "#000000",
@@ -763,6 +768,7 @@ let itemToObj = (
     | None => themeObj.cardTextSizeAdjust
     },
     paypalButonColor: themeObj.paypalButonColor,
+    samsungPayButtonColor: themeObj.samsungPayButtonColor,
     applePayButtonColor: applePayOverrideStyle,
     googlePayButtonColor: gpayOverrideStyle,
     payNowButtonColor: getStrProp(

src/routes/ParentPaymentSheet.res

@@ -21,22 +21,29 @@ let make = () => {
   let setConfirmButtonDataRef = React.useCallback1(confirmButtonDataRef => {
     setConfirmButtonDataRef(_ => confirmButtonDataRef)
   }, [setConfirmButtonDataRef])
+  let samsungPayValidity = SamsungPay.useSamsungPayValidityHook()
 
   <FullScreenSheetWrapper>
-    {switch (allApiData.savedPaymentMethods, allApiData.additionalPMLData.paymentType) {
-    | (_, None)
-    | (Loading, _) =>
-      nativeProp.hyperParams.defaultView
+    {switch (
+      allApiData.savedPaymentMethods,
+      allApiData.additionalPMLData.paymentType,
+      samsungPayValidity,
+    ) {
+    | (_, _, SamsungPay.Checking) => <SdkLoadingScreen />
+    | (_, _, SamsungPay.Not_Started) => <SdkLoadingScreen />
+    | (_, None, _)
+    | (Loading, _, _) =>
+      nativeProp.hyperParams.defaultView && samsungPayValidity->SamsungPay.isSamsungPayValid
         ? <PaymentSheet setConfirmButtonDataRef />
         : <SdkLoadingScreen />
-    | (Some(data), _) =>
+    | (Some(data), _, _) =>
       paymentScreenType == PaymentScreenContext.SAVEDCARDSCREEN &&
       data.pmList->Option.getOr([])->Array.length > 0 &&
       allApiData.additionalPMLData.mandateType !== SETUP_MANDATE
         ? <SavedPaymentScreen setConfirmButtonDataRef savedPaymentMethordContextObj=data />
         : <PaymentSheet setConfirmButtonDataRef />
 
-    | (None, _) => <PaymentSheet setConfirmButtonDataRef />
+    | (None, _, _) => <PaymentSheet setConfirmButtonDataRef />
     }}
     <GlobalConfirmButton confirmButtonDataRef />
     <Space height=12. />

src/types/PaymentMethodListType.res

@@ -143,6 +143,7 @@ let flattenPaymentListArray = (plist, item) => {
         | "google_pay" => GOOGLE_PAY
         | "apple_pay" => APPLE_PAY
         | "paypal" => PAYPAL
+        | "samsung_pay" => SAMSUNG_PAY
         | _ => NONE
         },
         payment_experience: dict2

src/types/SamsungPayType.res

@@ -0,0 +1,83 @@
+open Utils
+type payment3DS = {
+  \"type": string,
+  version: string,
+  data: string,
+}
+
+type paymentShippingAddress = {
+  shipping: Js.Json.t, // Assuming this is a complex object, we use Js.Json.t for now
+  email: string,
+}
+
+type paymentCredential = {
+  \"3_d_s": payment3DS,
+  card_brand: string,
+  // payment_currency_type: string,
+  // payment_last4_dpan: string,
+  // payment_last4_fpan: string,
+  card_last4digits: string,
+  // merchant_ref: string,
+  method: string,
+  recurring_payment: bool,
+  // payment_shipping_address: paymentShippingAddress,
+  // payment_shipping_method: string,
+}
+type paymentMethodData = {payment_credential: paymentCredential}
+
+let defaultSPayPaymentMethodData = {
+  payment_credential: {
+    card_brand: "",
+    recurring_payment: false,
+    card_last4digits: "",
+    method: "",
+    \"3_d_s": {
+      \"type": "",
+      version: "",
+      data: "",
+    },
+  },
+}
+
+let get3DSData = (dict, str) => {
+  dict
+  ->Dict.get(str)
+  ->Option.flatMap(JSON.Decode.object)
+  ->Option.map(json => {
+    {
+      \"type": getString(json, "type", ""),
+      version: getString(json, "version", ""),
+      data: getString(json, "data", ""),
+    }
+  })
+  ->Option.getOr({\"type": "", version: "", data: ""})
+}
+let getPaymentMethodData = dict => {
+  {
+    payment_credential: {
+      card_brand: getString(dict, "payment_card_brand", ""),
+      recurring_payment: getBool(dict, "recurring_payment", false),
+      card_last4digits: getString(dict, "payment_last4_fpan", ""),
+      method: getString(dict, "method", ""),
+      \"3_d_s": get3DSData(dict, "3DS"),
+    },
+  }
+}
+
+type paymentDataFromSPay = {paymentMethodData: paymentMethodData, email?: string}
+let itemToObjMapper = dict => {
+  getPaymentMethodData(dict)
+}
+
+let getSamsungPaySessionObject = (sessionData: AllApiDataContext.sessions) => {
+  let sessionObject = switch sessionData {
+  | Some(sessionData) =>
+    sessionData
+    ->Array.find(item => item.wallet_name == SAMSUNG_PAY)
+    ->Option.getOr(SessionsType.defaultToken)
+  | _ => SessionsType.defaultToken
+  }
+
+  sessionObject
+  //TO DO order_number should not contain _
+}

src/types/SdkTypes.res

@@ -34,7 +34,7 @@ type localeTypes =
 
 type fontFamilyTypes = DefaultIOS | DefaultAndroid | CustomFont(string) | DefaultWeb
 
-type payment_method_type_wallet = GOOGLE_PAY | APPLE_PAY | PAYPAL | NONE | KLARNA
+type payment_method_type_wallet = GOOGLE_PAY | APPLE_PAY | PAYPAL | SAMSUNG_PAY | NONE | KLARNA
 let walletNameMapper = str => {
   switch str {
   | "google_pay" => "Google Pay"
@@ -274,6 +274,7 @@ let walletTypeToStrMapper = walletType => {
   | GOOGLE_PAY => "google_pay"
   | APPLE_PAY => "apple_pay"
   | PAYPAL => "paypal"
+  | SAMSUNG_PAY => "samsung_pay"
   | _ => ""
   }
 }