mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-06 12:25:15 +08:00
Merge remote-tracking branch 'origin/trunk' into PCP-3930-Make-the-webhook-resubscribe/simulate-logic-usable-in-React-application
This commit is contained in:
commit
484ecc17d7
15 changed files with 186 additions and 205 deletions
|
@ -1,6 +1,4 @@
|
|||
import data from '../../utils/data';
|
||||
import TitleBadge, { TITLE_BADGE_INFO } from './TitleBadge';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
const BadgeBox = ( props ) => {
|
||||
const titleSize =
|
||||
|
@ -29,12 +27,7 @@ const BadgeBox = ( props ) => {
|
|||
</span>
|
||||
) }
|
||||
|
||||
{ props.textBadge && (
|
||||
<TitleBadge
|
||||
type={ TITLE_BADGE_INFO }
|
||||
text={ props.textBadge }
|
||||
/>
|
||||
) }
|
||||
{ props.textBadge }
|
||||
</span>
|
||||
<div className="ppcp-r-badge-box__description">
|
||||
{ props?.description && (
|
||||
|
|
|
@ -1,14 +1,13 @@
|
|||
import BadgeBox from '../BadgeBox';
|
||||
import { __, sprintf } from '@wordpress/i18n';
|
||||
|
||||
import BadgeBox from '../BadgeBox';
|
||||
import Separator from '../Separator';
|
||||
import generatePriceText from '../../../utils/badgeBoxUtils';
|
||||
import { countryPriceInfo } from '../../../utils/countryPriceInfo';
|
||||
import PricingTitleBadge from '../PricingTitleBadge';
|
||||
|
||||
const AcdcOptionalPaymentMethods = ( {
|
||||
isFastlane,
|
||||
isPayLater,
|
||||
storeCountry,
|
||||
storeCurrency,
|
||||
} ) => {
|
||||
if ( isFastlane && isPayLater && storeCountry === 'US' ) {
|
||||
return (
|
||||
|
@ -24,11 +23,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-amex.svg',
|
||||
'icon-button-discover.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'ccf',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="ccf" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -48,11 +43,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-apple-pay.svg',
|
||||
'icon-button-google-pay.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'dw',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="dw" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -73,11 +64,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-blik.svg',
|
||||
'icon-button-bancontact.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'apm',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="apm" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -91,11 +78,9 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
<BadgeBox
|
||||
title={ __( '', 'woocommerce-paypal-payments' ) }
|
||||
imageBadge={ [ 'icon-payment-method-fastlane-small.svg' ] }
|
||||
textBadge={ generatePriceText(
|
||||
'fastlane',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={
|
||||
<PricingTitleBadge item="fast country currency=storeCurrency=storeCountrylane" />
|
||||
}
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -123,11 +108,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-amex.svg',
|
||||
'icon-button-discover.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'ccf',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="ccf" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -147,11 +128,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-apple-pay.svg',
|
||||
'icon-button-google-pay.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'dw',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="dw" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -173,11 +150,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-blik.svg',
|
||||
'icon-button-bancontact.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'apm',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="apm" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -204,11 +177,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-amex.svg',
|
||||
'icon-button-discover.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'ccf',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="ccf" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -225,11 +194,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-apple-pay.svg',
|
||||
'icon-button-google-pay.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'dw',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="dw" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
@ -251,11 +216,7 @@ const AcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-blik.svg',
|
||||
'icon-button-bancontact.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'apm',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="apm" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal business fees guide
|
||||
__(
|
||||
|
|
|
@ -1,13 +1,9 @@
|
|||
import BadgeBox from '../BadgeBox';
|
||||
import { __, sprintf } from '@wordpress/i18n';
|
||||
import generatePriceText from '../../../utils/badgeBoxUtils';
|
||||
import { countryPriceInfo } from '../../../utils/countryPriceInfo';
|
||||
|
||||
const BcdcOptionalPaymentMethods = ( {
|
||||
isPayLater,
|
||||
storeCountry,
|
||||
storeCurrency,
|
||||
} ) => {
|
||||
import BadgeBox from '../BadgeBox';
|
||||
import PricingTitleBadge from '../PricingTitleBadge';
|
||||
|
||||
const BcdcOptionalPaymentMethods = ( { isPayLater, storeCountry } ) => {
|
||||
if ( isPayLater && storeCountry === 'us' ) {
|
||||
return (
|
||||
<div className="ppcp-r-optional-payment-methods__wrapper">
|
||||
|
@ -22,11 +18,9 @@ const BcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-amex.svg',
|
||||
'icon-button-discover.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'standardCardFields',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={
|
||||
<PricingTitleBadge item="standardCardFields" />
|
||||
}
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal REST application guide
|
||||
__(
|
||||
|
@ -53,11 +47,7 @@ const BcdcOptionalPaymentMethods = ( {
|
|||
'icon-button-amex.svg',
|
||||
'icon-button-discover.svg',
|
||||
] }
|
||||
textBadge={ generatePriceText(
|
||||
'standardCardFields',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
textBadge={ <PricingTitleBadge item="standardCardFields" /> }
|
||||
description={ sprintf(
|
||||
// translators: %s: Link to PayPal REST application guide
|
||||
__(
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -0,0 +1,38 @@
|
|||
import { __, sprintf } from '@wordpress/i18n';
|
||||
|
||||
import { countryPriceInfo } from '../../utils/countryPriceInfo';
|
||||
import { CommonHooks } from '../../data';
|
||||
|
||||
const PricingDescription = () => {
|
||||
const { storeCountry } = CommonHooks.useWooSettings();
|
||||
|
||||
if ( ! countryPriceInfo[ storeCountry ] ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
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 label = sprintf(
|
||||
// translators: %1$s: Pricing date, %2$s Link to PayPal price-details page.
|
||||
__(
|
||||
'Prices based on domestic transactions as of %1$s. <a target="_blank" href="%2$s">Click here</a> for full pricing details.',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
lastDate,
|
||||
detailsUrl
|
||||
);
|
||||
|
||||
return (
|
||||
<p
|
||||
className="ppcp-r-optional-payment-methods__description"
|
||||
data-country={ storeCountry }
|
||||
>
|
||||
<sup>1</sup>
|
||||
<span dangerouslySetInnerHTML={ { __html: label } } />
|
||||
</p>
|
||||
);
|
||||
};
|
||||
|
||||
export default PricingDescription;
|
|
@ -0,0 +1,43 @@
|
|||
import { __, sprintf } from '@wordpress/i18n';
|
||||
|
||||
import { CommonHooks } from '../../data';
|
||||
import { countryPriceInfo } from '../../utils/countryPriceInfo';
|
||||
import { formatPrice } from '../../utils/formatPrice';
|
||||
import TitleBadge, { TITLE_BADGE_INFO } from './TitleBadge';
|
||||
|
||||
const getFixedAmount = ( currency, priceList ) => {
|
||||
if ( priceList[ currency ] ) {
|
||||
return formatPrice( priceList[ currency ], currency );
|
||||
}
|
||||
|
||||
const [ defaultCurrency, defaultPrice ] = Object.entries( priceList )[ 0 ];
|
||||
|
||||
return formatPrice( defaultPrice, defaultCurrency );
|
||||
};
|
||||
|
||||
const PricingTitleBadge = ( { item } ) => {
|
||||
const { storeCountry } = CommonHooks.useWooSettings();
|
||||
const infos = countryPriceInfo[ storeCountry ];
|
||||
|
||||
if ( ! infos || ! infos[ item ] ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const percentage = infos[ item ].toFixed( 2 );
|
||||
const fixedAmount = getFixedAmount( storeCountry, infos.fixedFee );
|
||||
|
||||
const label = sprintf(
|
||||
__( 'from %1$s%% + %2$s', 'woocommerce-paypal-payments' ),
|
||||
percentage,
|
||||
fixedAmount
|
||||
);
|
||||
|
||||
return (
|
||||
<TitleBadge
|
||||
type={ TITLE_BADGE_INFO }
|
||||
text={ `${ label }<sup>1</sup>` }
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default PricingTitleBadge;
|
|
@ -1,17 +1,11 @@
|
|||
import BadgeBox, { BADGE_BOX_TITLE_BIG } from '../BadgeBox';
|
||||
import { __, sprintf } from '@wordpress/i18n';
|
||||
|
||||
import BadgeBox, { BADGE_BOX_TITLE_BIG } from '../BadgeBox';
|
||||
import Separator from '../Separator';
|
||||
import generatePriceText from '../../../utils/badgeBoxUtils';
|
||||
import { countryPriceInfo } from '../../../utils/countryPriceInfo';
|
||||
|
||||
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">
|
||||
|
@ -22,11 +16,7 @@ const AcdcFlow = ( {
|
|||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
titleType={ BADGE_BOX_TITLE_BIG }
|
||||
textBadge={ generatePriceText(
|
||||
'checkout',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
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'
|
||||
|
@ -116,7 +106,6 @@ const AcdcFlow = ( {
|
|||
isFastlane={ isFastlane }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -133,11 +122,7 @@ const AcdcFlow = ( {
|
|||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
titleType={ BADGE_BOX_TITLE_BIG }
|
||||
textBadge={ generatePriceText(
|
||||
'checkout',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
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'
|
||||
|
@ -201,7 +186,6 @@ const AcdcFlow = ( {
|
|||
isFastlane={ isFastlane }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -217,11 +201,7 @@ const AcdcFlow = ( {
|
|||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
titleType={ BADGE_BOX_TITLE_BIG }
|
||||
textBadge={ generatePriceText(
|
||||
'checkout',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
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'
|
||||
|
@ -280,7 +260,6 @@ const AcdcFlow = ( {
|
|||
isFastlane={ isFastlane }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import BadgeBox, { BADGE_BOX_TITLE_BIG } from '../BadgeBox';
|
||||
import { __, sprintf } from '@wordpress/i18n';
|
||||
import Separator from '../Separator';
|
||||
import generatePriceText from '../../../utils/badgeBoxUtils';
|
||||
import { countryPriceInfo } from '../../../utils/countryPriceInfo';
|
||||
import OptionalPaymentMethods from '../OptionalPaymentMethods/OptionalPaymentMethods';
|
||||
|
||||
const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
|
||||
import BadgeBox, { BADGE_BOX_TITLE_BIG } from '../BadgeBox';
|
||||
import Separator from '../Separator';
|
||||
import OptionalPaymentMethods from '../OptionalPaymentMethods/OptionalPaymentMethods';
|
||||
import PricingTitleBadge from '../PricingTitleBadge';
|
||||
|
||||
const BcdcFlow = ( { isPayLater, storeCountry } ) => {
|
||||
if ( isPayLater && storeCountry === 'US' ) {
|
||||
return (
|
||||
<div className="ppcp-r-welcome-docs__wrapper">
|
||||
|
@ -16,11 +16,7 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
|
|||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
titleType={ BADGE_BOX_TITLE_BIG }
|
||||
textBadge={ generatePriceText(
|
||||
'checkout',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
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'
|
||||
|
@ -110,7 +106,6 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
|
|||
isFastlane={ false }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -122,11 +117,7 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
|
|||
<BadgeBox
|
||||
title={ __( 'PayPal Checkout', 'woocommerce-paypal-payments' ) }
|
||||
titleType={ BADGE_BOX_TITLE_BIG }
|
||||
textBadge={ generatePriceText(
|
||||
'checkout',
|
||||
countryPriceInfo[ storeCountry ],
|
||||
storeCurrency
|
||||
) }
|
||||
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'
|
||||
|
@ -181,7 +172,6 @@ const BcdcFlow = ( { isPayLater, storeCountry, storeCurrency } ) => {
|
|||
isFastlane={ false }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -1,16 +1,10 @@
|
|||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
import PricingDescription from '../PricingDescription';
|
||||
import AcdcFlow from './AcdcFlow';
|
||||
import BcdcFlow from './BcdcFlow';
|
||||
import { countryPriceInfo } from '../../../utils/countryPriceInfo';
|
||||
import { pricesBasedDescription } from './pricesBasedDescription';
|
||||
|
||||
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,23 +18,14 @@ const WelcomeDocs = ( {
|
|||
isFastlane={ isFastlane }
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
) : (
|
||||
<BcdcFlow
|
||||
isPayLater={ isPayLater }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
) }
|
||||
{ storeCountry in countryPriceInfo && (
|
||||
<p
|
||||
className="ppcp-r-optional-payment-methods__description"
|
||||
dangerouslySetInnerHTML={ {
|
||||
__html: pricesBasedDescription,
|
||||
} }
|
||||
></p>
|
||||
) }
|
||||
<PricingDescription />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -1,10 +0,0 @@
|
|||
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 '
|
||||
);
|
|
@ -1,12 +1,11 @@
|
|||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
import { CommonHooks, OnboardingHooks } from '../../../data';
|
||||
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';
|
||||
import PricingDescription from '../../ReusableComponents/PricingDescription';
|
||||
|
||||
const OPM_RADIO_GROUP_NAME = 'optional-payment-methods';
|
||||
|
||||
|
@ -60,14 +59,7 @@ const StepPaymentMethods = ( {} ) => {
|
|||
type="radio"
|
||||
></SelectBox>
|
||||
</SelectBoxWrapper>
|
||||
{ storeCountry in countryPriceInfo && (
|
||||
<p
|
||||
className="ppcp-r-optional-payment-methods__description"
|
||||
dangerouslySetInnerHTML={ {
|
||||
__html: pricesBasedDescription,
|
||||
} }
|
||||
></p>
|
||||
) }
|
||||
<PricingDescription />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -12,7 +12,7 @@ import { CommonHooks } from '../../../data';
|
|||
import BusyStateWrapper from '../../ReusableComponents/BusyStateWrapper';
|
||||
|
||||
const StepWelcome = ( { setStep, currentStep } ) => {
|
||||
const { storeCountry, storeCurrency } = CommonHooks.useWooSettings();
|
||||
const { storeCountry } = CommonHooks.useWooSettings();
|
||||
|
||||
return (
|
||||
<div className="ppcp-r-page-welcome">
|
||||
|
@ -54,7 +54,6 @@ const StepWelcome = ( { setStep, currentStep } ) => {
|
|||
isFastlane={ true }
|
||||
isPayLater={ true }
|
||||
storeCountry={ storeCountry }
|
||||
storeCurrency={ storeCurrency }
|
||||
/>
|
||||
<Separator text={ __( 'or', 'woocommerce-paypal-payments' ) } />
|
||||
<AccordionSection
|
||||
|
|
|
@ -1,18 +0,0 @@
|
|||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
const generatePriceText = ( type, selectedCountryPrice, storeCurrency ) => {
|
||||
if ( ! selectedCountryPrice || ! selectedCountryPrice[ type ] ) {
|
||||
console.warn( `Invalid type or price data for: ${ type }` );
|
||||
return '';
|
||||
}
|
||||
|
||||
const percentage = selectedCountryPrice[ type ].toFixed( 2 );
|
||||
const fixedFee = `${ selectedCountryPrice.currencySymbol }${ selectedCountryPrice.fixedFee }`;
|
||||
|
||||
return __(
|
||||
`from ${ percentage }% + ${ fixedFee } ${ storeCurrency }<sup>1</sup>`,
|
||||
'woocommerce-paypal-payments'
|
||||
);
|
||||
};
|
||||
|
||||
export default generatePriceText;
|
|
@ -1,7 +1,8 @@
|
|||
export const countryPriceInfo = {
|
||||
US: {
|
||||
currencySymbol: '$',
|
||||
fixedFee: 0.49,
|
||||
fixedFee: {
|
||||
USD: 0.49,
|
||||
},
|
||||
checkout: 3.49,
|
||||
ccf: 2.59,
|
||||
dw: 2.59,
|
||||
|
@ -10,8 +11,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 2.99,
|
||||
},
|
||||
UK: {
|
||||
currencySymbol: '£',
|
||||
fixedFee: 0.3,
|
||||
fixedFee: {
|
||||
GPB: 0.3,
|
||||
},
|
||||
checkout: 2.9,
|
||||
ccf: 1.2,
|
||||
dw: 1.2,
|
||||
|
@ -19,8 +21,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 1.2,
|
||||
},
|
||||
CA: {
|
||||
currencySymbol: '$',
|
||||
fixedFee: 0.3,
|
||||
fixedFee: {
|
||||
CAD: 0.3,
|
||||
},
|
||||
checkout: 2.9,
|
||||
ccf: 2.7,
|
||||
dw: 2.7,
|
||||
|
@ -28,8 +31,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 2.9,
|
||||
},
|
||||
AU: {
|
||||
currencySymbol: '$',
|
||||
fixedFee: 0.3,
|
||||
fixedFee: {
|
||||
AUD: 0.3,
|
||||
},
|
||||
checkout: 2.6,
|
||||
ccf: 1.75,
|
||||
dw: 1.75,
|
||||
|
@ -37,8 +41,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 2.6,
|
||||
},
|
||||
FR: {
|
||||
currencySymbol: '€',
|
||||
fixedFee: 0.35,
|
||||
fixedFee: {
|
||||
EUR: 0.35,
|
||||
},
|
||||
checkout: 2.9,
|
||||
ccf: 1.2,
|
||||
dw: 1.2,
|
||||
|
@ -46,8 +51,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 1.2,
|
||||
},
|
||||
IT: {
|
||||
currencySymbol: '€',
|
||||
fixedFee: 0.35,
|
||||
fixedFee: {
|
||||
EUR: 0.35,
|
||||
},
|
||||
checkout: 3.4,
|
||||
ccf: 1.2,
|
||||
dw: 1.2,
|
||||
|
@ -55,8 +61,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 1.2,
|
||||
},
|
||||
DE: {
|
||||
currencySymbol: '€',
|
||||
fixedFee: 0.39,
|
||||
fixedFee: {
|
||||
EUR: 0.39,
|
||||
},
|
||||
checkout: 2.99,
|
||||
ccf: 2.99,
|
||||
dw: 2.99,
|
||||
|
@ -64,8 +71,9 @@ export const countryPriceInfo = {
|
|||
standardCardFields: 2.99,
|
||||
},
|
||||
ES: {
|
||||
currencySymbol: '€',
|
||||
fixedFee: 0.35,
|
||||
fixedFee: {
|
||||
EUR: 0.35,
|
||||
},
|
||||
checkout: 2.9,
|
||||
ccf: 1.2,
|
||||
dw: 1.2,
|
||||
|
|
34
modules/ppcp-settings/resources/js/utils/formatPrice.js
Normal file
34
modules/ppcp-settings/resources/js/utils/formatPrice.js
Normal file
|
@ -0,0 +1,34 @@
|
|||
const priceFormatInfo = {
|
||||
USD: {
|
||||
prefix: '$',
|
||||
suffix: 'USD',
|
||||
},
|
||||
CAD: {
|
||||
prefix: '$',
|
||||
suffix: 'CAD',
|
||||
},
|
||||
AUD: {
|
||||
prefix: '$',
|
||||
suffix: 'AUD',
|
||||
},
|
||||
EUR: {
|
||||
prefix: '€',
|
||||
suffix: '',
|
||||
},
|
||||
GPB: {
|
||||
prefix: '£',
|
||||
suffix: '',
|
||||
},
|
||||
};
|
||||
|
||||
export const formatPrice = ( value, currency ) => {
|
||||
const currencyInfo = priceFormatInfo[ currency ];
|
||||
const amount = value.toFixed( 2 );
|
||||
|
||||
if ( ! currencyInfo ) {
|
||||
console.error( `Unsupported currency: ${ currency }` );
|
||||
return amount;
|
||||
}
|
||||
|
||||
return `${ currencyInfo.prefix }${ amount } ${ currencyInfo.suffix }`;
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue