69 lines
1.4 KiB
TypeScript
69 lines
1.4 KiB
TypeScript
/**
|
|
* External dependencies
|
|
*/
|
|
import { __ } from '@wordpress/i18n';
|
|
import { filter } from 'lodash';
|
|
import { useState } from '@wordpress/element';
|
|
import { Stepper } from '@woocommerce/components';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { Configure } from './configure';
|
|
import { StoreLocation } from '../components/store-location';
|
|
|
|
export type ManualConfigurationProps = {
|
|
isPending: boolean;
|
|
onDisable: () => void;
|
|
onAutomate: () => void;
|
|
onManual: () => void;
|
|
};
|
|
|
|
export const ManualConfiguration: React.FC< ManualConfigurationProps > = ( {
|
|
isPending,
|
|
onDisable,
|
|
onAutomate,
|
|
onManual,
|
|
} ) => {
|
|
const [ stepIndex, setStepIndex ] = useState( 0 );
|
|
|
|
const nextStep = () => {
|
|
setStepIndex( stepIndex + 1 );
|
|
};
|
|
|
|
const stepProps = {
|
|
isPending,
|
|
onAutomate,
|
|
onDisable,
|
|
nextStep,
|
|
onManual,
|
|
};
|
|
|
|
const steps = [
|
|
{
|
|
key: 'store_location',
|
|
label: __( 'Set store location', 'woocommerce' ),
|
|
description: __(
|
|
'The address from which your business operates',
|
|
'woocommerce'
|
|
),
|
|
content: <StoreLocation { ...stepProps } />,
|
|
},
|
|
{
|
|
key: 'manual_configuration',
|
|
label: __( 'Configure tax rates', 'woocommerce' ),
|
|
description: __(
|
|
'Head over to the tax rate settings screen to configure your tax rates',
|
|
'woocommerce'
|
|
),
|
|
content: <Configure { ...stepProps } />,
|
|
},
|
|
];
|
|
|
|
const step = steps[ stepIndex ];
|
|
|
|
return (
|
|
<Stepper isVertical={ true } currentStep={ step.key } steps={ steps } />
|
|
);
|
|
};
|