Merge branch 'trunk' into 9331-with-gutenberg-trunk-the-images-arent-…

…loaded-on-the-site-editor

assets/js/data/cart/test/notify-quantity-changes.ts

@@ -3,15 +3,17 @@
  */
 import { dispatch, select } from '@wordpress/data';
 import { previewCart } from '@woocommerce/resource-previews';
-import { klona } from 'klona/json';
-import { Cart, CartResponse } from '@woocommerce/types';
+import { Cart } from '@woocommerce/types';
 import { camelCaseKeys } from '@woocommerce/base-utils';
 
 /**
  * Internal dependencies
  */
 import { notifyQuantityChanges } from '../notify-quantity-changes';
 
+// Deep clone an object to avoid mutating it later.
+const cloneObject = ( obj ) => JSON.parse( JSON.stringify( obj ) );
+
 jest.mock( '@wordpress/data' );
 
 const mockedCreateInfoNotice = jest.fn();
@@ -35,12 +37,8 @@ select.mockImplementation( () => {
  * Clones the preview cart and turns it into a `Cart`.
  */
 const getFreshCarts = (): { oldCart: Cart; newCart: Cart } => {
-	const oldCart = camelCaseKeys(
-		klona< CartResponse >( previewCart )
-	) as Cart;
-	const newCart = camelCaseKeys(
-		klona< CartResponse >( previewCart )
-	) as Cart;
+	const oldCart = camelCaseKeys( cloneObject( previewCart ) ) as Cart;
+	const newCart = camelCaseKeys( cloneObject( previewCart ) ) as Cart;
 	return { oldCart, newCart };
 };
 

assets/js/data/utils/update-state.ts

@@ -1,33 +1,37 @@
 /**
- * External dependencies
+ * Utility for updating nested state in the path that changed.
  */
-import { klona } from 'klona/json';
+function updateNested< T >( // The state being updated
+	state: T,
+	// The path being updated
+	path: string[],
+	// The value to update for the path
+	value: unknown,
+	// The current index in the path
+	index = 0
+): T {
+	const key = path[ index ] as keyof T;
+	if ( index === path.length - 1 ) {
+		return { ...state, [ key ]: value };
+	}
+
+	const nextState = state[ key ] || {};
+	return {
+		...state,
+		[ key ]: updateNested( nextState, path, value, index + 1 ),
+	} as T;
+}
 
 /**
  * Utility for updating state and only cloning objects in the path that changed.
  */
-export default function updateState< Type extends Record< string, unknown > >(
+export default function updateState< T >(
 	// The state being updated
-	state: Type,
+	state: T,
 	// The path being updated
-	path: Array< keyof Type >,
+	path: string[],
 	// The value to update for the path
 	value: unknown
-): Type {
-	const newState = klona( state ) as Type;
-
-	let current: Record< string, unknown > = newState;
-	for ( let i = 0; i < path.length; i++ ) {
-		const key = path[ i ] as string;
-
-		if ( i === path.length - 1 ) {
-			current[ key ] = value;
-		} else {
-			current[ key ] = current[ key ] || {};
-		}
-
-		current = current[ key ] as Record< string, unknown >;
-	}
-
-	return newState;
+): T {
+	return updateNested( state, path, value );
 }