From 6aaae7b06c91ee0c2eaa2f88233d27eff1abeb23 Mon Sep 17 00:00:00 2001
From: vsrivatsa-juspay <vrishab.srivatsa@juspay.in>
Date: Tue, 2 Jul 2024 12:15:49 +0530
Subject: [PATCH] fix: hooks conventions

---
 src/Payments/KlarnaSDK.res        | 9 ++++-----
 src/Payments/PayPal.res           | 6 +++++-
 src/Payments/PaypalSDK.res        | 3 +++
 src/Payments/PaypalSDKHelpers.res | 3 ++-
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/Payments/KlarnaSDK.res b/src/Payments/KlarnaSDK.res
index 5e9e86942..94a10ba35 100644
--- a/src/Payments/KlarnaSDK.res
+++ b/src/Payments/KlarnaSDK.res
@@ -18,6 +18,7 @@ let make = (~sessionObj: SessionsType.token) => {
   let {iframeId} = Recoil.useRecoilValueFromAtom(keys)
   let status = CommonHooks.useScript("https://x.klarnacdn.net/kp/lib/v1/api.js") // Klarna SDK script
   let paymentMethodListValue = Recoil.useRecoilValueFromAtom(PaymentUtils.paymentMethodListValue)
+  let (complete, setComplete) = React.useState(_ => false)
 
   let setAreOneClickWalletsRendered = Recoil.useSetRecoilState(areOneClickWalletsRendered)
   let (stateJson, setStatesJson) = React.useState(_ => JSON.Encode.null)
@@ -40,6 +41,8 @@ let make = (~sessionObj: SessionsType.token) => {
 
   PaymentUtils.useStatesJson(setStatesJson)
 
+  UtilityHooks.useHandlePostMessages(~complete, ~empty=!complete, ~paymentType="klarna")
+
   React.useEffect(() => {
     if (
       status === "ready" &&
@@ -62,16 +65,12 @@ let make = (~sessionObj: SessionsType.token) => {
               result => {
                 let result = result->JSON.Decode.bool->Option.getOr(false)
                 if result {
-                  UtilityHooks.useHandlePostMessages(
-                    ~complete=true,
-                    ~empty=false,
-                    ~paymentType="klarna",
-                  )
                   Utils.handlePostMessage([
                     ("fullscreen", true->JSON.Encode.bool),
                     ("param", "paymentloader"->JSON.Encode.string),
                     ("iframeId", iframeId->JSON.Encode.string),
                   ])
+                  setComplete(_ => true)
                   authorize(
                     {collect_shipping_address: componentName->getIsExpressCheckoutComponent},
                     Dict.make()->JSON.Encode.object,
diff --git a/src/Payments/PayPal.res b/src/Payments/PayPal.res
index a3ca1fcca..57bb69ba9 100644
--- a/src/Payments/PayPal.res
+++ b/src/Payments/PayPal.res
@@ -35,6 +35,11 @@ let make = () => {
   let isManualRetryEnabled = Recoil.useRecoilValueFromAtom(RecoilAtoms.isManualRetryEnabled)
 
   let intent = PaymentHelpers.usePaymentIntent(Some(loggerState), Paypal)
+  UtilityHooks.useHandlePostMessages(
+    ~complete=paypalClicked,
+    ~empty=!paypalClicked,
+    ~paymentType="paypal",
+  )
   let onPaypalClick = _ev => {
     loggerState.setLogInfo(
       ~value="Paypal Button Clicked",
@@ -48,7 +53,6 @@ let make = () => {
     ->then(result => {
       let result = result->JSON.Decode.bool->Option.getOr(false)
       if result {
-        UtilityHooks.useHandlePostMessages(~complete=true, ~empty=true, ~paymentType="paypal")
         let (connectors, _) =
           paymentMethodListValue->PaymentUtils.getConnectors(Wallets(Paypal(Redirect)))
         let body = PaymentBody.paypalRedirectionBody(~connectors)
diff --git a/src/Payments/PaypalSDK.res b/src/Payments/PaypalSDK.res
index a3c05e954..e1bacd799 100644
--- a/src/Payments/PaypalSDK.res
+++ b/src/Payments/PaypalSDK.res
@@ -8,6 +8,7 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
   let (loggerState, _setLoggerState) = Recoil.useRecoilState(RecoilAtoms.loggerAtom)
   let areOneClickWalletsRendered = Recoil.useSetRecoilState(RecoilAtoms.areOneClickWalletsRendered)
   let paymentMethodListValue = Recoil.useRecoilValueFromAtom(PaymentUtils.paymentMethodListValue)
+  let (complete, setComplete) = React.useState(_ => false)
 
   let token = sessionObj.token
   let orderDetails = sessionObj.orderDetails->getOrderDetails(paymentType)
@@ -51,6 +52,7 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
   )
 
   PaymentUtils.useStatesJson(setStatesJson)
+  UtilityHooks.useHandlePostMessages(~complete, ~empty=!complete, ~paymentType="paypal")
 
   let mountPaypalSDK = () => {
     let clientId = sessionObj.token
@@ -84,6 +86,7 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
         ~completeAuthorize,
         ~handleCloseLoader,
         ~areOneClickWalletsRendered,
+        ~setComplete,
       )
     })
     Window.body->Window.appendChild(paypalScript)
diff --git a/src/Payments/PaypalSDKHelpers.res b/src/Payments/PaypalSDKHelpers.res
index 661ed5358..4104e7aae 100644
--- a/src/Payments/PaypalSDKHelpers.res
+++ b/src/Payments/PaypalSDKHelpers.res
@@ -19,6 +19,7 @@ let loadPaypalSDK = (
   ~areOneClickWalletsRendered: (
     RecoilAtoms.areOneClickWalletsRendered => RecoilAtoms.areOneClickWalletsRendered
   ) => unit,
+  ~setComplete,
 ) => {
   loggerState.setLogInfo(
     ~value="Paypal SDK Button Clicked",
@@ -30,9 +31,9 @@ let loadPaypalSDK = (
   ->then(result => {
     let result = result->JSON.Decode.bool->Option.getOr(false)
     if result {
-      UtilityHooks.useHandlePostMessages(~complete=true, ~empty=true, ~paymentType="paypal")
       let paypalWrapper = GooglePayType.getElementById(Utils.document, "paypal-button")
       paypalWrapper.innerHTML = ""
+      setComplete(_ => true)
       paypal["Buttons"]({
         style: buttonStyle,
         fundingSource: paypal["FUNDING"]["PAYPAL"],