diff --git a/src/DonationForms/resources/registrars/templates/fields/Gateways.tsx b/src/DonationForms/resources/registrars/templates/fields/Gateways.tsx
index 8c4bd460f2..f8ef1da5f5 100644
--- a/src/DonationForms/resources/registrars/templates/fields/Gateways.tsx
+++ b/src/DonationForms/resources/registrars/templates/fields/Gateways.tsx
@@ -6,24 +6,50 @@ import {createInterpolateElement, useEffect, useMemo} from '@wordpress/element';
import cx from 'classnames';
/**
- * @since 3.0.0
+ * @unreleased
*/
-function GatewayMissingMessage({currencyNotSupported}: {currencyNotSupported?: boolean}) {
+function EmptyMessage({message}: {message: string}) {
return (
-
- {currencyNotSupported
- ? __(
- 'The selected currency is not supported by any of the available payment gateways. Please select a different currency or contact the site administrator for assistance.',
- 'give'
- )
- : __(
- 'No gateways have been enabled yet. To get started accepting donations, enable a compatible payment gateway in your settings.',
- 'give'
- )}
-
+
+
+ {__('Payment options are not available:', 'give')}
+
+
+
+ {message}
+
+
);
}
+/**
+ * @unreleased updated message to account for minimum donation amount
+ * @since 3.0.0
+ */
+function GatewayMissingMessage({
+ donationAmountMinimumNotReached,
+ currencyNotSupported,
+}: {
+ donationAmountMinimumNotReached?: boolean;
+ currencyNotSupported?: boolean;
+}) {
+ let message = __(
+ 'No gateways have been enabled yet. To get started accepting donations, enable a compatible payment gateway in your settings.',
+ 'give'
+ );
+
+ if (donationAmountMinimumNotReached) {
+ message = __('Donation amount must be greater than zero.', 'give');
+ } else if (currencyNotSupported) {
+ message = __(
+ 'The selected currency is not supported by any of the available payment gateways. Please select a different currency or contact the site administrator for assistance.',
+ 'give'
+ );
+ }
+
+ return ;
+}
+
/**
* @since 3.0.0
*/
@@ -82,11 +108,14 @@ export default function Gateways({isTestMode, defaultValue, inputProps, gateways
const {setValue} = useFormContext();
const {currencySwitcherSettings} = useDonationFormSettings();
+ const donationAmount = useWatch({name: 'amount'});
const currency = useWatch({name: 'currency'});
const activeGatewayId = useWatch({name: 'gatewayId'});
+ const donationAmountMinimumNotReached = donationAmount === 0;
+
// filter gateway options if currency switcher settings are present
- const gatewayOptions = useMemo(() => {
+ const gatewayOptionsWithCurrencySettings = useMemo(() => {
if (currencySwitcherSettings.length <= 1) {
return gateways;
}
@@ -100,6 +129,10 @@ export default function Gateways({isTestMode, defaultValue, inputProps, gateways
return gateways.filter(({id}) => currencySwitcherSetting.gateways.includes(id));
}, [currency]);
+ const gatewayOptions = useMemo(() => {
+ return donationAmountMinimumNotReached ? [] : gatewayOptionsWithCurrencySettings;
+ }, [donationAmountMinimumNotReached, gatewayOptionsWithCurrencySettings]);
+
// reset the default /selected gateway based on the gateway options available
useEffect(() => {
if (gatewayOptions.length > 0) {
@@ -129,7 +162,10 @@ export default function Gateways({isTestMode, defaultValue, inputProps, gateways
>
) : (
- 1} />
+ 1}
+ />
)}