From b85a16abda79b2db715f8ac0b78e43e6a261f9b1 Mon Sep 17 00:00:00 2001
From: Philipp Stracker <p.stracker@syde.com>
Date: Tue, 6 Aug 2024 15:59:54 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Move=20button=20event=20di?=
 =?UTF-8?q?spatcher=20to=20helper=20file?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ContextBootstrap/CheckoutBootstap.js      | 13 +++--
 .../js/modules/Helper/PaymentButtonHelpers.js | 48 +++++++++++++++++++
 2 files changed, 57 insertions(+), 4 deletions(-)
 create mode 100644 modules/ppcp-button/resources/js/modules/Helper/PaymentButtonHelpers.js

diff --git a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js
index 7a016fd9e..d679a7f21 100644
--- a/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js
+++ b/modules/ppcp-button/resources/js/modules/ContextBootstrap/CheckoutBootstap.js
@@ -7,6 +7,10 @@ import {
 	PaymentMethods,
 } from '../Helper/CheckoutMethodState';
 import BootstrapHelper from '../Helper/BootstrapHelper';
+import {
+	ButtonEvents,
+	dispatchButtonEvent,
+} from '../Helper/PaymentButtonHelpers';
 
 class CheckoutBootstap {
 	constructor( gateway, renderer, spinner, errorHandler ) {
@@ -180,7 +184,7 @@ class CheckoutBootstap {
 		 * Custom JS event to notify other modules that the payment button on the checkout page
 		 * has become irrelevant or invalid.
 		 */
-		document.body.dispatchEvent( new Event( 'ppcp_invalidate_methods' ) );
+		dispatchButtonEvent( { event: ButtonEvents.INVALIDATE } );
 	}
 
 	updateUi() {
@@ -247,9 +251,10 @@ class CheckoutBootstap {
 		 * Dynamic part of the event name is the payment method ID, for example
 		 * "ppcp-credit-card-gateway" or "ppcp-googlepay"
 		 */
-		document.body.dispatchEvent(
-			new Event( `ppcp_render_method-${ currentPaymentMethod }` )
-		);
+		dispatchButtonEvent( {
+			event: ButtonEvents.RENDER,
+			paymentMethod: currentPaymentMethod,
+		} );
 
 		document.body.dispatchEvent( new Event( 'ppcp_checkout_rendered' ) );
 	}
diff --git a/modules/ppcp-button/resources/js/modules/Helper/PaymentButtonHelpers.js b/modules/ppcp-button/resources/js/modules/Helper/PaymentButtonHelpers.js
new file mode 100644
index 000000000..19ecfc001
--- /dev/null
+++ b/modules/ppcp-button/resources/js/modules/Helper/PaymentButtonHelpers.js
@@ -0,0 +1,48 @@
+/**
+ * Helper function used by PaymentButton instances.
+ *
+ * @file
+ */
+
+/**
+ * Collection of recognized event names for payment button events.
+ *
+ * @type {Object}
+ */
+export const ButtonEvents = Object.freeze( {
+	INVALIDATE: 'ppcp_invalidate_methods',
+	RENDER: 'ppcp_render_method',
+	REDRAW: 'ppcp_redraw_method',
+} );
+
+/**
+ * Verifies if the given event name is a valid Payment Button event.
+ *
+ * @param {string} event - The event name to verify.
+ * @return {boolean} True, if the event name is valid.
+ */
+export function isValidButtonEvent( event ) {
+	const buttonEventValues = Object.values( ButtonEvents );
+
+	return buttonEventValues.includes( event );
+}
+
+/**
+ * Dispatches a payment button event.
+ *
+ * @param {Object} options                 - The options for dispatching the event.
+ * @param {string} options.event           - Event to dispatch.
+ * @param {string} [options.paymentMethod] - Optional. Name of payment method, to target a specific button only.
+ * @throws {Error} Throws an error if the event is invalid.
+ */
+export function dispatchButtonEvent( { event, paymentMethod = '' } ) {
+	if ( ! isValidButtonEvent( event ) ) {
+		throw new Error( `Invalid event: ${ event }` );
+	}
+
+	const fullEventName = paymentMethod
+		? `${ event }-${ paymentMethod }`
+		: event;
+
+	document.body.dispatchEvent( new Event( fullEventName ) );
+}