♻️ Move country logic into PricingTitleBadge

This commit is contained in:
Philipp Stracker 2024-12-12 17:54:38 +01:00
parent b89164e1ea
commit 5bd3e5f976
No known key found for this signature in database
9 changed files with 27 additions and 146 deletions

View file

@ -8,7 +8,6 @@ const AcdcOptionalPaymentMethods = ( {
isFastlane,
isPayLater,
storeCountry,
storeCurrency,
} ) => {
if ( isFastlane && isPayLater && storeCountry === 'US' ) {
return (
@ -24,13 +23,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-amex.svg',
'icon-button-discover.svg',
] }
textBadge={
<PricingTitleBadge
item="ccf"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="ccf" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -50,13 +43,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-apple-pay.svg',
'icon-button-google-pay.svg',
] }
textBadge={
<PricingTitleBadge
item="dw"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="dw" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -77,13 +64,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-blik.svg',
'icon-button-bancontact.svg',
] }
textBadge={
<PricingTitleBadge
item="apm"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="apm" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -127,13 +108,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-amex.svg',
'icon-button-discover.svg',
] }
textBadge={
<PricingTitleBadge
item="ccf"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="ccf" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -153,13 +128,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-apple-pay.svg',
'icon-button-google-pay.svg',
] }
textBadge={
<PricingTitleBadge
item="dw"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="dw" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -181,13 +150,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-blik.svg',
'icon-button-bancontact.svg',
] }
textBadge={
<PricingTitleBadge
item="apm"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="apm" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -214,13 +177,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-amex.svg',
'icon-button-discover.svg',
] }
textBadge={
<PricingTitleBadge
item="ccf"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="ccf" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -237,13 +194,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-apple-pay.svg',
'icon-button-google-pay.svg',
] }
textBadge={
<PricingTitleBadge
item="dw"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="dw" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(
@ -265,13 +216,7 @@ const AcdcOptionalPaymentMethods = ( {
'icon-button-blik.svg',
'icon-button-bancontact.svg',
] }
textBadge={
<PricingTitleBadge
item="apm"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="apm" /> }
description={ sprintf(
// translators: %s: Link to PayPal business fees guide
__(

View file

@ -3,11 +3,7 @@ import { __, sprintf } from '@wordpress/i18n';
import BadgeBox from '../BadgeBox';
import PricingTitleBadge from '../PricingTitleBadge';
const BcdcOptionalPaymentMethods = ( {
isPayLater,
storeCountry,
storeCurrency,
} ) => {
const BcdcOptionalPaymentMethods = ( { isPayLater, storeCountry } ) => {
if ( isPayLater && storeCountry === 'us' ) {
return (
<div className="ppcp-r-optional-payment-methods__wrapper">
@ -23,11 +19,7 @@ const BcdcOptionalPaymentMethods = ( {
'icon-button-discover.svg',
] }
textBadge={
<PricingTitleBadge
item="standardCardFields"
currency={ storeCurrency }
country={ storeCountry }
/>
<PricingTitleBadge item="standardCardFields" />
}
description={ sprintf(
// translators: %s: Link to PayPal REST application guide
@ -55,13 +47,7 @@ const BcdcOptionalPaymentMethods = ( {
'icon-button-amex.svg',
'icon-button-discover.svg',
] }
textBadge={
<PricingTitleBadge
item="standardCardFields"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="standardCardFields" /> }
description={ sprintf(
// translators: %s: Link to PayPal REST application guide
__(

View file

@ -6,7 +6,6 @@ const OptionalPaymentMethods = ( {
isFastlane,
isPayLater,
storeCountry,
storeCurrency,
} ) => {
return (
<div className="ppcp-r-optional-payment-methods">
@ -15,13 +14,11 @@ const OptionalPaymentMethods = ( {
isFastlane={ isFastlane }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
) : (
<BcdcOptionalPaymentMethods
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
) }
</div>

View file

@ -1,10 +1,12 @@
import { __, sprintf } from '@wordpress/i18n';
import { countryPriceInfo } from '../../utils/countryPriceInfo';
import TitleBadge, { TITLE_BADGE_INFO } from './TitleBadge';
import { CommonHooks } from '../../data';
const PricingTitleBadge = ( { item, country, currency } ) => {
const infos = countryPriceInfo[ country ];
const PricingTitleBadge = ( { item } ) => {
const { storeCountry } = CommonHooks.useWooSettings();
const infos = countryPriceInfo[ storeCountry ];
if ( ! infos || ! infos[ item ] ) {
return null;
@ -20,7 +22,7 @@ const PricingTitleBadge = ( { item, country, currency } ) => {
),
percentage,
fixedFee,
currency
infos.currencySymbol
);
return <TitleBadge type={ TITLE_BADGE_INFO } text={ label } />;

View file

@ -5,12 +5,7 @@ import Separator from '../Separator';
import OptionalPaymentMethods from '../OptionalPaymentMethods/OptionalPaymentMethods';
import PricingTitleBadge from '../PricingTitleBadge';
const AcdcFlow = ( {
isFastlane,
isPayLater,
storeCountry,
storeCurrency,
} ) => {
const AcdcFlow = ( { isFastlane, isPayLater, storeCountry } ) => {
if ( isFastlane && isPayLater && storeCountry === 'US' ) {
return (
<div className="ppcp-r-welcome-docs__wrapper">
@ -21,13 +16,7 @@ const AcdcFlow = ( {
'woocommerce-paypal-payments'
) }
titleType={ BADGE_BOX_TITLE_BIG }
textBadge={
<PricingTitleBadge
item="checkout"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="checkout" /> }
description={ __(
'Our all-in-one checkout solution lets you offer PayPal, Venmo, Pay Later options, and more to help maximise conversion',
'woocommerce-paypal-payments'
@ -117,7 +106,6 @@ const AcdcFlow = ( {
isFastlane={ isFastlane }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
</div>
</div>
@ -134,13 +122,7 @@ const AcdcFlow = ( {
'woocommerce-paypal-payments'
) }
titleType={ BADGE_BOX_TITLE_BIG }
textBadge={
<PricingTitleBadge
item="checkout"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="checkout" /> }
description={ __(
'Our all-in-one checkout solution lets you offer PayPal, Venmo, Pay Later options, and more to help maximise conversion',
'woocommerce-paypal-payments'
@ -204,7 +186,6 @@ const AcdcFlow = ( {
isFastlane={ isFastlane }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
</div>
</div>
@ -220,13 +201,7 @@ const AcdcFlow = ( {
'woocommerce-paypal-payments'
) }
titleType={ BADGE_BOX_TITLE_BIG }
textBadge={
<PricingTitleBadge
item="checkout"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="checkout" /> }
description={ __(
'Our all-in-one checkout solution lets you offer PayPal, Venmo, Pay Later options, and more to help maximise conversion',
'woocommerce-paypal-payments'
@ -285,7 +260,6 @@ const AcdcFlow = ( {
isFastlane={ isFastlane }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
</div>
</div>

View file

@ -5,7 +5,7 @@ import Separator from '../Separator';
import OptionalPaymentMethods from '../OptionalPaymentMethods/OptionalPaymentMethods';
import PricingTitleBadge from '../PricingTitleBadge';
const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
const BcdcFlow = ( { isPayLater, storeCountry } ) => {
if ( isPayLater && storeCountry === 'US' ) {
return (
<div className="ppcp-r-welcome-docs__wrapper">
@ -16,13 +16,7 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
'woocommerce-paypal-payments'
) }
titleType={ BADGE_BOX_TITLE_BIG }
textBadge={
<PricingTitleBadge
item="checkout"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="checkout" /> }
description={ __(
'Our all-in-one checkout solution lets you offer PayPal, Venmo, Pay Later options, and more to help maximise conversion',
'woocommerce-paypal-payments'
@ -112,7 +106,6 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
isFastlane={ false }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
</div>
</div>
@ -124,13 +117,7 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
<BadgeBox
title={ __( 'PayPal Checkout', 'woocommerce-paypal-payments' ) }
titleType={ BADGE_BOX_TITLE_BIG }
textBadge={
<PricingTitleBadge
item="checkout"
currency={ storeCurrency }
country={ storeCountry }
/>
}
textBadge={ <PricingTitleBadge item="checkout" /> }
description={ __(
'Our all-in-one checkout solution lets you offer PayPal, Venmo, Pay Later options, and more to help maximise conversion',
'woocommerce-paypal-payments'
@ -185,7 +172,6 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
isFastlane={ false }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
</div>
);

View file

@ -4,13 +4,7 @@ import PricingDescription from '../PricingDescription';
import AcdcFlow from './AcdcFlow';
import BcdcFlow from './BcdcFlow';
const WelcomeDocs = ( {
useAcdc,
isFastlane,
isPayLater,
storeCountry,
storeCurrency,
} ) => {
const WelcomeDocs = ( { useAcdc, isFastlane, isPayLater, storeCountry } ) => {
return (
<div className="ppcp-r-welcome-docs">
<h2 className="ppcp-r-welcome-docs__title">
@ -24,13 +18,11 @@ const WelcomeDocs = ( {
isFastlane={ isFastlane }
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
) : (
<BcdcFlow
isPayLater={ isPayLater }
storeCountry={ storeCountry }
storeCurrency={ storeCurrency }
/>
) }
<PricingDescription />