chore(merge): merge with main

.github/CODEOWNERS

@@ -1,12 +1,12 @@
-- @akash-c-k @ArushKapoorJuspay @PritishBudhiraja @seekshiva @vsrivatsa-juspay
+- @akash-c-k @ArushKapoorJuspay @PritishBudhiraja @seekshiva @vsrivatsa-edinburgh @swamu
 
 docs/ @akash-c-k
 LICENSE @akash-c-k
 README.md @akash-c-k
 SECURITY.md @akash-c-k
 .gitignore @ArushKapoorJuspay @PritishBudhiraja
 
-Hyperswitch-React-Demo-App/ @PritishBudhiraja @seekshiva @ArushKapoorJuspay @vsrivatsa-juspay
+Hyperswitch-React-Demo-App/ @PritishBudhiraja @seekshiva @ArushKapoorJuspay @vsrivatsa-edinburgh
 
 .husky/ @PritishBudhiraja @seekshiva
 .github/ @PritishBudhiraja @seekshiva
@@ -16,4 +16,4 @@ aws/ @seekshiva
 webpack.dev.js @ArushKapoorJuspay @PritishBudhiraja @seekshiva
 webpack.common.js @ArushKapoorJuspay @PritishBudhiraja @seekshiva
 
-src/ @seekshiva @PritishBudhiraja @ArushKapoorJuspay @vsrivatsa-juspay
+src/ @seekshiva @PritishBudhiraja @ArushKapoorJuspay @vsrivatsa-edinburgh @swamu

CHANGELOG.md

