Remove Shipping calculator settings and link to the WooCommerce admin…

… settings (#11184) * Remove block level options in favour of settings * Remove calculator toggle test * Update assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/block.tsx Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Remove unused attributes --------- Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
woocommerce · Oct 11, 2023 · a030d05 · a030d05
1 parent b23e003
commit a030d05
Show file tree

Hide file tree

Showing 18 changed files with 55 additions and 190 deletions.
diff --git a/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/attributes.tsx b/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/attributes.tsx
diff --git a/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/block.tsx b/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/block.tsx
@@ -5,14 +5,9 @@ import { TotalsShipping } from '@woocommerce/base-components/cart-checkout';
 import { getCurrencyFromPriceResponse } from '@woocommerce/price-format';
 import { useStoreCart } from '@woocommerce/base-context/hooks';
 import { TotalsWrapper } from '@woocommerce/blocks-checkout';
+import { getSetting } from '@woocommerce/settings';
 
-const Block = ( {
-	className,
-	isShippingCalculatorEnabled,
-}: {
-	className: string;
-	isShippingCalculatorEnabled: boolean;
-} ): JSX.Element | null => {
+const Block = ( { className }: { className: string } ): JSX.Element | null => {
 	const { cartTotals, cartNeedsShipping } = useStoreCart();
 
 	if ( ! cartNeedsShipping ) {
@@ -24,7 +19,10 @@ const Block = ( {
 	return (
 		<TotalsWrapper className={ className }>
 			<TotalsShipping
-				showCalculator={ isShippingCalculatorEnabled }
+				showCalculator={ getSetting< boolean >(
+					'isShippingCalculatorEnabled',
+					true
+				) }
 				showRateSelector={ true }
 				values={ cartTotals }
 				currency={ totalsCurrency }

diff --git a/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/edit.tsx b/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/edit.tsx
@@ -3,8 +3,8 @@
  */
 import { __ } from '@wordpress/i18n';
 import { useBlockProps, InspectorControls } from '@wordpress/block-editor';
-import { PanelBody, ToggleControl } from '@wordpress/components';
-import { getSetting } from '@woocommerce/settings';
+import { PanelBody, ExternalLink } from '@wordpress/components';
+import { ADMIN_URL, getSetting } from '@woocommerce/settings';
 import Noninteractive from '@woocommerce/base-components/noninteractive';
 
 /**
@@ -14,19 +14,16 @@ import Block from './block';
 
 export const Edit = ( {
 	attributes,
-	setAttributes,
 }: {
 	attributes: {
-		isShippingCalculatorEnabled: boolean;
 		className: string;
 		lock: {
 			move: boolean;
 			remove: boolean;
 		};
 	};
-	setAttributes: ( attributes: Record< string, unknown > ) => void;
 } ): JSX.Element => {
-	const { isShippingCalculatorEnabled, className } = attributes;
+	const { className } = attributes;
 	const shippingEnabled = getSetting( 'shippingEnabled', true );
 	const blockProps = useBlockProps();
 
@@ -36,35 +33,29 @@ export const Edit = ( {
 				{ !! shippingEnabled && (
 					<PanelBody
 						title={ __(
-							'Shipping rates',
+							'Shipping Calculations',
 							'woo-gutenberg-products-block'
 						) }
 					>
-						<ToggleControl
-							label={ __(
-								'Shipping calculator',
+						<p className="wc-block-checkout__controls-text">
+							{ __(
+								'Options that control shipping can be managed in your store settings.',
 								'woo-gutenberg-products-block'
 							) }
-							help={ __(
-								'Allow customers to estimate shipping by entering their address.',
+						</p>
+						<ExternalLink
+							href={ `${ ADMIN_URL }admin.php?page=wc-settings&tab=shipping&section=options` }
+						>
+							{ __(
+								'Manage shipping options',
 								'woo-gutenberg-products-block'
 							) }
-							checked={ isShippingCalculatorEnabled }
-							onChange={ () =>
-								setAttributes( {
-									isShippingCalculatorEnabled:
-										! isShippingCalculatorEnabled,
-								} )
-							}
-						/>
+						</ExternalLink>{ ' ' }
 					</PanelBody>
 				) }
 			</InspectorControls>
 			<Noninteractive>
-				<Block
-					className={ className }
-					isShippingCalculatorEnabled={ isShippingCalculatorEnabled }
-				/>
+				<Block className={ className } />
 			</Noninteractive>
 		</div>
 	);

diff --git a/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/frontend.tsx b/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/frontend.tsx
@@ -1,12 +1,6 @@
-/**
- * External dependencies
- */
-import { withFilteredAttributes } from '@woocommerce/shared-hocs';
-
 /**
  * Internal dependencies
  */
 import Block from './block';
-import attributes from './attributes';
 
-export default withFilteredAttributes( attributes )( Block );
+export default Block;
diff --git a/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/index.tsx b/assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/index.tsx
@@ -9,7 +9,6 @@ import { registerBlockType } from '@wordpress/blocks';
  * Internal dependencies
  */
 import { Edit, Save } from './edit';
-import attributes from './attributes';
 
 registerBlockType( 'woocommerce/cart-order-summary-shipping-block', {
 	icon: {
@@ -20,7 +19,6 @@ registerBlockType( 'woocommerce/cart-order-summary-shipping-block', {
 			/>
 		),
 	},
-	attributes,
 	edit: Edit,
 	save: Save,
 } );
diff --git a/assets/js/blocks/cart/test/block.js b/assets/js/blocks/cart/test/block.js
@@ -40,15 +40,10 @@ jest.mock( '@wordpress/compose', () => ( {
 const CartBlock = ( {
 	attributes = {
 		showRateAfterTaxName: false,
-		isShippingCalculatorEnabled: false,
 		checkoutPageId: 0,
 	},
 } ) => {
-	const {
-		showRateAfterTaxName,
-		isShippingCalculatorEnabled,
-		checkoutPageId,
-	} = attributes;
+	const { showRateAfterTaxName, checkoutPageId } = attributes;
 	return (
 		<Cart attributes={ attributes }>
 			<FilledCart>
@@ -59,11 +54,7 @@ const CartBlock = ( {
 					<OrderSummaryBlock>
 						<OrderSummaryHeadingBlock />
 						<OrderSummarySubtotalBlock />
-						<OrderSummaryShippingBlock
-							isShippingCalculatorEnabled={
-								isShippingCalculatorEnabled
-							}
-						/>
+						<OrderSummaryShippingBlock />
 						<OrderSummaryTaxesBlock
 							showRateAfterTaxName={ showRateAfterTaxName }
 						/>

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-contact-information-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-contact-information-block/edit.tsx
@@ -49,7 +49,7 @@ export const Edit = ( {
 				>
 					<p className="wc-block-checkout__controls-text">
 						{ __(
-							'Account creation and guest checkout settings can be managed in the WooCommerce settings.',
+							'Account creation and guest checkout settings can be managed in your store settings.',
 							'woo-gutenberg-products-block'
 						) }
 					</p>

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/attributes.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/attributes.tsx
@@ -44,8 +44,4 @@ export default {
 			remove: true,
 		},
 	},
-	shippingCostRequiresAddress: {
-		type: 'boolean',
-		default: false,
-	},
 };
diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/block.json b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/block.json
@@ -19,10 +19,6 @@
 				"remove": true,
 				"move": true
 			}
-		},
-		"shippingCostRequiresAddress": {
-			"type": "boolean",
-			"default": false
 		}
 	},
 	"parent": [ "woocommerce/checkout-fields-block" ],

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/block.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/block.tsx
@@ -13,6 +13,7 @@ import { useEffect } from '@wordpress/element';
 import { CART_STORE_KEY, VALIDATION_STORE_KEY } from '@woocommerce/block-data';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { isPackageRateCollectable } from '@woocommerce/base-utils';
+import { getSetting } from '@woocommerce/settings';
 
 /**
  * Internal dependencies
@@ -164,17 +165,19 @@ const Block = ( {
 	showIcon,
 	localPickupText,
 	shippingText,
-	shippingCostRequiresAddress = false,
 }: {
 	checked: string;
 	onChange: ( value: string ) => void;
 	showPrice: boolean;
 	showIcon: boolean;
-	shippingCostRequiresAddress: boolean;
 	localPickupText: string;
 	shippingText: string;
 } ): JSX.Element | null => {
 	const { shippingRates } = useShippingData();
+	const shippingCostRequiresAddress = getSetting< boolean >(
+		'shippingCostRequiresAddress',
+		false
+	);
 
 	return (
 		<RadioGroup

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/edit.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/edit.tsx
@@ -23,8 +23,6 @@ import { innerBlockAreas } from '@woocommerce/blocks-checkout';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { CHECKOUT_STORE_KEY } from '@woocommerce/block-data';
 import ExternalLinkCard from '@woocommerce/editor-components/external-link-card';
-import { Attributes } from '@woocommerce/blocks/checkout/types';
-import { updateAttributeInSiblingBlock } from '@woocommerce/utils';
 
 /**
  * Internal dependencies
@@ -154,9 +152,7 @@ const ShippingSelector = ( {
 export const Edit = ( {
 	attributes,
 	setAttributes,
-	clientId,
 }: {
-	clientId: string;
 	attributes: {
 		title: string;
 		description: string;
@@ -167,16 +163,9 @@ export const Edit = ( {
 		showPrice: boolean;
 		showIcon: boolean;
 		className: string;
-		shippingCostRequiresAddress: boolean;
 	};
 	setAttributes: ( attributes: Record< string, unknown > ) => void;
 } ): JSX.Element | null => {
-	const toggleAttribute = ( key: keyof Attributes ): void => {
-		const newAttributes = {} as Partial< Attributes >;
-		newAttributes[ key ] = ! ( attributes[ key ] as boolean );
-		setAttributes( newAttributes );
-	};
-
 	const { setPrefersCollection } = useDispatch( CHECKOUT_STORE_KEY );
 	const { prefersCollection } = useSelect( ( select ) => {
 		const checkoutStore = select( CHECKOUT_STORE_KEY );
@@ -221,30 +210,6 @@ export const Edit = ( {
 			) }
 		>
 			<InspectorControls>
-				<PanelBody
-					title={ __(
-						'Calculations',
-						'woo-gutenberg-products-block'
-					) }
-				>
-					<ToggleControl
-						label={ __(
-							'Hide shipping costs until an address is entered',
-							'woo-gutenberg-products-block'
-						) }
-						checked={ attributes.shippingCostRequiresAddress }
-						onChange={ ( selected ) => {
-							updateAttributeInSiblingBlock(
-								clientId,
-								'shippingCostRequiresAddress',
-								selected,
-								'woocommerce/checkout-shipping-methods-block'
-							);
-
-							toggleAttribute( 'shippingCostRequiresAddress' );
-						} }
-					/>
-				</PanelBody>
 				<PanelBody
 					title={ __( 'Appearance', 'woo-gutenberg-products-block' ) }
 				>

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/frontend.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-method-block/frontend.tsx
@@ -25,12 +25,10 @@ const FrontendBlock = ( {
 	showIcon,
 	shippingText,
 	localPickupText,
-	shippingCostRequiresAddress,
 }: {
 	title: string;
 	description: string;
 	showStepNumber: boolean;
-	shippingCostRequiresAddress: boolean;
 	children: JSX.Element;
 	className?: string;
 	showPrice: boolean;
@@ -92,7 +90,6 @@ const FrontendBlock = ( {
 				showIcon={ showIcon }
 				localPickupText={ localPickupText }
 				shippingText={ shippingText }
-				shippingCostRequiresAddress={ shippingCostRequiresAddress }
 			/>
 			{ children }
 		</FormStep>

diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/attributes.tsx b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/attributes.tsx
@@ -24,8 +24,4 @@ export default {
 			remove: true,
 		},
 	},
-	shippingCostRequiresAddress: {
-		type: 'boolean',
-		default: false,
-	},
 };
diff --git a/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/block.json b/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/block.json
@@ -19,10 +19,6 @@
 				"remove": true,
 				"move": true
 			}
-		},
-		"shippingCostRequiresAddress": {
-			"type": "boolean",
-			"default": false
 		}
 	},
 	"parent": [ "woocommerce/checkout-fields-block" ],