woocommerce/plugins/woocommerce-blocks/assets/js/base/context/hooks/use-checkout-address.ts

109 lines
2.8 KiB
TypeScript
Raw Normal View History

/**
* External dependencies
*/
import {
defaultAddressFields,
AddressFields,
ShippingAddress,
BillingAddress,
getSetting,
} from '@woocommerce/settings';
import { useCallback } from '@wordpress/element';
Convert checkout context to data store - part 1 (https://github.com/woocommerce/woocommerce-blocks/pull/6232) * Add checkout data store * wip on checkout data store * CheckoutContext now uses the checkout store * Investigated and removed setting the redirectUrl on the default state * update extension and address hooks to use checkout data store * use checkout data store in checkout-processor and use-checkout-button * trim useCheckoutContext from use-payment-method-interface && use-store-cart-item-quantity * Remove useCheckoutContext from shipping provider * Remove isCalculating from state * Removed useCheckoutContext from lots of places * Remove useCheckoutContext from checkout-payment-block * Remove useCheckoutContext in checkout-shipping-methods-block and checkout-shipping-address-block * add isCart selector and action and update the checkoutstate context * Fixed redirectUrl bug by using thunks * Remove dispatchActions from checkout-state * Change SET_HAS_ERROR action to be neater * Thomas' feedback * Tidy up * Oops, deleted things I shouldn't have * Typescript * Fix types * Fix tests * Remove isCart * Update docs and remove unecessary getRedirectUrl() selector * set correct type for preloadedCheckoutData * Remove duplicate Address type * Fix missing addresses from type-defs index * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Revert feedback changes * REvert feedback formatting * Update docs formatting * Delete empty types.ts file * remove merge conflict from docs * Correct linting in docs Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
2022-06-10 16:33:15 +00:00
import { useDispatch, useSelect } from '@wordpress/data';
import { CHECKOUT_STORE_KEY } from '@woocommerce/block-data';
/**
* Internal dependencies
*/
import { useCustomerData } from './use-customer-data';
Try move shipping related dat to a `@wordpress/data` store (https://github.com/woocommerce/woocommerce-blocks/pull/5896) * Add address-related items to wc/store/cart data store * Add useUpdateCustomerData hook This allows us to have a single hook responsible for updating the customer information on the server. * Add useUpdateCustomerData hook in Checkout block * Remove shippingAsBilling from previousCustomerData ref type * Add useShippingAsBillingCheckbox hook * Remove checkbox handling from useCheckoutAddress * Merge with woocommerce/woocommerce-blocks#5810 changes * Move shipping as billing to checkout state context provider * Subscribe to changes * Cache customerDataToUpdate * Combine customerDataType and customerDataContextType * Fix notice context * Clean up inline docs for push changes * Add useShippingData hook * Add shipping related selectors to cart store * Update useShippingDataContext to useCustomerData hook * Update uses of useShippingDataContext to get data from hook instead * Remove rogue linebreak * Re-add linebreak * Re-add linebreak, remove shippingAsBilling * Re-add linebreak * Use useShippingData and useCustomerData instead of context * Fix fromEntriesPolyfill to use number or undefined as an index option * Convert derive-selected-shipping-rates to TS * Add SelectShippingRateType * Get needsShipping from new hook and not context * Get address data from useCustomerData instead of useShippingDataContext * Move selectedRates, selectShippingRate and isSelectingRate * Remove items from ShippingDatacontext that are available in data stores * Get shipping data from stores, not context in payment method interface * Consider shipping rates to be loading if customer data is updating * Get rates from useShippingData hook instead of context * Fix incorrect TypeScript types and incorrectly named destructure * Move useShippingData into shipping folder * Update tests to mock useShippingData instead of context * Remove empty string fallback from shipping phone * Get types from Cart declaration instead of Picking them Co-authored-by: Mike Jolley <mike.jolley@me.com>
2022-03-04 17:43:45 +00:00
import { useShippingData } from './shipping/use-shipping-data';
interface CheckoutAddress {
shippingAddress: ShippingAddress;
billingAddress: BillingAddress;
setShippingAddress: ( data: Partial< ShippingAddress > ) => void;
setBillingAddress: ( data: Partial< BillingAddress > ) => void;
setEmail: ( value: string ) => void;
setBillingPhone: ( value: string ) => void;
setShippingPhone: ( value: string ) => void;
useShippingAsBilling: boolean;
setUseShippingAsBilling: ( useShippingAsBilling: boolean ) => void;
defaultAddressFields: AddressFields;
showShippingFields: boolean;
showBillingFields: boolean;
forcedBillingAddress: boolean;
useBillingAsShipping: boolean;
needsShipping: boolean;
showShippingMethods: boolean;
}
/**
* Custom hook for exposing address related functionality for the checkout address form.
*/
export const useCheckoutAddress = (): CheckoutAddress => {
Try move shipping related dat to a `@wordpress/data` store (https://github.com/woocommerce/woocommerce-blocks/pull/5896) * Add address-related items to wc/store/cart data store * Add useUpdateCustomerData hook This allows us to have a single hook responsible for updating the customer information on the server. * Add useUpdateCustomerData hook in Checkout block * Remove shippingAsBilling from previousCustomerData ref type * Add useShippingAsBillingCheckbox hook * Remove checkbox handling from useCheckoutAddress * Merge with woocommerce/woocommerce-blocks#5810 changes * Move shipping as billing to checkout state context provider * Subscribe to changes * Cache customerDataToUpdate * Combine customerDataType and customerDataContextType * Fix notice context * Clean up inline docs for push changes * Add useShippingData hook * Add shipping related selectors to cart store * Update useShippingDataContext to useCustomerData hook * Update uses of useShippingDataContext to get data from hook instead * Remove rogue linebreak * Re-add linebreak * Re-add linebreak, remove shippingAsBilling * Re-add linebreak * Use useShippingData and useCustomerData instead of context * Fix fromEntriesPolyfill to use number or undefined as an index option * Convert derive-selected-shipping-rates to TS * Add SelectShippingRateType * Get needsShipping from new hook and not context * Get address data from useCustomerData instead of useShippingDataContext * Move selectedRates, selectShippingRate and isSelectingRate * Remove items from ShippingDatacontext that are available in data stores * Get shipping data from stores, not context in payment method interface * Consider shipping rates to be loading if customer data is updating * Get rates from useShippingData hook instead of context * Fix incorrect TypeScript types and incorrectly named destructure * Move useShippingData into shipping folder * Update tests to mock useShippingData instead of context * Remove empty string fallback from shipping phone * Get types from Cart declaration instead of Picking them Co-authored-by: Mike Jolley <mike.jolley@me.com>
2022-03-04 17:43:45 +00:00
const { needsShipping } = useShippingData();
const { useShippingAsBilling, prefersCollection } = useSelect(
( select ) => ( {
useShippingAsBilling:
select( CHECKOUT_STORE_KEY ).getUseShippingAsBilling(),
prefersCollection: select( CHECKOUT_STORE_KEY ).prefersCollection(),
} )
Convert checkout context to data store - part 1 (https://github.com/woocommerce/woocommerce-blocks/pull/6232) * Add checkout data store * wip on checkout data store * CheckoutContext now uses the checkout store * Investigated and removed setting the redirectUrl on the default state * update extension and address hooks to use checkout data store * use checkout data store in checkout-processor and use-checkout-button * trim useCheckoutContext from use-payment-method-interface && use-store-cart-item-quantity * Remove useCheckoutContext from shipping provider * Remove isCalculating from state * Removed useCheckoutContext from lots of places * Remove useCheckoutContext from checkout-payment-block * Remove useCheckoutContext in checkout-shipping-methods-block and checkout-shipping-address-block * add isCart selector and action and update the checkoutstate context * Fixed redirectUrl bug by using thunks * Remove dispatchActions from checkout-state * Change SET_HAS_ERROR action to be neater * Thomas' feedback * Tidy up * Oops, deleted things I shouldn't have * Typescript * Fix types * Fix tests * Remove isCart * Update docs and remove unecessary getRedirectUrl() selector * set correct type for preloadedCheckoutData * Remove duplicate Address type * Fix missing addresses from type-defs index * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Update docs/block-client-apis/checkout/checkout-api.md Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com> * Revert feedback changes * REvert feedback formatting * Update docs formatting * Delete empty types.ts file * remove merge conflict from docs * Correct linting in docs Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
2022-06-10 16:33:15 +00:00
);
const { __internalSetUseShippingAsBilling } =
useDispatch( CHECKOUT_STORE_KEY );
const {
billingAddress,
setBillingAddress,
shippingAddress,
setShippingAddress,
} = useCustomerData();
const setEmail = useCallback(
( value ) =>
void setBillingAddress( {
email: value,
} ),
[ setBillingAddress ]
);
const setBillingPhone = useCallback(
( value ) =>
void setBillingAddress( {
phone: value,
} ),
[ setBillingAddress ]
);
const setShippingPhone = useCallback(
( value ) =>
void setShippingAddress( {
phone: value,
} ),
[ setShippingAddress ]
);
const forcedBillingAddress: boolean = getSetting(
'forcedBillingAddress',
false
);
return {
shippingAddress,
billingAddress,
setShippingAddress,
setBillingAddress,
setEmail,
setBillingPhone,
setShippingPhone,
defaultAddressFields,
useShippingAsBilling,
setUseShippingAsBilling: __internalSetUseShippingAsBilling,
needsShipping,
showShippingFields:
! forcedBillingAddress && needsShipping && ! prefersCollection,
showShippingMethods: needsShipping && ! prefersCollection,
showBillingFields:
! needsShipping || ! useShippingAsBilling || prefersCollection,
forcedBillingAddress,
useBillingAsShipping: forcedBillingAddress || prefersCollection,
};
};