Disable subscriptions if personal account

This commit is contained in:
carmenmaymo 2025-02-11 14:16:23 +01:00
parent afe05d4697
commit 1ef7141903
No known key found for this signature in database
GPG key ID: 6023F686B0F3102E
2 changed files with 60 additions and 41 deletions

View file

@ -9,7 +9,13 @@ const OptionSelector = ( {
} ) => (
<div className="ppcp-r-select-box-wrapper">
{ options.map(
( { value: itemValue, title, description, contents } ) => {
( {
value: itemValue,
title,
description,
contents,
isDisabled = false,
} ) => {
let isSelected;
if ( Array.isArray( value ) ) {
@ -27,6 +33,7 @@ const OptionSelector = ( {
onChange={ onChange }
isMulti={ multiSelect }
isSelected={ isSelected }
isDisabled={ isDisabled }
>
{ contents }
</OptionItem>
@ -46,13 +53,13 @@ const OptionItem = ( {
isMulti,
isSelected,
children,
isDisabled = false,
} ) => {
const boxClassName = classNames( 'ppcp-r-select-box', {
'ppcp--selected': isSelected,
'ppcp--multiselect': isMulti,
'ppcp--no-title': ! itemTitle,
} );
return (
// eslint-disable-next-line jsx-a11y/label-has-associated-control -- label has a nested input control.
<label className={ boxClassName }>
@ -61,6 +68,7 @@ const OptionItem = ( {
isRadio={ ! isMulti }
onChange={ onChange }
isSelected={ isSelected }
isDisabled={ isDisabled }
/>
<div className="ppcp--box-content">
@ -80,7 +88,7 @@ const OptionItem = ( {
);
};
const InputField = ( { value, onChange, isRadio, isSelected } ) => {
const InputField = ( { value, onChange, isRadio, isSelected, isDisabled } ) => {
if ( isRadio ) {
return (
<PayPalRdb
@ -96,6 +104,7 @@ const InputField = ( { value, onChange, isRadio, isSelected } ) => {
value={ value }
onChange={ onChange }
checked={ isSelected }
disabled={ isDisabled }
/>
);
};

View file

@ -10,6 +10,7 @@ const StepProducts = () => {
const { canUseSubscriptions } = OnboardingHooks.useFlags();
const [ optionState, setOptionState ] = useState( null );
const [ productChoices, setProductChoices ] = useState( [] );
const { isCasualSeller } = OnboardingHooks.useBusiness();
useEffect( () => {
const initChoices = () => {
@ -48,7 +49,36 @@ const StepProducts = () => {
setProducts( getNewValue() );
};
const productChoicesFull = [
{
value: PRODUCT_TYPES.VIRTUAL,
title: __( 'Virtual', 'woocommerce-paypal-payments' ),
description: __(
'Items do not require shipping.',
'woocommerce-paypal-payments'
),
contents: <DetailsVirtual />,
},
{
value: PRODUCT_TYPES.PHYSICAL,
title: __( 'Physical Goods', 'woocommerce-paypal-payments' ),
description: __(
'Items require shipping.',
'woocommerce-paypal-payments'
),
contents: <DetailsPhysical />,
},
{
value: PRODUCT_TYPES.SUBSCRIPTIONS,
title: __( 'Subscriptions', 'woocommerce-paypal-payments' ),
description: __(
'Recurring payments for either physical goods or services.',
'woocommerce-paypal-payments'
),
isDisabled: isCasualSeller,
contents: <DetailsSubscriptions showNotice={ isCasualSeller } />,
},
];
return (
<div className="ppcp-r-page-products">
<OnboardingHeader
@ -87,41 +117,21 @@ const DetailsPhysical = () => (
</ul>
);
const DetailsSubscriptions = () => (
<a
target="__blank"
href="https://woocommerce.com/document/woocommerce-paypal-payments/#subscriptions-faq"
>
{ __( 'WooCommerce Subscriptions', 'woocommerce-paypal-payments' ) }
</a>
const DetailsSubscriptions = ( { showNotice } ) => (
<>
<a
target="__blank"
href="https://woocommerce.com/document/woocommerce-paypal-payments/#subscriptions-faq"
>
{ __( 'WooCommerce Subscriptions', 'woocommerce-paypal-payments' ) }
</a>
{ showNotice && (
<p>
{ __(
'* Business account is required for subscriptions.',
'woocommerce-paypal-payments'
) }
</p>
) }
</>
);
const productChoicesFull = [
{
value: PRODUCT_TYPES.VIRTUAL,
title: __( 'Virtual', 'woocommerce-paypal-payments' ),
description: __(
'Items do not require shipping.',
'woocommerce-paypal-payments'
),
contents: <DetailsVirtual />,
},
{
value: PRODUCT_TYPES.PHYSICAL,
title: __( 'Physical Goods', 'woocommerce-paypal-payments' ),
description: __(
'Items require shipping.',
'woocommerce-paypal-payments'
),
contents: <DetailsPhysical />,
},
{
value: PRODUCT_TYPES.SUBSCRIPTIONS,
title: __( 'Subscriptions', 'woocommerce-paypal-payments' ),
description: __(
'Recurring payments for either physical goods or services.',
'woocommerce-paypal-payments'
),
contents: <DetailsSubscriptions />,
},
];