diff --git a/CHANGELOG.md b/CHANGELOG.md
index c56bc8d1e..65de3d68d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,68 @@
+## [0.43.2](https://github.com/juspay/hyperswitch-web/compare/v0.43.1...v0.43.2) (2024-04-18)
+
+
+### Bug Fixes
+
+* Added envLoggingUrl in webpack ([#294](https://github.com/juspay/hyperswitch-web/issues/294)) ([88587ac](https://github.com/juspay/hyperswitch-web/commit/88587ac725c03fa1362e3ad79222a290f4d86cdb))
+
+## [0.43.1](https://github.com/juspay/hyperswitch-web/compare/v0.43.0...v0.43.1) (2024-04-18)
+
+
+### Bug Fixes
+
+* **threedsmethod:** changed Three DS method API call to hidden Form Post ([#302](https://github.com/juspay/hyperswitch-web/issues/302)) ([e42a5a3](https://github.com/juspay/hyperswitch-web/commit/e42a5a3b0f68ba3264ffbe6d7afde41b1cc01d9d))
+
+# [0.43.0](https://github.com/juspay/hyperswitch-web/compare/v0.42.6...v0.43.0) (2024-04-18)
+
+
+### Features
+
+* mandate changes for Saved Card flow ([#309](https://github.com/juspay/hyperswitch-web/issues/309)) ([648ea87](https://github.com/juspay/hyperswitch-web/commit/648ea87d8e2b0c989edbe7949b43a2c1e70e70cc))
+
+## [0.42.6](https://github.com/juspay/hyperswitch-web/compare/v0.42.5...v0.42.6) (2024-04-17)
+
+
+### Bug Fixes
+
+* mandate data pass hide checkbox ([#308](https://github.com/juspay/hyperswitch-web/issues/308)) ([51c98ab](https://github.com/juspay/hyperswitch-web/commit/51c98abc4da2438195cfbb7e418bf7f47f800008))
+
+## [0.42.5](https://github.com/juspay/hyperswitch-web/compare/v0.42.4...v0.42.5) (2024-04-17)
+
+## [0.42.4](https://github.com/juspay/hyperswitch-web/compare/v0.42.3...v0.42.4) (2024-04-17)
+
+
+### Bug Fixes
+
+* promise unresolved type error ([#298](https://github.com/juspay/hyperswitch-web/issues/298)) ([03da575](https://github.com/juspay/hyperswitch-web/commit/03da57557f70ae36dc155392a6ccae2b9cad573e))
+
+## [0.42.3](https://github.com/juspay/hyperswitch-web/compare/v0.42.2...v0.42.3) (2024-04-17)
+
+
+### Bug Fixes
+
+* (paymenthelpers, paymentelement) promise being unresolved  ([#297](https://github.com/juspay/hyperswitch-web/issues/297)) ([6494f51](https://github.com/juspay/hyperswitch-web/commit/6494f517a95321b4cb0911f772866deff055d878))
+
+## [0.42.2](https://github.com/juspay/hyperswitch-web/compare/v0.42.1...v0.42.2) (2024-04-17)
+
+
+### Bug Fixes
+
+* changes card payment ([#306](https://github.com/juspay/hyperswitch-web/issues/306)) ([d9a5b61](https://github.com/juspay/hyperswitch-web/commit/d9a5b611dbb191f1e3f5a4504f3729249e60d73b))
+
+## [0.42.1](https://github.com/juspay/hyperswitch-web/compare/v0.42.0...v0.42.1) (2024-04-17)
+
+
+### Bug Fixes
+
+* card payment changes ([#303](https://github.com/juspay/hyperswitch-web/issues/303)) ([25dc996](https://github.com/juspay/hyperswitch-web/commit/25dc996c82fd459a67cf4836c2652cdee91b1cca))
+
+# [0.42.0](https://github.com/juspay/hyperswitch-web/compare/v0.41.0...v0.42.0) (2024-04-17)
+
+
+### Features
+
+* (revert) mandate Changes for the Saved card screen & SDK Button Loader changes ([#301](https://github.com/juspay/hyperswitch-web/issues/301)) ([b490fed](https://github.com/juspay/hyperswitch-web/commit/b490fed4702306997a642041fdff56417822b7ca))
+
 # [0.41.0](https://github.com/juspay/hyperswitch-web/compare/v0.40.0...v0.41.0) (2024-04-16)
 
 
diff --git a/aws/hyperswitch_web_aws_production_deployment.sh b/aws/hyperswitch_web_aws_production_deployment.sh
index 0f3fdd9a6..62c9ed923 100755
--- a/aws/hyperswitch_web_aws_production_deployment.sh
+++ b/aws/hyperswitch_web_aws_production_deployment.sh
@@ -76,12 +76,12 @@ echo $( (aws s3api put-bucket-policy --bucket $MY_AWS_S3_BUCKET_NAME --policy "$
 
 echo "Bucket configuration updated"
 
-echo "Enter the backend endpoint your Hyperswitch Client will hit (hosted Hyperswitch Backend, https://sandbox.hyperswitch.io is taken by default):"
+echo "Enter the backend endpoint your Hyperswitch Client will hit (hosted Hyperswitch Backend, https://beta.hyperswitch.io/api is taken by default):"
 read AWS_BACKEND_URL </dev/tty
 
 if [ -z $AWS_BACKEND_URL ]; then
-    echo "Setting backend URL value to https://sandbox.hyperswitch.io by default"
-    AWS_BACKEND_URL="https://sandbox.hyperswitch.io"
+    echo "Setting backend URL value to https://beta.hyperswitch.io/api by default"
+    AWS_BACKEND_URL="https://beta.hyperswitch.io/api"
 
 fi
 
diff --git a/aws/hyperswitch_web_aws_setup.sh b/aws/hyperswitch_web_aws_setup.sh
index 16b7f510a..f12a04b9b 100644
--- a/aws/hyperswitch_web_aws_setup.sh
+++ b/aws/hyperswitch_web_aws_setup.sh
@@ -11,20 +11,20 @@ command_discovery() {
 command_discovery curl
 command_discovery aws
 
-echo "Please enter the URL where you have hosted Hyperswitch Backend (https://sandbox.hyperswitch.io) "
+echo "Please enter the URL where you have hosted Hyperswitch Backend (https://beta.hyperswitch.io/api) "
 read HYPERSWITCH_SERVER_URL < /dev/tty
 
 if [ -z "$HYPERSWITCH_SERVER_URL" ]; then
-    echo "Using default api url: https://sandbox.hyperswitch.io"
-    HYPERSWITCH_SERVER_URL="https://sandbox.hyperswitch.io"
+    echo "Using default api url: https://beta.hyperswitch.io/api"
+    HYPERSWITCH_SERVER_URL="https://beta.hyperswitch.io/api"
 fi
 
-# echo "Please enter the api url (https://sandbox.hyperswitch.io) "
+# echo "Please enter the api url (https://beta.hyperswitch.io/api) "
 # read apiBaseUrl < /dev/tty
 
 # if [ -z "$apiBaseUrl" ]; then
-#     echo "Using default api url: https://sandbox.hyperswitch.io"
-#     apiBaseUrl="https://sandbox.hyperswitch.io"
+#     echo "Using default api url: https://beta.hyperswitch.io/api"
+#     apiBaseUrl="https://beta.hyperswitch.io/api"
 # fi
 
 echo "Please enter the URL where you have hosted Hyperswitch Client SDK (https://beta.hyperswitch.io/v1) "
diff --git a/package-lock.json b/package-lock.json
index 65d00fc54..57e7a8205 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "orca-payment-page",
-  "version": "0.41.0",
+  "version": "0.43.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "orca-payment-page",
-      "version": "0.41.0",
+      "version": "0.43.2",
       "hasInstallScript": true,
       "dependencies": {
         "@aws-sdk/client-cloudfront": "^3.414.0",
diff --git a/package.json b/package.json
index 0b6ba3b31..fc2f1b50d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "orca-payment-page",
-  "version": "0.41.0",
+  "version": "0.43.2",
   "main": "index.js",
   "private": true,
   "dependencies": {
diff --git a/src/App.res b/src/App.res
index b65ae89ef..904b641f0 100644
--- a/src/App.res
+++ b/src/App.res
@@ -30,9 +30,7 @@ let make = () => {
         let clientSecret = CardUtils.getQueryParamsDictforKey(url.search, "clientSecret")
         let sessionId = CardUtils.getQueryParamsDictforKey(url.search, "sessionId")
         let publishableKey = CardUtils.getQueryParamsDictforKey(url.search, "publishableKey")
-        let endpoint =
-          CardUtils.getQueryParamsDictforKey(url.search, "endpoint")->decodeURIComponent
-        <PreMountLoader publishableKey sessionId clientSecret endpoint />
+        <PreMountLoader publishableKey sessionId clientSecret />
       }
     | "achBankTransfer"
     | "bacsBankTransfer"
diff --git a/src/Components/SaveDetailsCheckbox.res b/src/Components/SaveDetailsCheckbox.res
index 703c58858..838fe86c8 100644
--- a/src/Components/SaveDetailsCheckbox.res
+++ b/src/Components/SaveDetailsCheckbox.res
@@ -1,5 +1,5 @@
 @react.component
-let make = (~isChecked, ~setIsChecked, ~list: PaymentMethodsRecord.list) => {
+let make = (~isChecked, ~setIsChecked) => {
   let {themeObj} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
   let showFields = Recoil.useRecoilValueFromAtom(RecoilAtoms.showCardFieldsAtom)
   let {business} = Recoil.useRecoilValueFromAtom(RecoilAtoms.optionAtom)
@@ -44,16 +44,14 @@ let make = (~isChecked, ~setIsChecked, ~list: PaymentMethodsRecord.list) => {
     setIsChecked(_ => value)
   }
   let {localeString} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
-  let (checkboxState, checkedState, checkBoxLabelSate) = isChecked
+  let (checkboxState, checkedState, checkBoxLabelState) = isChecked
     ? ("Checkbox--checked", "CheckboxInput--checked", "CheckboxLabel--checked")
     : ("", "", "")
 
-  let valueToBeRendered = if showFields {
+  let saveCardCheckboxLabel = if showFields {
     localeString.saveCardDetails
-  } else if business.name !== "" {
-    localeString.cardTerms(business.name)
   } else {
-    localeString.cardTerms(list.merchant_name)
+    localeString.cardTerms(business.name)
   }
 
   <div className={`Checkbox ${checkboxState} flex flex-row gap-2 items-center`}>
@@ -61,8 +59,8 @@ let make = (~isChecked, ~setIsChecked, ~list: PaymentMethodsRecord.list) => {
     <label className={`container CheckboxInput ${checkedState}`}>
       <input type_={`checkbox`} onChange />
       <div className={`checkmark CheckboxInput ${checkedState} mt-1`} />
-      <div className={`CheckboxLabel ${checkBoxLabelSate} ml-2 w-11/12`}>
-        {React.string(valueToBeRendered)}
+      <div className={`CheckboxLabel ${checkBoxLabelState} ml-2 w-11/12`}>
+        {React.string(saveCardCheckboxLabel)}
       </div>
     </label>
   </div>
diff --git a/src/Components/SavedMethods.res b/src/Components/SavedMethods.res
index 160f6ec5f..636f2f20b 100644
--- a/src/Components/SavedMethods.res
+++ b/src/Components/SavedMethods.res
@@ -6,12 +6,11 @@ let make = (
   ~loadSavedCards: PaymentType.savedCardsLoadState,
   ~cvcProps,
   ~paymentType,
-  ~list: PaymentMethodsRecord.list,
+  ~list,
 ) => {
   open CardUtils
   open Utils
   open UtilityHooks
-
   let {themeObj, localeString} = Recoil.useRecoilValueFromAtom(RecoilAtoms.configAtom)
   let (showFields, setShowFields) = Recoil.useRecoilState(RecoilAtoms.showCardFieldsAtom)
   let areRequiredFieldsValid = Recoil.useRecoilValueFromAtom(RecoilAtoms.areRequiredFieldsValid)
@@ -226,7 +225,18 @@ let make = (
     }}
     <RenderIf condition={conditionsForShowingSaveCardCheckbox}>
       <div className="pt-4 pb-2 flex items-center justify-start">
-        <SaveDetailsCheckbox isChecked=isSaveCardsChecked setIsChecked=setIsSaveCardsChecked list />
+        <SaveDetailsCheckbox isChecked=isSaveCardsChecked setIsChecked=setIsSaveCardsChecked />
+      </div>
+    </RenderIf>
+    <RenderIf condition={list.payment_type === SETUP_MANDATE}>
+      <div
+        className="opacity-50 text-xs mb-2 text-left"
+        style={ReactDOMStyle.make(
+          ~color=themeObj.colorText,
+          ~marginTop=themeObj.spacingGridColumn,
+          (),
+        )}>
+        <Terms mode={Card} />
       </div>
     </RenderIf>
     <RenderIf condition={!showFields}>
diff --git a/src/Hooks/UtilityHooks.res b/src/Hooks/UtilityHooks.res
index 02380e144..feb416e0b 100644
--- a/src/Hooks/UtilityHooks.res
+++ b/src/Hooks/UtilityHooks.res
@@ -33,4 +33,4 @@ let useIsCustomerAcceptanceRequired = (
     } else {
       !(isGuestCustomer || list.payment_type === NORMAL)
     }
-  }, (isSaveCardsChecked, list.payment_type))
+  }, (isSaveCardsChecked, list.payment_type, isGuestCustomer, displaySavedPaymentMethodsCheckbox))
diff --git a/src/LoaderController.res b/src/LoaderController.res
index 60e1430a5..e0b5a9aba 100644
--- a/src/LoaderController.res
+++ b/src/LoaderController.res
@@ -362,6 +362,15 @@ let make = (~children, ~paymentMode, ~setIntegrateErrorError, ~logger, ~initTime
         }
         if dict->getDictIsSome("paymentMethodList") {
           let list = dict->getJsonObjectFromDict("paymentMethodList")
+          let listDict = list->getDictFromJson
+          if optionsPayment.business.name === "" {
+            setOptionsPayment(prev => {
+              ...prev,
+              business: {
+                name: listDict->getString("merchant_name", ""),
+              },
+            })
+          }
           let finalLoadLatency = if launchTime <= 0.0 {
             -1.0
           } else {
@@ -370,11 +379,11 @@ let make = (~children, ~paymentMode, ~setIntegrateErrorError, ~logger, ~initTime
           let updatedState: PaymentType.loadType =
             list == Dict.make()->JSON.Encode.object
               ? LoadError(list)
-              : switch list->getDictFromJson->Dict.get("error") {
+              : switch listDict->Dict.get("error") {
                 | Some(_) => LoadError(list)
                 | None =>
                   let isNonEmptyPaymentMethodList =
-                    list->getDictFromJson->getArray("payment_methods")->Array.length > 0
+                    listDict->getArray("payment_methods")->Array.length > 0
                   isNonEmptyPaymentMethodList ? Loaded(list) : LoadError(list)
                 }
 
@@ -474,7 +483,7 @@ let make = (~children, ~paymentMode, ~setIntegrateErrorError, ~logger, ~initTime
       }
     }
     handleMessage(handleFun, "Error in parsing sent Data")
-  }, (showCardFormByDefault, paymentMethodOrder))
+  }, (showCardFormByDefault, paymentMethodOrder, optionsPayment))
 
   let observer = ResizeObserver.newResizerObserver(entries => {
     entries
diff --git a/src/PaymentElement.res b/src/PaymentElement.res
index 756b3e19a..4f5048b99 100644
--- a/src/PaymentElement.res
+++ b/src/PaymentElement.res
@@ -398,7 +398,8 @@ let make = (
   React.useEffect(() => {
     let evalMethodsList = () =>
       switch methodslist {
-      | SemiLoaded | Loaded(_) => handlePostMessage([("ready", true->JSON.Encode.bool)])
+      | SemiLoaded | LoadError(_) | Loaded(_) =>
+        handlePostMessage([("ready", true->JSON.Encode.bool)])
       | _ => ()
       }
     if !displaySavedPaymentMethods {
diff --git a/src/Payments/CardPayment.res b/src/Payments/CardPayment.res
index 790ff4e5e..14aee6d5b 100644
--- a/src/Payments/CardPayment.res
+++ b/src/Payments/CardPayment.res
@@ -180,6 +180,7 @@ let make = (
   let paymentMethod = isBancontact ? "bank_redirect" : "card"
   let paymentMethodType = isBancontact ? "bancontact_card" : "debit"
   let conditionsForShowingSaveCardCheckbox =
+    list.mandate_payment->Option.isNone &&
     !isGuestCustomer &&
     list.payment_type !== SETUP_MANDATE &&
     options.displaySavedPaymentMethodsCheckbox &&
@@ -274,7 +275,7 @@ let make = (
           <RenderIf condition={conditionsForShowingSaveCardCheckbox}>
             <div className="pt-4 pb-2 flex items-center justify-start">
               <SaveDetailsCheckbox
-                isChecked=isSaveCardsChecked setIsChecked=setIsSaveCardsChecked list
+                isChecked=isSaveCardsChecked setIsChecked=setIsSaveCardsChecked
               />
             </div>
           </RenderIf>
@@ -292,19 +293,23 @@ let make = (
       />
     </RenderIf>
     <RenderIf condition={!isBancontact}>
-      {switch (list.mandate_payment, options.terms.card) {
-      | (Some(_), Auto)
-      | (_, Always) =>
+      {switch (list.mandate_payment, options.terms.card, list.payment_type) {
+      | (Some(_), Auto, NEW_MANDATE)
+      | (Some(_), Auto, SETUP_MANDATE)
+      | (_, Always, NEW_MANDATE)
+      | (_, Always, SETUP_MANDATE)
+      | (_, _, SETUP_MANDATE)
+      | (_, _, NEW_MANDATE) =>
         <div
           className="opacity-50 text-xs mb-2 text-left"
           style={ReactDOMStyle.make(
             ~color=themeObj.colorText,
-            ~marginTop=themeObj.spacingGridColumn->addSize(10.0, Pixel),
+            ~marginTop=themeObj.spacingGridColumn,
             (),
           )}>
           <Terms mode={Card} />
         </div>
-      | (_, _) => React.null
+      | (_, _, _) => React.null
       }}
     </RenderIf>
   </div>
diff --git a/src/Payments/PreMountLoader.res b/src/Payments/PreMountLoader.res
index 214e2ecd0..ba75d49b1 100644
--- a/src/Payments/PreMountLoader.res
+++ b/src/Payments/PreMountLoader.res
@@ -1,83 +1,108 @@
 @react.component
-let make = (~sessionId as _, ~publishableKey as _, ~clientSecret as _, ~endpoint as _) => {
-  // open Utils
-  // let logger = OrcaLogger.make(
-  //   ~sessionId,
-  //   ~source=Loader,
-  //   ~merchantId=publishableKey,
-  //   ~clientSecret,
-  //   (),
-  // )
+let make = (~sessionId, ~publishableKey, ~clientSecret) => {
+  open Utils
+  let (paymentMethodsResponseSent, setPaymentMethodsResponseSent) = React.useState(_ => false)
+  let (
+    customerPaymentMethodsResponseSent,
+    setCustomerPaymentMethodsResponseSent,
+  ) = React.useState(_ => false)
+  let (sessionTokensResponseSent, setSessionTokensResponseSent) = React.useState(_ => false)
+  let logger = OrcaLogger.make(
+    ~sessionId,
+    ~source=Loader,
+    ~merchantId=publishableKey,
+    ~clientSecret,
+    (),
+  )
 
-  // // let (
-  // //   paymentMethodsResponse,
-  // //   customerPaymentMethodsResponse,
-  // //   sessionTokensResponse,
-  // // ) = React.useMemo0(() => {
-  // //   (
-  // //     PaymentHelpers.fetchPaymentMethodList(
-  // //       ~clientSecret,
-  // //       ~publishableKey,
-  // //       ~logger,
-  // //       ~switchToCustomPod=false,
-  // //       ~endpoint,
-  // //     ),
-  // //     PaymentHelpers.fetchCustomerDetails(
-  // //       ~clientSecret,
-  // //       ~publishableKey,
-  // //       ~optLogger=Some(logger),
-  // //       ~switchToCustomPod=false,
-  // //       ~endpoint,
-  // //     ),
-  // //     PaymentHelpers.fetchSessions(
-  // //       ~clientSecret,
-  // //       ~publishableKey,
-  // //       ~optLogger=Some(logger),
-  // //       ~switchToCustomPod=false,
-  // //       ~endpoint,
-  // //       (),
-  // //     ),
-  // //   )
-  // // })
+  let endpoint = ApiEndpoint.getApiEndPoint(~publishableKey, ())
 
-  // // let sendPromiseData = (promise, key) => {
-  // //   open Promise
-  // //   promise
-  // //   ->then(res => {
-  // //     handlePostMessage([("response", res), ("data", key->JSON.Encode.string)])
-  // //     resolve()
-  // //   })
-  // //   ->catch(_err => {
-  // //     handlePostMessage([("response", JSON.Encode.null), ("data", key->JSON.Encode.string)])
-  // //     resolve()
-  // //   })
-  // //   ->ignore
-  // // }
+  let paymentMethodsResponse = React.useMemo0(() =>
+    PaymentHelpers.fetchPaymentMethodList(
+      ~clientSecret,
+      ~publishableKey,
+      ~logger,
+      ~switchToCustomPod=false,
+      ~endpoint,
+    )
+  )
 
-  // // React.useEffect0(() => {
-  // //   let handle = (ev: Window.event) => {
-  // //     let json = try {
-  // //       ev.data->JSON.parseExn
-  // //     } catch {
-  // //     | _ => JSON.Encode.null
-  // //     }
-  // //     let dict = json->Utils.getDictFromJson
-  // //     if dict->Dict.get("sendPaymentMethodsResponse")->Option.isSome {
-  // //       paymentMethodsResponse->sendPromiseData("payment_methods")
-  // //     } else if dict->Dict.get("sendCustomerPaymentMethodsResponse")->Option.isSome {
-  // //       customerPaymentMethodsResponse->sendPromiseData("customer_payment_methods")
-  // //     } else if dict->Dict.get("sendSessionTokensResponse")->Option.isSome {
-  // //       sessionTokensResponse->sendPromiseData("session_tokens")
-  // //     }
-  // //   }
-  // //   Window.addEventListener("message", handle)
-  // //   handlePostMessage([("preMountLoaderInitCallback", true->JSON.Encode.bool)])
-  // //   Some(
-  // //     () => {
-  // //       Window.removeEventListener("message", handle)
-  // //     },
-  // //   )
-  // // })
+  let customerPaymentMethodsResponse = React.useMemo0(() =>
+    PaymentHelpers.fetchCustomerPaymentMethodList(
+      ~clientSecret,
+      ~publishableKey,
+      ~optLogger=Some(logger),
+      ~switchToCustomPod=false,
+      ~endpoint,
+    )
+  )
+
+  let sessionTokensResponse = React.useMemo0(() =>
+    PaymentHelpers.fetchSessions(
+      ~clientSecret,
+      ~publishableKey,
+      ~optLogger=Some(logger),
+      ~switchToCustomPod=false,
+      ~endpoint,
+      (),
+    )
+  )
+
+  let sendPromiseData = (promise, key) => {
+    open Promise
+    promise
+    ->then(res => {
+      handlePostMessage([("response", res), ("data", key->JSON.Encode.string)])
+      switch key {
+      | "payment_methods" => setPaymentMethodsResponseSent(_ => true)
+      | "session_tokens" => setSessionTokensResponseSent(_ => true)
+      | "customer_payment_methods" => setCustomerPaymentMethodsResponseSent(_ => true)
+      | _ => ()
+      }
+      resolve()
+    })
+    ->catch(_err => {
+      handlePostMessage([("response", JSON.Encode.null), ("data", key->JSON.Encode.string)])
+      resolve()
+    })
+    ->ignore
+  }
+
+  let handle = (ev: Window.event) => {
+    let json = try {
+      ev.data->JSON.parseExn
+    } catch {
+    | _ => JSON.Encode.null
+    }
+    let dict = json->Utils.getDictFromJson
+    if dict->Dict.get("sendPaymentMethodsResponse")->Belt.Option.isSome {
+      paymentMethodsResponse->sendPromiseData("payment_methods")
+    } else if dict->Dict.get("sendCustomerPaymentMethodsResponse")->Belt.Option.isSome {
+      customerPaymentMethodsResponse->sendPromiseData("customer_payment_methods")
+    } else if dict->Dict.get("sendSessionTokensResponse")->Belt.Option.isSome {
+      sessionTokensResponse->sendPromiseData("session_tokens")
+    }
+  }
+
+  React.useEffect0(() => {
+    Window.addEventListener("message", handle)
+    handlePostMessage([("preMountLoaderIframeMountedCallback", true->JSON.Encode.bool)])
+    Some(
+      () => {
+        Window.removeEventListener("message", handle)
+      },
+    )
+  })
+
+  React.useEffect3(() => {
+    if (
+      paymentMethodsResponseSent && customerPaymentMethodsResponseSent && sessionTokensResponseSent
+    ) {
+      handlePostMessage([("preMountLoaderIframeUnMount", true->JSON.Encode.bool)])
+      Window.removeEventListener("message", handle)
+    }
+    None
+  }, (paymentMethodsResponseSent, customerPaymentMethodsResponseSent, sessionTokensResponseSent))
 
   React.null
 }
diff --git a/src/ThreeDSMethod.res b/src/ThreeDSMethod.res
index de218ada5..e024fd7a9 100644
--- a/src/ThreeDSMethod.res
+++ b/src/ThreeDSMethod.res
@@ -3,15 +3,25 @@ open Utils
 let make = () => {
   let logger = OrcaLogger.make()
 
-  let mountToInnerHTML = innerHTML => {
-    let ele = Window.querySelector("#threeDsInvisibleIframe")
-    switch ele->Nullable.toOption {
-    | Some(elem) => elem->Window.innerHTML(innerHTML)
-    | None =>
-      Console.warn(
-        "INTEGRATION ERROR: Div does not seem to exist on which threeDSMethod is to be mounted",
-      )
-    }
+  let (stateMetadata, setStateMetadata) = React.useState(_ => Dict.make()->JSON.Encode.object)
+
+  let handleLoaded = _ev => {
+    stateMetadata->Utils.getDictFromJson->Dict.set("3dsMethodComp", "Y"->JSON.Encode.string)
+    let metadataDict = stateMetadata->JSON.Decode.object->Option.getOr(Dict.make())
+    let iframeId = metadataDict->getString("iframeId", "")
+    LoggerUtils.handleLogging(
+      ~optLogger=Some(logger),
+      ~eventName=THREE_DS_METHOD_RESULT,
+      ~value="Y",
+      ~paymentMethod="CARD",
+      (),
+    )
+    handlePostMessage([
+      ("fullscreen", true->JSON.Encode.bool),
+      ("param", `3dsAuth`->JSON.Encode.string),
+      ("iframeId", iframeId->JSON.Encode.string),
+      ("metadata", stateMetadata),
+    ])
   }
 
   React.useEffect0(() => {
@@ -21,6 +31,7 @@ let make = () => {
       let dict = json->Utils.getDictFromJson
       if dict->Dict.get("fullScreenIframeMounted")->Option.isSome {
         let metadata = dict->getJsonObjectFromDict("metadata")
+        setStateMetadata(_ => metadata)
         let metaDataDict = metadata->JSON.Decode.object->Option.getOr(Dict.make())
         let threeDsDataDict =
           metaDataDict
@@ -42,74 +53,65 @@ let make = () => {
           ->Option.getOr(Dict.make()->JSON.Encode.object)
         let paymentIntentId = metaDataDict->Utils.getString("paymentIntentId", "")
         let publishableKey = metaDataDict->Utils.getString("publishableKey", "")
-        let iframeId = metaDataDict->getString("iframeId", "")
 
         logger.setClientSecret(paymentIntentId)
         logger.setMerchantId(publishableKey)
 
-        open Promise
-        PaymentHelpers.threeDsMethod(threeDsUrl, threeDsMethodData, ~optLogger=Some(logger))
-        ->then(res => {
-          if res == "" {
-            Exn.raiseError("Empty response from threeDsMethod")->reject
-          } else {
-            LoggerUtils.handleLogging(
-              ~optLogger=Some(logger),
-              ~eventName=THREE_DS_METHOD_RESULT,
-              ~value="Y",
-              ~paymentMethod="CARD",
-              (),
-            )
-            mountToInnerHTML(res)
-            metadata->Utils.getDictFromJson->Dict.set("3dsMethodComp", "Y"->JSON.Encode.string)
-            handlePostMessage([
-              ("fullscreen", true->JSON.Encode.bool),
-              ("param", `3dsAuth`->JSON.Encode.string),
-              ("iframeId", iframeId->JSON.Encode.string),
-              ("metadata", metadata),
-            ])
-            resolve(res)
-          }
-        })
-        ->catch(err => {
-          let exceptionMessage = err->Utils.formatException
-          metadata->Utils.getDictFromJson->Dict.set("3dsMethodComp", "N"->JSON.Encode.string)
-          handlePostMessage([
-            ("fullscreen", true->JSON.Encode.bool),
-            ("param", `3dsAuth`->JSON.Encode.string),
-            ("iframeId", iframeId->JSON.Encode.string),
-            ("metadata", metadata),
-          ])
+        let iframeId = metaDataDict->getString("iframeId", "")
+
+        let handleFailureScenarios = value => {
           LoggerUtils.handleLogging(
             ~optLogger=Some(logger),
             ~eventName=THREE_DS_METHOD_RESULT,
-            ~value=exceptionMessage->JSON.stringify,
+            ~value,
             ~paymentMethod="CARD",
             ~logType=ERROR,
             (),
           )
-          reject(err)
-        })
-        ->ignore
+          metadata->Utils.getDictFromJson->Dict.set("3dsMethodComp", "N"->JSON.Encode.string)
+          handlePostMessage([
+            ("fullscreen", true->JSON.Encode.bool),
+            ("param", `3dsAuth`->JSON.Encode.string),
+            ("iframeId", iframeId->JSON.Encode.string),
+            ("metadata", stateMetadata),
+          ])
+        }
 
-        let headersDict =
-          metaDataDict
-          ->getJsonObjectFromDict("headers")
-          ->JSON.Decode.object
-          ->Option.getOr(Dict.make())
-        let headers = Dict.make()
+        let ele = Window.querySelector("#threeDsInvisibleDiv")
 
-        headersDict
-        ->Dict.toArray
-        ->Array.forEach(entries => {
-          let (x, val) = entries
-          Dict.set(headers, x, val->JSON.Decode.string->Option.getOr(""))
-        })
+        switch ele->Nullable.toOption {
+        | Some(elem) => {
+            let form = elem->makeForm(threeDsUrl, "threeDsHiddenPostMethod")
+            let input = Types.createElement("input")
+            input.name = encodeURIComponent("threeDSMethodData")
+            let threeDsMethodStr = threeDsMethodData->JSON.Decode.string->Option.getOr("")
+            input.value = encodeURIComponent(threeDsMethodStr)
+            form.target = "threeDsInvisibleIframe"
+            form.appendChild(input)
+            try {
+              form.submit()
+            } catch {
+            | err => {
+                let exceptionMessage = err->Utils.formatException->JSON.stringify
+                handleFailureScenarios(exceptionMessage)
+              }
+            }
+          }
+        | None => handleFailureScenarios("Unable to Locate threeDsInvisibleDiv")
+        }
       }
     }
     Window.addEventListener("message", handle)
     Some(() => {Window.removeEventListener("message", handle)})
   })
 
-  <div id="threeDsInvisibleIframe" className="bg-black-100 h-96" />
+  <>
+    <div id="threeDsInvisibleDiv" className="hidden" />
+    <iframe
+      id="threeDsInvisibleIframe"
+      name="threeDsInvisibleIframe"
+      className="h-96 invisible"
+      onLoad=handleLoaded
+    />
+  </>
 }
diff --git a/src/Utilities/ApiEndpoint.res b/src/Utilities/ApiEndpoint.res
index 0bd259d16..d3ede5855 100644
--- a/src/Utilities/ApiEndpoint.res
+++ b/src/Utilities/ApiEndpoint.res
@@ -14,7 +14,7 @@ let getApiEndPoint = (~publishableKey="", ~isConfirmCall=false, ()) => {
   | Some(str) => str
   | None =>
     let backendEndPoint = isConfirmCall ? GlobalVars.confirmEndPoint : GlobalVars.backendEndPoint
-    GlobalVars.isProd && testMode ? "https://sandbox.hyperswitch.io" : backendEndPoint
+    GlobalVars.isProd && testMode ? "https://beta.hyperswitch.io/api" : backendEndPoint
   }
 }
 
diff --git a/src/Utilities/PaymentBody.res b/src/Utilities/PaymentBody.res
index 9ddae8ef2..e98bdacf3 100644
--- a/src/Utilities/PaymentBody.res
+++ b/src/Utilities/PaymentBody.res
@@ -78,50 +78,49 @@ let customerAcceptanceBody =
   ->Dict.fromArray
   ->JSON.Encode.object
 
-let savedPaymentMethodBody = (
+let savedCardBody = (
   ~paymentToken,
   ~customerId,
-  ~paymentMethod,
-  ~paymentMethodType,
+  ~cvcNumber,
+  ~requiresCvv,
   ~isCustomerAcceptanceRequired,
 ) => {
-  let savedPaymentMethodBody = [
-    ("payment_method", paymentMethod->JSON.Encode.string),
+  let savedCardBody = [
+    ("payment_method", "card"->JSON.Encode.string),
     ("payment_token", paymentToken->JSON.Encode.string),
     ("customer_id", customerId->JSON.Encode.string),
-    ("payment_method_type", paymentMethodType),
   ]
 
+  if requiresCvv {
+    savedCardBody->Array.push(("card_cvc", cvcNumber->JSON.Encode.string))->ignore
+  }
+
   if isCustomerAcceptanceRequired {
-    savedPaymentMethodBody->Array.push(("customer_acceptance", customerAcceptanceBody))->ignore
+    savedCardBody->Array.push(("customer_acceptance", customerAcceptanceBody))->ignore
   }
 
-  savedPaymentMethodBody
+  savedCardBody
 }
 
-let savedCardBody = (
+let savedPaymentMethodBody = (
   ~paymentToken,
   ~customerId,
-  ~cvcNumber,
-  ~requiresCvv,
+  ~paymentMethod,
+  ~paymentMethodType,
   ~isCustomerAcceptanceRequired,
 ) => {
-  let savedCardBody = [
-    ("payment_method", "card"->JSON.Encode.string),
+  let savedPaymentMethodBody = [
+    ("payment_method", paymentMethod->JSON.Encode.string),
     ("payment_token", paymentToken->JSON.Encode.string),
     ("customer_id", customerId->JSON.Encode.string),
-    ("customer_acceptance", customerAcceptanceBody),
+    ("payment_method_type", paymentMethodType),
   ]
 
-  if requiresCvv {
-    savedCardBody->Array.push(("card_cvc", cvcNumber->JSON.Encode.string))->ignore
-  }
-
   if isCustomerAcceptanceRequired {
-    savedCardBody->Array.push(("customer_acceptance", customerAcceptanceBody))->ignore
+    savedPaymentMethodBody->Array.push(("customer_acceptance", customerAcceptanceBody))->ignore
   }
 
-  savedCardBody
+  savedPaymentMethodBody
 }
 
 let mandateBody = paymentType => {
diff --git a/src/Utilities/PaymentHelpers.res b/src/Utilities/PaymentHelpers.res
index 83937b42d..a2e835fd8 100644
--- a/src/Utilities/PaymentHelpers.res
+++ b/src/Utilities/PaymentHelpers.res
@@ -79,69 +79,6 @@ let retrievePaymentIntent = (
   })
 }
 
-let threeDsMethod = (url, threeDsMethodData, ~optLogger) => {
-  open Promise
-  logApi(
-    ~optLogger,
-    ~url,
-    ~apiLogType=Request,
-    ~eventName=THREE_DS_METHOD_CALL_INIT,
-    ~logType=INFO,
-    ~logCategory=API,
-    (),
-  )
-  let threeDsMethodStr = threeDsMethodData->JSON.Decode.string->Option.getOr("")
-  let body = `${encodeURIComponent("threeDSMethodData")}=${encodeURIComponent(threeDsMethodStr)}`
-
-  fetchApiWithNoCors(url, ~method=#POST, ~bodyStr=body, ())
-  ->then(res => {
-    let statusCode = res->Fetch.Response.status->Int.toString
-    if statusCode->String.charAt(0) !== "2" {
-      res
-      ->Fetch.Response.text
-      ->then(text => {
-        logApi(
-          ~optLogger,
-          ~url,
-          ~data=text->JSON.Encode.string,
-          ~statusCode,
-          ~apiLogType=Err,
-          ~eventName=THREE_DS_METHOD_CALL,
-          ~logType=ERROR,
-          ~logCategory=API,
-          (),
-        )
-        ""->resolve
-      })
-    } else {
-      logApi(
-        ~optLogger,
-        ~url,
-        ~statusCode,
-        ~apiLogType=Response,
-        ~eventName=THREE_DS_METHOD_CALL,
-        (),
-      )
-      res->Fetch.Response.text
-    }
-  })
-  ->catch(err => {
-    let exceptionMessage = err->formatException
-    Console.log2("Unable to call 3ds method ", exceptionMessage)
-    logApi(
-      ~optLogger,
-      ~url,
-      ~eventName=THREE_DS_METHOD_CALL,
-      ~apiLogType=NoResponse,
-      ~data=exceptionMessage,
-      ~logType=ERROR,
-      ~logCategory=API,
-      (),
-    )
-    reject(err)
-  })
-}
-
 let threeDsAuth = (~clientSecret, ~optLogger, ~threeDsMethodComp, ~headers) => {
   let endpoint = ApiEndpoint.getApiEndPoint()
   let paymentIntentID = String.split(clientSecret, "_secret_")[0]->Option.getOr("")
@@ -712,65 +649,78 @@ let rec intentCall = (
   })
   ->catch(err => {
     Promise.make((resolve, _) => {
-      let url = urlSearch(confirmParam.return_url)
-      url.searchParams.set("payment_intent_client_secret", clientSecret)
-      url.searchParams.set("status", "failed")
-      let exceptionMessage = err->formatException
-      logApi(
-        ~optLogger,
-        ~url=uri,
-        ~eventName,
-        ~apiLogType=NoResponse,
-        ~data=exceptionMessage,
-        ~logType=ERROR,
-        ~logCategory=API,
-        ~isPaymentSession,
-        (),
-      )
-      if counter >= 5 {
-        if !isPaymentSession {
-          closePaymentLoaderIfAny()
-          postFailedSubmitResponse(~errortype="server_error", ~message="Something went wrong")
-        }
-        if handleUserError {
-          handleOpenUrl(url.href)
-        } else {
-          let failedSubmitResponse = getFailedSubmitResponse(
-            ~errorType="server_error",
-            ~message="Something went wrong",
-          )
-          resolve(failedSubmitResponse)
-        }
-      } else {
-        let paymentIntentID = String.split(clientSecret, "_secret_")->Array.get(0)->Option.getOr("")
-        let endpoint = ApiEndpoint.getApiEndPoint(~publishableKey=confirmParam.publishableKey, ())
-        let retrieveUri = `${endpoint}/payments/${paymentIntentID}?client_secret=${clientSecret}`
-        intentCall(
-          ~fetchApi,
-          ~uri=retrieveUri,
-          ~headers,
-          ~bodyStr,
-          ~confirmParam: ConfirmType.confirmParams,
-          ~clientSecret,
+      try {
+        let url = urlSearch(confirmParam.return_url)
+        url.searchParams.set("payment_intent_client_secret", clientSecret)
+        url.searchParams.set("status", "failed")
+        let exceptionMessage = err->formatException
+        logApi(
           ~optLogger,
-          ~handleUserError,
-          ~paymentType,
-          ~iframeId,
-          ~fetchMethod=#GET,
-          ~setIsManualRetryEnabled,
-          ~switchToCustomPod,
-          ~sdkHandleOneClickConfirmPayment,
-          ~counter=counter + 1,
+          ~url=uri,
+          ~eventName,
+          ~apiLogType=NoResponse,
+          ~data=exceptionMessage,
+          ~logType=ERROR,
+          ~logCategory=API,
           ~isPaymentSession,
           (),
         )
-        ->then(
-          res => {
-            resolve(res)
-            Promise.resolve()
-          },
+        if counter >= 5 {
+          if !isPaymentSession {
+            closePaymentLoaderIfAny()
+            postFailedSubmitResponse(~errortype="server_error", ~message="Something went wrong")
+          }
+          if handleUserError {
+            handleOpenUrl(url.href)
+          } else {
+            let failedSubmitResponse = getFailedSubmitResponse(
+              ~errorType="server_error",
+              ~message="Something went wrong",
+            )
+            resolve(failedSubmitResponse)
+          }
+        } else {
+          let paymentIntentID =
+            String.split(clientSecret, "_secret_")->Array.get(0)->Option.getOr("")
+          let endpoint = ApiEndpoint.getApiEndPoint(~publishableKey=confirmParam.publishableKey, ())
+          let retrieveUri = `${endpoint}/payments/${paymentIntentID}?client_secret=${clientSecret}`
+          intentCall(
+            ~fetchApi,
+            ~uri=retrieveUri,
+            ~headers,
+            ~bodyStr,
+            ~confirmParam: ConfirmType.confirmParams,
+            ~clientSecret,
+            ~optLogger,
+            ~handleUserError,
+            ~paymentType,
+            ~iframeId,
+            ~fetchMethod=#GET,
+            ~setIsManualRetryEnabled,
+            ~switchToCustomPod,
+            ~sdkHandleOneClickConfirmPayment,
+            ~counter=counter + 1,
+            ~isPaymentSession,
+            (),
+          )
+          ->then(
+            res => {
+              resolve(res)
+              Promise.resolve()
+            },
+          )
+          ->ignore
+        }
+      } catch {
+      | _ =>
+        if !isPaymentSession {
+          postFailedSubmitResponse(~errortype="error", ~message="Something went wrong")
+        }
+        let failedSubmitResponse = getFailedSubmitResponse(
+          ~errorType="server_error",
+          ~message="Something went wrong",
         )
-        ->ignore
+        resolve(failedSubmitResponse)
       }
     })->then(resolve)
   })
@@ -976,26 +926,39 @@ let usePaymentIntent = (optLogger: option<OrcaLogger.loggerMake>, paymentType: p
       }
 
       switch list {
+      | LoadError(data)
       | Loaded(data) =>
         let paymentList = data->getDictFromJson->PaymentMethodsRecord.itemToObjMapper
         let mandatePaymentType =
           paymentList.payment_type->PaymentMethodsRecord.paymentTypeToStringMapper
-        switch paymentList.mandate_payment {
-        | Some(_) =>
-          switch paymentType {
-          | Card
-          | Gpay
-          | Applepay
-          | KlarnaRedirect
-          | Paypal
-          | BankDebits =>
-            intentWithMandate(mandatePaymentType)
-          | _ => intentWithoutMandate(mandatePaymentType)
+        if paymentList.payment_methods->Array.length > 0 {
+          switch paymentList.mandate_payment {
+          | Some(_) =>
+            switch paymentType {
+            | Card
+            | Gpay
+            | Applepay
+            | KlarnaRedirect
+            | Paypal
+            | BankDebits =>
+              intentWithMandate(mandatePaymentType)
+            | _ => intentWithoutMandate(mandatePaymentType)
+            }
+          | None => intentWithoutMandate(mandatePaymentType)
           }
-        | None => intentWithoutMandate(mandatePaymentType)
+        } else {
+          postFailedSubmitResponse(
+            ~errortype="payment_methods_empty",
+            ~message="Payment Failed. Try again!",
+          )
+          Console.warn("Please enable atleast one Payment method.")
         }
       | SemiLoaded => intentWithoutMandate("")
-      | _ => ()
+      | _ =>
+        postFailedSubmitResponse(
+          ~errortype="payment_methods_loading",
+          ~message="Please wait. Try again!",
+        )
       }
     | None =>
       postFailedSubmitResponse(
@@ -1168,7 +1131,7 @@ let fetchPaymentMethodList = (
   })
 }
 
-let fetchCustomerDetails = (
+let fetchCustomerPaymentMethodList = (
   ~clientSecret,
   ~publishableKey,
   ~endpoint,
diff --git a/src/Utilities/Utils.res b/src/Utilities/Utils.res
index af84cfe38..c3b8a2d00 100644
--- a/src/Utilities/Utils.res
+++ b/src/Utilities/Utils.res
@@ -835,37 +835,6 @@ let fetchApi = (uri, ~bodyStr: string="", ~headers=Dict.make(), ~method: Fetch.m
   })
 }
 
-let fetchApiWithNoCors = (
-  uri,
-  ~bodyStr: string="",
-  ~headers=Dict.make(),
-  ~method: Fetch.method,
-  (),
-) => {
-  open Promise
-  let body = switch method {
-  | #GET => resolve(None)
-  | _ => resolve(Some(Fetch.Body.string(bodyStr)))
-  }
-  body->then(body => {
-    Fetch.fetch(
-      uri,
-      {
-        method,
-        mode: #"no-cors",
-        ?body,
-        headers: getHeaders(~headers, ~uri, ()),
-      },
-    )
-    ->catch(err => {
-      reject(err)
-    })
-    ->then(resp => {
-      resolve(resp)
-    })
-  })
-}
-
 let arrayJsonToCamelCase = arr => {
   arr->Array.map(item => {
     item->transformKeys(CamelCase)
@@ -1192,7 +1161,7 @@ let makeForm = (element, url, id) => {
   form.action = url
   form.method = "POST"
   form.enctype = "application/x-www-form-urlencoded;charset=UTF-8"
-  form.style = "display: hidden; "
+  form.style = "display: hidden;"
   element->appendChild(form)
   form
 }
@@ -1234,3 +1203,14 @@ let makeOneClickHandlerPromise = sdkHandleOneClickConfirmPayment => {
     }
   })
 }
+
+let generateRandomString = length => {
+  let characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"
+  let result = ref("")
+  let charactersLength = characters->String.length
+  Int.range(0, length)->Array.forEach(_ => {
+    let charIndex = mod((Math.random() *. 100.0)->Float.toInt, charactersLength)
+    result := result.contents ++ characters->String.charAt(charIndex)
+  })
+  result.contents
+}
diff --git a/src/orca-loader/Elements.res b/src/orca-loader/Elements.res
index d093d55a5..1297d5895 100644
--- a/src/orca-loader/Elements.res
+++ b/src/orca-loader/Elements.res
@@ -55,105 +55,135 @@ let make = (
       ->Option.flatMap(JSON.Decode.bool)
       ->Option.getOr(false)
 
-    let paymentMethodListPromise = PaymentHelpers.fetchPaymentMethodList(
-      ~clientSecret,
-      ~publishableKey,
-      ~endpoint,
-      ~switchToCustomPod,
-      ~logger,
-    )
-
-    let customerDetailsPromise = PaymentHelpers.fetchCustomerDetails(
-      ~clientSecret,
-      ~publishableKey,
-      ~endpoint,
-      ~switchToCustomPod,
-      ~optLogger=Some(logger),
-    )
-
-    let sessionsPromise = PaymentHelpers.fetchSessions(
-      ~clientSecret,
-      ~publishableKey,
-      ~endpoint,
-      ~switchToCustomPod,
-      ~optLogger=Some(logger),
-      (),
-    )
+    let localSelectorString = "hyper-preMountLoader-iframe"
+    let mountPreMountLoaderIframe = () => {
+      if (
+        Window.querySelector(
+          `#orca-payment-element-iframeRef-${localSelectorString}`,
+        )->Js.Nullable.isNullable
+      ) {
+        let componentType = "preMountLoader"
+        let iframeDivHtml = `<div id="orca-element-${localSelectorString}" style= "height: 0px; width: 0px; display: none;"  class="${componentType}">
+          <div id="orca-fullscreen-iframeRef-${localSelectorString}"></div>
+           <iframe
+           id ="orca-payment-element-iframeRef-${localSelectorString}"
+           name="orca-payment-element-iframeRef-${localSelectorString}"
+          src="${ApiEndpoint.sdkDomainUrl}/?fullscreenType=${componentType}&publishableKey=${publishableKey}&clientSecret=${clientSecret}&sessionId=${sdkSessionId}"
+          allow="*"
+          name="orca-payment"
+        ></iframe>
+        </div>`
+        let iframeDiv = Window.createElement("div")
+        iframeDiv->Window.innerHTML(iframeDivHtml)
+        Window.body->Window.appendChild(iframeDiv)
+      }
+
+      let elem = Window.querySelector(`#orca-payment-element-iframeRef-${localSelectorString}`)
+      elem
+    }
 
     let locale = localOptions->getJsonStringFromDict("locale", "")
     let loader = localOptions->getJsonStringFromDict("loader", "")
     let clientSecret = localOptions->getRequiredString("clientSecret", "", ~logger)
-    let clientSecretReMatch = RegExp.test(`.+_secret_[A-Za-z0-9]+`->RegExp.fromString, clientSecret)
+    let clientSecretReMatch = Re.test(`.+_secret_[A-Za-z0-9]+`->Re.fromString, clientSecret)
+
+    let preMountLoaderIframeDiv = mountPreMountLoaderIframe()
+
+    let unMountPreMountLoaderIframe = () => {
+      switch preMountLoaderIframeDiv->Nullable.toOption {
+      | Some(iframe) => iframe->remove
+      | None => ()
+      }
+    }
+
+    let preMountLoaderMountedPromise = Promise.make((resolve, _reject) => {
+      let preMountLoaderIframeCallback = (ev: Types.event) => {
+        let json = ev.data->Identity.anyTypeToJson
+        let dict = json->Utils.getDictFromJson
+        if dict->Dict.get("preMountLoaderIframeMountedCallback")->Belt.Option.isSome {
+          resolve(true->JSON.Encode.bool)
+        } else if dict->Dict.get("preMountLoaderIframeUnMount")->Belt.Option.isSome {
+          unMountPreMountLoaderIframe()
+        }
+      }
+      addSmartEventListener(
+        "message",
+        preMountLoaderIframeCallback,
+        "onPreMountLoaderIframeCallback",
+      )
+    })
+
     let fetchPaymentsList = mountedIframeRef => {
-      open Promise
-      paymentMethodListPromise
-      ->then(json => {
-        let isApplePayPresent =
-          PaymentMethodsRecord.getPaymentMethodTypeFromList(
-            ~list=json->getDictFromJson->PaymentMethodsRecord.itemToObjMapper,
-            ~paymentMethod="wallet",
-            ~paymentMethodType="apple_pay",
-          )->Option.isSome
-
-        let isGooglePayPresent =
-          PaymentMethodsRecord.getPaymentMethodTypeFromList(
-            ~list=json->getDictFromJson->PaymentMethodsRecord.itemToObjMapper,
-            ~paymentMethod="wallet",
-            ~paymentMethodType="google_pay",
-          )->Option.isSome
-
-        if isApplePayPresent || isGooglePayPresent {
-          if (
-            Window.querySelectorAll(`script[src="https://tpgw.trustpay.eu/js/v1.js"]`)->Array.length === 0 &&
-              Window.querySelectorAll(`script[src="https://test-tpgw.trustpay.eu/js/v1.js"]`)->Array.length === 0
-          ) {
-            let trustPayScriptURL =
-              publishableKey->String.startsWith("pk_prd_")
-                ? "https://tpgw.trustpay.eu/js/v1.js"
-                : "https://test-tpgw.trustpay.eu/js/v1.js"
-            let trustPayScript = Window.createElement("script")
-            trustPayScript->Window.elementSrc(trustPayScriptURL)
-            trustPayScript->Window.elementOnerror(err => {
-              logInfo(Console.log2("ERROR DURING LOADING TRUSTPAY APPLE PAY", err))
-            })
-            Window.body->Window.appendChild(trustPayScript)
-            logger.setLogInfo(~value="TrustPay Script Loaded", ~eventName=TRUSTPAY_SCRIPT, ())
+      let handlePaymentMethodsLoaded = (event: Types.event) => {
+        let json = event.data->Identity.anyTypeToJson
+        let dict = json->getDictFromJson
+        let isPaymentMethodsData = dict->Utils.getString("data", "") === "payment_methods"
+        if isPaymentMethodsData {
+          let json = dict->Utils.getJsonFromDict("response", JSON.Encode.null)
+          let isApplePayPresent =
+            PaymentMethodsRecord.getPaymentMethodTypeFromList(
+              ~list=json->Utils.getDictFromJson->PaymentMethodsRecord.itemToObjMapper,
+              ~paymentMethod="wallet",
+              ~paymentMethodType="apple_pay",
+            )->Belt.Option.isSome
+
+          let isGooglePayPresent =
+            PaymentMethodsRecord.getPaymentMethodTypeFromList(
+              ~list=json->Utils.getDictFromJson->PaymentMethodsRecord.itemToObjMapper,
+              ~paymentMethod="wallet",
+              ~paymentMethodType="google_pay",
+            )->Belt.Option.isSome
+
+          if isApplePayPresent || isGooglePayPresent {
+            if (
+              Window.querySelectorAll(`script[src="https://tpgw.trustpay.eu/js/v1.js"]`)->Array.length === 0 &&
+                Window.querySelectorAll(`script[src="https://test-tpgw.trustpay.eu/js/v1.js"]`)->Array.length === 0
+            ) {
+              let trustPayScriptURL =
+                publishableKey->String.startsWith("pk_prd_")
+                  ? "https://tpgw.trustpay.eu/js/v1.js"
+                  : "https://test-tpgw.trustpay.eu/js/v1.js"
+              let trustPayScript = Window.createElement("script")
+              trustPayScript->Window.elementSrc(trustPayScriptURL)
+              trustPayScript->Window.elementOnerror(err => {
+                Utils.logInfo(Console.log2("ERROR DURING LOADING TRUSTPAY APPLE PAY", err))
+              })
+              Window.body->Window.appendChild(trustPayScript)
+              logger.setLogInfo(~value="TrustPay Script Loaded", ~eventName=TRUSTPAY_SCRIPT, ())
+            }
+          }
+          let msg = [("paymentMethodList", json)]->Dict.fromArray
+          mountedIframeRef->Window.iframePostMessage(msg)
+        }
+      }
+      let msg = [("sendPaymentMethodsResponse", true->JSON.Encode.bool)]->Dict.fromArray
+      addSmartEventListener("message", handlePaymentMethodsLoaded, "onPaymentMethodsLoaded")
+      preMountLoaderIframeDiv->Window.iframePostMessage(msg)
+    }
+    let fetchCustomerPaymentMethods = (mountedIframeRef, disableSaveCards) => {
+      if !disableSaveCards {
+        let handleCustomerPaymentMethodsLoaded = (event: Types.event) => {
+          let json = event.data->Identity.anyTypeToJson
+          let dict = json->getDictFromJson
+          let isCustomerPaymentMethodsData =
+            dict->Utils.getString("data", "") === "customer_payment_methods"
+          if isCustomerPaymentMethodsData {
+            let json = dict->Utils.getJsonFromDict("response", JSON.Encode.null)
+            let msg = [("customerPaymentMethods", json)]->Dict.fromArray
+            mountedIframeRef->Window.iframePostMessage(msg)
           }
         }
-
-        // setTimeout(() => {
-        let msg = [("paymentMethodList", json)]->Dict.fromArray
-        mountedIframeRef->Window.iframePostMessage(msg)
-        let maskedPayload = json->PaymentHelpers.maskPayload->JSON.stringify
-        logger.setLogInfo(
-          ~value="",
-          ~internalMetadata=maskedPayload,
-          ~eventName=PAYMENT_METHODS_RESPONSE,
-          (),
+        addSmartEventListener(
+          "message",
+          handleCustomerPaymentMethodsLoaded,
+          "onCustomerPaymentMethodsLoaded",
         )
-        // }, 5000)->ignore
-        json->resolve
-      })
-      ->ignore
-    }
-    let fetchCustomerDetails = mountedIframeRef => {
-      open Promise
-      customerDetailsPromise
-      ->then(json => {
-        // setTimeout(() => {
-        let msg = [("customerPaymentMethods", json)]->Dict.fromArray
-        mountedIframeRef->Window.iframePostMessage(msg)
-        // }, 5000)->ignore
-        json->resolve
-      })
-      ->catch(_err => {
-        let dict =
-          [("customer_payment_methods", []->JSON.Encode.array)]->Dict.fromArray->JSON.Encode.object
-        let msg = [("customerPaymentMethods", dict)]->Dict.fromArray
-        mountedIframeRef->Window.iframePostMessage(msg)
-        resolve(msg->JSON.Encode.object)
-      })
-      ->ignore
+      }
+      let msg =
+        [
+          ("sendCustomerPaymentMethodsResponse", !disableSaveCards->JSON.Encode.bool),
+        ]->Dict.fromArray
+      preMountLoaderIframeDiv->Window.iframePostMessage(msg)
     }
 
     !clientSecretReMatch
@@ -246,7 +276,6 @@ let make = (
             ("sdkSessionId", sdkSessionId->JSON.Encode.string),
             ("blockConfirm", blockConfirm->JSON.Encode.bool),
             ("switchToCustomPod", switchToCustomPod->JSON.Encode.bool),
-            ("endpoint", endpoint->JSON.Encode.string),
             ("sdkHandleOneClickConfirmPayment", sdkHandleOneClickConfirmPayment->JSON.Encode.bool),
             ("parentURL", "*"->JSON.Encode.string),
             ("analyticsMetadata", analyticsMetadata),
@@ -396,372 +425,391 @@ let make = (
 
         addSmartEventListener("message", handleApplePayMounted, "onApplePayMount")
         addSmartEventListener("message", handleGooglePayThirdPartyFlow, "onGooglePayThirdParty")
+        Window.removeEventListener("message", handleApplePayMessages.contents)
 
-        sessionsPromise
-        ->then(json => {
-          let sessionsArr =
-            json
-            ->JSON.Decode.object
-            ->Option.getOr(Dict.make())
-            ->SessionsType.getSessionsTokenJson("session_token")
-
-          let applePayPresent = sessionsArr->Array.find(item => {
-            let x =
-              item
-              ->JSON.Decode.object
-              ->Option.flatMap(
-                x => {
-                  x->Dict.get("wallet_name")
-                },
-              )
-              ->Option.flatMap(JSON.Decode.string)
-              ->Option.getOr("")
-            x === "apple_pay" || x === "applepay"
-          })
-          if !(applePayPresent->Option.isSome) {
-            let msg = [("applePaySessionObjNotPresent", true->JSON.Encode.bool)]->Dict.fromArray
-            mountedIframeRef->Window.iframePostMessage(msg)
-          }
-          let googlePayPresent = sessionsArr->Array.find(item => {
-            let x =
-              item
-              ->JSON.Decode.object
-              ->Option.flatMap(
-                x => {
-                  x->Dict.get("wallet_name")
-                },
-              )
-              ->Option.flatMap(JSON.Decode.string)
-              ->Option.getOr("")
-            x === "google_pay" || x === "googlepay"
-          })
+        let fetchSessionTokens = mountedIframeRef => {
+          let handleSessionTokensLoaded = (event: Types.event) => {
+            let json = event.data->Identity.anyTypeToJson
+            let dict = json->getDictFromJson
+            let sessionTokensData = dict->Utils.getString("data", "") === "session_tokens"
+            if sessionTokensData {
+              let json = dict->Utils.getJsonFromDict("response", JSON.Encode.null)
 
-          (json, applePayPresent, googlePayPresent)->resolve
-        })
-        ->then(res => {
-          let (json, applePayPresent, googlePayPresent) = res
-          if componentType === "payment" && applePayPresent->Option.isSome {
-            //do operations here
-            let processPayment = (token: JSON.t) => {
-              //let body = PaymentBody.applePayBody(~token)
-              let msg = [("applePayProcessPayment", token)]->Dict.fromArray
-              mountedIframeRef->Window.iframePostMessage(msg)
-            }
+              {
+                let sessionsArr =
+                  json
+                  ->JSON.Decode.object
+                  ->Belt.Option.getWithDefault(Dict.make())
+                  ->SessionsType.getSessionsTokenJson("session_token")
+
+                let applePayPresent = sessionsArr->Array.find(item => {
+                  let x =
+                    item
+                    ->JSON.Decode.object
+                    ->Belt.Option.flatMap(x => {
+                      x->Dict.get("wallet_name")
+                    })
+                    ->Belt.Option.flatMap(JSON.Decode.string)
+                    ->Belt.Option.getWithDefault("")
+                  x === "apple_pay" || x === "applepay"
+                })
+                if !(applePayPresent->Belt.Option.isSome) {
+                  let msg =
+                    [("applePaySessionObjNotPresent", true->JSON.Encode.bool)]->Dict.fromArray
+                  mountedIframeRef->Window.iframePostMessage(msg)
+                }
+                let googlePayPresent = sessionsArr->Array.find(item => {
+                  let x =
+                    item
+                    ->JSON.Decode.object
+                    ->Belt.Option.flatMap(x => {
+                      x->Dict.get("wallet_name")
+                    })
+                    ->Belt.Option.flatMap(JSON.Decode.string)
+                    ->Belt.Option.getWithDefault("")
+                  x === "google_pay" || x === "googlepay"
+                })
 
-            handleApplePayMessages :=
-              (
-                (event: Types.event) => {
-                  let json = event.data->anyTypeToJson
-                  let dict = json->getDictFromJson
-                  switch dict->Dict.get("applePayButtonClicked") {
-                  | Some(val) =>
-                    if val->JSON.Decode.bool->Option.getOr(false) {
-                      let isDelayedSessionToken =
-                        applePayPresent
-                        ->Option.flatMap(JSON.Decode.object)
-                        ->Option.getOr(Dict.make())
-                        ->Dict.get("delayed_session_token")
-                        ->Option.getOr(JSON.Encode.null)
-                        ->JSON.Decode.bool
-                        ->Option.getOr(false)
-
-                      if isDelayedSessionToken {
-                        logger.setLogInfo(
-                          ~value="Delayed Session Token Flow",
-                          ~eventName=APPLE_PAY_FLOW,
-                          ~paymentMethod="APPLE_PAY",
-                          (),
-                        )
+                (json, applePayPresent, googlePayPresent)->resolve
+              }
+              ->then(res => {
+                let (json, applePayPresent, googlePayPresent) = res
+                if componentType === "payment" && applePayPresent->Belt.Option.isSome {
+                  //do operations here
+                  let processPayment = (token: JSON.t) => {
+                    //let body = PaymentBody.applePayBody(~token)
+                    let msg = [("applePayProcessPayment", token)]->Dict.fromArray
+                    mountedIframeRef->Window.iframePostMessage(msg)
+                  }
 
-                        let applePayPresent =
-                          dict
-                          ->Dict.get("applePayPresent")
-                          ->Option.flatMap(JSON.Decode.object)
-                          ->Option.getOr(Dict.make())
-
-                        let connector =
-                          applePayPresent
-                          ->Dict.get("connector")
-                          ->Option.getOr(JSON.Encode.null)
-                          ->JSON.Decode.string
-                          ->Option.getOr("")
-
-                        switch connector {
-                        | "trustpay" =>
-                          logger.setLogInfo(
-                            ~value="TrustPay Connector Flow",
-                            ~eventName=APPLE_PAY_FLOW,
-                            ~paymentMethod="APPLE_PAY",
-                            (),
-                          )
-                          let secrets =
-                            applePayPresent
-                            ->Dict.get("session_token_data")
-                            ->Option.getOr(JSON.Encode.null)
-                            ->JSON.Decode.object
-                            ->Option.getOr(Dict.make())
-                            ->Dict.get("secrets")
-                            ->Option.getOr(JSON.Encode.null)
-
-                          let paymentRequest =
-                            applePayPresent
-                            ->Dict.get("payment_request_data")
-                            ->Option.flatMap(JSON.Decode.object)
-                            ->Option.getOr(Dict.make())
-                            ->jsonToPaymentRequestDataType
-
-                          let payment =
-                            secrets
-                            ->JSON.Decode.object
-                            ->Option.getOr(Dict.make())
-                            ->Dict.get("payment")
-                            ->Option.getOr(JSON.Encode.null)
-                            ->JSON.Decode.string
-                            ->Option.getOr("")
-
-                          try {
-                            let trustpay = trustPayApi(secrets)
-                            trustpay.finishApplePaymentV2(payment, paymentRequest)
-                            ->then(res => {
-                              logger.setLogInfo(
-                                ~value="TrustPay ApplePay Success Response",
-                                ~internalMetadata=res->JSON.stringify,
-                                ~eventName=APPLE_PAY_FLOW,
-                                ~paymentMethod="APPLE_PAY",
-                                (),
-                              )
-                              let msg =
-                                [("applePaySyncPayment", true->JSON.Encode.bool)]->Dict.fromArray
-                              mountedIframeRef->Window.iframePostMessage(msg)
-                              resolve()
-                            })
-                            ->catch(err => {
-                              let exceptionMessage = err->formatException->JSON.stringify
-                              logger.setLogInfo(
-                                ~eventName=APPLE_PAY_FLOW,
-                                ~paymentMethod="APPLE_PAY",
-                                ~value=exceptionMessage,
-                                (),
-                              )
-                              let msg =
-                                [("applePaySyncPayment", true->JSON.Encode.bool)]->Dict.fromArray
-                              mountedIframeRef->Window.iframePostMessage(msg)
-                              resolve()
-                            })
-                            ->ignore
-                          } catch {
-                          | exn => {
+                  handleApplePayMessages :=
+                    (
+                      (event: Types.event) => {
+                        let json = event.data->Identity.anyTypeToJson
+                        let dict = json->getDictFromJson
+                        switch dict->Dict.get("applePayButtonClicked") {
+                        | Some(val) =>
+                          if val->JSON.Decode.bool->Belt.Option.getWithDefault(false) {
+                            let isDelayedSessionToken =
+                              applePayPresent
+                              ->Belt.Option.flatMap(JSON.Decode.object)
+                              ->Belt.Option.getWithDefault(Dict.make())
+                              ->Dict.get("delayed_session_token")
+                              ->Belt.Option.getWithDefault(JSON.Encode.null)
+                              ->JSON.Decode.bool
+                              ->Belt.Option.getWithDefault(false)
+
+                            if isDelayedSessionToken {
                               logger.setLogInfo(
-                                ~value=exn->formatException->JSON.stringify,
+                                ~value="Delayed Session Token Flow",
                                 ~eventName=APPLE_PAY_FLOW,
                                 ~paymentMethod="APPLE_PAY",
                                 (),
                               )
-                              let msg =
-                                [("applePaySyncPayment", true->JSON.Encode.bool)]->Dict.fromArray
-                              mountedIframeRef->Window.iframePostMessage(msg)
+
+                              let applePayPresent =
+                                dict
+                                ->Dict.get("applePayPresent")
+                                ->Belt.Option.flatMap(JSON.Decode.object)
+                                ->Belt.Option.getWithDefault(Dict.make())
+
+                              let connector =
+                                applePayPresent
+                                ->Dict.get("connector")
+                                ->Belt.Option.getWithDefault(JSON.Encode.null)
+                                ->JSON.Decode.string
+                                ->Belt.Option.getWithDefault("")
+
+                              switch connector {
+                              | "trustpay" =>
+                                logger.setLogInfo(
+                                  ~value="TrustPay Connector Flow",
+                                  ~eventName=APPLE_PAY_FLOW,
+                                  ~paymentMethod="APPLE_PAY",
+                                  (),
+                                )
+                                let secrets =
+                                  applePayPresent
+                                  ->Dict.get("session_token_data")
+                                  ->Belt.Option.getWithDefault(JSON.Encode.null)
+                                  ->JSON.Decode.object
+                                  ->Belt.Option.getWithDefault(Dict.make())
+                                  ->Dict.get("secrets")
+                                  ->Belt.Option.getWithDefault(JSON.Encode.null)
+
+                                let paymentRequest =
+                                  applePayPresent
+                                  ->Dict.get("payment_request_data")
+                                  ->Belt.Option.flatMap(JSON.Decode.object)
+                                  ->Belt.Option.getWithDefault(Dict.make())
+                                  ->ApplePayTypes.jsonToPaymentRequestDataType
+
+                                let payment =
+                                  secrets
+                                  ->JSON.Decode.object
+                                  ->Belt.Option.getWithDefault(Dict.make())
+                                  ->Dict.get("payment")
+                                  ->Belt.Option.getWithDefault(JSON.Encode.null)
+                                  ->JSON.Decode.string
+                                  ->Belt.Option.getWithDefault("")
+
+                                try {
+                                  let trustpay = trustPayApi(secrets)
+                                  trustpay.finishApplePaymentV2(payment, paymentRequest)
+                                  ->then(res => {
+                                    logger.setLogInfo(
+                                      ~value="TrustPay ApplePay Success Response",
+                                      ~internalMetadata=res->JSON.stringify,
+                                      ~eventName=APPLE_PAY_FLOW,
+                                      ~paymentMethod="APPLE_PAY",
+                                      (),
+                                    )
+                                    let msg =
+                                      [
+                                        ("applePaySyncPayment", true->JSON.Encode.bool),
+                                      ]->Dict.fromArray
+                                    mountedIframeRef->Window.iframePostMessage(msg)
+                                    logger.setLogInfo(
+                                      ~value="",
+                                      ~eventName=PAYMENT_DATA_FILLED,
+                                      ~paymentMethod="APPLE_PAY",
+                                      (),
+                                    )
+                                    resolve()
+                                  })
+                                  ->catch(err => {
+                                    let exceptionMessage =
+                                      err->Utils.formatException->JSON.stringify
+                                    logger.setLogInfo(
+                                      ~eventName=APPLE_PAY_FLOW,
+                                      ~paymentMethod="APPLE_PAY",
+                                      ~value=exceptionMessage,
+                                      (),
+                                    )
+                                    let msg =
+                                      [
+                                        ("applePaySyncPayment", true->JSON.Encode.bool),
+                                      ]->Dict.fromArray
+                                    mountedIframeRef->Window.iframePostMessage(msg)
+                                    resolve()
+                                  })
+                                  ->ignore
+                                } catch {
+                                | exn => {
+                                    logger.setLogInfo(
+                                      ~value=exn->Utils.formatException->JSON.stringify,
+                                      ~eventName=APPLE_PAY_FLOW,
+                                      ~paymentMethod="APPLE_PAY",
+                                      (),
+                                    )
+                                    let msg =
+                                      [
+                                        ("applePaySyncPayment", true->JSON.Encode.bool),
+                                      ]->Dict.fromArray
+                                    mountedIframeRef->Window.iframePostMessage(msg)
+                                  }
+                                }
+                              | _ => ()
+                              }
+                            } else {
+                              let paymentRequest =
+                                applePayPresent
+                                ->Belt.Option.flatMap(JSON.Decode.object)
+                                ->Belt.Option.getWithDefault(Dict.make())
+                                ->Dict.get("payment_request_data")
+                                ->Belt.Option.getWithDefault(Dict.make()->JSON.Encode.object)
+                                ->Utils.transformKeys(Utils.CamelCase)
+
+                              let ssn = applePaySession(3, paymentRequest)
+                              switch applePaySessionRef.contents->Nullable.toOption {
+                              | Some(session) =>
+                                try {
+                                  session.abort()
+                                } catch {
+                                | error => Console.log2("Abort fail", error)
+                                }
+                              | None => ()
+                              }
+
+                              ssn.begin()
+                              applePaySessionRef := ssn->Js.Nullable.return
+
+                              ssn.onvalidatemerchant = _event => {
+                                let merchantSession =
+                                  applePayPresent
+                                  ->Belt.Option.flatMap(JSON.Decode.object)
+                                  ->Belt.Option.getWithDefault(Dict.make())
+                                  ->Dict.get("session_token_data")
+                                  ->Belt.Option.getWithDefault(Dict.make()->JSON.Encode.object)
+                                  ->Utils.transformKeys(Utils.CamelCase)
+                                ssn.completeMerchantValidation(merchantSession)
+                              }
+
+                              ssn.onpaymentauthorized = event => {
+                                ssn.completePayment(
+                                  {"status": ssn.\"STATUS_SUCCESS"}->Identity.anyTypeToJson,
+                                )
+                                applePaySessionRef := Nullable.null
+                                processPayment(event.payment.token)
+                              }
+                              ssn.oncancel = _ev => {
+                                let msg =
+                                  [("showApplePayButton", true->JSON.Encode.bool)]->Dict.fromArray
+                                mountedIframeRef->Window.iframePostMessage(msg)
+                                applePaySessionRef := Nullable.null
+                                Utils.logInfo(Console.log("Apple Pay payment cancelled"))
+                              }
                             }
+                          } else {
+                            ()
                           }
-                        | _ => ()
+                        | None => ()
                         }
-                      } else {
-                        try {
-                          let paymentRequest =
-                            applePayPresent
-                            ->Option.flatMap(JSON.Decode.object)
-                            ->Option.getOr(Dict.make())
-                            ->Dict.get("payment_request_data")
-                            ->Option.getOr(Dict.make()->JSON.Encode.object)
-                            ->transformKeys(CamelCase)
-
-                          let ssn = applePaySession(3, paymentRequest)
-                          switch applePaySessionRef.contents->Nullable.toOption {
-                          | Some(session) =>
-                            try {
-                              session.abort()
-                            } catch {
-                            | error => Console.log2("Abort fail", error)
-                            }
-                          | None => ()
-                          }
+                      }
+                    )
 
-                          applePaySessionRef := ssn->Nullable.make
+                  addSmartEventListener(
+                    "message",
+                    handleApplePayMessages.contents,
+                    "onApplePayMessages",
+                  )
+                }
+                if componentType === "payment" && googlePayPresent->Belt.Option.isSome {
+                  let dict = json->getDictFromJson
+                  let sessionObj = SessionsType.itemToObjMapper(dict, Others)
+                  let gPayToken = SessionsType.getPaymentSessionObj(sessionObj.sessionsToken, Gpay)
 
-                          ssn.onvalidatemerchant = _event => {
-                            let merchantSession =
-                              applePayPresent
-                              ->Option.flatMap(JSON.Decode.object)
-                              ->Option.getOr(Dict.make())
-                              ->Dict.get("session_token_data")
-                              ->Option.getOr(Dict.make()->JSON.Encode.object)
-                              ->transformKeys(CamelCase)
-                            ssn.completeMerchantValidation(merchantSession)
-                          }
+                  let tokenObj = switch gPayToken {
+                  | OtherTokenOptional(optToken) => optToken
+                  | _ => Some(SessionsType.defaultToken)
+                  }
 
-                          ssn.onpaymentauthorized = event => {
-                            ssn.completePayment({"status": ssn.\"STATUS_SUCCESS"}->anyTypeToJson)
-                            applePaySessionRef := Nullable.null
-                            processPayment(event.payment.token)
-                          }
-                          ssn.oncancel = _ev => {
-                            let msg =
-                              [("showApplePayButton", true->JSON.Encode.bool)]->Dict.fromArray
-                            mountedIframeRef->Window.iframePostMessage(msg)
-                            applePaySessionRef := Nullable.null
-                            logInfo(Console.log("Apple Pay payment cancelled"))
-                          }
+                  let gpayobj = switch tokenObj {
+                  | Some(val) => val
+                  | _ => SessionsType.defaultToken
+                  }
 
-                          ssn.begin()
-                        } catch {
-                        | exn => {
-                            logger.setLogInfo(
-                              ~value=exn->formatException->JSON.stringify,
-                              ~eventName=APPLE_PAY_FLOW,
-                              ~paymentMethod="APPLE_PAY",
-                              (),
-                            )
-                            logInfo(Console.error2("Apple Pay Error", exn))
-
-                            let msg =
-                              [("showApplePayButton", true->JSON.Encode.bool)]->Dict.fromArray
-                            mountedIframeRef->Window.iframePostMessage(msg)
-                            applePaySessionRef := Nullable.null
-                          }
-                        }
-                      }
-                    } else {
-                      ()
-                    }
-                  | None => ()
+                  let baseRequest = {
+                    "apiVersion": 2,
+                    "apiVersionMinor": 0,
                   }
-                }
-              )
+                  let paymentDataRequest = GooglePayType.assign2(
+                    Dict.make()->JSON.Encode.object,
+                    baseRequest->Identity.anyTypeToJson,
+                  )
 
-            addSmartEventListener("message", handleApplePayMessages.contents, "onApplePayMessages")
-          }
-          if componentType === "payment" && googlePayPresent->Option.isSome {
-            let dict = json->getDictFromJson
-            let sessionObj = SessionsType.itemToObjMapper(dict, Others)
-            let gPayToken = SessionsType.getPaymentSessionObj(sessionObj.sessionsToken, Gpay)
+                  let payRequest = GooglePayType.assign(
+                    Dict.make()->JSON.Encode.object,
+                    baseRequest->Identity.anyTypeToJson,
+                    {
+                      "allowedPaymentMethods": gpayobj.allowed_payment_methods->arrayJsonToCamelCase,
+                    }->Identity.anyTypeToJson,
+                  )
+                  paymentDataRequest.allowedPaymentMethods =
+                    gpayobj.allowed_payment_methods->arrayJsonToCamelCase
+                  paymentDataRequest.transactionInfo =
+                    gpayobj.transaction_info->transformKeys(CamelCase)
+                  paymentDataRequest.merchantInfo = gpayobj.merchant_info->transformKeys(CamelCase)
+                  try {
+                    let gPayClient = GooglePayType.google(
+                      {
+                        "environment": publishableKey->String.startsWith("pk_prd_")
+                          ? "PRODUCTION"
+                          : "TEST",
+                      }->Identity.anyTypeToJson,
+                    )
 
-            let tokenObj = switch gPayToken {
-            | OtherTokenOptional(optToken) => optToken
-            | _ => Some(SessionsType.defaultToken)
-            }
+                    gPayClient.isReadyToPay(payRequest)
+                    ->then(res => {
+                      let dict = res->getDictFromJson
+                      let isReadyToPay = getBool(dict, "result", false)
+                      let msg = [("isReadyToPay", isReadyToPay->JSON.Encode.bool)]->Dict.fromArray
+                      mountedIframeRef->Window.iframePostMessage(msg)
+                      resolve()
+                    })
+                    ->catch(err => {
+                      logger.setLogInfo(
+                        ~value=err->Identity.anyTypeToJson->JSON.stringify,
+                        ~eventName=GOOGLE_PAY_FLOW,
+                        ~paymentMethod="GOOGLE_PAY",
+                        ~logType=DEBUG,
+                        (),
+                      )
+                      resolve()
+                    })
+                    ->ignore
 
-            let gpayobj = switch tokenObj {
-            | Some(val) => val
-            | _ => SessionsType.defaultToken
-            }
+                    let handleGooglePayMessages = (event: Types.event) => {
+                      let evJson = event.data->anyTypeToJson
+                      let gpayClicked =
+                        evJson
+                        ->getOptionalJsonFromJson("GpayClicked")
+                        ->getBoolFromJson(false)
+
+                      if gpayClicked {
+                        setTimeout(() => {
+                          gPayClient.loadPaymentData(paymentDataRequest->anyTypeToJson)
+                          ->then(
+                            json => {
+                              let msg = [("gpayResponse", json->anyTypeToJson)]->Dict.fromArray
+                              mountedIframeRef->Window.iframePostMessage(msg)
+                              resolve()
+                            },
+                          )
+                          ->catch(
+                            err => {
+                              logger.setLogInfo(
+                                ~value=err->anyTypeToJson->JSON.stringify,
+                                ~eventName=GOOGLE_PAY_FLOW,
+                                ~paymentMethod="GOOGLE_PAY",
+                                ~logType=DEBUG,
+                                (),
+                              )
 
-            let baseRequest = {
-              "apiVersion": 2,
-              "apiVersionMinor": 0,
-            }
-            let paymentDataRequest = GooglePayType.assign2(
-              Dict.make()->JSON.Encode.object,
-              baseRequest->anyTypeToJson,
-            )
-
-            let payRequest = GooglePayType.assign(
-              Dict.make()->JSON.Encode.object,
-              baseRequest->anyTypeToJson,
-              {
-                "allowedPaymentMethods": gpayobj.allowed_payment_methods->arrayJsonToCamelCase,
-              }->anyTypeToJson,
-            )
-            paymentDataRequest.allowedPaymentMethods =
-              gpayobj.allowed_payment_methods->arrayJsonToCamelCase
-            paymentDataRequest.transactionInfo = gpayobj.transaction_info->transformKeys(CamelCase)
-            paymentDataRequest.merchantInfo = gpayobj.merchant_info->transformKeys(CamelCase)
-            try {
-              let gPayClient = GooglePayType.google(
-                {
-                  "environment": publishableKey->String.startsWith("pk_prd_")
-                    ? "PRODUCTION"
-                    : "TEST",
-                }->anyTypeToJson,
-              )
+                              let msg = [("gpayError", err->anyTypeToJson)]->Dict.fromArray
+                              mountedIframeRef->Window.iframePostMessage(msg)
+                              resolve()
+                            },
+                          )
+                          ->ignore
+                        }, 0)->ignore
+                      }
+                    }
+                    addSmartEventListener("message", handleGooglePayMessages, "onGooglePayMessages")
+                  } catch {
+                  | _ => Console.log("Error loading Gpay")
+                  }
+                }
 
-              gPayClient.isReadyToPay(payRequest)
-              ->then(res => {
-                let dict = res->getDictFromJson
-                let isReadyToPay = getBool(dict, "result", false)
-                let msg = [("isReadyToPay", isReadyToPay->JSON.Encode.bool)]->Dict.fromArray
-                mountedIframeRef->Window.iframePostMessage(msg)
-                resolve()
+                json->resolve
               })
-              ->catch(err => {
-                logger.setLogInfo(
-                  ~value=err->anyTypeToJson->JSON.stringify,
-                  ~eventName=GOOGLE_PAY_FLOW,
-                  ~paymentMethod="GOOGLE_PAY",
-                  ~logType=DEBUG,
-                  (),
-                )
-                resolve()
+              ->then(json => {
+                let msg = [("sessions", json)]->Dict.fromArray
+                mountedIframeRef->Window.iframePostMessage(msg)
+                json->resolve
               })
               ->ignore
-
-              let handleGooglePayMessages = (event: Types.event) => {
-                let evJson = event.data->anyTypeToJson
-                let gpayClicked =
-                  evJson
-                  ->getOptionalJsonFromJson("GpayClicked")
-                  ->getBoolFromJson(false)
-
-                if gpayClicked {
-                  setTimeout(() => {
-                    gPayClient.loadPaymentData(paymentDataRequest->anyTypeToJson)
-                    ->then(
-                      json => {
-                        let msg = [("gpayResponse", json->anyTypeToJson)]->Dict.fromArray
-                        mountedIframeRef->Window.iframePostMessage(msg)
-                        resolve()
-                      },
-                    )
-                    ->catch(
-                      err => {
-                        logger.setLogInfo(
-                          ~value=err->anyTypeToJson->JSON.stringify,
-                          ~eventName=GOOGLE_PAY_FLOW,
-                          ~paymentMethod="GOOGLE_PAY",
-                          ~logType=DEBUG,
-                          (),
-                        )
-
-                        let msg = [("gpayError", err->anyTypeToJson)]->Dict.fromArray
-                        mountedIframeRef->Window.iframePostMessage(msg)
-                        resolve()
-                      },
-                    )
-                    ->ignore
-                  }, 0)->ignore
-                }
-              }
-              addSmartEventListener("message", handleGooglePayMessages, "onGooglePayMessages")
-            } catch {
-            | _ => Console.log("Error loading Gpay")
             }
           }
-
-          json->resolve
-        })
-        ->then(json => {
-          let msg = [("sessions", json)]->Dict.fromArray
-          mountedIframeRef->Window.iframePostMessage(msg)
-          json->resolve
+          let msg = [("sendSessionTokensResponse", true->JSON.Encode.bool)]->Dict.fromArray
+          addSmartEventListener("message", handleSessionTokensLoaded, "onSessionTokensLoaded")
+          preMountLoaderIframeDiv->Window.iframePostMessage(msg)
+        }
+        preMountLoaderMountedPromise
+        ->then(_ => {
+          fetchPaymentsList(mountedIframeRef)
+          if (
+            newOptions
+            ->getDictFromJson
+            ->getBool("displaySavedPaymentMethods", true)
+          ) {
+            fetchCustomerPaymentMethods(mountedIframeRef, false)
+          }
+          fetchSessionTokens(mountedIframeRef)
+          mountedIframeRef->Window.iframePostMessage(message)
+          resolve()
         })
         ->ignore
-        if (
-          newOptions
-          ->getDictFromJson
-          ->getBool("displaySavedPaymentMethods", true)
-        ) {
-          fetchCustomerDetails(mountedIframeRef)
-        }
-        fetchPaymentsList(mountedIframeRef)
-        mountedIframeRef->Window.iframePostMessage(message)
       }
 
       let paymentElement = LoaderPaymentElement.make(
diff --git a/src/orca-loader/Hyper.res b/src/orca-loader/Hyper.res
index fd8239ea0..47c3f108e 100644
--- a/src/orca-loader/Hyper.res
+++ b/src/orca-loader/Hyper.res
@@ -85,7 +85,8 @@ let make = (publishableKey, options: option<JSON.t>, analyticsInfo: option<JSON.
     }
     let analyticsInfoDict =
       analyticsInfo->Option.flatMap(JSON.Decode.object)->Option.getOr(Dict.make())
-    let sessionID = analyticsInfoDict->getString("sessionID", "")
+    let sessionID =
+      analyticsInfoDict->getString("sessionID", "hyp_" ++ Utils.generateRandomString(8))
     let sdkTimestamp = analyticsInfoDict->getString("timeStamp", Date.now()->Belt.Float.toString)
     let logger = OrcaLogger.make(
       ~sessionId=sessionID,
diff --git a/src/orca-loader/PaymentSessionMethods.res b/src/orca-loader/PaymentSessionMethods.res
index 8e5ab84a0..bdf2693ac 100644
--- a/src/orca-loader/PaymentSessionMethods.res
+++ b/src/orca-loader/PaymentSessionMethods.res
@@ -8,7 +8,7 @@ let getCustomerSavedPaymentMethods = (
   ~switchToCustomPod,
 ) => {
   open Promise
-  PaymentHelpers.fetchCustomerDetails(
+  PaymentHelpers.fetchCustomerPaymentMethodList(
     ~clientSecret,
     ~publishableKey,
     ~endpoint,
diff --git a/src/orca-loader/Types.res b/src/orca-loader/Types.res
index 7800863c2..af364c201 100644
--- a/src/orca-loader/Types.res
+++ b/src/orca-loader/Types.res
@@ -177,8 +177,8 @@ type rec ele = {
   mutable target: string,
   mutable enctype: string,
   mutable value: string,
-  submit: (. unit) => unit,
-  appendChild: (. ele) => unit,
+  submit: unit => unit,
+  appendChild: ele => unit,
 }
 @scope("document") @val external createElement: string => ele = "createElement"
 
diff --git a/src/orca-log-catcher/OrcaLogger.res b/src/orca-log-catcher/OrcaLogger.res
index 6517c1b09..c42ca30c2 100644
--- a/src/orca-log-catcher/OrcaLogger.res
+++ b/src/orca-log-catcher/OrcaLogger.res
@@ -14,8 +14,6 @@ type eventName =
   | RETRIEVE_CALL
   | AUTHENTICATION_CALL_INIT
   | AUTHENTICATION_CALL
-  | THREE_DS_METHOD_CALL_INIT
-  | THREE_DS_METHOD_CALL
   | CONFIRM_CALL_INIT
   | CONFIRM_CALL
   | SESSIONS_CALL_INIT
@@ -79,8 +77,6 @@ let eventNameToStrMapper = eventName => {
   | RETRIEVE_CALL => "RETRIEVE_CALL"
   | AUTHENTICATION_CALL_INIT => "AUTHENTICATION_CALL_INIT"
   | AUTHENTICATION_CALL => "AUTHENTICATION_CALL"
-  | THREE_DS_METHOD_CALL_INIT => "THREE_DS_METHOD_CALL_INIT"
-  | THREE_DS_METHOD_CALL => "THREE_DS_METHOD_CALL"
   | CONFIRM_CALL_INIT => "CONFIRM_CALL_INIT"
   | CONFIRM_CALL => "CONFIRM_CALL"
   | SESSIONS_CALL_INIT => "SESSIONS_CALL_INIT"
@@ -499,7 +495,7 @@ let make = (
       PAYMENT_ATTEMPT,
       CONFIRM_CALL,
       AUTHENTICATION_CALL,
-      THREE_DS_METHOD_CALL,
+      THREE_DS_METHOD_RESULT,
       SDK_CRASH,
       REDIRECTING_USER,
       DISPLAY_BANK_TRANSFER_INFO_PAGE,
@@ -508,6 +504,7 @@ let make = (
       LOADER_CHANGED,
       SESSIONS_CALL,
       RETRIEVE_CALL,
+      DISPLAY_THREE_DS_SDK,
     ]
     arrayOfLogs
     ->Array.find(log => {
@@ -542,7 +539,6 @@ let make = (
         }
       }
     | AUTHENTICATION_CALL
-    | THREE_DS_METHOD_CALL
     | RETRIEVE_CALL
     | CONFIRM_CALL
     | SESSIONS_CALL
diff --git a/webpack.common.js b/webpack.common.js
index c6602f654..c8fc54102 100644
--- a/webpack.common.js
+++ b/webpack.common.js
@@ -5,21 +5,20 @@ const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const CopyPlugin = require("copy-webpack-plugin");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 const TerserPlugin = require("terser-webpack-plugin");
-const BundleAnalyzerPlugin =
-  require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
+const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
 const { sentryWebpackPlugin } = require("@sentry/webpack-plugin");
 
 const sdkEnv = process.env.sdkEnv;
 const envSdkUrl = process.env.envSdkUrl;
 const envBackendUrl = process.env.envBackendUrl;
+const envLoggingUrl = process.env.envLoggingUrl;
 
 //git rev-parse --abbrev-ref HEAD
 let repoVersion = require("./package.json").version;
 let majorVersion = "v" + repoVersion.split(".")[0];
 
 let repoName = require("./package.json").name;
-let repoPublicPath =
-  sdkEnv === "local" ? "" : `/${repoVersion}/${majorVersion}`;
+let repoPublicPath = sdkEnv === "local" ? "" : `/${repoVersion}/${majorVersion}`;
 
 let sdkUrl;
 
@@ -40,12 +39,12 @@ let backendEndPoint;
 if (envBackendUrl === undefined) {
   backendEndPoint =
     sdkEnv === "prod"
-      ? "https://api.hyperswitch.io"
+      ? "https://checkout.hyperswitch.io/api"
       : sdkEnv === "sandbox"
-      ? "https://sandbox.hyperswitch.io"
+      ? "https://beta.hyperswitch.io/api"
       : sdkEnv === "integ"
       ? "https://integ-api.hyperswitch.io"
-      : "https://sandbox.hyperswitch.io";
+      : "https://beta.hyperswitch.io/api";
 } else {
   backendEndPoint = envBackendUrl;
 }
@@ -54,20 +53,25 @@ let confirmEndPoint;
 if (envBackendUrl === undefined) {
   confirmEndPoint =
     sdkEnv === "prod"
-      ? "https://api.hyperswitch.io"
+      ? "https://checkout.hyperswitch.io/api"
       : sdkEnv === "sandbox"
-      ? "https://sandbox.hyperswitch.io"
+      ? "https://beta.hyperswitch.io/api"
       : sdkEnv === "integ"
       ? "https://integ-api.hyperswitch.io"
-      : "https://sandbox.hyperswitch.io";
+      : "https://beta.hyperswitch.io/api";
 } else {
   confirmEndPoint = envBackendUrl;
 }
 
-let logEndpoint =
-  sdkEnv === "prod"
-    ? "https://api.hyperswitch.io/logs/sdk"
-    : "https://sandbox.hyperswitch.io/logs/sdk";
+let logEndpoint;
+if (envLoggingUrl === undefined) {
+  logEndpoint =
+    sdkEnv === "prod"
+      ? "https://api.hyperswitch.io/logs/sdk"
+      : "https://sandbox.hyperswitch.io/logs/sdk";
+} else {
+  logEndpoint = envLoggingUrl;
+}
 
 // Set this to true to enable logging
 let enableLogging = true;
diff --git a/webpack.dev.js b/webpack.dev.js
index 8801754f3..89044d741 100644
--- a/webpack.dev.js
+++ b/webpack.dev.js
@@ -6,20 +6,21 @@ const sdkEnv = process.env.sdkEnv;
 
 let backendEndPoint =
   sdkEnv === "prod"
-    ? "https://api.hyperswitch.io/payments"
+    ? "https://checkout.hyperswitch.io/api/payments"
     : sdkEnv === "sandbox"
-    ? "https://sandbox.hyperswitch.io/payments"
+    ? "https://beta.hyperswitch.io/api/payments"
     : sdkEnv === "integ"
     ? "https://integ-api.hyperswitch.io/payments"
-    : "https://sandbox.hyperswitch.io/payments";
+    : "https://beta.hyperswitch.io/api/payments";
 
 let devServer = {
   contentBase: path.join(__dirname, "dist"),
   hot: true,
+  host: "0.0.0.0",
   port: 9050,
   historyApiFallback: true,
   proxy: {
-    "/payments": {
+    "/api/payments": {
       target: backendEndPoint,
       changeOrigin: true,
       secure: true,