Merge branch 'main' of github.com:juspay/hyperswitch-web into refacto…

…r-premount-loader-2

CHANGELOG.md

@@ -1,3 +1,19 @@
+# [0.101.0](https://github.com/juspay/hyperswitch-web/compare/v0.100.1...v0.101.0) (2024-11-07)
+
+
+### Features
+
+* added dynamic fields support for sepa bank transfer ([#775](https://github.com/juspay/hyperswitch-web/issues/775)) ([52d2d15](https://github.com/juspay/hyperswitch-web/commit/52d2d15ed2b2b8ed364a81fe9bbd3dfbd64c0cec))
+
+## [0.100.1](https://github.com/juspay/hyperswitch-web/compare/v0.100.0...v0.100.1) (2024-11-06)
+
+# [0.100.0](https://github.com/juspay/hyperswitch-web/compare/v0.99.6...v0.100.0) (2024-11-06)
+
+
+### Features
+
+* add dynamic fields support for affirm ([#776](https://github.com/juspay/hyperswitch-web/issues/776)) ([e55e533](https://github.com/juspay/hyperswitch-web/commit/e55e533a197efad11c9b8cceb4b06c672a365dfe))
+
 ## [0.99.6](https://github.com/juspay/hyperswitch-web/compare/v0.99.5...v0.99.6) (2024-11-06)
 
 ## [0.99.5](https://github.com/juspay/hyperswitch-web/compare/v0.99.4...v0.99.5) (2024-11-06)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "orca-payment-page",
-  "version": "0.99.6",
+  "version": "0.101.0",
   "main": "index.js",
   "private": true,
   "dependencies": {

src/PaymentMethodCollectElement.res

@@ -74,7 +74,7 @@ let make = (~integrateError, ~logger) => {
         setTimeout(() => {
           clearInterval(interval)
           // Append query params and redirect
-          let url = PaymentHelpers.urlSearch(returnUrl)
+          let url = URLModule.makeUrl(returnUrl)
           url.searchParams.set("payout_id", options.payoutId)
           url.searchParams.set("status", statusInfo.status->getPayoutStatusString)
           Utils.openUrl(url.href)

src/Payments/PaymentMethodsRecord.res

@@ -680,6 +680,7 @@ let dynamicFieldsEnabledPaymentMethods = [
   "mifinity",
   "upi_collect",
   "sepa",
+  "affirm",
 ]
 
 let getIsBillingField = requiredFieldType => {

src/Payments/PaypalSDKHelpers.res

@@ -1,5 +1,4 @@
 open PaypalSDKTypes
-open Promise
 open Utils
 open TaxCalculation
 
@@ -11,13 +10,13 @@ let loadPaypalSDK = (
   ~isManualRetryEnabled,
   ~paymentMethodListValue,
   ~isGuestCustomer,
-  ~postSessionTokens: PaymentHelpers.paymentIntent,
+  ~postSessionTokens: PaymentHelpersTypes.paymentIntent,
   ~options: PaymentType.options,
   ~publishableKey,
   ~paymentMethodTypes,
   ~stateJson,
-  ~confirm: PaymentHelpers.paymentIntent,
-  ~completeAuthorize: PaymentHelpers.completeAuthorize,
+  ~confirm: PaymentHelpersTypes.paymentIntent,
+  ~completeAuthorize: PaymentHelpersTypes.completeAuthorize,
   ~handleCloseLoader,
   ~areOneClickWalletsRendered: (
     RecoilAtoms.areOneClickWalletsRendered => RecoilAtoms.areOneClickWalletsRendered
@@ -57,10 +56,10 @@ let loadPaypalSDK = (
     style: buttonStyle,
     fundingSource: paypal["FUNDING"]["PAYPAL"],
     createOrder: () => {
-      Utils.makeOneClickHandlerPromise(sdkHandleIsThere)->then(result => {
+      makeOneClickHandlerPromise(sdkHandleIsThere)->Promise.then(result => {
         let result = result->JSON.Decode.bool->Option.getOr(false)
         if result {
-          Utils.messageParentWindow([
+          messageParentWindow([
             ("fullscreen", true->JSON.Encode.bool),
             ("param", "paymentloader"->JSON.Encode.string),
             ("iframeId", iframeId->JSON.Encode.string),
@@ -84,9 +83,9 @@ let loadPaypalSDK = (
                 ~handleUserError=true,
                 ~intentCallback=val => {
                   val
-                  ->Utils.getDictFromJson
-                  ->Utils.getDictFromDict("nextActionData")
-                  ->Utils.getString("order_id", "")
+                  ->getDictFromJson
+                  ->getDictFromDict("nextActionData")
+                  ->getString("order_id", "")
                   ->resolve
                 },
                 ~manualRetry=isManualRetryEnabled,
@@ -99,8 +98,7 @@ let loadPaypalSDK = (
                   publishableKey,
                 },
                 ~handleUserError=true,
-                ~intentCallback=val =>
-                  val->Utils.getDictFromJson->Utils.getString("orderId", "")->resolve,
+                ~intentCallback=val => val->getDictFromJson->getString("orderId", "")->resolve,
                 ~manualRetry=isManualRetryEnabled,
               )
             }
@@ -111,7 +109,7 @@ let loadPaypalSDK = (
             ~eventName=PAYPAL_SDK_FLOW,
             ~paymentMethod="PAYPAL",
           )
-          resolve("")
+          Promise.resolve("")
         }
       })
     },
@@ -141,23 +139,23 @@ let loadPaypalSDK = (
           ~sessionId=data->getDictFromJson->Dict.get("orderID"),
         )
       } else {
-        Js.Json.null->Js.Promise.resolve
+        JSON.Encode.null->Promise.resolve
       }
     },
     onApprove: (_data, actions) => {
       if !options.readOnly {
         actions.order.get()
-        ->then(val => {
+        ->Promise.then(val => {
           let purchaseUnit =
             val
-            ->Utils.getDictFromJson
-            ->Utils.getArray("purchase_units")
+            ->getDictFromJson
+            ->getArray("purchase_units")
             ->Array.get(0)
             ->Option.flatMap(JSON.Decode.object)
             ->Option.getOr(Dict.make())
           let payerDetails =
             val
-            ->Utils.getDictFromJson
+            ->getDictFromJson
             ->Dict.get("payer")
             ->Option.flatMap(JSON.Decode.object)
             ->Option.getOr(Dict.make())
@@ -172,7 +170,7 @@ let loadPaypalSDK = (
 
           let (connectors, _) =
             paymentMethodListValue->PaymentUtils.getConnectors(Wallets(Paypal(SDK)))
-          let orderId = val->getDictFromJson->Utils.getString("id", "")
+          let orderId = val->getDictFromJson->getString("id", "")
           let body = PaymentBody.paypalSdkBody(~token=orderId, ~connectors)
           let modifiedPaymentBody = PaymentUtils.appendedCustomerAcceptance(
             ~isGuestCustomer,
@@ -183,8 +181,8 @@ let loadPaypalSDK = (
           let bodyArr =
             requiredFieldsBody
             ->JSON.Encode.object
-            ->Utils.unflattenObject
-            ->Utils.getArrayOfTupleFromDict
+            ->unflattenObject
+            ->getArrayOfTupleFromDict
 
           let confirmBody = bodyArr->Array.concatMany([modifiedPaymentBody])
           Promise.make((_resolve, _) => {
@@ -234,7 +232,7 @@ let loadBraintreePaypalSdk = (
   ~iframeId,
   ~paymentMethodListValue,
   ~isGuestCustomer,
-  ~intent: PaymentHelpers.paymentIntent,
+  ~intent: PaymentHelpersTypes.paymentIntent,
   ~options: PaymentType.options,
   ~orderDetails,
   ~publishableKey,
@@ -251,8 +249,8 @@ let loadBraintreePaypalSdk = (
     ~eventName=PAYPAL_SDK_FLOW,
     ~paymentMethod="PAYPAL",
   )
-  Utils.makeOneClickHandlerPromise(sdkHandleOneClickConfirmPayment)
-  ->then(result => {
+  makeOneClickHandlerPromise(sdkHandleOneClickConfirmPayment)
+  ->Promise.then(result => {
     let result = result->JSON.Decode.bool->Option.getOr(false)
     if result {
       braintree.client.create({authorization: token}, (clientErr, clientInstance) => {
@@ -276,7 +274,7 @@ let loadBraintreePaypalSdk = (
                   fundingSource: paypal["FUNDING"]["PAYPAL"],
                   createBillingAgreement: () => {
                     //Paypal Clicked
-                    Utils.messageParentWindow([
+                    messageParentWindow([
                       ("fullscreen", true->JSON.Encode.bool),
                       ("param", "paymentloader"->JSON.Encode.string),
                       ("iframeId", iframeId->JSON.Encode.string),
@@ -303,10 +301,10 @@ let loadBraintreePaypalSdk = (
 
                             let paypalBody =
                               body
-                              ->Utils.getJsonFromArrayOfJson
-                              ->Utils.flattenObject(true)
-                              ->Utils.mergeTwoFlattenedJsonDicts(requiredFieldsBody)
-                              ->Utils.getArrayOfTupleFromDict
+                              ->getJsonFromArrayOfJson
+                              ->flattenObject(true)
+                              ->mergeTwoFlattenedJsonDicts(requiredFieldsBody)
+                              ->getArrayOfTupleFromDict
 
                             let modifiedPaymentBody = PaymentUtils.appendedCustomerAcceptance(
                               ~isGuestCustomer,
@@ -345,7 +343,7 @@ let loadBraintreePaypalSdk = (
         )
       })->ignore
     }
-    resolve()
+    Promise.resolve()
   })
   ->ignore
 }

src/Payments/SepaBankTransfer.res

@@ -4,27 +4,17 @@ open Utils
 @react.component
 let make = (~paymentType) => {
   let {iframeId} = Recoil.useRecoilValueFromAtom(keys)
-  let {fields} = Recoil.useRecoilValueFromAtom(optionAtom)
   let loggerState = Recoil.useRecoilValueFromAtom(loggerAtom)
-  let {config, themeObj, localeString} = Recoil.useRecoilValueFromAtom(configAtom)
-  let intent = PaymentHelpers.usePaymentIntent(Some(loggerState), BankTransfer)
+  let {themeObj} = Recoil.useRecoilValueFromAtom(configAtom)
   let isManualRetryEnabled = Recoil.useRecoilValueFromAtom(isManualRetryEnabled)
-  let (country, setCountry) = React.useState(_ => "France")
+  let setComplete = Recoil.useSetRecoilState(fieldsComplete)
   let (email, _) = Recoil.useLoggedRecoilState(userEmailAddress, "email", loggerState)
   let (fullName, _) = Recoil.useLoggedRecoilState(userFullName, "fullName", loggerState)
-  let showAddressDetails = PaymentType.getShowAddressDetails(
-    ~billingDetails=fields.billingDetails,
-    ~logger=loggerState,
-  )
-  let countryNames = Utils.getCountryNames(Country.country)
-  let setComplete = Recoil.useSetRecoilState(fieldsComplete)
-  let clientCountryCode =
-    Country.country
-    ->Array.find(item => item.countryName == country)
-    ->Option.getOr(Country.defaultTimeZone)
+  let intent = PaymentHelpers.usePaymentIntent(Some(loggerState), BankTransfer)
+
+  let (requiredFieldsBody, setRequiredFieldsBody) = React.useState(_ => Dict.make())
   let complete = email.value != "" && fullName.value != "" && email.isValid->Option.getOr(false)
   let empty = email.value == "" || fullName.value == ""
-  let paymentMethodListValue = Recoil.useRecoilValueFromAtom(PaymentUtils.paymentMethodListValue)
 
   UtilityHooks.useHandlePostMessages(~complete, ~empty, ~paymentType="bank_transfer")
 
@@ -38,14 +28,15 @@ let make = (~paymentType) => {
     let confirm = json->getDictFromJson->ConfirmType.itemToObjMapper
     if confirm.doSubmit {
       if complete {
-        let (connectors, _) = paymentMethodListValue->PaymentUtils.getConnectors(BankTransfer(Sepa))
+        let bodyArr =
+          PaymentBody.dynamicPaymentBody("bank_transfer", "sepa")
+          ->getJsonFromArrayOfJson
+          ->flattenObject(true)
+          ->mergeTwoFlattenedJsonDicts(requiredFieldsBody)
+          ->getArrayOfTupleFromDict
+
         intent(
-          ~bodyArr=PaymentBody.sepaBankTransferBody(
-            ~email=email.value,
-            ~name=fullName.value,
-            ~country=clientCountryCode.isoAlpha2,
-            ~connectors,
-          ),
+          ~bodyArr,
           ~confirmParam=confirm.confirmParams,
           ~handleUserError=false,
           ~iframeId,
@@ -55,25 +46,13 @@ let make = (~paymentType) => {
         postFailedSubmitResponse(~errortype="validation_error", ~message="Please enter all fields")
       }
     }
-  }, (email, fullName, country, isManualRetryEnabled))
+  }, (email, fullName, isManualRetryEnabled))
   useSubmitPaymentData(submitCallback)
 
-  let updatedOptionsArrayForCountry =
-    countryNames->DropdownField.updateArrayOfStringToOptionsTypeArray
-
   <div className="flex flex-col animate-slowShow" style={gridGap: themeObj.spacingTab}>
-    <EmailPaymentInput paymentType />
-    <FullNamePaymentInput paymentType={paymentType} />
-    <RenderIf condition={showAddressDetails.country == Auto}>
-      <DropdownField
-        appearance=config.appearance
-        fieldName=localeString.countryLabel
-        value=country
-        setValue=setCountry
-        disabled=false
-        options=updatedOptionsArrayForCountry
-      />
-    </RenderIf>
+    <DynamicFields
+      paymentType paymentMethod="bank_transfer" paymentMethodType="sepa" setRequiredFieldsBody
+    />
     <Surcharge paymentMethod="bank_transfer" paymentMethodType="sepa" />
     <InfoElement />
   </div>

src/Utilities/ApplePayHelpers.res

@@ -7,7 +7,7 @@ let processPayment = (
   ~isThirdPartyFlow=false,
   ~isGuestCustomer,
   ~paymentMethodListValue=PaymentMethodsRecord.defaultList,
-  ~intent: PaymentHelpers.paymentIntent,
+  ~intent: PaymentHelpersTypes.paymentIntent,
   ~options: PaymentType.options,
   ~publishableKey,
   ~isManualRetryEnabled,

src/Utilities/GooglePayHelpers.res

@@ -63,7 +63,7 @@ let getGooglePayBodyFromResponse = (
 let processPayment = (
   ~body: array<(string, JSON.t)>,
   ~isThirdPartyFlow=false,
-  ~intent: PaymentHelpers.paymentIntent,
+  ~intent: PaymentHelpersTypes.paymentIntent,
   ~options: PaymentType.options,
   ~publishableKey,
   ~isManualRetryEnabled,
@@ -151,12 +151,7 @@ let useHandleGooglePayResponse = (
   }, (paymentMethodTypes, stateJson, isManualRetryEnabled, requiredFieldsBody, isWallet))
 }
 
-let handleGooglePayClicked = (
-  ~sessionObj,
-  ~componentName,
-  ~iframeId,
-  ~readOnly,
-) => {
+let handleGooglePayClicked = (~sessionObj, ~componentName, ~iframeId, ~readOnly) => {
   let paymentDataRequest = GooglePayType.getPaymentDataFromSession(~sessionObj, ~componentName)
   messageParentWindow([
     ("fullscreen", true->JSON.Encode.bool),
@@ -183,12 +178,7 @@ let useSubmitCallback = (~isWallet, ~sessionObj, ~componentName) => {
       let json = ev.data->safeParse
       let confirm = json->getDictFromJson->ConfirmType.itemToObjMapper
       if confirm.doSubmit && areRequiredFieldsValid && !areRequiredFieldsEmpty {
-        handleGooglePayClicked(
-          ~sessionObj,
-          ~componentName,
-          ~iframeId,
-          ~readOnly=options.readOnly,
-        )
+        handleGooglePayClicked(~sessionObj, ~componentName, ~iframeId, ~readOnly=options.readOnly)
       } else if areRequiredFieldsEmpty {
         postFailedSubmitResponse(
           ~errortype="validation_error",