2022-03-04 17:43:45 +00:00
|
|
|
/**
|
|
|
|
* External dependencies
|
|
|
|
*/
|
2023-01-30 15:12:17 +00:00
|
|
|
import {
|
|
|
|
CART_STORE_KEY as storeKey,
|
|
|
|
processErrorResponse,
|
|
|
|
} from '@woocommerce/block-data';
|
2022-12-15 23:52:03 +00:00
|
|
|
import { useSelect, useDispatch } from '@wordpress/data';
|
|
|
|
import { isObject } from '@woocommerce/types';
|
|
|
|
import { useEffect, useRef, useCallback } from '@wordpress/element';
|
2022-03-04 17:43:45 +00:00
|
|
|
import { deriveSelectedShippingRates } from '@woocommerce/base-utils';
|
|
|
|
import isShallowEqual from '@wordpress/is-shallow-equal';
|
2022-07-27 06:00:17 +00:00
|
|
|
import { previewCart } from '@woocommerce/resource-previews';
|
2022-03-04 17:43:45 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Internal dependencies
|
|
|
|
*/
|
2022-12-15 23:52:03 +00:00
|
|
|
import { useStoreEvents } from '../use-store-events';
|
|
|
|
import type { ShippingData } from './types';
|
2022-03-04 17:43:45 +00:00
|
|
|
|
|
|
|
export const useShippingData = (): ShippingData => {
|
|
|
|
const {
|
|
|
|
shippingRates,
|
|
|
|
needsShipping,
|
|
|
|
hasCalculatedShipping,
|
2022-03-14 11:29:25 +00:00
|
|
|
isLoadingRates,
|
2022-10-18 16:31:06 +00:00
|
|
|
isCollectable,
|
2023-01-19 16:40:52 +00:00
|
|
|
isSelectingRate,
|
2022-03-04 17:43:45 +00:00
|
|
|
} = useSelect( ( select ) => {
|
2022-07-27 06:00:17 +00:00
|
|
|
const isEditor = !! select( 'core/editor' );
|
2022-03-04 17:43:45 +00:00
|
|
|
const store = select( storeKey );
|
2022-10-18 16:31:06 +00:00
|
|
|
const rates = isEditor
|
|
|
|
? previewCart.shipping_rates
|
|
|
|
: store.getShippingRates();
|
2022-03-04 17:43:45 +00:00
|
|
|
return {
|
2022-10-18 16:31:06 +00:00
|
|
|
shippingRates: rates,
|
2022-07-27 06:00:17 +00:00
|
|
|
needsShipping: isEditor
|
|
|
|
? previewCart.needs_shipping
|
|
|
|
: store.getNeedsShipping(),
|
|
|
|
hasCalculatedShipping: isEditor
|
2022-07-28 09:22:42 +00:00
|
|
|
? previewCart.has_calculated_shipping
|
2022-07-27 06:00:17 +00:00
|
|
|
: store.getHasCalculatedShipping(),
|
|
|
|
isLoadingRates: isEditor ? false : store.isCustomerDataUpdating(),
|
2022-10-18 16:31:06 +00:00
|
|
|
isCollectable: rates.every(
|
|
|
|
( { shipping_rates: packageShippingRates } ) =>
|
|
|
|
packageShippingRates.find(
|
|
|
|
( { method_id: methodId } ) =>
|
|
|
|
methodId === 'pickup_location'
|
|
|
|
)
|
|
|
|
),
|
2023-01-19 16:40:52 +00:00
|
|
|
isSelectingRate: isEditor
|
|
|
|
? false
|
|
|
|
: store.isShippingRateBeingSelected(),
|
2022-03-04 17:43:45 +00:00
|
|
|
};
|
|
|
|
} );
|
2022-12-15 23:52:03 +00:00
|
|
|
|
2022-03-04 17:43:45 +00:00
|
|
|
// set selected rates on ref so it's always current.
|
2022-12-15 23:52:03 +00:00
|
|
|
const selectedRates = useRef< Record< string, string > >( {} );
|
2022-03-04 17:43:45 +00:00
|
|
|
useEffect( () => {
|
2022-06-15 09:56:52 +00:00
|
|
|
const derivedSelectedRates =
|
|
|
|
deriveSelectedShippingRates( shippingRates );
|
2022-03-04 17:43:45 +00:00
|
|
|
if (
|
|
|
|
isObject( derivedSelectedRates ) &&
|
|
|
|
! isShallowEqual( selectedRates.current, derivedSelectedRates )
|
|
|
|
) {
|
|
|
|
selectedRates.current = derivedSelectedRates;
|
|
|
|
}
|
|
|
|
}, [ shippingRates ] );
|
|
|
|
|
2022-12-15 23:52:03 +00:00
|
|
|
const { selectShippingRate: dispatchSelectShippingRate } = useDispatch(
|
|
|
|
storeKey
|
|
|
|
) as {
|
|
|
|
selectShippingRate: unknown;
|
|
|
|
} as {
|
|
|
|
selectShippingRate: (
|
|
|
|
newShippingRateId: string,
|
2023-01-30 15:12:17 +00:00
|
|
|
packageId?: string | number | undefined
|
2022-12-15 23:52:03 +00:00
|
|
|
) => Promise< unknown >;
|
|
|
|
};
|
|
|
|
|
|
|
|
// Selects a shipping rate, fires an event, and catch any errors.
|
|
|
|
const { dispatchCheckoutEvent } = useStoreEvents();
|
|
|
|
const selectShippingRate = useCallback(
|
|
|
|
(
|
|
|
|
newShippingRateId: string,
|
|
|
|
packageId?: string | number | undefined
|
|
|
|
): void => {
|
|
|
|
let selectPromise;
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Picking location handling
|
|
|
|
*
|
|
|
|
* Forces pickup location to be selected for all packages since we don't allow a mix of shipping and pickup.
|
|
|
|
*/
|
|
|
|
const hasSelectedLocalPickup = !! Object.values(
|
|
|
|
selectedRates.current
|
|
|
|
).find( ( rate ) => rate.includes( 'pickup_location:' ) );
|
|
|
|
|
|
|
|
if (
|
|
|
|
newShippingRateId.includes( 'pickup_location:' ) ||
|
|
|
|
hasSelectedLocalPickup
|
|
|
|
) {
|
|
|
|
selectPromise = dispatchSelectShippingRate( newShippingRateId );
|
|
|
|
} else {
|
|
|
|
selectPromise = dispatchSelectShippingRate(
|
|
|
|
newShippingRateId,
|
|
|
|
packageId
|
|
|
|
);
|
|
|
|
}
|
|
|
|
selectPromise
|
|
|
|
.then( () => {
|
|
|
|
dispatchCheckoutEvent( 'set-selected-shipping-rate', {
|
|
|
|
shippingRateId: newShippingRateId,
|
|
|
|
} );
|
|
|
|
} )
|
|
|
|
.catch( ( error ) => {
|
2023-01-30 15:12:17 +00:00
|
|
|
processErrorResponse( error );
|
2022-12-15 23:52:03 +00:00
|
|
|
} );
|
|
|
|
},
|
2023-01-30 15:12:17 +00:00
|
|
|
[ dispatchSelectShippingRate, dispatchCheckoutEvent, selectedRates ]
|
2022-12-15 23:52:03 +00:00
|
|
|
);
|
|
|
|
|
2022-03-04 17:43:45 +00:00
|
|
|
return {
|
|
|
|
isSelectingRate,
|
|
|
|
selectedRates: selectedRates.current,
|
|
|
|
selectShippingRate,
|
|
|
|
shippingRates,
|
|
|
|
needsShipping,
|
|
|
|
hasCalculatedShipping,
|
2022-03-14 11:29:25 +00:00
|
|
|
isLoadingRates,
|
2022-10-18 16:31:06 +00:00
|
|
|
isCollectable,
|
2022-12-15 23:52:03 +00:00
|
|
|
hasSelectedLocalPickup: !! Object.values( selectedRates.current ).find(
|
|
|
|
( rate ) => rate.includes( 'pickup_location:' )
|
|
|
|
),
|
2022-03-04 17:43:45 +00:00
|
|
|
};
|
|
|
|
};
|