woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-08-31 06:52:50 +08:00
Code Issues Projects Packages Wiki Activity Actions

🐛 Ensure the wizard displays a valid step

Browse source
This commit is contained in:
Philipp Stracker 2024-10-29 12:31:58 +01:00
parent dcb8d01370
commit 98224690ee
No known key found for this signature in database
1 changed files with 19 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

39
modules/ppcp-settings/resources/js/Components/Screens/Onboarding/Onboarding.js
View file

@ -12,7 +12,7 @@ const Onboarding = () => {
return (
<Container page={ PAGE_ONBOARDING }>
<div className="ppcp-r-card">
<Stepper
<OnboardingStep
currentStep={ step }
setStep={ setStep }
setCompleted={ setCompleted }
@ -22,28 +22,27 @@ const Onboarding = () => {
);
};
const Stepper = ( { currentStep, setStep, setCompleted } ) => {
const OnboardingStep = ( { currentStep, setStep, setCompleted } ) => {
const stepperOrder = [ StepWelcome, StepBusiness, StepProducts ];
const renderSteps = () => {
return stepperOrder.map( ( Step, index ) => {
return (
<div
key={ index }
style={ index !== currentStep ? { display: 'none' } : {} }
>
<Step
setStep={ setStep }
currentStep={ currentStep }
setCompleted={ setCompleted }
stepperOrder={ stepperOrder }
/>
</div>
);
} );
};
const isValidStep = ( step ) =>
typeof step === 'number' &&
Number.isInteger( step ) &&
step >= 0 &&
step < stepperOrder.length;
return <>{ renderSteps() }</>;
const safeCurrentStep = isValidStep( currentStep ) ? currentStep : 0;
const CurrentStepComponent = stepperOrder[ safeCurrentStep ];
return (
<CurrentStepComponent
setStep={ setStep }
currentStep={ safeCurrentStep }
setCompleted={ setCompleted }
stepperOrder={ stepperOrder }
/>
);
};
export default Onboarding;