Display shipping calculator link for guests shopper (https://github.com/woocommerce/woocommerce-blocks/pull/11442)

* Display shipping calculator when formatted address is present

- Earlier, shipping calculator was getting displayed based on the isAddressComplete value.
- For the scenarios where address was incomplete but formatted address was present shipping calculator was not getting displayed.
- This made shipping calculator not getting displayed for guest shoppers.
- With this, conditions are changed from isAddressComplete to formatShippingAddress to display shipping calculator if formatted address is present.
- Add unit test case for the condition for formatted address.

* Update comments to explain the condition to hide shipping calculator

- Update the comments to add the reason to hide shipping calculator.
- When there is no default customer location in the store and the customer has not entered their address, but there is a default shipping method available for all locations, then we will hide the shipping calculator.
This commit is contained in:
Tarun Vijwani 2023-10-25 22:50:13 +04:00 committed by GitHub
parent d74b0423e1
commit 503b2c8dbb
2 changed files with 52 additions and 7 deletions

View File

@ -2,10 +2,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import {
formatShippingAddress,
isAddressComplete,
} from '@woocommerce/base-utils';
import { formatShippingAddress } from '@woocommerce/base-utils';
import { useEditorContext } from '@woocommerce/base-context';
import { ShippingAddress as ShippingAddressType } from '@woocommerce/settings';
import PickupLocation from '@woocommerce/base-components/cart-checkout/pickup-location';
@ -31,15 +28,19 @@ export const ShippingAddress = ( {
setIsShippingCalculatorOpen,
shippingAddress,
}: ShippingAddressProps ): JSX.Element | null => {
const addressComplete = isAddressComplete( shippingAddress );
const { isEditor } = useEditorContext();
const prefersCollection = useSelect( ( select ) =>
select( CHECKOUT_STORE_KEY ).prefersCollection()
);
// If the address is incomplete, and we're not in the editor, don't show anything.
if ( ! addressComplete && ! isEditor ) {
const hasFormattedAddress = !! formatShippingAddress( shippingAddress );
// If there is no default customer location set in the store, the customer hasn't provided their address,
// but a default shipping method is available for all locations,
// then the shipping calculator will be hidden to avoid confusion.
if ( ! hasFormattedAddress && ! isEditor ) {
return null;
}
const formattedLocation = formatShippingAddress( shippingAddress );
return (
<>

View File

@ -295,4 +295,48 @@ describe( 'TotalsShipping', () => {
screen.queryByText( 'Add an address for shipping options' )
).not.toBeInTheDocument();
} );
it( 'does show the calculator button when default rates are available and has formatted address', () => {
baseContextHooks.useStoreCart.mockReturnValue( {
cartItems: mockPreviewCart.items,
cartTotals: [ mockPreviewCart.totals ],
cartCoupons: mockPreviewCart.coupons,
cartFees: mockPreviewCart.fees,
cartNeedsShipping: mockPreviewCart.needs_shipping,
shippingRates: mockPreviewCart.shipping_rates,
shippingAddress: {
...shippingAddress,
city: '',
state: 'California',
country: 'US',
postcode: '',
},
billingAddress: mockPreviewCart.billing_address,
cartHasCalculatedShipping: mockPreviewCart.has_calculated_shipping,
isLoadingRates: false,
} );
render(
<SlotFillProvider>
<TotalsShipping
currency={ {
code: 'USD',
symbol: '$',
position: 'left',
precision: 2,
} }
values={ {
total_shipping: '0',
total_shipping_tax: '0',
} }
showCalculator={ true }
showRateSelector={ true }
isCheckout={ false }
className={ '' }
/>
</SlotFillProvider>
);
expect( screen.queryByText( 'Change address' ) ).toBeInTheDocument();
expect(
screen.queryByText( 'Add an address for shipping options' )
).not.toBeInTheDocument();
} );
} );