From 7a9f75c154fa190466793b1f2132648a32796405 Mon Sep 17 00:00:00 2001 From: Aleksandar Mihajlovski Date: Wed, 4 Dec 2024 11:22:15 +0100 Subject: [PATCH] Google Pay temp basket (#1222) --- .../client/default/js/commons/index.js | 3 +- .../cartridge/client/default/js/constants.js | 5 +++ .../client/default/js/googlePayExpress.js | 44 ++++++++++++++----- 3 files changed, 39 insertions(+), 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 index 04564bf7b..fc31c0905 100644 --- 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 index 7b8c3d327..4bc8c8b10 100644 --- 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 index e54fdd088..0ffaebf72 100644 --- 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,6 +157,7 @@ function handleAuthorised(response) { amount: response.fullResponse?.amount, }); document.querySelector('#showConfirmationForm').submit(); + $.spinner().stop(); } function handleError() { @@ -169,6 +165,7 @@ function handleError() { 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,9 +323,16 @@ 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, @@ -322,7 +340,9 @@ async function init(paymentMethodsResponse) { ); } - if (callbackTrigger === CALLBACK_TRIGGERS.SHIPPING_OPTION) { + if ( + callbackTrigger === GOOGLE_PAY_CALLBACK_TRIGGERS.SHIPPING_OPTION + ) { onShippingOptionChangeStatus = await onShippingOptionChange( shippingOptionData, paymentDataRequestUpdate,