Merge pull request #3053 from woocommerce/PCP-4134-replace-link-for-f…

…ees-step-1-footer Replace link for fees in Step 1, footer (4134)
woocommerce · Feb 5, 2025 · 4c8bd6c · 4c8bd6c
2 parents a164f56 + aa17a05
commit 4c8bd6c
Show file tree

Hide file tree

Showing 9 changed files with 86 additions and 69 deletions.
diff --git a/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss b/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss
@@ -54,8 +54,4 @@
 			}
 		}
 	}
-
-	.ppcp-r-page-welcome-mode-separator {
-		margin: 8px 0 24px 0 !important;
-	}
 }
diff --git a/modules/ppcp-settings/resources/css/components/screens/_onboarding.scss b/modules/ppcp-settings/resources/css/components/screens/_onboarding.scss
@@ -13,4 +13,8 @@
 	.ppcp-r-inner-container {
 		max-width: var(--max-width-onboarding-content);
 	}
+
+	.ppcp-r-payment-method--separator {
+		margin: 8px 0 24px 0;
+	}
 }
diff --git a/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss b/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss
@@ -68,6 +68,7 @@
 	@media screen and (max-width: 480px) {
 		flex-wrap: wrap;
 		row-gap: 8px;
+
 		&__col {
 			width: 100%;
 			text-align: center;
@@ -77,7 +78,7 @@
 				border-right: 0;
 				padding-right: 0;
 				padding-bottom: 8px;
-				margin: 0px;
+				margin: 0;
 			}
 		}
 	}

diff --git a/...pcp-settings/resources/js/Components/Screens/Onboarding/Components/PaymentMethodsGroup.js b/...pcp-settings/resources/js/Components/Screens/Onboarding/Components/PaymentMethodsGroup.js
@@ -22,7 +22,7 @@ const PaymentMethodItem = ( { Component, learnMore, showSeparator } ) => {
 		<>
 			<Component learnMore={ learnMore } />
 			{ showSeparator && (
-				<Separator className="ppcp-r-page-welcome-mode-separator" />
+				<Separator className="ppcp-r-payment-method--separator" />
 			) }
 		</>
 	);

diff --git a/.../ReusableComponents/PricingDescription.js → ...boarding/Components/PricingDescription.js b/.../ReusableComponents/PricingDescription.js → ...boarding/Components/PricingDescription.js
@@ -1,7 +1,8 @@
 import { __, sprintf } from '@wordpress/i18n';
 
