From 2c3c404869a322c0417c076fc25ffa1b533a08d6 Mon Sep 17 00:00:00 2001
From: Dale du Preez <dale@automattic.com>
Date: Tue, 18 Nov 2025 22:20:27 +0200
Subject: [PATCH] Use memoization for payment method checks

---
 .../index.js                                  | 36 +++++++++++++++++++
 client/utils/use-payment-method-currencies.js |  5 ++-
 .../use-payment-method-unavailable-reason.js  | 14 ++++----
 3 files changed, 48 insertions(+), 7 deletions(-)
 create mode 100644 client/components/payment-method-unavailable-tax-config-pill/index.js

diff --git a/client/components/payment-method-unavailable-tax-config-pill/index.js b/client/components/payment-method-unavailable-tax-config-pill/index.js
new file mode 100644
index 0000000000..66d3ee22f7
--- /dev/null
+++ b/client/components/payment-method-unavailable-tax-config-pill/index.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import { __, sprintf } from '@wordpress/i18n';
+import PaymentMethodUnavailablePill from 'wcstripe/components/payment-method-unavailable-pill';
+import usePaymentMethodUnavailableReason from 'utils/use-payment-method-unavailable-reason';
+import { PAYMENT_METHOD_UNAVAILABLE_REASONS } from 'wcstripe/stripe-utils/constants';
+
+const PaymentMethodUnavailableTaxConfigPill = ( { id, label } ) => {
+	const unavailableReason = usePaymentMethodUnavailableReason( id );
+
+	if (
+		unavailableReason !==
+		PAYMENT_METHOD_UNAVAILABLE_REASONS.UNSUPPORTED_TAX_CONFIGURATION
+	) {
+		return null;
+	}
+
+	return (
+		<PaymentMethodUnavailablePill
+			title={ __(
+				'Unsupported tax configuration',
+				'woocommerce-gateway-stripe'
+			) }
+		>
+			{ sprintf(
+				/* translators: $1: a payment method name */
+				__(
+					"%1$s is unavailable due to your store's tax configuration.",
+					'woocommerce-gateway-stripe'
+				),
+				label
+			) }
+		</PaymentMethodUnavailablePill>
+	);
+};
+
+export default PaymentMethodUnavailableTaxConfigPill;
diff --git a/client/utils/use-payment-method-currencies.js b/client/utils/use-payment-method-currencies.js
index 87f77b0686..1fbe7661b6 100644
--- a/client/utils/use-payment-method-currencies.js
+++ b/client/utils/use-payment-method-currencies.js
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import UpeToggleContext from '../settings/upe-toggle/context';
 import PaymentMethodsMap from '../payment-methods-map';
 import { useContext } from '@wordpress/element';
@@ -273,7 +274,9 @@ export const getPaymentMethodCurrencies = ( paymentMethodId, isUpeEnabled ) => {
 export const usePaymentMethodCurrencies = ( paymentMethodId ) => {
 	const { isUpeEnabled } = useContext( UpeToggleContext );
 
-	return getPaymentMethodCurrencies( paymentMethodId, isUpeEnabled );
+	return useMemo( () => {
+		return getPaymentMethodCurrencies( paymentMethodId, isUpeEnabled );
+	}, [ paymentMethodId, isUpeEnabled ] );
 };
 
 export default usePaymentMethodCurrencies;
diff --git a/client/utils/use-payment-method-unavailable-reason.js b/client/utils/use-payment-method-unavailable-reason.js
index c68338d1b4..79799b1dce 100644
--- a/client/utils/use-payment-method-unavailable-reason.js
+++ b/client/utils/use-payment-method-unavailable-reason.js
@@ -1,5 +1,5 @@
 import { getSetting } from '@woocommerce/settings';
-import { useContext } from 'react';
+import { useContext, useMemo } from 'react';
 import UpeToggleContext from 'wcstripe/settings/upe-toggle/context';
 import getPaymentMethodUnavailableReason from 'utils/get-payment-method-unavailable-reason';
 
@@ -14,11 +14,13 @@ const usePaymentMethodUnavailableReason = ( paymentMethodId ) => {
 
 	const storeCurrencyCode = getSetting( 'currency' )?.code;
 
-	return getPaymentMethodUnavailableReason( {
-		paymentMethodId,
-		isUpeEnabled,
-		storeCurrencyCode,
-	} );
+	return useMemo( () => {
+		return getPaymentMethodUnavailableReason( {
+			paymentMethodId,
+			isUpeEnabled,
+			storeCurrencyCode,
+		} );
+	}, [ paymentMethodId, isUpeEnabled, storeCurrencyCode ] );
 };
 
 export default usePaymentMethodUnavailableReason;