From b6a85f0d1374dea0a186e2f4d0c524b06da52c5b Mon Sep 17 00:00:00 2001 From: Alex P Date: Fri, 16 Jun 2023 11:39:20 +0300 Subject: [PATCH 1/2] Update Pay Later amount on the cart page when cart total changes --- modules/ppcp-button/resources/js/button.js | 1 + .../js/modules/ContextBootstrap/CartBootstap.js | 13 +++++++++++-- .../src/Endpoint/CartScriptParamsEndpoint.php | 7 ++++++- 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/modules/ppcp-button/resources/js/button.js b/modules/ppcp-button/resources/js/button.js index 6708b0275..718378875 100644 --- a/modules/ppcp-button/resources/js/button.js +++ b/modules/ppcp-button/resources/js/button.js @@ -154,6 +154,7 @@ const bootstrap = () => { const cartBootstrap = new CartBootstrap( PayPalCommerceGateway, renderer, + messageRenderer, errorHandler, ); diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js index 72d28932b..6cc9a13af 100644 --- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js +++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CartBootstap.js @@ -2,10 +2,12 @@ import CartActionHandler from '../ActionHandler/CartActionHandler'; import {setVisible} from "../Helper/Hiding"; class CartBootstrap { - constructor(gateway, renderer, errorHandler) { + constructor(gateway, renderer, messages, errorHandler) { this.gateway = gateway; this.renderer = renderer; + this.messages = messages; this.errorHandler = errorHandler; + this.lastAmount = this.gateway.messages.amount; } init() { @@ -31,11 +33,16 @@ class CartBootstrap { return; } - const newParams = result.data; + const newParams = result.data.url_params; const reloadRequired = this.gateway.url_params.intent !== newParams.intent; // TODO: should reload the script instead setVisible(this.gateway.button.wrapper, !reloadRequired) + + if (this.lastAmount !== result.data.amount) { + this.lastAmount = result.data.amount; + this.messages.renderWithAmount(this.lastAmount); + } }); }); } @@ -61,6 +68,8 @@ class CartBootstrap { this.renderer.render( actionHandler.configuration() ); + + this.messages.renderWithAmount(this.lastAmount); } } diff --git a/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php b/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php index ee976cac3..440af66f1 100644 --- a/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php +++ b/modules/ppcp-button/src/Endpoint/CartScriptParamsEndpoint.php @@ -67,7 +67,12 @@ class CartScriptParamsEndpoint implements EndpointInterface { try { $script_data = $this->smart_button->script_data(); - wp_send_json_success( $script_data['url_params'] ); + wp_send_json_success( + array( + 'url_params' => $script_data['url_params'], + 'amount' => WC()->cart->get_total( 'raw' ), + ) + ); return true; } catch ( Throwable $error ) { From 395102ef26e375dceae9b36471d429241ab18125 Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 11 Jul 2023 16:52:46 +0300 Subject: [PATCH 2/2] Update Pay Later amount in checkout when cart total changes --- .../ContextBootstrap/CheckoutBootstap.js | 32 +++++++++++++++++-- .../js/modules/Renderer/MessageRenderer.js | 22 ------------- 2 files changed, 30 insertions(+), 24 deletions(-) diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js index b426ac3ee..db1cba84f 100644 --- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js +++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js @@ -15,6 +15,7 @@ class CheckoutBootstap { this.messages = messages; this.spinner = spinner; this.errorHandler = errorHandler; + this.lastAmount = this.gateway.messages.amount; this.standardOrderButtonSelector = ORDER_BUTTON_SELECTOR; @@ -36,6 +37,27 @@ class CheckoutBootstap { jQuery(document.body).on('updated_checkout', () => { this.render() this.handleButtonStatus(); + + if (this.shouldRenderMessages()) { // currently we need amount only for Pay Later + fetch( + this.gateway.ajax.cart_script_params.endpoint, + { + method: 'GET', + credentials: 'same-origin', + } + ) + .then(result => result.json()) + .then(result => { + if (! result.success) { + return; + } + + if (this.lastAmount !== result.data.amount) { + this.lastAmount = result.data.amount; + this.updateUi(); + } + }); + } }); jQuery(document.body).on('updated_checkout payment_method_selected', () => { @@ -117,8 +139,8 @@ class CheckoutBootstap { setVisible(wrapper, gatewayId === currentPaymentMethod); } - if (isPaypal && !isFreeTrial) { - this.messages.render(); + if (this.shouldRenderMessages()) { + this.messages.renderWithAmount(this.lastAmount); } if (isCard) { @@ -130,6 +152,12 @@ class CheckoutBootstap { } } + shouldRenderMessages() { + return getCurrentPaymentMethod() === PaymentMethods.PAYPAL + && !PayPalCommerceGateway.is_free_trial_cart + && this.messages.shouldRender(); + } + disableCreditCardFields() { jQuery('label[for="ppcp-credit-card-gateway-card-number"]').addClass('ppcp-credit-card-gateway-form-field-disabled') jQuery('#ppcp-credit-card-gateway-card-number').addClass('ppcp-credit-card-gateway-form-field-disabled') diff --git a/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js b/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js index 80c90c0ef..7b1577aad 100644 --- a/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js +++ b/modules/ppcp-button/resources/js/modules/Renderer/MessageRenderer.js @@ -5,28 +5,6 @@ class MessageRenderer { this.optionsFingerprint = null; } - render() { - if (! this.shouldRender()) { - return; - } - - const options = { - amount: this.config.amount, - placement: this.config.placement, - style: this.config.style - }; - - if (this.optionsEqual(options)) { - return; - } - - paypal.Messages(options).render(this.config.wrapper); - - jQuery(document.body).on('updated_cart_totals', () => { - paypal.Messages(options).render(this.config.wrapper); - }); - } - renderWithAmount(amount) { if (! this.shouldRender()) { return;