Switch to rest_preload_api_request for API hydration in cart and checkout blocks. (#4090)

* Introduce hydrate_api_request

* Consume preloadedApiRequests

* no need to set false here

Author: mikejolley

assets/js/base/context/providers/cart-checkout/checkout-state/constants.js

@@ -15,10 +15,12 @@ export const STATUS = {
 	AFTER_PROCESSING: 'after_processing',
 };
 
-const checkoutData = getSetting( 'checkoutData', {
+const preloadedApiRequests = getSetting( 'preloadedApiRequests', {} );
+const checkoutData = {
 	order_id: 0,
 	customer_id: 0,
-} );
+	...( preloadedApiRequests[ '/wc/store/checkout' ]?.body || {} ),
+};
 
 export const DEFAULT_STATE = {
 	redirectUrl: '',

assets/js/blocks/cart-checkout/checkout/checkout-order-error/index.js

@@ -34,7 +34,13 @@ const cartItemErrorCodes = [
  * checkout block.
  */
 const CheckoutOrderError = () => {
-	const checkoutData = getSetting( 'checkoutData', {} );
+	const preloadedApiRequests = getSetting( 'preloadedApiRequests', {} );
+	const checkoutData = {
+		code: '',
+		message: '',
+		...( preloadedApiRequests[ '/wc/store/checkout' ]?.body || {} ),
+	};
+
 	const errorData = {
 		code: checkoutData.code || 'unknown',
 		message:

assets/js/hocs/with-store-cart-api-hydration.js

@@ -17,13 +17,18 @@ import { LAST_CART_UPDATE_TIMESTAMP_KEY } from '../data/cart/constants';
  * Makes cart data available without an API request to wc/store/cart/.
  */
 const useStoreCartApiHydration = () => {
-	const cartData = useRef( getSetting( 'cartData' ) );
+	const preloadedApiRequests = useRef(
+		getSetting( 'preloadedApiRequests', {} )
+	);
 	const { setIsCartDataStale } = useDispatch( CART_STORE_KEY );
 
 	useSelect( ( select, registry ) => {
-		if ( ! cartData.current ) {
+		const cartData = preloadedApiRequests.current[ '/wc/store/cart' ]?.body;
+
+		if ( ! cartData ) {
 			return;
 		}
+
 		const { isResolving, hasFinishedResolution, isCartDataStale } = select(
 			CART_STORE_KEY
 		);
@@ -46,7 +51,7 @@ const useStoreCartApiHydration = () => {
 			if ( lastCartUpdateRaw ) {
 				const lastCartUpdate = parseFloat( lastCartUpdateRaw );
 				const cartGeneratedTimestamp = parseFloat(
-					cartData.current.generated_timestamp
+					cartData.generated_timestamp
 				);
 
 				const needsUpdateFromAPI =
@@ -72,10 +77,10 @@ const useStoreCartApiHydration = () => {
 			! hasFinishedResolution( 'getCartData', [] )
 		) {
 			startResolution( 'getCartData', [] );
-			if ( cartData.current?.code?.includes( 'error' ) ) {
-				receiveError( cartData.current );
+			if ( cartData?.code?.includes( 'error' ) ) {
+				receiveError( cartData );
 			} else {
-				receiveCart( cartData.current );
+				receiveCart( cartData );
 			}
 			finishResolution( 'getCartData', [] );
 		}

src/Assets/AssetDataRegistry.php

@@ -272,6 +272,20 @@ public function add( $key, $data, $check_key_exists = false ) {
 		}
 	}
 
+	/**
+	 * Hydrate from API.
+	 *
+	 * @param string $path REST API path to preload.
+	 */
+	public function hydrate_api_request( $path ) {
+		if ( ! isset( $this->data['preloadedApiRequests'] ) ) {
+			$this->data['preloadedApiRequests'] = [];
+		}
+		if ( ! isset( $this->data['preloadedApiRequests'][ $path ] ) ) {
+			$this->data['preloadedApiRequests'] = rest_preload_api_request( $this->data['preloadedApiRequests'], $path );
+		}
+	}
+
 	/**
 	 * Adds a page permalink to the data registry.
 	 *

src/BlockTypes/Cart.php

@@ -159,9 +159,7 @@ protected function deep_sort_with_accents( $array ) {
 	 * Hydrate the cart block with data from the API.
 	 */
 	protected function hydrate_from_api() {
-		if ( ! $this->asset_data_registry->exists( 'cartData' ) ) {
-			$this->asset_data_registry->add( 'cartData', WC()->api->get_endpoint_data( '/wc/store/cart' ) );
-		}
+		$this->asset_data_registry->hydrate_api_request( '/wc/store/cart' );
 	}
 
 	/**

src/BlockTypes/Checkout.php

@@ -216,14 +216,10 @@ protected function hydrate_from_api() {
 		// Controller and converted to exceptions.
 		wc_print_notices();
 
-		if ( ! $this->asset_data_registry->exists( 'cartData' ) ) {
-			$this->asset_data_registry->add( 'cartData', WC()->api->get_endpoint_data( '/wc/store/cart' ) );
-		}
-		if ( ! $this->asset_data_registry->exists( 'checkoutData' ) ) {
-			add_filter( 'woocommerce_store_api_disable_nonce_check', '__return_true' );
-			$this->asset_data_registry->add( 'checkoutData', WC()->api->get_endpoint_data( '/wc/store/checkout' ) );
-			remove_filter( 'woocommerce_store_api_disable_nonce_check', '__return_true' );
-		}
+		add_filter( 'woocommerce_store_api_disable_nonce_check', '__return_true' );
+		$this->asset_data_registry->hydrate_api_request( '/wc/store/cart' );
+		$this->asset_data_registry->hydrate_api_request( '/wc/store/checkout' );
+		remove_filter( 'woocommerce_store_api_disable_nonce_check', '__return_true' );
 	}
 
 	/**