-import { countryPriceInfo } from '../../utils/countryPriceInfo';
-import { CommonHooks } from '../../data';
+import { countryPriceInfo } from '../../../../utils/countryPriceInfo';
+import { learnMoreLinks } from '../../../../utils/countryInfoLinks';
+import { CommonHooks } from '../../../../data';
 
 const PricingDescription = () => {
 	const { storeCountry } = CommonHooks.useWooSettings();
@@ -11,8 +12,7 @@ const PricingDescription = () => {
 	}
 
 	const lastDate = 'October 25th, 2024'; // TODO -- needs to be the last plugin update date.
-	const detailsUrl =
-		'https://woocommerce.com/document/woocommerce-paypal-payments/#manual-credential-input';
+	const countryLinks = learnMoreLinks[ storeCountry ] || learnMoreLinks.US;
 
 	const label = sprintf(
 		// translators: %1$s: Pricing date, %2$s Link to PayPal price-details page.
@@ -21,7 +21,7 @@ const PricingDescription = () => {
 			'woocommerce-paypal-payments'
 		),
 		lastDate,
-		detailsUrl
+		countryLinks.PaymentDetails
 	);
 
 	return (

diff --git a/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/Components/WelcomeDocs.js b/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/Components/WelcomeDocs.js
@@ -1,6 +1,6 @@
 import { __ } from '@wordpress/i18n';
 
-import PricingDescription from '../../../ReusableComponents/PricingDescription';
+import PricingDescription from './PricingDescription';
 import PaymentFlow from './PaymentFlow';
 
 const WelcomeDocs = ( { useAcdc, isFastlane, isPayLater, storeCountry } ) => {

diff --git a/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/Steps/StepPaymentMethods.js b/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/Steps/StepPaymentMethods.js
@@ -2,7 +2,7 @@ import { __ } from '@wordpress/i18n';
 
 import { CommonHooks, OnboardingHooks } from '../../../../data';
 import { OptionSelector } from '../../../ReusableComponents/Fields';
-import PricingDescription from '../../../ReusableComponents/PricingDescription';
+import PricingDescription from '../Components/PricingDescription';
 import OnboardingHeader from '../Components/OnboardingHeader';
 import PaymentFlow from '../Components/PaymentFlow';
 

diff --git a/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/hooks/usePaymentConfig.js b/modules/ppcp-settings/resources/js/Components/Screens/Onboarding/hooks/usePaymentConfig.js
@@ -1,5 +1,7 @@
 import { __ } from '@wordpress/i18n';
+import { useMemo } from '@wordpress/element';
 
+import { learnMoreLinks } from '../../../../utils/countryInfoLinks';
 import {
 	PayWithPayPal,
 	PayLater,
@@ -12,7 +14,6 @@ import {
 	Fastlane,
 	CreditDebitCards,
 } from '../Components/PaymentOptions';
-import { useMemo } from '@wordpress/element';
 
 // Default configuration, used for all countries, unless they override individual attributes below.
 const defaultConfig = {
@@ -35,61 +36,6 @@ const defaultConfig = {
 	),
 };
 
-const learnMoreLinks = {
-	US: {
-		PayPalCheckout:
-			'https://www.paypal.com/us/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/us/business/accept-payments/checkout/installments',
-		Venmo: 'https://www.paypal.com/us/enterprise/payment-processing/accept-venmo',
-		Crypto: 'https://www.paypal.com/us/digital-wallet/manage-money/crypto',
-		OptionalMethods:
-			'https://www.paypal.com/us/business/accept-payments/checkout/integration#expanded-checkout',
-		Fastlane:
-			'https://www.paypal.com/us/enterprise/payment-processing/guest-checkout',
-	},
-	CA: {
-		PayPalCheckout:
-			'https://www.paypal.com/ca/business/accept-payments/checkout',
-	},
-	GB: {
-		PayPalCheckout:
-			'https://www.paypal.com/uk/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/uk/business/accept-payments/checkout/installments',
-	},
-	FR: {
-		PayPalCheckout:
-			'https://www.paypal.com/fr/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/fr/business/accept-payments/checkout/installments',
-	},
-	ES: {
-		PayPalCheckout:
-			'https://www.paypal.com/es/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/es/business/accept-payments/checkout/installments',
-	},
-	IT: {
-		PayPalCheckout:
-			'https://www.paypal.com/it/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/it/business/accept-payments/checkout/installments',
-	},
-	DE: {
-		PayPalCheckout:
-			'https://www.paypal.com/de/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/de/business/accept-payments/checkout/installments',
-	},
-	AU: {
-		PayPalCheckout:
-			'https://www.paypal.com/au/business/accept-payments/checkout',
-		PayLater:
-			'https://www.paypal.com/au/business/accept-payments/checkout/installments',
-	},
-};
-
 const countrySpecificConfigs = {
 	US: {
 		includedMethods: [

diff --git a/modules/ppcp-settings/resources/js/utils/countryInfoLinks.js b/modules/ppcp-settings/resources/js/utils/countryInfoLinks.js
@@ -0,0 +1,70 @@
+export const learnMoreLinks = {
+	US: {
+		PaymentDetails:
+			'https://www.paypal.com/us/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/us/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/us/business/accept-payments/checkout/installments',
+		Venmo: 'https://www.paypal.com/us/enterprise/payment-processing/accept-venmo',
+		Crypto: 'https://www.paypal.com/us/digital-wallet/manage-money/crypto',
+		OptionalMethods:
+			'https://www.paypal.com/us/business/accept-payments/checkout/integration#expanded-checkout',
+		Fastlane:
+			'https://www.paypal.com/us/enterprise/payment-processing/guest-checkout',
+	},
+	CA: {
+		PaymentDetails:
+			'https://www.paypal.com/ca/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/ca/business/accept-payments/checkout',
+	},
+	GB: {
+		PaymentDetails:
+			'https://www.paypal.com/uk/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/uk/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/uk/business/accept-payments/checkout/installments',
+	},
+	FR: {
+		PaymentDetails:
+			'https://www.paypal.com/fr/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/fr/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/fr/business/accept-payments/checkout/installments',
+	},
+	ES: {
+		PaymentDetails:
+			'https://www.paypal.com/es/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/es/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/es/business/accept-payments/checkout/installments',
+	},
+	IT: {
+		PaymentDetails:
+			'https://www.paypal.com/it/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/it/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/it/business/accept-payments/checkout/installments',
+	},
+	DE: {
+		PaymentDetails:
+			'https://www.paypal.com/de/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/de/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/de/business/accept-payments/checkout/installments',
+	},
+	AU: {
+		PaymentDetails:
+			'https://www.paypal.com/au/business/paypal-business-fees',
+		PayPalCheckout:
+			'https://www.paypal.com/au/business/accept-payments/checkout',
+		PayLater:
+			'https://www.paypal.com/au/business/accept-payments/checkout/installments',
+	},
+};
-Original file line number
+Diff line change
@@ Expand Up / @@ -54,8 +54,4 @@ @@
     			}
     		}
     	}
-    	.ppcp-r-page-welcome-mode-separator {
-    		margin: 8px 0 24px 0 !important;
-    	}
     }