mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-05 08:59:14 +08:00
Disable subscriptions if personal account
This commit is contained in:
parent
afe05d4697
commit
1ef7141903
2 changed files with 60 additions and 41 deletions
|
@ -9,7 +9,13 @@ const OptionSelector = ( {
|
||||||
} ) => (
|
} ) => (
|
||||||
<div className="ppcp-r-select-box-wrapper">
|
<div className="ppcp-r-select-box-wrapper">
|
||||||
{ options.map(
|
{ options.map(
|
||||||
( { value: itemValue, title, description, contents } ) => {
|
( {
|
||||||
|
value: itemValue,
|
||||||
|
title,
|
||||||
|
description,
|
||||||
|
contents,
|
||||||
|
isDisabled = false,
|
||||||
|
} ) => {
|
||||||
let isSelected;
|
let isSelected;
|
||||||
|
|
||||||
if ( Array.isArray( value ) ) {
|
if ( Array.isArray( value ) ) {
|
||||||
|
@ -27,6 +33,7 @@ const OptionSelector = ( {
|
||||||
onChange={ onChange }
|
onChange={ onChange }
|
||||||
isMulti={ multiSelect }
|
isMulti={ multiSelect }
|
||||||
isSelected={ isSelected }
|
isSelected={ isSelected }
|
||||||
|
isDisabled={ isDisabled }
|
||||||
>
|
>
|
||||||
{ contents }
|
{ contents }
|
||||||
</OptionItem>
|
</OptionItem>
|
||||||
|
@ -46,13 +53,13 @@ const OptionItem = ( {
|
||||||
isMulti,
|
isMulti,
|
||||||
isSelected,
|
isSelected,
|
||||||
children,
|
children,
|
||||||
|
isDisabled = false,
|
||||||
} ) => {
|
} ) => {
|
||||||
const boxClassName = classNames( 'ppcp-r-select-box', {
|
const boxClassName = classNames( 'ppcp-r-select-box', {
|
||||||
'ppcp--selected': isSelected,
|
'ppcp--selected': isSelected,
|
||||||
'ppcp--multiselect': isMulti,
|
'ppcp--multiselect': isMulti,
|
||||||
'ppcp--no-title': ! itemTitle,
|
'ppcp--no-title': ! itemTitle,
|
||||||
} );
|
} );
|
||||||
|
|
||||||
return (
|
return (
|
||||||
// eslint-disable-next-line jsx-a11y/label-has-associated-control -- label has a nested input control.
|
// eslint-disable-next-line jsx-a11y/label-has-associated-control -- label has a nested input control.
|
||||||
<label className={ boxClassName }>
|
<label className={ boxClassName }>
|
||||||
|
@ -61,6 +68,7 @@ const OptionItem = ( {
|
||||||
isRadio={ ! isMulti }
|
isRadio={ ! isMulti }
|
||||||
onChange={ onChange }
|
onChange={ onChange }
|
||||||
isSelected={ isSelected }
|
isSelected={ isSelected }
|
||||||
|
isDisabled={ isDisabled }
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="ppcp--box-content">
|
<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 ) {
|
if ( isRadio ) {
|
||||||
return (
|
return (
|
||||||
<PayPalRdb
|
<PayPalRdb
|
||||||
|
@ -96,6 +104,7 @@ const InputField = ( { value, onChange, isRadio, isSelected } ) => {
|
||||||
value={ value }
|
value={ value }
|
||||||
onChange={ onChange }
|
onChange={ onChange }
|
||||||
checked={ isSelected }
|
checked={ isSelected }
|
||||||
|
disabled={ isDisabled }
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -10,6 +10,7 @@ const StepProducts = () => {
|
||||||
const { canUseSubscriptions } = OnboardingHooks.useFlags();
|
const { canUseSubscriptions } = OnboardingHooks.useFlags();
|
||||||
const [ optionState, setOptionState ] = useState( null );
|
const [ optionState, setOptionState ] = useState( null );
|
||||||
const [ productChoices, setProductChoices ] = useState( [] );
|
const [ productChoices, setProductChoices ] = useState( [] );
|
||||||
|
const { isCasualSeller } = OnboardingHooks.useBusiness();
|
||||||
|
|
||||||
useEffect( () => {
|
useEffect( () => {
|
||||||
const initChoices = () => {
|
const initChoices = () => {
|
||||||
|
@ -48,7 +49,36 @@ const StepProducts = () => {
|
||||||
|
|
||||||
setProducts( getNewValue() );
|
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 (
|
return (
|
||||||
<div className="ppcp-r-page-products">
|
<div className="ppcp-r-page-products">
|
||||||
<OnboardingHeader
|
<OnboardingHeader
|
||||||
|
@ -87,41 +117,21 @@ const DetailsPhysical = () => (
|
||||||
</ul>
|
</ul>
|
||||||
);
|
);
|
||||||
|
|
||||||
const DetailsSubscriptions = () => (
|
const DetailsSubscriptions = ( { showNotice } ) => (
|
||||||
<a
|
<>
|
||||||
target="__blank"
|
<a
|
||||||
href="https://woocommerce.com/document/woocommerce-paypal-payments/#subscriptions-faq"
|
target="__blank"
|
||||||
>
|
href="https://woocommerce.com/document/woocommerce-paypal-payments/#subscriptions-faq"
|
||||||
{ __( 'WooCommerce Subscriptions', 'woocommerce-paypal-payments' ) }
|
>
|
||||||
</a>
|
{ __( '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 />,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue