Move the switch to enable new Font Library to Experiments setting

lib/experimental/editor-settings.php

@@ -34,6 +34,10 @@ function gutenberg_enable_experiments() {
 	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-block-hooks', $gutenberg_experiments ) ) {
 		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalBlockHooks = true', 'before' );
 	}
+
+	if ( $gutenberg_experiments && array_key_exists( 'gutenberg-font-library', $gutenberg_experiments ) ) {
+		wp_add_inline_script( 'wp-block-editor', 'window.__experimentalFontLibrary = true', 'before' );
+	}
 }
 
 add_action( 'admin_init', 'gutenberg_enable_experiments' );

lib/experiments-page.php

@@ -127,6 +127,17 @@ function gutenberg_initialize_experiments_settings() {
 		)
 	);
 
+	add_settings_field(
+		'gutenberg-font-library',
+		__( 'Font Library', 'gutenberg' ),
+		'gutenberg_display_experiment_field',
+		'gutenberg-experiments',
+		'gutenberg_experiments_section',
+		array(
+			'label' => __( 'Enable the New Font Library', 'gutenberg' ),
+			'id'    => 'gutenberg-font-library',
+		)
+	);
 	register_setting(
 		'gutenberg-experiments',
 		'gutenberg-experiments'

lib/load.php

@@ -134,9 +134,10 @@ function gutenberg_is_experiment_enabled( $name ) {
  * the Font Face (redesigned Fonts API) to be merged before the Font Library while
  * keeping Fonts API available for sites that are using it.
  */
+
+$gutenberg_experiments = get_option( 'gutenberg-experiments' );
 if (
-	( defined( 'FONT_LIBRARY_ENABLE' ) && FONT_LIBRARY_ENABLE ) ||
-	( defined( 'FONTS_LIBRARY_ENABLE' ) && FONTS_LIBRARY_ENABLE )
+	$gutenberg_experiments && array_key_exists( 'gutenberg-font-library', $gutenberg_experiments )
 ) {
 	// Loads the Font Library.
 	if ( ! class_exists( 'WP_Font_Library' ) ) {

packages/core-data/src/actions.js

@@ -14,6 +14,7 @@ import deprecated from '@wordpress/deprecated';
 /**
  * Internal dependencies
  */
+import { getNestedValue, setNestedValue } from './utils';
 import { receiveItems, removeItems, receiveQueriedItems } from './queried-data';
 import { getOrLoadEntitiesConfig, DEFAULT_ENTITY_KEY } from './entities';
 import { createBatch } from './batch';
@@ -779,7 +780,7 @@ export const saveEditedEntityRecord =
  * @param {string} kind        Kind of the entity.
  * @param {string} name        Name of the entity.
  * @param {Object} recordId    ID of the record.
- * @param {Array}  itemsToSave List of entity properties to save.
+ * @param {Array}  itemsToSave List of entity properties or properties paths to save.
  * @param {Object} options     Saving options.
  */
 export const __experimentalSaveSpecifiedEntityEdits =
@@ -794,10 +795,9 @@ export const __experimentalSaveSpecifiedEntityEdits =
 			recordId
 		);
 		const editsToSave = {};
-		for ( const edit in edits ) {
-			if ( itemsToSave.some( ( item ) => item === edit ) ) {
-				editsToSave[ edit ] = edits[ edit ];
-			}
+
+		for ( const item of itemsToSave ) {
+			setNestedValue( editsToSave, item, getNestedValue( edits, item ) );
 		}
 
 		const configs = await dispatch( getOrLoadEntitiesConfig( kind ) );
@@ -814,7 +814,6 @@ export const __experimentalSaveSpecifiedEntityEdits =
 		if ( recordId ) {
 			editsToSave[ entityIdKey ] = recordId;
 		}
-
 		return await dispatch.saveEntityRecord(
 			kind,
 			name,

packages/core-data/src/utils/get-nested-value.js

@@ -0,0 +1,20 @@
+/**
+ * Helper util to return a value from a certain path of the object.
+ * Path is specified as either:
+ * - a string of properties, separated by dots, for example: "x.y".
+ * - an array of properties, for example `[ 'x', 'y' ]`.
+ * You can also specify a default value in case the result is nullish.
+ *
+ * @param {Object}       object       Input object.
+ * @param {string|Array} path         Path to the object property.
+ * @param {*}            defaultValue Default value if the value at the specified path is nullish.
+ * @return {*} Value of the object property at the specified path.
+ */
+export default function getNestedValue( object, path, defaultValue ) {
+	const normalizedPath = Array.isArray( path ) ? path : path.split( '.' );
+	let value = object;
+	normalizedPath.forEach( ( fieldName ) => {
+		value = value?.[ fieldName ];
+	} );
+	return value !== undefined ? value : defaultValue;
+}

packages/core-data/src/utils/index.js

@@ -7,3 +7,4 @@ export { default as replaceAction } from './replace-action';
 export { default as withWeakMapCache } from './with-weak-map-cache';
 export { default as isRawAttribute } from './is-raw-attribute';
 export { default as setNestedValue } from './set-nested-value';
+export { default as getNestedValue } from './get-nested-value';

packages/core-data/src/utils/set-nested-value.js

@@ -4,6 +4,10 @@
  * Arrays are created for missing index properties while objects are created
  * for all other missing properties.
  *
+ * Path is specified as either:
+ * - a string of properties, separated by dots, for example: "x.y".
+ * - an array of properties, for example `[ 'x', 'y' ]`.
+ *
  * This function intentionally mutates the input object.
  *
  * Inspired by _.set().
@@ -12,24 +16,26 @@
  *
  * @todo Needs to be deduplicated with its copy in `@wordpress/edit-site`.
  *
- * @param {Object} object Object to modify
- * @param {Array}  path   Path of the property to set.
- * @param {*}      value  Value to set.
+ * @param {Object}       object Object to modify
+ * @param {Array|string} path   Path of the property to set.
+ * @param {*}            value  Value to set.
  */
 export default function setNestedValue( object, path, value ) {
 	if ( ! object || typeof object !== 'object' ) {
 		return object;
 	}
 
-	path.reduce( ( acc, key, idx ) => {
+	const normalizedPath = Array.isArray( path ) ? path : path.split( '.' );
+
+	normalizedPath.reduce( ( acc, key, idx ) => {
 		if ( acc[ key ] === undefined ) {
-			if ( Number.isInteger( path[ idx + 1 ] ) ) {
+			if ( Number.isInteger( normalizedPath[ idx + 1 ] ) ) {
 				acc[ key ] = [];
 			} else {
 				acc[ key ] = {};
 			}
 		}
-		if ( idx === path.length - 1 ) {
+		if ( idx === normalizedPath.length - 1 ) {
 			acc[ key ] = value;
 		}
 		return acc[ key ];

packages/core-data/src/utils/test/get-nested-value.js

@@ -0,0 +1,61 @@
+/**
+ * Internal dependencies
+ */
+import getNestedValue from '../get-nested-value';
+
+describe( 'setNestedValue', () => {
+	it( 'should return the same object unmodified if path is an empty array', () => {
+		const input = { x: 'y' };
+		const result = getNestedValue( input, [] );
+		expect( result ).toEqual( input );
+	} );
+
+	it( 'should the nested value', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = getNestedValue( input, [ 'x', 'y', 'z' ] );
+
+		expect( result ).toEqual( 123 );
+	} );
+
+	it( 'should return the nested value if the path is a string', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = getNestedValue( input, 'x.y.z' );
+
+		expect( result ).toEqual( 123 );
+	} );
+
+	it( 'should return the shallow value', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = getNestedValue( input, 'x' );
+
+		expect( result ).toEqual( { y: { z: 123 } } );
+	} );
+
+	it( 'should return the default value if the nested value is undefined', () => {
+		const input = { x: { y: { z: undefined } } };
+		const result = getNestedValue( input, [ 'x', 'y', 'z' ], 456 );
+
+		expect( result ).toEqual( 456 );
+	} );
+
+	it( 'should return the nested value if it different to undefined', () => {
+		const input = { x: { y: { z: null } } };
+		const result = getNestedValue( input, 'x.y.z', 456 );
+
+		expect( result ).toBeNull();
+	} );
+
+	it( 'should return the default value if the nested value does not exist', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = getNestedValue( input, [ 'x', 'y', 'z1' ], 456 );
+
+		expect( result ).toEqual( 456 );
+	} );
+
+	it( 'should return undefined if the nested value does not exist', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = getNestedValue( input, [ 'x', 'y', 'z1' ] );
+
+		expect( result ).toBeUndefined();
+	} );
+} );

packages/core-data/src/utils/test/set-nested-value.js

@@ -19,6 +19,13 @@ describe( 'setNestedValue', () => {
 		expect( result ).toEqual( { x: { y: { z: 456 } } } );
 	} );
 
+	it( 'should set values at deep level having a string as path', () => {
+		const input = { x: { y: { z: 123 } } };
+		const result = setNestedValue( input, 'x.y.z', 456 );
+
+		expect( result ).toEqual( { x: { y: { z: 456 } } } );
+	} );
+
 	it( 'should create nested objects if necessary', () => {
 		const result = setNestedValue( {}, [ 'x', 'y', 'z' ], 123 );