fix: payment data filled event logs for few payment methods

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 (isCompleted, setIsCompleted) = React.useState(_ => false)
 
   let setAreOneClickWalletsRendered = Recoil.useSetRecoilState(areOneClickWalletsRendered)
   let (stateJson, setStatesJson) = React.useState(_ => JSON.Encode.null)
@@ -40,6 +41,12 @@ let make = (~sessionObj: SessionsType.token) => {
 
   PaymentUtils.useStatesJson(setStatesJson)
 
+  UtilityHooks.useHandlePostMessages(
+    ~complete=isCompleted,
+    ~empty=!isCompleted,
+    ~paymentType="klarna",
+  )
+
   React.useEffect(() => {
     if (
       status === "ready" &&
@@ -67,6 +74,7 @@ let make = (~sessionObj: SessionsType.token) => {
                     ("param", "paymentloader"->JSON.Encode.string),
                     ("iframeId", iframeId->JSON.Encode.string),
                   ])
+                  setIsCompleted(_ => true)
                   authorize(
                     {collect_shipping_address: componentName->getIsExpressCheckoutComponent},
                     Dict.make()->JSON.Encode.object,

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",

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 (isCompleted, setIsCompleted) = React.useState(_ => false)
 
   let token = sessionObj.token
   let orderDetails = sessionObj.orderDetails->getOrderDetails(paymentType)
@@ -51,6 +52,11 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
   )
 
   PaymentUtils.useStatesJson(setStatesJson)
+  UtilityHooks.useHandlePostMessages(
+    ~complete=isCompleted,
+    ~empty=!isCompleted,
+    ~paymentType="paypal",
+  )
 
   let mountPaypalSDK = () => {
     let clientId = sessionObj.token
@@ -84,6 +90,7 @@ let make = (~sessionObj: SessionsType.token, ~paymentType: CardThemeType.mode) =
         ~completeAuthorize,
         ~handleCloseLoader,
         ~areOneClickWalletsRendered,
+        ~setIsCompleted,
       )
     })
     Window.body->Window.appendChild(paypalScript)

src/Payments/PaypalSDKHelpers.res

@@ -19,6 +19,7 @@ let loadPaypalSDK = (
   ~areOneClickWalletsRendered: (
     RecoilAtoms.areOneClickWalletsRendered => RecoilAtoms.areOneClickWalletsRendered
   ) => unit,
+  ~setIsCompleted,
 ) => {
   loggerState.setLogInfo(
     ~value="Paypal SDK Button Clicked",
@@ -32,6 +33,7 @@ let loadPaypalSDK = (
     if result {
       let paypalWrapper = GooglePayType.getElementById(Utils.document, "paypal-button")
       paypalWrapper.innerHTML = ""
+      setIsCompleted(_ => true)
       paypal["Buttons"]({
         style: buttonStyle,
         fundingSource: paypal["FUNDING"]["PAYPAL"],