From 30bd5f13fbfad0f4984b26e6fff2d6574f93ba32 Mon Sep 17 00:00:00 2001
From: Darren Ethier <darren@roughsmootheng.in>
Date: Sun, 15 Dec 2019 17:07:02 -0500
Subject: [PATCH] add payment method hooks

---
 assets/js/base/hooks/index.js                 |  1 +
 .../base/hooks/payment-methods/constants.js   |  8 ++++
 assets/js/base/hooks/payment-methods/index.js |  2 +
 .../use-active-payment-method.js              | 28 ++++++++++++++
 .../payment-methods/use-payment-events.js     | 38 +++++++++++++++++++
 5 files changed, 77 insertions(+)
 create mode 100644 assets/js/base/hooks/payment-methods/constants.js
 create mode 100644 assets/js/base/hooks/payment-methods/index.js
 create mode 100644 assets/js/base/hooks/payment-methods/use-active-payment-method.js
 create mode 100644 assets/js/base/hooks/payment-methods/use-payment-events.js

diff --git a/assets/js/base/hooks/index.js b/assets/js/base/hooks/index.js
index 013716c9cbf..3cd18b51450 100644
--- a/assets/js/base/hooks/index.js
+++ b/assets/js/base/hooks/index.js
@@ -6,3 +6,4 @@ export * from './use-collection-header';
 export * from './use-collection-data';
 export * from './use-previous';
 export * from './checkout';
+export * from './payment-methods';
diff --git a/assets/js/base/hooks/payment-methods/constants.js b/assets/js/base/hooks/payment-methods/constants.js
new file mode 100644
index 00000000000..f943f737332
--- /dev/null
+++ b/assets/js/base/hooks/payment-methods/constants.js
@@ -0,0 +1,8 @@
+export const STATUS = {
+	PRISTINE: 'pristine',
+	STARTED: 'started',
+	FINISHED: 'finished',
+	ERROR: 'has_error',
+	FAILED: 'failed',
+	SUCCESS: 'success',
+};
diff --git a/assets/js/base/hooks/payment-methods/index.js b/assets/js/base/hooks/payment-methods/index.js
new file mode 100644
index 00000000000..48e39068860
--- /dev/null
+++ b/assets/js/base/hooks/payment-methods/index.js
@@ -0,0 +1,2 @@
+export { default as useActivePaymentMethod } from './use-active-payment-method';
+export { default as usePaymentEvents } from './use-payment-events';
diff --git a/assets/js/base/hooks/payment-methods/use-active-payment-method.js b/assets/js/base/hooks/payment-methods/use-active-payment-method.js
new file mode 100644
index 00000000000..56461e9ccd4
--- /dev/null
+++ b/assets/js/base/hooks/payment-methods/use-active-payment-method.js
@@ -0,0 +1,28 @@
+/**
+ * External dependencies
+ */
+import { useCheckoutContext } from '@woocommerce/base-context/checkout-context';
+import { useEffect } from '@wordpress/element';
+import { getPaymentMethods } from '@woocommerce/blocks-registry';
+
+const useActivePaymentMethod = () => {
+	const {
+		activePaymentMethod,
+		setActivePaymentMethod,
+	} = useCheckoutContext();
+	// if payment method has not been set yet, let's set it.
+	useEffect( () => {
+		if ( ! activePaymentMethod && activePaymentMethod !== null ) {
+			const paymentMethods = getPaymentMethods();
+			const paymentMethodNames = Object.keys( paymentMethods );
+			setActivePaymentMethod(
+				paymentMethodNames.length > 0
+					? paymentMethods[ paymentMethodNames[ 0 ] ].name
+					: null
+			);
+		}
+	}, [ activePaymentMethod, setActivePaymentMethod ] );
+	return { activePaymentMethod, setActivePaymentMethod };
+};
+
+export default useActivePaymentMethod;
diff --git a/assets/js/base/hooks/payment-methods/use-payment-events.js b/assets/js/base/hooks/payment-methods/use-payment-events.js
new file mode 100644
index 00000000000..ef5b7201434
--- /dev/null
+++ b/assets/js/base/hooks/payment-methods/use-payment-events.js
@@ -0,0 +1,38 @@
+/**
+ * External dependencies
+ */
+import { useState, useMemo } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import { STATUS } from './constants';
+
+const usePaymentEvents = () => {
+	const { paymentStatus, setPaymentStatus } = useState( STATUS.PRISTINE );
+	const dispatch = useMemo(
+		() => ( {
+			pristine: () => setPaymentStatus( STATUS.PRISTINE ),
+			started: () => setPaymentStatus( STATUS.STARTED ),
+			finished: () => setPaymentStatus( STATUS.FINISHED ),
+			error: () => setPaymentStatus( STATUS.ERROR ),
+			failed: () => setPaymentStatus( STATUS.FAILED ),
+			success: () => setPaymentStatus( STATUS.SUCCESS ),
+		} ),
+		[ setPaymentStatus ]
+	);
+	const select = useMemo(
+		() => ( {
+			isPristine: () => paymentStatus === STATUS.PRISTINE,
+			isStarted: () => paymentStatus === STATUS.STARTED,
+			isFinished: () => paymentStatus === STATUS.FINISHED,
+			hasError: () => paymentStatus === STATUS.ERROR,
+			hasFailed: () => paymentStatus === STATUS.FAILED,
+			isSuccessful: () => paymentStatus === STATUS.SUCCESS,
+		} ),
+		[ paymentStatus ]
+	);
+	return { dispatch, select };
+};
+
+export default usePaymentEvents;