@wordpress/core-data 4.11.0 → 4.14.0

package/src/batch/create-batch.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { zip } from 'lodash';
-
 /**
  * Internal dependencies
  */
@@ -138,12 +133,8 @@ export default function createBatch( processor = defaultProcessor ) {
 
 			let isSuccess = true;
 
-			for ( const pair of zip( results, queue ) ) {
-				/** @type {{error?: unknown, output?: unknown}} */
-				const result = pair[ 0 ];
-
-				/** @type {{resolve: (value: any) => void; reject: (error: any) => void} | undefined} */
-				const queueItem = pair[ 1 ];
+			results.forEach( ( result, key ) => {
+				const queueItem = queue[ key ];
 
 				if ( result?.error ) {
 					queueItem?.reject( result.error );
@@ -151,7 +142,7 @@ export default function createBatch( processor = defaultProcessor ) {
 				} else {
 					queueItem?.resolve( result?.output ?? result );
 				}
-			}
+			} );
 
 			queue = [];
 

package/src/entities.ts

@@ -1,7 +1,8 @@
 /**
  * External dependencies
  */
-import { upperFirst, camelCase, map, find, get, startCase } from 'lodash';
+import { capitalCase, pascalCase } from 'change-case';
+import { map, find, get } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -457,7 +458,9 @@ async function loadPostTypeEntities() {
 			getTitle: ( record ) =>
 				record?.title?.rendered ||
 				record?.title ||
-				( isTemplate ? startCase( record.slug ) : String( record.id ) ),
+				( isTemplate
+					? capitalCase( record.slug ?? '' )
+					: String( record.id ) ),
 			__unstablePrePersist: isTemplate ? undefined : prePersistPostType,
 			__unstable_rest_base: postType.rest_base,
 		};
@@ -511,12 +514,11 @@ export const getMethodName = (
 	usePlural = false
 ) => {
 	const entityConfig = find( rootEntitiesConfig, { kind, name } );
-	const kindPrefix = kind === 'root' ? '' : upperFirst( camelCase( kind ) );
-	const nameSuffix =
-		upperFirst( camelCase( name ) ) + ( usePlural ? 's' : '' );
+	const kindPrefix = kind === 'root' ? '' : pascalCase( kind );
+	const nameSuffix = pascalCase( name ) + ( usePlural ? 's' : '' );
 	const suffix =
 		usePlural && 'plural' in entityConfig! && entityConfig?.plural
-			? upperFirst( camelCase( entityConfig.plural ) )
+			? pascalCase( entityConfig.plural )
 			: nameSuffix;
 	return `${ prefix }${ kindPrefix }${ suffix }`;
 };

package/src/entity-types/theme.ts

@@ -78,6 +78,10 @@ declare module './base-entity-records' {
 			 * Whether theme opts in to wide alignment CSS class.
 			 */
 			'align-wide': boolean;
+			/**
+			 * Whether appearanceTools are enabled in Global Styles.
+			 */
+			'appearance-tools': boolean;
 			/**
 			 * Whether posts and comments RSS feed links are added to head.
 			 */

package/src/hooks/index.ts

@@ -6,3 +6,7 @@ export {
 	default as useEntityRecords,
 	__experimentalUseEntityRecords,
 } from './use-entity-records';
+export {
+	default as useResourcePermissions,
+	__experimentalUseResourcePermissions,
+} from './use-resource-permissions';

package/src/hooks/test/use-entity-record.js

@@ -50,7 +50,11 @@ describe( 'useEntityRecord', () => {
 		);
 
 		expect( data ).toEqual( {
-			records: undefined,
+			edit: expect.any( Function ),
+			editedRecord: {},
+			hasEdits: false,
+			record: undefined,
+			save: expect.any( Function ),
 			hasResolved: false,
 			isResolving: false,
 			status: 'IDLE',
@@ -66,10 +70,54 @@ describe( 'useEntityRecord', () => {
 		} );
 
 		expect( data ).toEqual( {
+			edit: expect.any( Function ),
+			editedRecord: { hello: 'world', id: 1 },
+			hasEdits: false,
 			record: { hello: 'world', id: 1 },
+			save: expect.any( Function ),
 			hasResolved: true,
 			isResolving: false,
 			status: 'SUCCESS',
 		} );
 	} );
+
+	it( 'applies edits to the entity record', async () => {
+		// Provide response
+		triggerFetch.mockImplementation( () => TEST_RECORD );
+
+		let widget;
+		const TestComponent = () => {
+			widget = useEntityRecord( 'root', 'widget', 1 );
+			return <div />;
+		};
+		render(
+			<RegistryProvider value={ registry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
+
+		await act( async () => {
+			jest.advanceTimersByTime( 1 );
+		} );
+
+		expect( widget ).toEqual( {
+			edit: expect.any( Function ),
+			editedRecord: { hello: 'world', id: 1 },
+			hasEdits: false,
+			record: { hello: 'world', id: 1 },
+			save: expect.any( Function ),
+			hasResolved: true,
+			isResolving: false,
+			status: 'SUCCESS',
+		} );
+
+		await act( async () => {
+			widget.edit( { hello: 'foo' } );
+			jest.advanceTimersByTime( 1 );
+		} );
+
+		expect( widget.hasEdits ).toEqual( true );
+		expect( widget.record ).toEqual( { hello: 'world', id: 1 } );
+		expect( widget.editedRecord ).toEqual( { hello: 'foo', id: 1 } );
+	} );
 } );

package/src/hooks/test/use-resource-permissions.js

@@ -50,28 +50,26 @@ describe( 'useResourcePermissions', () => {
 				<TestComponent />
 			</RegistryProvider>
 		);
-		expect( data ).toEqual( [
-			false,
-			{
-				status: 'IDLE',
-				isResolving: false,
-				canCreate: false,
-			},
-		] );
+		expect( data ).toEqual( {
+			status: 'IDLE',
+			isResolving: false,
+			hasResolved: false,
+			canCreate: false,
+			canRead: false,
+		} );
 
 		// Required to make sure no updates happen outside of act()
 		await act( async () => {
 			jest.advanceTimersByTime( 1 );
 		} );
 
-		expect( data ).toEqual( [
-			true,
-			{
-				status: 'SUCCESS',
-				isResolving: false,
-				canCreate: true,
-			},
-		] );
+		expect( data ).toEqual( {
+			status: 'SUCCESS',
+			isResolving: false,
+			hasResolved: true,
+			canCreate: true,
+			canRead: false,
+		} );
 	} );
 
 	it( 'retrieves the relevant permissions for a resource with a key', async () => {
@@ -85,31 +83,29 @@ describe( 'useResourcePermissions', () => {
 				<TestComponent />
 			</RegistryProvider>
 		);
-		expect( data ).toEqual( [
-			false,
-			{
-				status: 'IDLE',
-				isResolving: false,
-				canCreate: false,
-				canUpdate: false,
-				canDelete: false,
-			},
-		] );
+		expect( data ).toEqual( {
+			status: 'IDLE',
+			isResolving: false,
+			hasResolved: false,
+			canCreate: false,
+			canRead: false,
+			canUpdate: false,
+			canDelete: false,
+		} );
 
 		// Required to make sure no updates happen outside of act()
 		await act( async () => {
 			jest.advanceTimersByTime( 1 );
 		} );
 
-		expect( data ).toEqual( [
-			true,
-			{
-				status: 'SUCCESS',
-				isResolving: false,
-				canCreate: true,
-				canUpdate: false,
-				canDelete: false,
-			},
-		] );
+		expect( data ).toEqual( {
+			status: 'SUCCESS',
+			isResolving: false,
+			hasResolved: true,
+			canCreate: true,
+			canRead: false,
+			canUpdate: false,
+			canDelete: false,
+		} );
 	} );
 } );

package/src/hooks/use-entity-record.ts

@@ -1,7 +1,9 @@
 /**
  * WordPress dependencies
  */
+import { useDispatch, useSelect } from '@wordpress/data';
 import deprecated from '@wordpress/deprecated';
+import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -14,11 +16,25 @@ export interface EntityRecordResolution< RecordType > {
 	/** The requested entity record */
 	record: RecordType | null;
 
+	/** The edited entity record */
+	editedRecord: Partial< RecordType >;
+
+	/** Apply local (in-browser) edits to the edited entity record */
+	edit: ( diff: Partial< RecordType > ) => void;
+
+	/** Persist the edits to the server */
+	save: () => Promise< void >;
+
 	/**
 	 * Is the record still being resolved?
 	 */
 	isResolving: boolean;
 
+	/**
+	 * Does the record have any local edits?
+	 */
+	hasEdits: boolean;
+
 	/**
 	 * Is the record resolved by now?
 	 */
@@ -66,6 +82,60 @@ export interface Options {
  * application, the page and the resolution details will be retrieved from
  * the store state using `getEntityRecord()`, or resolved if missing.
  *
+ * @example
+ * ```js
+ * import { useDispatch } from '@wordpress/data';
+ * import { useCallback } from '@wordpress/element';
+ * import { __ } from '@wordpress/i18n';
+ * import { TextControl } from '@wordpress/components';
+ * import { store as noticeStore } from '@wordpress/notices';
+ * import { useEntityRecord } from '@wordpress/core-data';
+ *
+ * function PageRenameForm( { id } ) {
+ * 	const page = useEntityRecord( 'postType', 'page', id );
+ * 	const { createSuccessNotice, createErrorNotice } =
+ * 		useDispatch( noticeStore );
+ *
+ * 	const setTitle = useCallback( ( title ) => {
+ * 		page.edit( { title } );
+ * 	}, [ page.edit ] );
+ *
+ * 	if ( page.isResolving ) {
+ * 		return 'Loading...';
+ * 	}
+ *
+ * 	async function onRename( event ) {
+ * 		event.preventDefault();
+ * 		try {
+ * 			await page.save();
+ * 			createSuccessNotice( __( 'Page renamed.' ), {
+ * 				type: 'snackbar',
+ * 			} );
+ * 		} catch ( error ) {
+ * 			createErrorNotice( error.message, { type: 'snackbar' } );
+ * 		}
+ * 	}
+ *
+ * 	return (
+ * 		<form onSubmit={ onRename }>
+ * 			<TextControl
+ * 				label={ __( 'Name' ) }
+ * 				value={ page.editedRecord.title }
+ * 				onChange={ setTitle }
+ * 			/>
+ * 			<button type="submit">{ __( 'Save' ) }</button>
+ * 		</form>
+ * 	);
+ * }
+ *
+ * // Rendered in the application:
+ * // <PageRenameForm id={ 1 } />
+ * ```
+ *
+ * In the above example, updating and saving the page title is handled
+ * via the `edit()` and `save()` mutation helpers provided by
+ * `useEntityRecord()`;
+ *
  * @return Entity record data.
  * @template RecordType
  */
@@ -75,7 +145,39 @@ export default function useEntityRecord< RecordType >(
 	recordId: string | number,
 	options: Options = { enabled: true }
 ): EntityRecordResolution< RecordType > {
-	const { data: record, ...rest } = useQuerySelect(
+	const { editEntityRecord, saveEditedEntityRecord } =
+		useDispatch( coreStore );
+
+	const mutations = useMemo(
+		() => ( {
+			edit: ( record ) =>
+				editEntityRecord( kind, name, recordId, record ),
+			save: ( saveOptions: any = {} ) =>
+				saveEditedEntityRecord( kind, name, recordId, {
+					throwOnError: true,
+					...saveOptions,
+				} ),
+		} ),
+		[ recordId ]
+	);
+
+	const { editedRecord, hasEdits } = useSelect(
+		( select ) => ( {
+			editedRecord: select( coreStore ).getEditedEntityRecord(
+				kind,
+				name,
+				recordId
+			),
+			hasEdits: select( coreStore ).hasEditsForEntityRecord(
+				kind,
+				name,
+				recordId
+			),
+		} ),
+		[ kind, name, recordId ]
+	);
+
+	const { data: record, ...querySelectRest } = useQuerySelect(
 		( query ) => {
 			if ( ! options.enabled ) {
 				return null;
@@ -87,7 +189,10 @@ export default function useEntityRecord< RecordType >(
 
 	return {
 		record,
-		...rest,
+		editedRecord,
+		hasEdits,
+		...querySelectRest,
+		...mutations,
 	};
 }
 

package/src/hooks/use-resource-permissions.ts

@@ -1,3 +1,8 @@
+/**
+ * WordPress dependencies
+ */
+import deprecated from '@wordpress/deprecated';
+
 /**
  * Internal dependencies
  */
@@ -65,6 +70,36 @@ type ResourcePermissionsResolution< IdType > = [
  * // <PagesList />
  * ```
  *
+ * @example
+ * ```js
+ * import { useResourcePermissions } from '@wordpress/core-data';
+ *
+ * function Page({ pageId }) {
+ *   const {
+ *     canCreate,
+ *     canUpdate,
+ *     canDelete,
+ *     isResolving
+ *   } = useResourcePermissions( 'pages', pageId );
+ *
+ *   if ( isResolving ) {
+ *     return 'Loading ...';
+ *   }
+ *
+ *   return (
+ *     <div>
+ *       {canCreate ? (<button>+ Create a new page</button>) : false}
+ *       {canUpdate ? (<button>Edit page</button>) : false}
+ *       {canDelete ? (<button>Delete page</button>) : false}
+ *       // ...
+ *     </div>
+ *   );
+ * }
+ *
+ * // Rendered in the application:
+ * // <Page pageId={ 15 } />
+ * ```
+ *
  * In the above example, when `PagesList` is rendered into an
  * application, the appropriate permissions and the resolution details will be retrieved from
  * the store state using `canUser()`, or resolved if missing.
@@ -72,7 +107,7 @@ type ResourcePermissionsResolution< IdType > = [
  * @return Entity records data.
  * @template IdType
  */
-export default function __experimentalUseResourcePermissions< IdType = void >(
+export default function useResourcePermissions< IdType = void >(
 	resource: string,
 	id?: IdType
 ): ResourcePermissionsResolution< IdType > {
@@ -81,22 +116,39 @@ export default function __experimentalUseResourcePermissions< IdType = void >(
 			const { canUser } = resolve( coreStore );
 			const create = canUser( 'create', resource );
 			if ( ! id ) {
-				return [
-					create.hasResolved,
-					{
-						status: create.status,
-						isResolving: create.isResolving,
-						canCreate: create.hasResolved && create.data,
-					},
-				];
+				const read = canUser( 'read', resource );
+
+				const isResolving = create.isResolving || read.isResolving;
+				const hasResolved = create.hasResolved && read.hasResolved;
+				let status = Status.Idle;
+				if ( isResolving ) {
+					status = Status.Resolving;
+				} else if ( hasResolved ) {
+					status = Status.Success;
+				}
+
+				return {
+					status,
+					isResolving,
+					hasResolved,
+					canCreate: create.hasResolved && create.data,
+					canRead: read.hasResolved && read.data,
+				};
 			}
 
+			const read = canUser( 'read', resource, id );
 			const update = canUser( 'update', resource, id );
 			const _delete = canUser( 'delete', resource, id );
 			const isResolving =
-				create.isResolving || update.isResolving || _delete.isResolving;
+				read.isResolving ||
+				create.isResolving ||
+				update.isResolving ||
+				_delete.isResolving;
 			const hasResolved =
-				create.hasResolved && update.hasResolved && _delete.hasResolved;
+				read.hasResolved &&
+				create.hasResolved &&
+				update.hasResolved &&
+				_delete.hasResolved;
 
 			let status = Status.Idle;
 			if ( isResolving ) {
@@ -104,17 +156,27 @@ export default function __experimentalUseResourcePermissions< IdType = void >(
 			} else if ( hasResolved ) {
 				status = Status.Success;
 			}
-			return [
+			return {
+				status,
+				isResolving,
 				hasResolved,
-				{
-					status,
-					isResolving,
-					canCreate: hasResolved && create.data,
-					canUpdate: hasResolved && update.data,
-					canDelete: hasResolved && _delete.data,
-				},
-			];
+				canRead: hasResolved && read.data,
+				canCreate: hasResolved && create.data,
+				canUpdate: hasResolved && update.data,
+				canDelete: hasResolved && _delete.data,
+			};
 		},
 		[ resource, id ]
 	);
 }
+
+export function __experimentalUseResourcePermissions(
+	resource: string,
+	id?: unknown
+) {
+	deprecated( `wp.data.__experimentalUseResourcePermissions`, {
+		alternative: 'wp.data.useResourcePermissions',
+		since: '6.1',
+	} );
+	return useResourcePermissions( resource, id );
+}

package/src/index.js

@@ -68,9 +68,6 @@ export const store = createReduxStore( STORE_NAME, storeConfig() );
 register( store );
 
 export { default as EntityProvider } from './entity-provider';
-export { default as useEntityRecord } from './hooks/use-entity-record';
-export { default as useEntityRecords } from './hooks/use-entity-records';
-export { default as __experimentalUseResourcePermissions } from './hooks/use-resource-permissions';
 export * from './entity-provider';
 export * from './entity-types';
 export * from './fetch';