Merge pull request #2927 from woocommerce/PCP-3998-customize-description-based-on-locations-selection

Add location based descriptions on styling tab (3998)
This commit is contained in:
Philipp Stracker 2024-12-17 18:08:40 +01:00 committed by GitHub
commit ba7fbb0943
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 37 additions and 10 deletions

View file

@ -90,7 +90,7 @@ const TabStyling = () => {
return ( return (
<div className="ppcp-r-styling"> <div className="ppcp-r-styling">
<div className="ppcp-r-styling__settings"> <div className="ppcp-r-styling__settings">
<SectionIntro /> <SectionIntro location={ location } />
<SectionLocations <SectionLocations
locationOptions={ locationOptions } locationOptions={ locationOptions }
location={ location } location={ location }
@ -157,20 +157,17 @@ const TabStylingSection = ( props ) => {
); );
}; };
const SectionIntro = () => { const SectionIntro = ( { location } ) => {
const buttonStyleDescription = sprintf( const { description, descriptionLink } =
// translators: %s: Link to Classic checkout page defaultLocationSettings[ location ];
__( const buttonStyleDescription = sprintf( description, descriptionLink );
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Classic Checkout page</a>. Checkout Buttons must be enabled to display the PayPal gateway on the Checkout page.'
),
'#'
);
return ( return (
<TabStylingSection <TabStylingSection
className="ppcp-r-styling__section--rc ppcp-r-styling__section--empty" className="ppcp-r-styling__section--rc ppcp-r-styling__section--empty"
title={ __( 'Button Styling', 'wooocommerce-paypal-payments' ) } title={ __( 'Button Styling', 'wooocommerce-paypal-payments' ) }
description={ buttonStyleDescription } description={ buttonStyleDescription }
></TabStylingSection> />
); );
}; };

View file

@ -25,26 +25,56 @@ export const defaultLocationSettings = {
value: 'cart', value: 'cart',
label: __( 'Cart', 'woocommerce-paypal-payments' ), label: __( 'Cart', 'woocommerce-paypal-payments' ),
settings: { ...cartAndExpressCheckoutSettings }, settings: { ...cartAndExpressCheckoutSettings },
// translators: %s: Link to Cart page
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Cart page</a> and select which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
descriptionLink: '#',
}, },
'classic-checkout': { 'classic-checkout': {
value: 'classic-checkout', value: 'classic-checkout',
label: __( 'Classic Checkout', 'woocommerce-paypal-payments' ), label: __( 'Classic Checkout', 'woocommerce-paypal-payments' ),
settings: { ...settings }, settings: { ...settings },
// translators: %s: Link to Classic Checkout page
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Classic Checkout page</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
descriptionLink: '#',
}, },
'express-checkout': { 'express-checkout': {
value: 'express-checkout', value: 'express-checkout',
label: __( 'Express Checkout', 'woocommerce-paypal-payments' ), label: __( 'Express Checkout', 'woocommerce-paypal-payments' ),
settings: { ...cartAndExpressCheckoutSettings }, settings: { ...cartAndExpressCheckoutSettings },
// translators: %s: Link to Express Checkout location
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Express Checkout location</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
descriptionLink: '#',
}, },
'mini-cart': { 'mini-cart': {
value: 'mini-cart', value: 'mini-cart',
label: __( 'Mini Cart', 'woocommerce-paypel-payements' ), label: __( 'Mini Cart', 'woocommerce-paypel-payements' ),
settings: { ...settings }, settings: { ...settings },
// translators: %s: Link to Mini Cart
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Mini Cart</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
descriptionLink: '#',
}, },
'product-page': { 'product-page': {
value: 'product-page', value: 'product-page',
label: __( 'Product Page', 'woocommerce-paypal-payments' ), label: __( 'Product Page', 'woocommerce-paypal-payments' ),
settings: { ...settings }, settings: { ...settings },
// translators: %s: Link to Product Page
description: __(
'Customize the appearance of the PayPal smart buttons on the <a href="%s">[MISSING LINK]Product Page</a> and choose which additional payment buttons to display in this location.',
'wooocommerce-paypal-payments'
),
descriptionLink: '#',
}, },
}; };