Google Pay temp basket (#1222)

Adyen · Dec 4, 2024 · 7a9f75c · 7a9f75c
1 parent ea8ecbc
commit 7a9f75c
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 13 deletions.
diff --git a/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/commons/index.js b/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/commons/index.js
@@ -1,6 +1,6 @@
 const $ = require('jquery');
 const store = require('../../../../store');
-const { PAYPAL, APPLE_PAY, AMAZON_PAY } = require('../constants');
+const { PAYPAL, APPLE_PAY, AMAZON_PAY, GOOGLE_PAY } = require('../constants');
 
 module.exports.onFieldValid = function onFieldValid(data) {
   if (data.endDigits) {
@@ -65,6 +65,7 @@ module.exports.checkIfExpressMethodsAreReady =
       [APPLE_PAY]: window.isApplePayExpressEnabled === 'true',
       [AMAZON_PAY]: window.isAmazonPayExpressEnabled === 'true',
       [PAYPAL]: window.isPayPalExpressEnabled === 'true',
+      [GOOGLE_PAY]: window.isGooglePayExpressEnabled === 'true',
     };
     let enabledExpressMethods = [];
     Object.keys(expressMethodsConfig).forEach((key) => {

diff --git a/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/constants.js b/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/constants.js
@@ -14,6 +14,11 @@ module.exports = {
   PAYPAL: 'paypal',
   AMAZON_PAY: 'amazonpay',
   GOOGLE_PAY: 'googlepay',
+  GOOGLE_PAY_CALLBACK_TRIGGERS: {
+    INITIALIZE: 'INITIALIZE',
+    SHIPPING_ADDRESS: 'SHIPPING_ADDRESS',
+    SHIPPING_OPTION: 'SHIPPING_OPTION',
+  },
   ACTIONTYPE: {
     QRCODE: 'qrCode',
   },

diff --git a/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/googlePayExpress.js b/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/googlePayExpress.js
@@ -2,20 +2,15 @@ const helpers = require('./adyen_checkout/helpers');
 const {
   checkIfExpressMethodsAreReady,
   updateLoadedExpressMethods,
+  createTemporaryBasket,
 } = require('./commons');
-const { GOOGLE_PAY } = require('./constants');
+const { GOOGLE_PAY, GOOGLE_PAY_CALLBACK_TRIGGERS } = require('./constants');
 
 let checkout;
 let googlePayButton;
 let shippingMethodsData;
 let temporaryBasketId;
 
-const CALLBACK_TRIGGERS = {
-  INITIALIZE: 'INITIALIZE',
-  SHIPPING_ADDRESS: 'SHIPPING_ADDRESS',
-  SHIPPING_OPTION: 'SHIPPING_OPTION',
-};
-
 function formatCustomerObject(customerData) {
   const shippingData = customerData.shippingAddress;
   const billingData = customerData.paymentMethodData.info.billingAddress;
@@ -162,13 +157,15 @@ function handleAuthorised(response) {
     amount: response.fullResponse?.amount,
   });
   document.querySelector('#showConfirmationForm').submit();
+  $.spinner().stop();
 }
 
 function handleError() {
   document.querySelector('#result').value = JSON.stringify({
     error: true,
   });
   document.querySelector('#showConfirmationForm').submit();
+  $.spinner().stop();
 }
 
 function handleGooglePayResponse(response) {
@@ -180,6 +177,7 @@ function handleGooglePayResponse(response) {
 }
 
 function paymentFromComponent(data) {
+  $.spinner().start();
   $.ajax({
     url: window.paymentFromComponentURL,
     type: 'post',
@@ -199,7 +197,7 @@ function paymentFromComponent(data) {
       );
       handleGooglePayResponse(response);
     },
-  });
+  }).fail(() => $.spinner().stop());
 }
 
 async function initializeCheckout(paymentMethodsResponse) {
@@ -260,6 +258,15 @@ async function onShippingOptionChange(
   return false;
 }
 
+async function onInitTrigger() {
+  if (window.isExpressPdp) {
+    const tempBasketResponse = await createTemporaryBasket();
+    if (tempBasketResponse?.basketId) {
+      temporaryBasketId = tempBasketResponse.basketId;
+    }
+  }
+}
+
 async function init(paymentMethodsResponse) {
   initializeCheckout(paymentMethodsResponse)
     .then(async () => {
@@ -300,7 +307,11 @@ async function init(paymentMethodsResponse) {
             paymentType: 'express',
           };
           const customer = formatCustomerObject(data);
-          paymentFromComponent({ ...stateData, customer });
+          paymentFromComponent({
+            ...stateData,
+            customer,
+            basketId: temporaryBasketId,
+          });
         },
         onSubmit: async () => {},
         paymentDataCallbacks: {
@@ -312,17 +323,26 @@ async function init(paymentMethodsResponse) {
             let onShippingAddressChangeStatus = true;
             let onShippingOptionChangeStatus = true;
 
+            if (callbackTrigger === GOOGLE_PAY_CALLBACK_TRIGGERS.INITIALIZE) {
+              await onInitTrigger();
+              onShippingAddressChangeStatus = await onShippingAddressChange(
+                shippingAddress,
+                paymentDataRequestUpdate,
+              );
+            }
+
             if (
-              callbackTrigger === CALLBACK_TRIGGERS.INITIALIZE ||
-              callbackTrigger === CALLBACK_TRIGGERS.SHIPPING_ADDRESS
+              callbackTrigger === GOOGLE_PAY_CALLBACK_TRIGGERS.SHIPPING_ADDRESS
             ) {
               onShippingAddressChangeStatus = await onShippingAddressChange(
                 shippingAddress,
                 paymentDataRequestUpdate,
               );
             }
 
-            if (callbackTrigger === CALLBACK_TRIGGERS.SHIPPING_OPTION) {
+            if (
+              callbackTrigger === GOOGLE_PAY_CALLBACK_TRIGGERS.SHIPPING_OPTION
+            ) {
               onShippingOptionChangeStatus = await onShippingOptionChange(
                 shippingOptionData,
                 paymentDataRequestUpdate,