Remove CustomerDataContext (https://github.com/woocommerce/woocommerce-blocks/pull/7686)

* Remove CustomerDataContext

* bot: update checkstyle.xml

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

plugins/woocommerce-blocks/assets/js/base/context/hooks/payment-methods/use-payment-method-interface.ts

@@ -11,7 +11,11 @@ import deprecated from '@wordpress/deprecated';
 import LoadingMask from '@woocommerce/base-components/loading-mask';
 import type { PaymentMethodInterface } from '@woocommerce/types';
 import { useSelect, useDispatch } from '@wordpress/data';
-import { CHECKOUT_STORE_KEY, PAYMENT_STORE_KEY } from '@woocommerce/block-data';
+import {
+	CHECKOUT_STORE_KEY,
+	PAYMENT_STORE_KEY,
+	CART_STORE_KEY,
+} from '@woocommerce/block-data';
 import { ValidationInputError } from '@woocommerce/blocks-checkout';
 
 /**
@@ -23,7 +27,6 @@ import { noticeContexts, responseTypes } from '../../event-emit';
 import { useCheckoutEventsContext } from '../../providers/cart-checkout/checkout-events';
 import { usePaymentEventsContext } from '../../providers/cart-checkout/payment-events';
 import { useShippingDataContext } from '../../providers/cart-checkout/shipping';
-import { useCustomerDataContext } from '../../providers/cart-checkout/customer';
 import { prepareTotalItems } from './utils';
 import { useShippingData } from '../shipping/use-shipping-data';
 
@@ -92,8 +95,11 @@ export const usePaymentMethodInterface = (): PaymentMethodInterface => {
 		selectShippingRate,
 		needsShipping,
 	} = useShippingData();
-	const { billingAddress, shippingAddress, setShippingAddress } =
+
-		useCustomerDataContext();
+	const { billingAddress, shippingAddress } = useSelect( ( select ) =>
+		select( CART_STORE_KEY ).getCustomerData()
+	);
+	const { setShippingAddress } = useDispatch( CART_STORE_KEY );
 	const { cartItems, cartFees, cartTotals, extensions } = useStoreCart();
 	const { appliedCoupons } = useStoreCartCoupons();
 	const currentCartTotals = useRef(

plugins/woocommerce-blocks/assets/js/base/context/hooks/tsconfig.json

@@ -4,6 +4,9 @@
 	"include": [
 		".",
 		"../../../../../packages/checkout/index.js",
+		"../providers/cart-checkout/checkout-events/index.tsx",
+		"../providers/cart-checkout/payment-events/index.tsx",
+		"../providers/cart-checkout/shipping/index.js"
 	],
 	"exclude": [ "**/test/**" ]
 }

plugins/woocommerce-blocks/assets/js/base/context/providers/cart-checkout/checkout-processor.js

@@ -19,6 +19,7 @@ import {
 	CHECKOUT_STORE_KEY,
 	PAYMENT_STORE_KEY,
 	VALIDATION_STORE_KEY,
+	CART_STORE_KEY,
 } from '@woocommerce/block-data';
 import {
 	getPaymentMethods,
@@ -31,7 +32,6 @@ import {
 import { preparePaymentData, processCheckoutResponseHeaders } from './utils';
 import { useCheckoutEventsContext } from './checkout-events';
 import { useShippingDataContext } from './shipping';
-import { useCustomerDataContext } from './customer';
 import { useStoreCart } from '../../hooks/cart/use-store-cart';
 
 /**
@@ -72,7 +72,11 @@ const CheckoutProcessor = () => {
 		( select ) => select( VALIDATION_STORE_KEY ).hasValidationErrors
 	);
 	const { shippingErrorStatus } = useShippingDataContext();
-	const { billingAddress, shippingAddress } = useCustomerDataContext();
+
+	const { billingAddress, shippingAddress } = useSelect( ( select ) =>
+		select( CART_STORE_KEY ).getCustomerData()
+	);
+
 	const { cartNeedsPayment, cartNeedsShipping, receiveCart } = useStoreCart();
 	const { createErrorNotice, removeNotice } = useDispatch( 'core/notices' );
 

plugins/woocommerce-blocks/assets/js/base/context/providers/cart-checkout/checkout-provider.js

@@ -9,7 +9,6 @@ import BlockErrorBoundary from '@woocommerce/base-components/block-error-boundar
  */
 import { PaymentEventsProvider } from './payment-events';
 import { ShippingDataProvider } from './shipping';
-import { CustomerDataProvider } from './customer';
 import { CheckoutEventsProvider } from './checkout-events';
 import CheckoutProcessor from './checkout-processor';
 
@@ -28,23 +27,21 @@ import CheckoutProcessor from './checkout-processor';
 export const CheckoutProvider = ( { children, redirectUrl } ) => {
 	return (
 		<CheckoutEventsProvider redirectUrl={ redirectUrl }>
-			<CustomerDataProvider>
+			<ShippingDataProvider>
-				<ShippingDataProvider>
+				<PaymentEventsProvider>
-					<PaymentEventsProvider>
+					{ children }
-						{ children }
+					{ /* If the current user is an admin, we let BlockErrorBoundary render
-						{ /* If the current user is an admin, we let BlockErrorBoundary render
 								the error, or we simply die silently. */ }
-						<BlockErrorBoundary
+					<BlockErrorBoundary
-							renderError={
+						renderError={
-								CURRENT_USER_IS_ADMIN ? null : () => null
+							CURRENT_USER_IS_ADMIN ? null : () => null
-							}
+						}
-						>
+					>
-							<PluginArea scope="woocommerce-checkout" />
+						<PluginArea scope="woocommerce-checkout" />
-						</BlockErrorBoundary>
+					</BlockErrorBoundary>
-						<CheckoutProcessor />
+					<CheckoutProcessor />
-					</PaymentEventsProvider>
+				</PaymentEventsProvider>
-				</ShippingDataProvider>
+			</ShippingDataProvider>
-			</CustomerDataProvider>
 		</CheckoutEventsProvider>
 	);
 };

plugins/woocommerce-blocks/assets/js/base/context/providers/cart-checkout/customer/constants.ts

@@ -1,31 +0,0 @@
-/**
- * Internal dependencies
- */
-import type { CustomerDataType } from '../../../hooks/use-customer-data';
-
-export const defaultBillingAddress: CustomerDataType[ 'billingAddress' ] = {
-	first_name: '',
-	last_name: '',
-	company: '',
-	address_1: '',
-	address_2: '',
-	city: '',
-	state: '',
-	postcode: '',
-	country: '',
-	email: '',
-	phone: '',
-};
-
-export const defaultShippingAddress: CustomerDataType[ 'shippingAddress' ] = {
-	first_name: '',
-	last_name: '',
-	company: '',
-	address_1: '',
-	address_2: '',
-	city: '',
-	state: '',
-	postcode: '',
-	country: '',
-	phone: '',
-};

plugins/woocommerce-blocks/assets/js/base/context/providers/cart-checkout/customer/index.tsx

@@ -1,42 +0,0 @@
-/**
- * External dependencies
- */
-import { createContext, useContext } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { defaultBillingAddress, defaultShippingAddress } from './constants';
-import {
-	useCustomerData,
-	CustomerDataType,
-} from '../../../hooks/use-customer-data';
-
-const CustomerDataContext = createContext< CustomerDataType >( {
-	isInitialized: false,
-	billingAddress: defaultBillingAddress,
-	shippingAddress: defaultShippingAddress,
-	setBillingAddress: () => void 0,
-	setShippingAddress: () => void 0,
-} );
-
-export const useCustomerDataContext = (): CustomerDataType => {
-	return useContext( CustomerDataContext );
-};
-
-/**
- * Customer Data context provider.
- */
-export const CustomerDataProvider = ( {
-	children,
-}: {
-	children: JSX.Element | JSX.Element[];
-} ): JSX.Element => {
-	const contextValue = useCustomerData();
-
-	return (
-		<CustomerDataContext.Provider value={ contextValue }>
-			{ children }
-		</CustomerDataContext.Provider>
-	);
-};

plugins/woocommerce-blocks/assets/js/base/context/providers/cart-checkout/index.js

@@ -1,6 +1,5 @@
 export * from './payment-events';
 export * from './shipping';
-export * from './customer';
 export * from './checkout-events';
 export * from './cart';
 export * from './checkout-processor';

plugins/woocommerce-blocks/assets/js/data/payment/utils/check-payment-methods.ts

@@ -30,11 +30,8 @@ import {
 	EMPTY_CART_ERRORS,
 	EMPTY_CART_ITEM_ERRORS,
 	EMPTY_EXTENSIONS,
-} from '../../constants';
+} from '../../../data/constants';
-import {
+import { defaultCartState } from '../../../data/cart/default-state';
-	defaultBillingAddress,
-	defaultShippingAddress,
-} from '../../../base/context/providers/cart-checkout/customer/constants';
 
 export const checkPaymentMethodsCanPay = async ( express = false ) => {
 	const isEditor = !! select( 'core/editor' );
@@ -122,9 +119,9 @@ export const checkPaymentMethodsCanPay = async ( express = false ) => {
 			cartTotals: previewCart.totals,
 			cartIsLoading: false,
 			cartErrors: EMPTY_CART_ERRORS,
-			billingData: defaultBillingAddress,
+			billingData: defaultCartState.cartData.billingAddress,
-			billingAddress: defaultBillingAddress,
+			billingAddress: defaultCartState.cartData.billingAddress,
-			shippingAddress: defaultShippingAddress,
+			shippingAddress: defaultCartState.cartData.shippingAddress,
 			extensions: EMPTY_EXTENSIONS,
 			shippingRates: previewCart.shipping_rates,
 			isLoadingRates: false,

plugins/woocommerce-blocks/checkstyle.xml

@@ -1049,10 +1049,10 @@
 <file name="assets/js/base/context/providers/cart-checkout/checkout-provider.js">
 <error line="4" column="28" severity="error" message="Could not find a declaration file for module &apos;@wordpress/plugins&apos;. &apos;/home/runner/work/woocommerce-blocks/woocommerce-blocks/node_modules/@wordpress/plugins/build/index.js&apos; implicitly has an &apos;any&apos; type.
   Try `npm i --save-dev @types/wordpress__plugins` if it exists or add a new declaration (.d.ts) file containing `declare module &apos;@wordpress/plugins&apos;;`" source="TS7016" />
-<error line="30" column="27" severity="error" message="Type &apos;string | undefined&apos; is not assignable to type &apos;string&apos;.
+<error line="29" column="27" severity="error" message="Type &apos;string | undefined&apos; is not assignable to type &apos;string&apos;.
   Type &apos;undefined&apos; is not assignable to type &apos;string&apos;." source="TS2322" />
-<error line="31" column="4" severity="error" message="Type &apos;Element&apos; is missing the following properties from type &apos;ReactChildren&apos;: map, forEach, count, only, toArray" source="TS2739" />
+<error line="30" column="4" severity="error" message="Type &apos;Element&apos; is missing the following properties from type &apos;ReactChildren&apos;: map, forEach, count, only, toArray" source="TS2739" />
-<error line="38" column="8" severity="error" message="No overload matches this call.
+<error line="36" column="7" severity="error" message="No overload matches this call.
   Overload 1 of 2, &apos;(props: BlockErrorBoundaryProps | Readonly&lt;BlockErrorBoundaryProps&gt;): BlockErrorBoundary&apos;, gave the following error.
     Type &apos;(() =&gt; null) | null&apos; is not assignable to type &apos;(props: RenderErrorProps) =&gt; ReactNode&apos;.
       Type &apos;null&apos; is not assignable to type &apos;(props: RenderErrorProps) =&gt; ReactNode&apos;.

plugins/woocommerce-blocks/docs/internal-developers/block-client-apis/checkout/checkout-api.md

@@ -79,15 +79,6 @@ Much of the data and api interface for components in the Checkout Block are cons
 
 You can find type definitions (`typedef`) for contexts in [this file](../../../../assets/js/types/type-defs/contexts.js).
 
-### Customer Data Context
-
-The customer data context exposes the api interfaces for the following things via the `useCustomerDataContext` hook:
-
--   `billingData`: The currently set billing data.
--   `setBillingData`: A state updated for updating the billing data state with new billing data.
--   `shippingAddress`: The current set shipping address.
--   `setShippingAddress`: A function for setting the shipping address. This will trigger shipping rates updates.
-
 ### Shipping Method Data context
 
 The shipping method data context exposes the api interfaces for the following things (typedef `ShippingMethodDataContext`) via the `useShippingMethodData` hook: