feat: Added masked payload for confirm calls (#148)

src/Components/DynamicFields.res

@@ -283,6 +283,44 @@ let make = (
     dynamicFieldsToRenderInsideBilling->Js.Array2.length > 0 &&
       (dynamicFieldsToRenderInsideBilling->Js.Array2.length > 1 || !isOnlyInfoElementPresent)
 
+  React.useEffect1(() => {
+    let fieldsArrStr = fieldsArr->Js.Array2.map(field => {
+      field->PaymentMethodsRecord.paymentMethodFieldToStrMapper->Js.Json.string
+    })
+    let dynamicFieldsToRenderOutsideBillingStr =
+      dynamicFieldsToRenderOutsideBilling->Js.Array2.map(field => {
+        field->PaymentMethodsRecord.paymentMethodFieldToStrMapper->Js.Json.string
+      })
+    let dynamicFieldsToRenderInsideBillingStr =
+      dynamicFieldsToRenderInsideBilling->Js.Array2.map(field => {
+        field->PaymentMethodsRecord.paymentMethodFieldToStrMapper->Js.Json.string
+      })
+    let requiredFieldsStr = requiredFields->Js.Array2.map(field => {
+      field.required_field->Js.Json.string
+    })
+
+    let loggerPayload =
+      [
+        ("requiredFields", requiredFieldsStr->Js.Json.array),
+        ("fieldsArr", fieldsArrStr->Js.Json.array),
+        (
+          "dynamicFieldsToRenderOutsideBilling",
+          dynamicFieldsToRenderOutsideBillingStr->Js.Json.array,
+        ),
+        (
+          "dynamicFieldsToRenderInsideBilling",
+          dynamicFieldsToRenderInsideBillingStr->Js.Json.array,
+        ),
+        ("isRenderDynamicFieldsInsideBilling", isRenderDynamicFieldsInsideBilling->Js.Json.boolean),
+        ("isOnlyInfoElementPresent", isOnlyInfoElementPresent->Js.Json.boolean),
+        ("isInfoElementPresent", isInfoElementPresent->Js.Json.boolean),
+      ]
+      ->Js.Dict.fromArray
+      ->Js.Json.object_
+    logger.setLogInfo(~value=loggerPayload->Js.Json.stringify, ~eventName=DYNAMIC_FIELDS_RENDER, ())
+    None
+  }, fieldsArr)
+
   {
     fieldsArr->Js.Array2.length > 0
       ? <>

src/Payments/PaymentMethodsRecord.res

@@ -529,7 +529,8 @@ let getPaymentMethodsFieldTypeFromDict = dict => {
       switch options->Belt.Array.get(0)->Belt.Option.getWithDefault("") {
       | "" => None
       | "ALL" => AddressCountry(Country.country->Js.Array2.map(item => item.countryName))
-      | _ => AddressCountry(
+      | _ =>
+        AddressCountry(
           Country.country
           ->Js.Array2.filter(item => options->Js.Array2.includes(item.isoAlpha2))
           ->Js.Array2.map(item => item.countryName),
@@ -983,3 +984,33 @@ let getCardNetwork = (~paymentMethodType, ~cardBrand) => {
   ->Belt.Array.get(0)
   ->Belt.Option.getWithDefault(defaultCardNetworks)
 }
+
+let paymentMethodFieldToStrMapper = (field: paymentMethodsFields) => {
+  switch field {
+  | Email => "Email"
+  | FullName => "FullName"
+  | InfoElement => "InfoElement"
+  | Country => "Country"
+  | Bank => "Bank"
+  | SpecialField(_) => "SpecialField"
+  | None => "None"
+  | BillingName => "BillingName"
+  | PhoneNumber => "PhoneNumber"
+  | AddressLine1 => "AddressLine1"
+  | AddressLine2 => "AddressLine2"
+  | AddressCity => "AddressCity"
+  | StateAndCity => "StateAndCity"
+  | CountryAndPincode(_) => "CountryAndPincode"
+  | AddressPincode => "AddressPincode"
+  | AddressState => "AddressState"
+  | AddressCountry(_) => "AddressCountry"
+  | BlikCode => "BlikCode"
+  | Currency(_) => "Currency"
+  | CardNumber => "CardNumber"
+  | CardExpiryMonth => "CardExpiryMonth"
+  | CardExpiryYear => "CardExpiryYear"
+  | CardExpiryMonthAndYear => "CardExpiryMonthAndYear"
+  | CardCvc => "CardCvc"
+  | CardExpiryAndCvc => "CardExpiryAndCvc"
+  }
+}

src/Utilities/PaymentHelpers.res

@@ -255,10 +255,12 @@ let intentCall = (
             let qrData = intent.nextAction.image_data_url->Belt.Option.getWithDefault("")
             let expiryTime = intent.nextAction.display_to_timestamp->Belt.Option.getWithDefault("")
             let headerObj = Js.Dict.empty()
-            headers->Js.Array2.forEach(entries => {
-              let (x, val) = entries
-              Js.Dict.set(headerObj, x, val->Js.Json.string)
-            })
+            headers->Js.Array2.forEach(
+              entries => {
+                let (x, val) = entries
+                Js.Dict.set(headerObj, x, val->Js.Json.string)
+              },
+            )
             let metaData =
               [
                 ("qrData", qrData->Js.Json.string),
@@ -357,7 +359,7 @@ let intentCall = (
             )
           }
           if intent.status === "failed" {
-            setIsManualRetryEnabled(._ => intent.manualRetryAllowed)
+            setIsManualRetryEnabled(. _ => intent.manualRetryAllowed)
           }
           switch paymentType {
           | Card => postSubmitResponse(~jsonData=data, ~url=url.href)
@@ -451,7 +453,15 @@ let rec maskPayload = payloadDict => {
   keys
   ->Js.Array2.map(key => {
     let value = payloadDict->Js.Dict.get(key)->Belt.Option.getWithDefault(Js.Json.null)
-    if value->Js.Json.decodeObject->Belt.Option.isSome {
+    if value->Js.Json.decodeArray->Belt.Option.isSome {
+      let arr = value->Js.Json.decodeArray->Belt.Option.getWithDefault([])
+      arr->Js.Array2.forEachi((element, index) => {
+        maskedPayload->Js.Dict.set(
+          key ++ "[" ++ index->Belt.Int.toString ++ "]",
+          element->Utils.getDictFromJson->maskPayload->Js.Json.string,
+        )
+      })
+    } else if value->Js.Json.decodeObject->Belt.Option.isSome {
       let valueDict = value->Utils.getDictFromJson
       maskedPayload->Js.Dict.set(key, valueDict->maskPayload->Js.Json.string)
     } else {
@@ -504,9 +514,31 @@ let usePaymentIntent = (optLogger: option<OrcaLogger.loggerMake>, paymentType: p
       )
       let uri = `${endpoint}/payments/${paymentIntentID}/confirm`
       let fetchMethod = Fetch.Post
-      let loggerPayload = body->Js.Dict.fromArray->maskPayload
 
       let callIntent = body => {
+        let maskedPayload =
+          body
+          ->OrcaUtils.safeParseOpt
+          ->Belt.Option.getWithDefault(Js.Json.null)
+          ->Utils.getDictFromJson
+          ->maskPayload
+        let loggerPayload =
+          [
+            ("payload", maskedPayload->Js.Json.string),
+            (
+              "headers",
+              headers
+              ->Js.Array2.map(header => {
+                let (key, value) = header
+                (key, value->Js.Json.string)
+              })
+              ->Js.Dict.fromArray
+              ->Js.Json.object_,
+            ),
+          ]
+          ->Js.Dict.fromArray
+          ->Js.Json.object_
+          ->Js.Json.stringify
         switch paymentType {
         | Card =>
           handleLogging(
@@ -843,4 +875,4 @@ let useCustomerDetails = (
     )
     Js.Json.null->resolve
   })
-}
+}

src/orca-loader/Elements.res

@@ -121,6 +121,8 @@ let make = (
         // Js.Global.setTimeout(() => {
         let msg = [("paymentMethodList", json)]->Js.Dict.fromArray
         mountedIframeRef->Window.iframePostMessage(msg)
+        let maskedPayload = json->getDictFromJson->PaymentHelpers.maskPayload
+        logger.setLogInfo(~value=maskedPayload, ~eventName=PAYMENT_METHODS_RESPONSE, ())
         // }, 5000)->ignore
         json->resolve
       })

src/orca-log-catcher/OrcaLogger.res

@@ -52,6 +52,8 @@ type eventName =
   | REDIRECTING_USER
   | DISPLAY_BANK_TRANSFER_INFO_PAGE
   | DISPLAY_QR_CODE_INFO_PAGE
+  | DYNAMIC_FIELDS_RENDER
+  | PAYMENT_METHODS_RESPONSE
 
 let eventNameToStrMapper = eventName => {
   switch eventName {
@@ -105,6 +107,8 @@ let eventNameToStrMapper = eventName => {
   | REDIRECTING_USER => "REDIRECTING_USER"
   | DISPLAY_BANK_TRANSFER_INFO_PAGE => "DISPLAY_BANK_TRANSFER_INFO_PAGE"
   | DISPLAY_QR_CODE_INFO_PAGE => "DISPLAY_QR_CODE_INFO_PAGE"
+  | DYNAMIC_FIELDS_RENDER => "DYNAMIC_FIELDS_RENDER"
+  | PAYMENT_METHODS_RESPONSE => "PAYMENT_METHODS_RESPONSE"
   }
 }