Merge branch 'main' into error-utils-refactor

juspay · May 31, 2024 · d253803 · d253803
2 parents aececd4 + acb313d
commit d253803
Show file tree

Hide file tree

Showing 15 changed files with 512 additions and 139 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,29 @@
+## [0.57.2](https://github.com/juspay/hyperswitch-web/compare/v0.57.1...v0.57.2) (2024-05-30)
+
+
+### Bug Fixes
+
+* allow customer to pay with different payment method on cancel of… ([#409](https://github.com/juspay/hyperswitch-web/issues/409)) ([d48c5c2](https://github.com/juspay/hyperswitch-web/commit/d48c5c26b2eb96ceeaa75c348d73c3f6ab480cc4))
+
+## [0.57.1](https://github.com/juspay/hyperswitch-web/compare/v0.57.0...v0.57.1) (2024-05-30)
+
+
+### Bug Fixes
+
+* hide terms based upon prop ([#408](https://github.com/juspay/hyperswitch-web/issues/408)) ([8a5d554](https://github.com/juspay/hyperswitch-web/commit/8a5d5548d70750725a61381abf4fa68879fa4746))
+
+# [0.57.0](https://github.com/juspay/hyperswitch-web/compare/v0.56.1...v0.57.0) (2024-05-30)
+
+
+### Bug Fixes
+
+* fixed ApplePay Event Handler ([#406](https://github.com/juspay/hyperswitch-web/issues/406)) ([bfc7470](https://github.com/juspay/hyperswitch-web/commit/bfc747010c6a5c891d0d93e7ce9dbbcdd8980e07))
+
+
+### Features
+
+* added PayPal SDK Via PayPal ([#404](https://github.com/juspay/hyperswitch-web/issues/404)) ([084932d](https://github.com/juspay/hyperswitch-web/commit/084932d644cc4f7da9aebe124e069e97ee14476b))
+
 ## [0.56.1](https://github.com/juspay/hyperswitch-web/compare/v0.56.0...v0.56.1) (2024-05-27)
 
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "orca-payment-page",
-  "version": "0.56.1",
+  "version": "0.57.2",
   "main": "index.js",
   "private": true,
   "dependencies": {

diff --git a/src/Components/SavedMethods.res b/src/Components/SavedMethods.res
@@ -214,7 +214,9 @@ let make = (
         <SaveDetailsCheckbox isChecked=isSaveCardsChecked setIsChecked=setIsSaveCardsChecked />
       </div>
     </RenderIf>
-    <RenderIf condition={paymentMethodListValue.payment_type === SETUP_MANDATE}>
+    <RenderIf
+      condition={displaySavedPaymentMethodsCheckbox &&
+      paymentMethodListValue.payment_type === SETUP_MANDATE}>
       <div
         className="opacity-50 text-xs mb-2 text-left"
         style={

diff --git a/src/Payments/Boleto.res b/src/Payments/Boleto.res
@@ -66,7 +66,6 @@ let make = (~paymentType: CardThemeType.mode) => {
           ~iframeId,
           (),
         )
-        ()
       } else {
         postFailedSubmitResponse(~errortype="validation_error", ~message="Please enter all fields")
       }

diff --git a/src/Payments/CardPayment.res b/src/Payments/CardPayment.res
@@ -355,7 +355,7 @@ let make = (
     <RenderIf condition={showFields || isBancontact}>
       <Surcharge paymentMethod paymentMethodType cardBrand={cardBrand->CardUtils.getCardType} />
     </RenderIf>
-    <RenderIf condition={!isBancontact}>
+    <RenderIf condition={displaySavedPaymentMethodsCheckbox && !isBancontact}>
       {switch (
         paymentMethodListValue.mandate_payment,
         options.terms.card,

diff --git a/src/Payments/KlarnaSDK.res b/src/Payments/KlarnaSDK.res
@@ -32,13 +32,9 @@ let make = (~sessionObj: SessionsType.token) => {
 
   let handleCloseLoader = () => {
     Utils.handlePostMessage([("fullscreen", false->JSON.Encode.bool)])
-    Utils.postFailedSubmitResponse(
-      ~errortype="confirm_payment_failed",
-      ~message="An unknown error has occurred",
-    )
   }
 
-  let submitCallback = (ev: Window.event) => {
+  let submitCallback = React.useCallback((ev: Window.event) => {
     let json = ev.data->JSON.parseExn
     let confirm = json->Utils.getDictFromJson->ConfirmType.itemToObjMapper
 
@@ -65,7 +61,7 @@ let make = (~sessionObj: SessionsType.token) => {
         },
       )
     }
-  }
+  }, [status])
   useSubmitPaymentData(submitCallback)
 
   React.useEffect(() => {

diff --git a/src/Payments/PaypalSDK.res b/src/Payments/PaypalSDK.res
@@ -1,5 +1,4 @@
 open PaypalSDKTypes
-open Promise
 
 @react.component
 let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) => {
@@ -13,6 +12,7 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
   let token = sessionObj.token
   let orderDetails = sessionObj.orderDetails->getOrderDetails(paymentType)
   let intent = PaymentHelpers.usePaymentIntent(Some(loggerState), Paypal)
+  let completeAuthorize = PaymentHelpers.useCompleteAuthorize(Some(loggerState), Paypal)
   let checkoutScript =
     Window.document(Window.window)->Window.getElementById("braintree-checkout")->Nullable.toOption
   let clientScript =
@@ -51,123 +51,70 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
 
   PaymentUtils.useStatesJson(setStatesJson)
 
-  let loadPaypalSdk = () => {
-    loggerState.setLogInfo(
-      ~value="Paypal SDK Button Clicked",
-      ~eventName=PAYPAL_SDK_FLOW,
-      ~paymentMethod="PAYPAL",
-      (),
-    )
-    Utils.makeOneClickHandlerPromise(sdkHandleOneClickConfirmPayment)
-    ->then(result => {
-      let result = result->JSON.Decode.bool->Option.getOr(false)
-      if result {
-        braintree.client.create({authorization: token}, (clientErr, clientInstance) => {
-          if clientErr {
-            Console.error2("Error creating client", clientErr)
-          }
-          braintree.paypalCheckout.create(
-            {client: clientInstance},
-            (paypalCheckoutErr, paypalCheckoutInstance) => {
-              switch paypalCheckoutErr->Nullable.toOption {
-              | Some(val) => Console.warn(`INTEGRATION ERROR: ${val.message}`)
-              | None => ()
-              }
-              paypalCheckoutInstance.loadPayPalSDK(
-                {vault: true},
-                () => {
-                  let paypalWrapper = GooglePayType.getElementById(Utils.document, "paypal-button")
-                  paypalWrapper.innerHTML = ""
-                  paypal["Buttons"]({
-                    style: buttonStyle,
-                    fundingSource: paypal["FUNDING"]["PAYPAL"],
-                    createBillingAgreement: () => {
-                      //Paypal Clicked
-                      Utils.handlePostMessage([
-                        ("fullscreen", true->JSON.Encode.bool),
-                        ("param", "paymentloader"->JSON.Encode.string),
-                        ("iframeId", iframeId->JSON.Encode.string),
-                      ])
-                      options.readOnly ? () : paypalCheckoutInstance.createPayment(orderDetails)
-                    },
-                    onApprove: (data, _actions) => {
-                      options.readOnly
-                        ? ()
-                        : paypalCheckoutInstance.tokenizePayment(
-                            data,
-                            (_err, payload) => {
-                              let (connectors, _) =
-                                paymentMethodListValue->PaymentUtils.getConnectors(
-                                  Wallets(Paypal(SDK)),
-                                )
-                              let body = PaymentBody.paypalSdkBody(
-                                ~token=payload.nonce,
-                                ~connectors,
-                              )
-
-                              let requiredFieldsBody = DynamicFieldsUtils.getPaypalRequiredFields(
-                                ~details=payload.details,
-                                ~paymentMethodTypes,
-                                ~statesList=stateJson,
-                              )
-
-                              let paypalBody =
-                                body
-                                ->Utils.getJsonFromArrayOfJson
-                                ->Utils.flattenObject(true)
-                                ->Utils.mergeTwoFlattenedJsonDicts(requiredFieldsBody)
-                                ->Utils.getArrayOfTupleFromDict
-
-                              let modifiedPaymentBody = PaymentUtils.appendedCustomerAcceptance(
-                                ~isGuestCustomer,
-                                ~paymentType=paymentMethodListValue.payment_type,
-                                ~body=paypalBody,
-                              )
-
-                              intent(
-                                ~bodyArr=modifiedPaymentBody,
-                                ~confirmParam={
-                                  return_url: options.wallets.walletReturnUrl,
-                                  publishableKey,
-                                },
-                                ~handleUserError=true,
-                                (),
-                              )
-                            },
-                          )
-                    },
-                    onCancel: _data => {
-                      handleCloseLoader()
-                    },
-                    onError: _err => {
-                      handleCloseLoader()
-                    },
-                  }).render("#paypal-button")
-                  areOneClickWalletsRendered(
-                    prev => {
-                      ...prev,
-                      isPaypal: true,
-                    },
-                  )
-                },
-              )
-            },
-          )
-        })->ignore
-      }
-      resolve()
+  let mountPaypalSDK = () => {
+    let clientId = sessionObj.token
+    let paypalScriptURL = `https://www.paypal.com/sdk/js?client-id=${clientId}&components=buttons,hosted-fields`
+    loggerState.setLogInfo(~value="PayPal SDK Script Loading", ~eventName=PAYPAL_SDK_FLOW, ())
+    let paypalScript = Window.createElement("script")
+    paypalScript->Window.elementSrc(paypalScriptURL)
+    paypalScript->Window.elementOnerror(exn => {
+      let err = exn->Identity.anyTypeToJson->JSON.stringify
+      loggerState.setLogError(
+        ~value=`Error During Loading PayPal SDK Script: ${err}`,
+        ~eventName=PAYPAL_SDK_FLOW,
+        (),
+      )
+    })
+    paypalScript->Window.elementOnload(_ => {
+      loggerState.setLogInfo(~value="PayPal SDK Script Loaded", ~eventName=PAYPAL_SDK_FLOW, ())
+      PaypalSDKHelpers.loadPaypalSDK(
+        ~loggerState,
+        ~sdkHandleOneClickConfirmPayment,
+        ~buttonStyle,
+        ~iframeId,
+        ~paymentMethodListValue,
+        ~isGuestCustomer,
+        ~intent,
+        ~options,
+        ~publishableKey,
+        ~paymentMethodTypes,
+        ~stateJson,
+        ~completeAuthorize,
+        ~handleCloseLoader,
+        ~areOneClickWalletsRendered,
+      )
     })
-    ->ignore
+    Window.body->Window.appendChild(paypalScript)
   }
+
   React.useEffect(() => {
     try {
-      switch (
-        checkoutScript,
-        clientScript,
-        stateJson->Identity.jsonToNullableJson->Js.Nullable.isNullable,
-      ) {
-      | (Some(_), Some(_), false) => loadPaypalSdk()
-      | (_, _, _) => Utils.logInfo(Console.log("Error loading Paypal"))
+      if stateJson->Identity.jsonToNullableJson->Js.Nullable.isNullable->not {
+        switch sessionObj.connector {
+        | "paypal" => mountPaypalSDK()
+        | _ =>
+          switch (checkoutScript, clientScript) {
+          | (Some(_), Some(_)) =>
+            PaypalSDKHelpers.loadBraintreePaypalSdk(
+              ~loggerState,
+              ~sdkHandleOneClickConfirmPayment,
+              ~token,
+              ~buttonStyle,
+              ~iframeId,
+              ~paymentMethodListValue,
+              ~isGuestCustomer,
+              ~intent,
+              ~options,
+              ~orderDetails,
+              ~publishableKey,
+              ~paymentMethodTypes,
+              ~stateJson,
+              ~handleCloseLoader,
+              ~areOneClickWalletsRendered,
+            )
+          | _ => ()
+          }
+        }
       }
     } catch {
     | _err => Utils.logInfo(Console.log("Error loading Paypal"))
-Original file line number
+Diff line change
@@ Expand Up / @@ -66,7 +66,6 @@ let make = (~paymentType: CardThemeType.mode) => { @@
               ~iframeId,
               (),
             )
-            ()
           } else {
             postFailedSubmitResponse(~errortype="validation_error", ~message="Please enter all fields")
           }
@@ Expand Down @@