Merge pull request #2892 from woocommerce/PCP-4000-hide-the-price-not…

…ice-when-no-badges-are-visible Hide the price notice when no badges are visible (4000)
woocommerce · Dec 11, 2024 · eaac7c0 · eaac7c0
2 parents 4d2c9fc + a0d6106
commit eaac7c0
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 31 deletions.
diff --git a/modules/ppcp-settings/resources/js/Components/ReusableComponents/WelcomeDocs/WelcomeDocs.js b/modules/ppcp-settings/resources/js/Components/ReusableComponents/WelcomeDocs/WelcomeDocs.js
@@ -1,7 +1,8 @@
-import { __, sprintf } from '@wordpress/i18n';
+import { __ } from '@wordpress/i18n';
 import AcdcFlow from './AcdcFlow';
 import BcdcFlow from './BcdcFlow';
-import { Button } from '@wordpress/components';
+import { countryPriceInfo } from '../../../utils/countryPriceInfo';
+import { pricesBasedDescription } from './pricesBasedDescription';
 
 const WelcomeDocs = ( {
 	useAcdc,
@@ -10,15 +11,6 @@ const WelcomeDocs = ( {
 	storeCountry,
 	storeCurrency,
 } ) => {
-	const pricesBasedDescription = sprintf(
-		// translators: %s: Link to PayPal REST application guide
-		__(
-			'<sup>1</sup>Prices based on domestic transactions as of October 25th, 2024. <a target="_blank" href="%s">Click here</a> for full pricing details.',
-			'woocommerce-paypal-payments'
-		),
-		'https://woocommerce.com/document/woocommerce-paypal-payments/#manual-credential-input '
-	);
-
 	return (
 		<div className="ppcp-r-welcome-docs">
 			<h2 className="ppcp-r-welcome-docs__title">
@@ -41,10 +33,14 @@ const WelcomeDocs = ( {
 					storeCurrency={ storeCurrency }
 				/>
 			) }
-			<p
-				className="ppcp-r-optional-payment-methods__description"
-				dangerouslySetInnerHTML={ { __html: pricesBasedDescription } }
-			></p>
+			{ storeCountry in countryPriceInfo && (
+				<p
+					className="ppcp-r-optional-payment-methods__description"
+					dangerouslySetInnerHTML={ {
+						__html: pricesBasedDescription,
+					} }
+				></p>
+			) }
 		</div>
 	);
 };

diff --git a/...settings/resources/js/Components/ReusableComponents/WelcomeDocs/pricesBasedDescription.js b/...settings/resources/js/Components/ReusableComponents/WelcomeDocs/pricesBasedDescription.js
@@ -0,0 +1,10 @@
+import { __, sprintf } from '@wordpress/i18n';
+
+export const pricesBasedDescription = sprintf(
+	// translators: %s: Link to PayPal REST application guide
+	__(
+		'<sup>1</sup>Prices based on domestic transactions as of October 25th, 2024. <a target="_blank" href="%s">Click here</a> for full pricing details.',
+		'woocommerce-paypal-payments'
+	),
+	'https://woocommerce.com/document/woocommerce-paypal-payments/#manual-credential-input '
+);
diff --git a/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/StepPaymentMethods.js b/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/StepPaymentMethods.js
@@ -1,10 +1,12 @@
-import { __, sprintf } from '@wordpress/i18n';
+import { __ } from '@wordpress/i18n';
 
 import OnboardingHeader from '../../ReusableComponents/OnboardingHeader';
 import SelectBoxWrapper from '../../ReusableComponents/SelectBoxWrapper';
 import SelectBox from '../../ReusableComponents/SelectBox';
 import { CommonHooks, OnboardingHooks } from '../../../data';
 import OptionalPaymentMethods from '../../ReusableComponents/OptionalPaymentMethods/OptionalPaymentMethods';
+import { pricesBasedDescription } from '../../ReusableComponents/WelcomeDocs/pricesBasedDescription';
+import { countryPriceInfo } from '../../../utils/countryPriceInfo';
 
 const OPM_RADIO_GROUP_NAME = 'optional-payment-methods';
 
@@ -16,15 +18,6 @@ const StepPaymentMethods = ( {} ) => {
 
 	const { storeCountry, storeCurrency } = CommonHooks.useWooSettings();
 
-	const pricesBasedDescription = sprintf(
-		// translators: %s: Link to PayPal REST application guide
-		__(
-			'<sup>1</sup>Prices based on domestic transactions as of October 25th, 2024. <a target="_blank" href="%s">Click here</a> for full pricing details.',
-			'woocommerce-paypal-payments'
-		),
-		'https://woocommerce.com/document/woocommerce-paypal-payments/#manual-credential-input '
-	);
-
 	return (
 		<div className="ppcp-r-page-optional-payment-methods">
 			<OnboardingHeader
@@ -67,12 +60,14 @@ const StepPaymentMethods = ( {} ) => {
 						type="radio"
 					></SelectBox>
 				</SelectBoxWrapper>
-				<p
-					className="ppcp-r-optional-payment-methods__description"
-					dangerouslySetInnerHTML={ {
-						__html: pricesBasedDescription,
-					} }
-				></p>
+				{ storeCountry in countryPriceInfo && (
+					<p
+						className="ppcp-r-optional-payment-methods__description"
+						dangerouslySetInnerHTML={ {
+							__html: pricesBasedDescription,
+						} }
+					></p>
+				) }
 			</div>
 		</div>
 	);