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

✨ Integrate Redux store to onboarding naviagtion

Browse source
This commit is contained in:
Philipp Stracker 2024-10-28 18:27:12 +01:00
parent 164af7f515
commit ef60cca606
No known key found for this signature in database
4 changed files with 38 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

22
modules/ppcp-settings/resources/js/Components/ReusableComponents/Navigation.js
View file

@ -3,27 +3,35 @@ import { __ } from '@wordpress/i18n';
const Navigation = ( {
setStep,
setCompleted,
currentStep,
stepperOrder,
canProceeedCallback = () => true,
} ) => {
const setNextStep = ( nextStep ) => {
let newStep = currentStep + nextStep;
if ( newStep > stepperOrder.length - 1 ) {
newStep = currentStep;
const navigateBy = ( stepDirection ) => {
let newStep = currentStep + stepDirection;
if ( isNaN( newStep ) || newStep < 0 ) {
console.warn( 'Invalid next step:', newStep );
newStep = 0;
}
if ( newStep >= stepperOrder.length ) {
setCompleted( true );
} else {
setStep( newStep );
}
setStep( newStep );
};
return (
<div className="ppcp-r-navigation">
<Button variant="tertiary" onClick={ () => setNextStep( -1 ) }>
<Button variant="tertiary" onClick={ () => navigateBy( -1 ) }>
{ __( 'Back', 'woocommerce-paypal-payments' ) }
</Button>
<Button
variant="primary"
disabled={ ! canProceeedCallback() }
onClick={ () => setNextStep( 1 ) }
onClick={ () => navigateBy( 1 ) }
>
{ __( 'Next', 'woocommerce-paypal-payments' ) }
</Button>