Move tax rate setup to the Settings page

js/src/components/free-listings/configure-product-listings/__snapshots__/checkErrors.test.js.snap

@@ -6,14 +6,6 @@ exports[`checkErrors Audience When the audience location option is an invalid va
 
 exports[`checkErrors Audience When the audience location option is an invalid value or missing, should not pass 2`] = `"Please select a location option."`;
 
-exports[`checkErrors For tax rate, if store country code or selected country codes include 'US' When the tax rate option is an invalid value or missing, should not pass 1`] = `"Please specify tax rate option."`;
-
-exports[`checkErrors For tax rate, if store country code or selected country codes include 'US' When the tax rate option is an invalid value or missing, should not pass 2`] = `"Please specify tax rate option."`;
-
-exports[`checkErrors For tax rate, if store country code or selected country codes include 'US' When the tax rate option is an invalid value or missing, should not pass 3`] = `"Please specify tax rate option."`;
-
-exports[`checkErrors For tax rate, if store country code or selected country codes include 'US' When the tax rate option is an invalid value or missing, should not pass 4`] = `"Please specify tax rate option."`;
-
 exports[`checkErrors Offer free shipping With flat shipping rate option When there are some non-free shipping rates, and offer free shipping is checked, and there is no minimum order amount for non-free shipping rates, should not pass 1`] = `"Please enter minimum order for free shipping."`;
 
 exports[`checkErrors Shipping rates For flat type When there are any selected countries with shipping rates not set, should not pass 1`] = `"Please specify estimated shipping rates for all the countries, and the rate cannot be less than 0."`;

js/src/components/free-listings/configure-product-listings/checkErrors.js

@@ -6,15 +6,8 @@ import { __ } from '@wordpress/i18n';
 const validlocationSet = new Set( [ 'all', 'selected' ] );
 const validShippingRateSet = new Set( [ 'automatic', 'flat', 'manual' ] );
 const validShippingTimeSet = new Set( [ 'flat', 'manual' ] );
-const validTaxRateSet = new Set( [ 'destination', 'manual' ] );
 
-const checkErrors = (
-	values,
-	shippingTimes,
-	finalCountryCodes,
-	storeCountryCode,
-	hideTaxRates = false
-) => {
+const checkErrors = ( values, shippingTimes, finalCountryCodes ) => {
 	const errors = {};
 
 	// Check audience.
@@ -102,20 +95,6 @@ const checkErrors = (
 		);
 	}
 
-	/**
-	 * Check tax rate (required for U.S. only).
-	 */
-	if (
-		! hideTaxRates &&
-		( storeCountryCode === 'US' || finalCountryCodes.includes( 'US' ) ) &&
-		! validTaxRateSet.has( values.tax_rate )
-	) {
-		errors.tax_rate = __(
-			'Please specify tax rate option.',
-			'google-listings-and-ads'
-		);
-	}
-
 	return errors;
 };
 

js/src/components/free-listings/configure-product-listings/checkErrors.test.js

@@ -41,7 +41,6 @@ describe( 'checkErrors', () => {
 			countries: [ 'US', 'JP' ],
 			shipping_rate: 'flat',
 			shipping_time: 'flat',
-			tax_rate: 'manual',
 			shipping_country_rates: toRates( [ 'US', 10 ], [ 'JP', 30, 88 ] ),
 			offer_free_shipping: true,
 		};
@@ -436,72 +435,4 @@ describe( 'checkErrors', () => {
 			} );
 		} );
 	} );
-
-	describe( `For tax rate, if store country code or selected country codes include 'US'`, () => {
-		let codes;
-
-		beforeEach( () => {
-			codes = [ 'US' ];
-		} );
-
-		it( `When the tax rate option is an invalid value or missing, should not pass`, () => {
-			// Not set yet
-			let errors = checkErrors( defaultFormValues, [], codes );
-
-			expect( errors ).toHaveProperty( 'tax_rate' );
-			expect( errors.tax_rate ).toMatchSnapshot();
-
-			errors = checkErrors( defaultFormValues, [], [], 'US' );
-
-			expect( errors ).toHaveProperty( 'tax_rate' );
-			expect( errors.tax_rate ).toMatchSnapshot();
-
-			// Invalid value
-			errors = checkErrors(
-				{ ...defaultFormValues, tax_rate: true },
-				[],
-				codes
-			);
-
-			expect( errors ).toHaveProperty( 'tax_rate' );
-			expect( errors.tax_rate ).toMatchSnapshot();
-
-			// Invalid value
-			errors = checkErrors(
-				{ ...defaultFormValues, tax_rate: 'invalid' },
-				[],
-				codes
-			);
-
-			expect( errors ).toHaveProperty( 'tax_rate' );
-			expect( errors.tax_rate ).toMatchSnapshot();
-		} );
-
-		it( 'When the tax rate option is a valid value, should pass', () => {
-			// Selected destination
-			const destinationTaxRate = {
-				...defaultFormValues,
-				tax_rate: 'destination',
-			};
-
-			let errors = checkErrors( destinationTaxRate, [], codes );
-
-			expect( errors ).not.toHaveProperty( 'tax_rate' );
-
-			errors = checkErrors( destinationTaxRate, [], [], 'US' );
-
-			expect( errors ).not.toHaveProperty( 'tax_rate' );
-
-			// Selected manual
-			const manualTaxRate = { ...defaultFormValues, tax_rate: 'manual' };
-
-			errors = checkErrors( manualTaxRate, [], codes );
-
-			expect( errors ).not.toHaveProperty( 'tax_rate' );
-
-			errors = checkErrors( destinationTaxRate, [], [], 'US' );
-
-			expect( errors ).not.toHaveProperty( 'tax_rate' );
-		} );
-	} );
 } );

js/src/components/free-listings/setup-free-listings/form-content.js

@@ -10,13 +10,10 @@ import { useAdaptiveFormContext } from '~/components/adaptive-form';
 import StepContent from '~/components/stepper/step-content';
 import StepContentActions from '~/components/stepper/step-content-actions';
 import StepContentFooter from '~/components/stepper/step-content-footer';
-import TaxRate from '~/pages/settings/setup-tax-rate/tax-rate';
-import useDisplayTaxRate from '~/pages/settings/setup-tax-rate/useDisplayTaxRate';
 import ChooseAudienceSection from '~/components/free-listings/choose-audience-section';
 import ShippingRateSection from '~/components/shipping-rate-section';
 import ShippingTimeSection from '~/components/free-listings/configure-product-listings/shipping-time-section';
 import AppButton from '~/components/app-button';
-import ConditionalSection from '~/components/conditional-section';
 import OrderValueConditionSection from '~/components/order-value-condition-section';
 import isNonFreeShippingRate from '~/utils/isNonFreeShippingRate';
 
@@ -25,23 +22,20 @@ import isNonFreeShippingRate from '~/utils/isNonFreeShippingRate';
  *
  * @param {Object} props React props.
  * @param {string} [props.submitLabel="Complete setup"] Submit button label.
- * @param {boolean} [props.hideTaxRates] Whether to hide tax rate section.
  */
 const FormContent = ( {
 	submitLabel = __( 'Complete setup', 'google-listings-and-ads' ),
-	hideTaxRates,
 } ) => {
 	const { values, isValidForm, handleSubmit, adapter } =
 		useAdaptiveFormContext();
-	const displayTaxRate = useDisplayTaxRate( adapter.audienceCountries );
-	const shouldDisplayTaxRate = ! hideTaxRates && displayTaxRate;
+
 	const shouldDisplayShippingTime = values.shipping_time === 'flat';
 	const shouldDisplayOrderValueCondition =
 		values.shipping_rate === 'flat' &&
 		values.shipping_country_rates.some( isNonFreeShippingRate );
 
 	const handleSubmitClick = ( event ) => {
-		if ( shouldDisplayTaxRate !== null && isValidForm ) {
+		if ( isValidForm ) {
 			return handleSubmit( event );
 		}
 
@@ -56,9 +50,6 @@ const FormContent = ( {
 				<OrderValueConditionSection />
 			) }
 			{ shouldDisplayShippingTime && <ShippingTimeSection /> }
-			<ConditionalSection show={ shouldDisplayTaxRate }>
-				<TaxRate />
-			</ConditionalSection>
 			<StepContentFooter>
 				<StepContentActions>
 					<AppButton

js/src/components/free-listings/setup-free-listings/index.js

@@ -8,7 +8,6 @@
 /**
  * Internal dependencies
  */
-import useStoreCountry from '~/hooks/useStoreCountry';
 import AppSpinner from '~/components/app-spinner';
 import Hero from '~/components/free-listings/configure-product-listings/hero';
 import AdaptiveForm from '~/components/adaptive-form';
@@ -32,7 +31,7 @@
  *
  * If we are adding a new settings field, it should be added into this array.
  */
-const settingsFieldNames = [ 'shipping_rate', 'shipping_time', 'tax_rate' ];
+const settingsFieldNames = [ 'shipping_rate', 'shipping_time' ];
 
 /**
  * Get settings object from Form values.
@@ -69,7 +68,6 @@
  * @param {() => void} [props.onContinue] Callback called once continue button is clicked. Could be async. While it's being resolved the form would turn into a saving state.
  * @param {string} [props.submitLabel] Submit button label, to be forwarded to `FormContent`.
  * @param {JSX.Element} props.headerTitle Title in the header block of this setup.
- * @param {boolean} [props.hideTaxRates=false] Whether to hide tax rate section, to be forwarded to `FormContent`.
  */
 const SetupFreeListings = ( {
 	targetAudience,
@@ -84,10 +82,8 @@
 	onContinue = noop,
 	submitLabel,
 	headerTitle,
-	hideTaxRates = false,
 } ) => {
 	const formRef = useRef();
-	const { code: storeCountryCode } = useStoreCountry();
 
 	if ( ! ( targetAudience && settings && shippingRates && shippingTimes ) ) {
 		return <AppSpinner />;
@@ -97,13 +93,7 @@
 		const countries = resolveFinalCountries( values );
 		const { shipping_country_times: shippingTimesData } = values;
 
-		return checkErrors(
-			values,
-			shippingTimesData,
-			countries,
-			storeCountryCode,
-			hideTaxRates
-		);
+		return checkErrors( values, shippingTimesData, countries );
 	};
 
 	const handleChange = ( change, values ) => {
@@ -220,7 +210,6 @@
 					// These are the fields for settings.
 					shipping_rate: settings.shipping_rate,
 					shipping_time: settings.shipping_time,
-					tax_rate: settings.tax_rate,
 					// This is used in UI only, not used in API.
 					offer_free_shipping:
 						getOfferFreeShippingInitialValue( shippingRates ),
@@ -233,10 +222,7 @@
 				validate={ handleValidate }
 				onSubmit={ onContinue }
 			>
-				<FormContent
-					submitLabel={ submitLabel }
-					hideTaxRates={ hideTaxRates }
-				/>
+				<FormContent submitLabel={ submitLabel } />
 			</AdaptiveForm>
 		</div>
 	);

js/src/components/order-value-condition-section/minimum-order-card/minimum-order-card.test.js

@@ -43,7 +43,6 @@ const adaptiveFormContextDefaultValues = {
 	shipping_country_times: [],
 	shipping_rate: true,
 	shipping_time: true,
-	tax_rate: null,
 };
 
 const adaptiveFormInputPropsDefaultValues = {

js/src/components/shipping-rate-section/shipping-rate-section.test.js

@@ -40,7 +40,6 @@ jest.mock( '~/components/adaptive-form', () => ( {
 					shipping_country_times: [],
 					shipping_rate: 'flat',
 					shipping_time: 'flat',
-					tax_rate: null,
 				},
 			};
 		} ),

js/src/pages/onboarding/setup-stepper/saved-setup-stepper.js

@@ -165,7 +165,6 @@ const SavedSetupStepper = ( { savedStep } ) => {
 							targetAudience={ initTargetAudience }
 							settings={ initSettings }
 							shippingRates={ initShippingRates }
-							hideTaxRates={ true }
 							shippingTimes={ initShippingTimes }
 							resolveFinalCountries={ getFinalCountries }
 							onTargetAudienceChange={ handleFormChange.bind(

js/src/pages/settings/index.js

@@ -13,6 +13,7 @@ import useGoogleAccount from '~/hooks/useGoogleAccount';
 import useUpdateRestAPIAuthorizeStatusByUrlQuery from '~/hooks/useUpdateRestAPIAuthorizeStatusByUrlQuery';
 import { subpaths, getReconnectAccountUrl } from '~/utils/urls';
 import { ContactInformationPreview } from '~/components/contact-information';
+import SetupTaxRate from './setup-tax-rate';
 import LinkedAccounts from './linked-accounts';
 import ReconnectWPComAccount from './reconnect-wpcom-account';
 import ReconnectGoogleAccount from './reconnect-google-account';
@@ -65,6 +66,7 @@ const Settings = () => {
 			<MainTabNav />
 			<RebrandingTour />
 			<ContactInformationPreview />
+			<SetupTaxRate />
 			<LinkedAccounts />
 		</div>
 	);

js/src/pages/settings/setup-tax-rate/index.js

@@ -0,0 +1 @@
+export { default } from './setup-tax-rate';