From 389860c739e13560532ff2515ec38ca08e57f3a9 Mon Sep 17 00:00:00 2001
From: Philipp Stracker <p.stracker@syde.com>
Date: Wed, 11 Sep 2024 16:17:12 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Re-organize=20payment-setu?=
 =?UTF-8?q?p-integration?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Performance update, and preparation for Gary-flow changes
---
 modules/ppcp-axo-block/resources/js/index.js | 39 +++++++++++---------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/modules/ppcp-axo-block/resources/js/index.js b/modules/ppcp-axo-block/resources/js/index.js
index 85a521a6f..4dcbe7419 100644
--- a/modules/ppcp-axo-block/resources/js/index.js
+++ b/modules/ppcp-axo-block/resources/js/index.js
@@ -81,29 +81,22 @@ const Axo = ( props ) => {
 		card,
 	] );
 
-	useEffect( () => {
-		const unsubscribe = onPaymentSetup( async () => {
-			// Validate payment options and emit response.
+	const handlePaymentSetup = useCallback( async () => {
+		const isRyanFlow = !! card?.id;
+		const cardToken = card?.id;
 
-			// Note: This response supports the Ryan flow (payment via saved card-token)
-			return {
-				type: emitResponse.responseTypes.SUCCESS,
-				meta: {
-					paymentMethodData: {
-						axo_nonce: card?.id,
-					},
+		return {
+			type: emitResponse.responseTypes.SUCCESS,
+			meta: {
+				paymentMethodData: {
+					fastlane_member: isRyanFlow,
+					axo_nonce: cardToken,
 				},
-			};
-		} );
-
-		// Unsubscribes when this component is unmounted.
-		return () => {
-			unsubscribe();
+			},
 		};
 	}, [
 		emitResponse.responseTypes.ERROR,
 		emitResponse.responseTypes.SUCCESS,
-		onPaymentSetup,
 		card,
 	] );
 
@@ -117,6 +110,18 @@ const Axo = ( props ) => {
 		setBillingAddress: updateWooBillingAddress,
 	} = useCustomerData();
 
+	/**
+	 * `onPaymentSetup()` fires when we enter the "PROCESSING" state in the checkout flow.
+	 * It pre-processes the payment details and returns data for server-side processing.
+	 */
+	useEffect( () => {
+		const unsubscribe = onPaymentSetup( handlePaymentSetup );
+
+		return () => {
+			unsubscribe();
+		};
+	}, [ onPaymentSetup, handlePaymentSetup ] );
+
 	useEffect( () => {
 		console.log( 'Initializing class toggles' );
 		initializeClassToggles();