@@ -1,3 +1,35 @@
+## [0.82.3](https://github.com/juspay/hyperswitch-web/compare/v0.82.2...v0.82.3) (2024-08-12)
+
+## [0.82.2](https://github.com/juspay/hyperswitch-web/compare/v0.82.1...v0.82.2) (2024-08-09)
+
+## [0.82.1](https://github.com/juspay/hyperswitch-web/compare/v0.82.0...v0.82.1) (2024-08-07)
+
+
+### Bug Fixes
+
+* revert changes for hyper.res ([#548](https://github.com/juspay/hyperswitch-web/issues/548)) ([373cd40](https://github.com/juspay/hyperswitch-web/commit/373cd40860f31cc201be41b2706e9c14c6eb771a))
+
+# [0.82.0](https://github.com/juspay/hyperswitch-web/compare/v0.81.1...v0.82.0) (2024-08-07)
+
+
+### Features
+
+* open banking PIS integration ([#541](https://github.com/juspay/hyperswitch-web/issues/541)) ([25e24b6](https://github.com/juspay/hyperswitch-web/commit/25e24b614e616104057d1ece77a18d7f841dbc89))
+
+## [0.81.1](https://github.com/juspay/hyperswitch-web/compare/v0.81.0...v0.81.1) (2024-08-07)
+
+
+### Bug Fixes
+
+* fixed structure of billing details in payment body ([#546](https://github.com/juspay/hyperswitch-web/issues/546)) ([1e63aad](https://github.com/juspay/hyperswitch-web/commit/1e63aad43e7de2cfca8bd8127395445fbb43e109))
+
+# [0.81.0](https://github.com/juspay/hyperswitch-web/compare/v0.80.7...v0.81.0) (2024-08-07)
+
+
+### Features
+
+* sdk pay now button enable prop added ([#543](https://github.com/juspay/hyperswitch-web/issues/543)) ([bf7a505](https://github.com/juspay/hyperswitch-web/commit/bf7a50518d74a5cd0d5e74b420d49d5320b515d0))
+
 ## [0.80.7](https://github.com/juspay/hyperswitch-web/compare/v0.80.6...v0.80.7) (2024-08-06)
 
 ## [0.80.6](https://github.com/juspay/hyperswitch-web/compare/v0.80.5...v0.80.6) (2024-08-06)

Hyperswitch-React-Demo-App/src/CheckoutForm.js

@@ -90,9 +90,9 @@ export default function CheckoutForm() {
       return;
     }
     hyper.retrievePaymentIntent(clientSecret).then(({ paymentIntent }) => {
-      console.log("-retrieve called", paymentIntent);
+      console.log("-retrieve called", paymentIntent?.status);
       handlePaymentStatus(paymentIntent?.status);
-    }).catch(err => console.log(err));
+    });
   }, [hyper, navigate]);
 
   const options = {

package.json

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

src/Components/DropdownField.res

@@ -101,42 +101,40 @@ let make = (
         </div>
       </RenderIf>
       <div className="relative">
-        <div className={`Input ${className} appearance-none relative`}>
-          <RenderIf condition={isDisplayValueVisible && displayValue->Option.isSome}>
-            <div
-              className="absolute top-1 left-1 right-0 bottom-0  pointer-events-none rounded-sm z-20 whitespace-nowrap"
-              style={
-                background: disabled ? disbaledBG : themeObj.colorBackground,
-                opacity: disabled ? "35%" : "",
-                padding: themeObj.spacingUnit,
-                width: "95%",
-              }>
-              {React.string(displayValue->Option.getOr(""))}
-            </div>
-          </RenderIf>
-          <select
-            ref={dropdownRef->ReactDOM.Ref.domRef}
+        <RenderIf condition={isDisplayValueVisible && displayValue->Option.isSome}>
+          <div
+            className="absolute top-1 left-1 right-0 bottom-0  pointer-events-none rounded-sm z-20 whitespace-nowrap"
             style={
               background: disabled ? disbaledBG : themeObj.colorBackground,
               opacity: disabled ? "35%" : "",
               padding: themeObj.spacingUnit,
-              width: "100%",
-            }
-            name=""
-            value
-            disabled={readOnly || disabled}
-            onChange=handleChange
-            onFocus=handleFocus
-            className={`${inputClassStyles} ${className} w-full appearance-none outline-none ${cursorClass}`}>
-            {options
-            ->Array.mapWithIndex((item, index) => {
-              <option key={Int.toString(index)} value=item.value>
-                {React.string(item.label->Option.getOr(item.value))}
-              </option>
-            })
-            ->React.array}
-          </select>
-        </div>
+              width: "95%",
+            }>
+            {React.string(displayValue->Option.getOr(""))}
+          </div>
+        </RenderIf>
+        <select
+          ref={dropdownRef->ReactDOM.Ref.domRef}
+          style={
+            background: disabled ? disbaledBG : themeObj.colorBackground,
+            opacity: disabled ? "35%" : "",
+            padding: themeObj.spacingUnit,
+            width: "100%",
+          }
+          name=""
+          value
+          disabled={readOnly || disabled}
+          onChange=handleChange
+          onFocus=handleFocus
+          className={`${inputClassStyles} ${className} w-full appearance-none outline-none ${cursorClass}`}>
+          {options
+          ->Array.mapWithIndex((item, index) => {
+            <option key={Int.toString(index)} value=item.value>
+              {React.string(item.label->Option.getOr(item.value))}
+            </option>
+          })
+          ->React.array}
+        </select>
         <RenderIf condition={config.appearance.labels == Floating}>
           <div
             className={`Label ${floatinglabelClass} absolute bottom-0 ml-3 ${focusClass}`}

src/Components/DynamicFields.res

@@ -493,13 +493,14 @@ let make = (
       ->React.array}
       <RenderIf condition={isRenderDynamicFieldsInsideBilling}>
         <div
-          className={`${spacedStylesForBiilingDetails} w-full text-left`}
+          className={`billing-section ${spacedStylesForBiilingDetails} w-full text-left`}
           style={
             border: {isSpacedInnerLayout ? `1px solid ${themeObj.borderColor}` : ""},
             borderRadius: {isSpacedInnerLayout ? themeObj.borderRadius : ""},
             margin: {isSpacedInnerLayout ? `10px 0` : ""},
           }>
           <div
+            className="billing-details-text"
             style={
               marginBottom: "5px",
               fontSize: themeObj.fontSizeLg,

src/Components/PayNowButton.res

@@ -21,6 +21,11 @@ let make = () => {
   let confirmPayload = sdkHandleConfirmPayment->PaymentBody.confirmPayloadForSDKButton
   let buttonText = sdkHandleConfirmPayment.buttonText->Option.getOr(localeString.payNowButton)
 
+  React.useEffect1(() => {
+    setIsPayNowButtonDisable(_ => !sdkHandleConfirmPayment.allowButtonBeforeValidation)
+    None
+  }, [sdkHandleConfirmPayment.allowButtonBeforeValidation])
+
   let handleMessage = (event: Types.event) => {
     let json = event.data->Identity.anyTypeToJson->getStringFromJson("")->safeParse
     let dict = json->getDictFromJson

src/Hooks/UtilityHooks.res

@@ -11,12 +11,17 @@ let useIsGuestCustomer = () => {
 }
 
 let useHandlePostMessages = (~complete, ~empty, ~paymentType, ~savedMethod=false) => {
-  let loggerState = Recoil.useRecoilValueFromAtom(RecoilAtoms.loggerAtom)
-  let setIsPayNowButtonDisable = RecoilAtoms.payNowButtonDisable->Recoil.useSetRecoilState
+  open RecoilAtoms
+
+  let loggerState = Recoil.useRecoilValueFromAtom(loggerAtom)
+  let setIsPayNowButtonDisable = Recoil.useSetRecoilState(payNowButtonDisable)
+  let {sdkHandleConfirmPayment} = Recoil.useRecoilValueFromAtom(optionAtom)
 
   React.useEffect(() => {
-    let isCompletelyFilled = complete && paymentType !== ""
-    setIsPayNowButtonDisable(_ => !isCompletelyFilled)
+    if !sdkHandleConfirmPayment.allowButtonBeforeValidation {
+      let isCompletelyFilled = complete && paymentType !== ""
+      setIsPayNowButtonDisable(_ => !isCompletelyFilled)
+    }
     Utils.handlePostMessageEvents(~complete, ~empty, ~paymentType, ~loggerState, ~savedMethod)
     None
   }, (complete, empty, paymentType))

src/LocaleStrings/ArabicLocale.res

@@ -42,7 +42,7 @@ let localeStrings: LocaleStringTypes.localeStrings = {
   achBankDebitTerms: str =>
     `من خلال تقديم رقم حسابك وتأكيد هذا الدفع ، فإنك تفوض ${str} و Hyperswitch ، مزود خدمة الدفع ، لإرسال تعليمات إلى البنك الذي تتعامل معه للخصم من حسابك والبنك الخاص بك للخصم من حسابك وفقًا لهذه التعليمات. يحق لك استرداد الأموال من البنك الذي تتعامل معه بموجب شروط وأحكام اتفاقيتك مع البنك الذي تتعامل معه. يجب المطالبة باسترداد الأموال في غضون 8 أسابيع بدءًا من تاريخ الخصم من حسابك.`,
   sepaDebitTerms: str =>
-    `من خلال تقديم معلومات الدفع الخاصة بك وتأكيد هذا الدفع ، فإنك تفوض (أ) ${str} و Hyperswitch ، موفر خدمة الدفع لدينا و / أو PPRO ، مزود الخدمة المحلي ، لإرسال تعليمات إلى البنك الذي تتعامل معه للخصم من حسابك و (ب) البنك الذي تتعامل معه للخصم من حسابك وفقًا لتلك التعليمات. كجزء من حقوقك ، يحق لك استرداد الأموال من البنك الذي تتعامل معه بموجب شروط وأحكام اتفاقيتك مع البنك الذي تتعامل معه. يجب المطالبة باسترداد الأموال في غضون 8 أسابيع بدءًا من تاريخ الخصم من حسابك. يتم توضيح حقوقك في بيان يمكنك الحصول عليه من البنك الذي تتعامل معه. أنت توافق على تلقي إشعارات بالخصم المستقبلي لمدة تصل إلى يومين قبل حدوثها.`,
+    `من خلال تقديم معلومات الدفع الخاصة بك وتأكيد هذا النموذج، فإنك تفوض (أ) ${str}، الدائن و/أو مقدمي خدمات الدفع لدينا لإرسال تعليمات إلى بنكك لسحب المبلغ من حسابك و(ب) بنكك لسحب المبلغ من حسابك وفقًا لتعليمات ${str}. كجزء من حقوقك، يحق لك استرداد من بنكك وفقًا للشروط والأحكام في اتفاقيتك مع بنكك. يجب تقديم طلب الاسترداد خلال 8 أسابيع من تاريخ خصم المبلغ من حسابك. حقوقك موضحة في بيان يمكنك الحصول عليه من بنكك.`,
   becsDebitTerms: `من خلال تقديم تفاصيل حسابك المصرفي وتأكيد هذه الدفعة ، فإنك توافق على طلب الخصم المباشر هذا واتفاقية خدمة طلب الخصم المباشر وتفوض Hyperswitch Payments Australia Pty Ltd ACN 160180343 رقم معرف مستخدم الخصم المباشر 507156 ("Hyperswitch") للخصم من حسابك حساب من خلال نظام المقاصة الإلكترونية المجمعة (BECS) نيابة عن Hyperswitch Payment Widget ("التاجر") لأي مبالغ يرسلها التاجر لك بشكل منفصل. أنت تقر بأنك إما صاحب حساب أو مفوض بالتوقيع على الحساب المذكور أعلاه.`,
   cardTerms: str =>
     `من خلال تقديم معلومات بطاقتك ، فإنك تسمح لـ ${str} بشحن بطاقتك للمدفوعات المستقبلية وفقًا لشروطها.`,

src/LocaleStrings/CatalanLocale.res

@@ -34,7 +34,7 @@ let localeStrings: LocaleStringTypes.localeStrings = {
   achBankDebitTerms: str =>
     `En facilitar el número de compte i confirmar el pagament, autoritza ${str} i Hyperswitch, el nostre proveïdor de serveis de pagament, a enviar ordres al seu banc perquè apliqui els càrrecs corresponents al compte. Tindrà dret a rebre un reembossament del banc d'acord amb els termes i condicions del contracte que hi hagi subscrit. El reembossament s'ha de sol·licitar en un termini de 8 setmanes des de la data en què es va aplicar el càrrec al compte.`,
   sepaDebitTerms: str =>
-    `En facilitar la informació de pagament i confirmar el pagament, autoritza ${str} i Hyperswitch, el nostre proveïdor de serveis de pagament, o a PPRO, el seu proveïdor de serveis local, a enviar ordres al seu banc i a (B) perquè apliqui els càrrecs corresponents al compte. Com a part dels seus drets, podrà rebre un reembossament del banc d'acord amb els termes i condicions del contracte que hi hagi subscrit. El reembossament s'ha de sol·licitar en un termini de 8 setmanes des de la data en què es va aplicar el càrrec al compte. Els seus drets s'expliquen en un extracte que podrà sol·licitar al banc. Accepta rebre notificacions dels càrrecs futurs fins 2 dies abans que es produeixin.`,
+    `En proporcionar la seva informació de pagament i confirmar aquest formulari de mandat, autoritza (A) ${str}, el Creditor i/o els nostres proveïdors de serveis de pagament a enviar instruccions al seu banc per carregar el seu compte i (B) al seu banc a carregar el seu compte d’acord amb les instruccions de ${str}. Com a part dels seus drets, té dret a un reemborsament del seu banc segons els termes i condicions del seu acord amb el seu banc. El reemborsament ha de ser sol·licitat dins de les 8 setmanes següents a la data en què el seu compte va ser carregat. Els seus drets es descriuen en un document que pot obtenir al seu banc.`,
   becsDebitTerms: `En facilitar les dades del compte bancari i confirmar el pagament, accepta aquesta sol·licitud de domiciliació bancària i l'acord de servei corresponent. A més, autoritza Hyperswitch Payments Australia Pty Ltd ACN 160 180 343, amb número d'identificació d'usuari de domiciliació bancària 507156, («Hyperswitch») a aplicar càrrecs al compte a través del sistema de compensació electrònica massiva (BECS) en nom de Hyperswitch Payment Widget (el «comerç») per a qualsevol import que el comerç li comuniqui individualment. Certifica que és titular d'un compte o signatari autoritzat del compte que s'indica anteriorment.`,
   cardTerms: str =>
     `En facilitar la informació de la targeta, permet a ${str} que faci càrrecs a la targeta per a pagaments futurs d'acord amb les seves condicions.`,

src/LocaleStrings/ChineseLocale.res

@@ -42,7 +42,7 @@ let localeStrings: LocaleStringTypes.localeStrings = {
   achBankDebitTerms: _ =>
     `您的 ACH 扣款授权将立即设置，但我们会确认金额并在未来的付款前通知您。`,
   sepaDebitTerms: str =>
-    `通过提供您的付款信息并确认此付款，您授权（A）${str} 和 Hyperswitch，我们的支付服务提供商和/或 PPRO，其本地服务提供商，向您的银行发送指示从您的账户中扣款，以及（B）您的银行根据这些指示从您的账户中扣款。作为您的权利的一部分，您有权根据与银行的协议的条款和条件要求银行退款。退款必须在账户扣款之日起的 8 周内申请。您的权利在银行可以获得的声明中有解释。您同意在未来的扣款前最多提前 2 天接收通知。`,
+    `通过提供您的支付信息并确认此授权书表格，您授权 (A) ${str}，债权人和/或我们的支付服务提供商向您的银行发送指令以从您的账户中扣款，以及 (B) 您的银行按照 ${str} 的指示从您的账户中扣款。作为您权利的一部分，您有权根据与银行的协议条款和条件从您的银行获得退款。退款请求必须在从您的账户被扣款之日起的 8 周内提出。您的权利在您可以从银行获取的声明中有详细说明。`,
   becsDebitTerms: `通过提供您的银行账户详细信息并确认此付款，您同意此直接借记请求和直接借记请求服务协议，并授权 Hyperswitch Payments Australia Pty Ltd ACN 160 180 343 直接借记用户 ID 号码 507156（“Hyperswitch”）通过批量电子清算系统（BECS）从您的账户中扣款，代表 Hyperswitch Payment Widget（“商户”）处理任何商户单独通知您的金额。您确认您是上述账户的账户持有人或授权签署人。`,
   cardTerms: str =>
     `通过提供您的卡片信息，您允许 ${str} 根据其条款向您的卡片收费。`,

src/LocaleStrings/DeutschLocale.res

@@ -42,7 +42,7 @@ let localeStrings: LocaleStringTypes.localeStrings = {
   achBankDebitTerms: str =>
     `Indem Sie Ihre Kontonummer angeben und diese Zahlung bestätigen, autorisieren Sie diese ${str} und Hyperswitch, unser Zahlungsdienstleister, um Anweisungen an Ihre Bank zu senden, um Ihr Konto zu belasten, und Ihre Bank, um Ihr Konto gemäß diesen Anweisungen zu belasten. Sie haben gemäß den Bedingungen Ihrer Vereinbarung mit Ihrer Bank Anspruch auf eine Rückerstattung von Ihrer Bank. Eine Rückerstattung muss innerhalb von 8 Wochen ab dem Datum der Belastung Ihres Kontos beantragt werden.`,
   sepaDebitTerms: str =>
-    `Indem Sie Ihre Zahlungsinformationen angeben und diese Zahlung bestätigen, autorisieren Sie (A) ${str} und Hyperswitch, unser Zahlungsdienstleister und/oder PPRO, sein lokaler Dienstleister, um Anweisungen an Ihre Bank zu senden, um Ihr Konto zu belasten, und (B) Ihre Bank, um Ihr Konto gemäß diesen Anweisungen zu belasten. Im Rahmen Ihrer Rechte haben Sie gemäß den Bedingungen Ihrer Vereinbarung mit Ihrer Bank Anspruch auf eine Rückerstattung von Ihrer Bank. Eine Rückerstattung muss innerhalb von 8 Wochen ab dem Datum der Belastung Ihres Kontos beantragt werden. Ihre Rechte werden in einer Abrechnung erläutert, die Sie bei Ihrer Bank erhalten können. Sie stimmen zu, Benachrichtigungen über zukünftige Belastungen bis zu 2 Tage vor deren Auftreten zu erhalten.`,
+    `Durch die Angabe Ihrer Zahlungsinformationen und die Bestätigung dieses Mandatsformulars ermächtigen Sie (A) ${str}, den Gläubiger und/oder unsere Zahlungsdienstleister, Ihrer Bank Anweisungen zu erteilen, um Ihr Konto zu belasten, und (B) Ihre Bank, Ihr Konto gemäß den Anweisungen von ${str} zu belasten. Im Rahmen Ihrer Rechte haben Sie Anspruch auf eine Rückerstattung von Ihrer Bank gemäß den Bedingungen und Konditionen Ihrer Vereinbarung mit Ihrer Bank. Eine Rückerstattung muss innerhalb von 8 Wochen ab dem Datum, an dem Ihr Konto belastet wurde, beantragt werden. Ihre Rechte sind in einem von Ihrer Bank erhältlichen Dokument erläutert.`,
   becsDebitTerms: `Indem Sie Ihre Bankkontodaten angeben und diese Zahlung bestätigen, stimmen Sie dieser Lastschriftanforderung und der Servicevereinbarung für Lastschriftanträge zu und ermächtigen Hyperswitch Payments Australia Pty Ltd ACN 160 180 343 Lastschriftbenutzer-ID-Nummer 507156 („Hyperswitch“), Ihr Konto zu belasten Konto über das Bulk Electronic Clearing System (BECS) im Namen von Hyperswitch Payment Widget (der „Händler“) für alle Beträge, die Ihnen vom Händler gesondert mitgeteilt werden. Sie bestätigen, dass Sie entweder Kontoinhaber oder Zeichnungsberechtigter des oben aufgeführten Kontos sind.`,
   cardTerms: str =>
     `Durch die Angabe Ihrer Karteninformationen stimmen Sie zu ${str} Ihre Karte gemäß deren Bedingungen für zukünftige Zahlungen zu belasten.`,