From 7106413f8747521ecf79a2ad681411e3baa53fdd Mon Sep 17 00:00:00 2001
From: Philipp Stracker <p.stracker@syde.com>
Date: Thu, 8 Aug 2024 21:01:22 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Refresh=20total=20price=20when?=
 =?UTF-8?q?=20checkout=20form=20changes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Applies the selected shipping costs to the Google Payment button
---
 .../resources/js/GooglepayButton.js           | 29 ++++++++++++++++---
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/modules/ppcp-googlepay/resources/js/GooglepayButton.js b/modules/ppcp-googlepay/resources/js/GooglepayButton.js
index 65803d800..9061a917d 100644
--- a/modules/ppcp-googlepay/resources/js/GooglepayButton.js
+++ b/modules/ppcp-googlepay/resources/js/GooglepayButton.js
@@ -128,6 +128,7 @@ class GooglepayButton extends PaymentButton {
 			contextHandler
 		);
 
+		this.init = this.init.bind( this );
 		this.onPaymentAuthorized = this.onPaymentAuthorized.bind( this );
 		this.onPaymentDataChanged = this.onPaymentDataChanged.bind( this );
 		this.onButtonClick = this.onButtonClick.bind( this );
@@ -207,6 +208,17 @@ class GooglepayButton extends PaymentButton {
 		return this.#transactionInfo;
 	}
 
+	/**
+	 * Assign the new transaction details to the payment button.
+	 *
+	 * @param {TransactionInfo} newTransactionInfo - Transaction details.
+	 */
+	set transactionInfo( newTransactionInfo ) {
+		this.#transactionInfo = newTransactionInfo;
+
+		this.refresh();
+	}
+
 	/**
 	 * Configures the button instance. Must be called before the initial `init()`.
 	 *
@@ -257,14 +269,23 @@ class GooglepayButton extends PaymentButton {
 				this.isEligible = !! response.result;
 			} )
 			.catch( ( err ) => {
-				console.error( err );
+				this.error( err );
 				this.isEligible = false;
 			} );
 	}
 
 	reinit() {
 		super.reinit();
-		this.init();
+
+		if ( this.contextHandler?.transactionInfo ) {
+			// If possible, fetch the current transaction details from the checkout form.
+			this.contextHandler.transactionInfo().then( ( transactionInfo ) => {
+				this.transactionInfo = transactionInfo;
+				this.init();
+			} );
+		} else {
+			this.init();
+		}
 	}
 
 	/**
@@ -320,7 +341,7 @@ class GooglepayButton extends PaymentButton {
 	 * correct wrapper.
 	 */
 	addButton() {
-		if ( ! this.isInitialized || ! this.paymentsClient ) {
+		if ( ! this.paymentsClient ) {
 			return;
 		}
 
@@ -466,7 +487,7 @@ class GooglepayButton extends PaymentButton {
 
 				resolve( paymentDataRequestUpdate );
 			} catch ( error ) {
-				console.error( 'Error during onPaymentDataChanged:', error );
+				this.error( 'Error during onPaymentDataChanged:', error );
 				reject( error );
 			}
 		} );