75 lines
1.8 KiB
TypeScript
75 lines
1.8 KiB
TypeScript
/**
|
|
* External dependencies
|
|
*/
|
|
import { __ } from '@wordpress/i18n';
|
|
import { Button } from '@wordpress/components';
|
|
import interpolateComponents from 'interpolate-components';
|
|
import { H } from '@woocommerce/components';
|
|
import { recordEvent } from '@woocommerce/tracks';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { SetupStepProps } from './setup';
|
|
|
|
export const AutomatedTaxes: React.FC< SetupStepProps > = ( {
|
|
isPending,
|
|
onAutomate,
|
|
onManual,
|
|
onDisable,
|
|
} ) => {
|
|
return (
|
|
<div className="woocommerce-task-tax__success">
|
|
<span
|
|
className="woocommerce-task-tax__success-icon"
|
|
role="img"
|
|
aria-labelledby="woocommerce-task-tax__success-message"
|
|
>
|
|
🎊
|
|
</span>
|
|
<H id="woocommerce-task-tax__success-message">
|
|
{ __( 'Good news!', 'woocommerce-admin' ) }
|
|
</H>
|
|
<p>
|
|
{ interpolateComponents( {
|
|
mixedString: __(
|
|
'{{strong}}Jetpack{{/strong}} and {{strong}}WooCommerce Tax{{/strong}} ' +
|
|
'can automate your sales tax calculations for you.',
|
|
'woocommerce-admin'
|
|
),
|
|
components: {
|
|
strong: <strong />,
|
|
},
|
|
} ) }
|
|
</p>
|
|
<Button
|
|
isPrimary
|
|
isBusy={ isPending }
|
|
onClick={ () => {
|
|
recordEvent( 'tasklist_tax_setup_automated_proceed', {
|
|
setup_automatically: true,
|
|
} );
|
|
onAutomate();
|
|
} }
|
|
>
|
|
{ __( 'Yes please', 'woocommerce-admin' ) }
|
|
</Button>
|
|
<Button
|
|
disabled={ isPending }
|
|
isTertiary
|
|
onClick={ () => {
|
|
recordEvent( 'tasklist_tax_setup_automated_proceed', {
|
|
setup_automatically: false,
|
|
} );
|
|
onManual();
|
|
} }
|
|
>
|
|
{ __( "No thanks, I'll set up manually", 'woocommerce-admin' ) }
|
|
</Button>
|
|
<Button disabled={ isPending } isTertiary onClick={ onDisable }>
|
|
{ __( "I don't charge sales tax", 'woocommerce-admin' ) }
|
|
</Button>
|
|
</div>
|
|
);
|
|
};
|