@wordpress/editor 13.32.0 → 13.33.0

package/src/hooks/pattern-overrides.js

@@ -6,6 +6,7 @@ import { privateApis as patternsPrivateApis } from '@wordpress/patterns';
 import { createHigherOrderComponent } from '@wordpress/compose';
 import { useBlockEditingMode } from '@wordpress/block-editor';
 import { useSelect } from '@wordpress/data';
+import { store as blocksStore } from '@wordpress/blocks';
 
 /**
  * Internal dependencies
@@ -14,7 +15,7 @@ import { store as editorStore } from '../store';
 import { unlock } from '../lock-unlock';
 
 const {
-	useSetPatternBindings,
+	PatternOverridesControls,
 	ResetOverridesControl,
 	PATTERN_TYPES,
 	PARTIAL_SYNCING_SUPPORTED_BLOCKS,
@@ -38,7 +39,6 @@ const withPatternOverrideControls = createHigherOrderComponent(
 		return (
 			<>
 				<BlockEdit { ...props } />
-				{ isSupportedBlock && <BindingUpdater { ...props } /> }
 				{ props.isSelected && isSupportedBlock && (
 					<ControlsWithStoreSubscription { ...props } />
 				) }
@@ -47,22 +47,24 @@ const withPatternOverrideControls = createHigherOrderComponent(
 	}
 );
 
-function BindingUpdater( props ) {
-	const postType = useSelect(
-		( select ) => select( editorStore ).getCurrentPostType(),
-		[]
-	);
-	useSetPatternBindings( props, postType );
-	return null;
-}
-
 // Split into a separate component to avoid a store subscription
 // on every block.
 function ControlsWithStoreSubscription( props ) {
 	const blockEditingMode = useBlockEditingMode();
-	const isEditingPattern = useSelect(
-		( select ) =>
-			select( editorStore ).getCurrentPostType() === PATTERN_TYPES.user,
+	const { hasPatternOverridesSource, isEditingPattern } = useSelect(
+		( select ) => {
+			const { getBlockBindingsSource } = unlock( select( blocksStore ) );
+
+			return {
+				// For editing link to the site editor if the theme and user permissions support it.
+				hasPatternOverridesSource: !! getBlockBindingsSource(
+					'core/pattern-overrides'
+				),
+				isEditingPattern:
+					select( editorStore ).getCurrentPostType() ===
+					PATTERN_TYPES.user,
+			};
+		},
 		[]
 	);
 
@@ -73,14 +75,23 @@ function ControlsWithStoreSubscription( props ) {
 			( binding ) => binding.source === 'core/pattern-overrides'
 		);
 
+	const shouldShowPatternOverridesControls =
+		isEditingPattern && blockEditingMode === 'default';
 	const shouldShowResetOverridesControl =
 		! isEditingPattern &&
 		!! props.attributes.metadata?.name &&
 		blockEditingMode !== 'disabled' &&
 		hasPatternBindings;
 
+	if ( ! hasPatternOverridesSource ) {
+		return null;
+	}
+
 	return (
 		<>
+			{ shouldShowPatternOverridesControls && (
+				<PatternOverridesControls { ...props } />
+			) }
 			{ shouldShowResetOverridesControl && (
 				<ResetOverridesControl { ...props } />
 			) }

package/src/private-apis.js

@@ -1,3 +1,8 @@
+/**
+ * WordPress dependencies
+ */
+import * as interfaceApis from '@wordpress/interface';
+
 /**
  * Internal dependencies
  */
@@ -5,6 +10,7 @@ import EditorCanvas from './components/editor-canvas';
 import { ExperimentalEditorProvider } from './components/provider';
 import { lock } from './lock-unlock';
 import { EntitiesSavedStatesExtensible } from './components/entities-saved-states';
+import useAutoSwitchEditorSidebars from './components/provider/use-auto-switch-editor-sidebars';
 import useBlockEditorSettings from './components/provider/use-block-editor-settings';
 import DocumentTools from './components/document-tools';
 import InserterSidebar from './components/inserter-sidebar';
@@ -16,8 +22,12 @@ import PostPanelRow from './components/post-panel-row';
 import PostViewLink from './components/post-view-link';
 import PreviewDropdown from './components/preview-dropdown';
 import PreferencesModal from './components/preferences-modal';
+import PostActions from './components/post-actions';
 import { usePostActions } from './components/post-actions/actions';
 import PostCardPanel from './components/post-card-panel';
+import PostStatus from './components/post-status';
+
+const { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;
 
 export const privateApis = {};
 lock( privateApis, {
@@ -30,13 +40,18 @@ lock( privateApis, {
 	ModeSwitcher,
 	PatternOverridesPanel,
 	PluginPostExcerpt,
+	PostActions,
 	PostPanelRow,
 	PostViewLink,
 	PreviewDropdown,
 	PreferencesModal,
 	usePostActions,
 	PostCardPanel,
+	PostStatus,
 
 	// This is a temporary private API while we're updating the site editor to use EditorProvider.
+	useAutoSwitchEditorSidebars,
 	useBlockEditorSettings,
+	interfaceStore,
+	...remainingInterfaceApis,
 } );

package/src/store/constants.js

@@ -20,3 +20,10 @@ export const ONE_MINUTE_IN_MS = 60 * 1000;
 export const AUTOSAVE_PROPERTIES = [ 'title', 'excerpt', 'content' ];
 export const TEMPLATE_POST_TYPE = 'wp_template';
 export const TEMPLATE_PART_POST_TYPE = 'wp_template_part';
+export const PATTERN_POST_TYPE = 'wp_block';
+export const NAVIGATION_POST_TYPE = 'wp_navigation';
+export const TEMPLATE_ORIGINS = {
+	custom: 'custom',
+	theme: 'theme',
+	plugin: 'plugin',
+};

package/src/store/private-actions.js

@@ -2,10 +2,20 @@
  * WordPress dependencies
  */
 import { store as coreStore } from '@wordpress/core-data';
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { store as noticesStore } from '@wordpress/notices';
 import { store as blockEditorStore } from '@wordpress/block-editor';
 import { store as preferencesStore } from '@wordpress/preferences';
+import { addQueryArgs } from '@wordpress/url';
+import apiFetch from '@wordpress/api-fetch';
+import { parse, __unstableSerializeAndClean } from '@wordpress/blocks';
+import { decodeEntities } from '@wordpress/html-entities';
+
+/**
+ * Internal dependencies
+ */
+import isTemplateRevertable from './utils/is-template-revertable';
+import { TEMPLATE_POST_TYPE } from './constants';
 
 /**
  * Returns an action object used to set which template is currently being used/edited.
@@ -140,9 +150,6 @@ export const saveDirtyEntities =
 				);
 			}
 		);
-		if ( ! entitiesToSave.length ) {
-			return;
-		}
 		close?.( entitiesToSave );
 		const siteItemsToSave = [];
 		const pendingSavedRecords = [];
@@ -220,3 +227,261 @@ export const saveDirtyEntities =
 					)
 			);
 	};
+
+/**
+ * Reverts a template to its original theme-provided file.
+ *
+ * @param {Object}  template            The template to revert.
+ * @param {Object}  [options]
+ * @param {boolean} [options.allowUndo] Whether to allow the user to undo
+ *                                      reverting the template. Default true.
+ */
+export const revertTemplate =
+	( template, { allowUndo = true } = {} ) =>
+	async ( { registry } ) => {
+		const noticeId = 'edit-site-template-reverted';
+		registry.dispatch( noticesStore ).removeNotice( noticeId );
+		if ( ! isTemplateRevertable( template ) ) {
+			registry
+				.dispatch( noticesStore )
+				.createErrorNotice( __( 'This template is not revertable.' ), {
+					type: 'snackbar',
+				} );
+			return;
+		}
+
+		try {
+			const templateEntityConfig = registry
+				.select( coreStore )
+				.getEntityConfig( 'postType', template.type );
+
+			if ( ! templateEntityConfig ) {
+				registry
+					.dispatch( noticesStore )
+					.createErrorNotice(
+						__(
+							'The editor has encountered an unexpected error. Please reload.'
+						),
+						{ type: 'snackbar' }
+					);
+				return;
+			}
+
+			const fileTemplatePath = addQueryArgs(
+				`${ templateEntityConfig.baseURL }/${ template.id }`,
+				{ context: 'edit', source: 'theme' }
+			);
+
+			const fileTemplate = await apiFetch( { path: fileTemplatePath } );
+			if ( ! fileTemplate ) {
+				registry
+					.dispatch( noticesStore )
+					.createErrorNotice(
+						__(
+							'The editor has encountered an unexpected error. Please reload.'
+						),
+						{ type: 'snackbar' }
+					);
+				return;
+			}
+
+			const serializeBlocks = ( {
+				blocks: blocksForSerialization = [],
+			} ) => __unstableSerializeAndClean( blocksForSerialization );
+
+			const edited = registry
+				.select( coreStore )
+				.getEditedEntityRecord(
+					'postType',
+					template.type,
+					template.id
+				);
+
+			// We are fixing up the undo level here to make sure we can undo
+			// the revert in the header toolbar correctly.
+			registry.dispatch( coreStore ).editEntityRecord(
+				'postType',
+				template.type,
+				template.id,
+				{
+					content: serializeBlocks, // Required to make the `undo` behave correctly.
+					blocks: edited.blocks, // Required to revert the blocks in the editor.
+					source: 'custom', // required to avoid turning the editor into a dirty state
+				},
+				{
+					undoIgnore: true, // Required to merge this edit with the last undo level.
+				}
+			);
+
+			const blocks = parse( fileTemplate?.content?.raw );
+			registry
+				.dispatch( coreStore )
+				.editEntityRecord( 'postType', template.type, fileTemplate.id, {
+					content: serializeBlocks,
+					blocks,
+					source: 'theme',
+				} );
+
+			if ( allowUndo ) {
+				const undoRevert = () => {
+					registry
+						.dispatch( coreStore )
+						.editEntityRecord(
+							'postType',
+							template.type,
+							edited.id,
+							{
+								content: serializeBlocks,
+								blocks: edited.blocks,
+								source: 'custom',
+							}
+						);
+				};
+
+				registry
+					.dispatch( noticesStore )
+					.createSuccessNotice( __( 'Template reset.' ), {
+						type: 'snackbar',
+						id: noticeId,
+						actions: [
+							{
+								label: __( 'Undo' ),
+								onClick: undoRevert,
+							},
+						],
+					} );
+			}
+		} catch ( error ) {
+			const errorMessage =
+				error.message && error.code !== 'unknown_error'
+					? error.message
+					: __( 'Template revert failed. Please reload.' );
+			registry
+				.dispatch( noticesStore )
+				.createErrorNotice( errorMessage, { type: 'snackbar' } );
+		}
+	};
+
+/**
+ * Action that removes an array of templates.
+ *
+ * @param {Array} items An array of template or template part objects to remove.
+ */
+export const removeTemplates =
+	( items ) =>
+	async ( { registry } ) => {
+		const isTemplate = items[ 0 ].type === TEMPLATE_POST_TYPE;
+		const promiseResult = await Promise.allSettled(
+			items.map( ( item ) => {
+				return registry
+					.dispatch( coreStore )
+					.deleteEntityRecord(
+						'postType',
+						item.type,
+						item.id,
+						{ force: true },
+						{ throwOnError: true }
+					);
+			} )
+		);
+
+		// If all the promises were fulfilled with sucess.
+		if ( promiseResult.every( ( { status } ) => status === 'fulfilled' ) ) {
+			let successMessage;
+
+			if ( items.length === 1 ) {
+				// Depending on how the entity was retrieved its title might be
+				// an object or simple string.
+				const title =
+					typeof items[ 0 ].title === 'string'
+						? items[ 0 ].title
+						: items[ 0 ].title?.rendered;
+				successMessage = sprintf(
+					/* translators: The template/part's name. */
+					__( '"%s" deleted.' ),
+					decodeEntities( title )
+				);
+			} else {
+				successMessage = isTemplate
+					? __( 'Templates deleted.' )
+					: __( 'Template parts deleted.' );
+			}
+
+			registry
+				.dispatch( noticesStore )
+				.createSuccessNotice( successMessage, {
+					type: 'snackbar',
+					id: 'site-editor-template-deleted-success',
+				} );
+		} else {
+			// If there was at lease one failure.
+			let errorMessage;
+			// If we were trying to delete a single template.
+			if ( promiseResult.length === 1 ) {
+				if ( promiseResult[ 0 ].reason?.message ) {
+					errorMessage = promiseResult[ 0 ].reason.message;
+				} else {
+					errorMessage = isTemplate
+						? __( 'An error occurred while deleting the template.' )
+						: __(
+								'An error occurred while deleting the template part.'
+						  );
+				}
+				// If we were trying to delete a multiple templates
+			} else {
+				const errorMessages = new Set();
+				const failedPromises = promiseResult.filter(
+					( { status } ) => status === 'rejected'
+				);
+				for ( const failedPromise of failedPromises ) {
+					if ( failedPromise.reason?.message ) {
+						errorMessages.add( failedPromise.reason.message );
+					}
+				}
+				if ( errorMessages.size === 0 ) {
+					errorMessage = isTemplate
+						? __(
+								'An error occurred while deleting the templates.'
+						  )
+						: __(
+								'An error occurred while deleting the template parts.'
+						  );
+				} else if ( errorMessages.size === 1 ) {
+					errorMessage = isTemplate
+						? sprintf(
+								/* translators: %s: an error message */
+								__(
+									'An error occurred while deleting the templates: %s'
+								),
+								[ ...errorMessages ][ 0 ]
+						  )
+						: sprintf(
+								/* translators: %s: an error message */
+								__(
+									'An error occurred while deleting the template parts: %s'
+								),
+								[ ...errorMessages ][ 0 ]
+						  );
+				} else {
+					errorMessage = isTemplate
+						? sprintf(
+								/* translators: %s: a list of comma separated error messages */
+								__(
+									'Some errors occurred while deleting the templates: %s'
+								),
+								[ ...errorMessages ].join( ',' )
+						  )
+						: sprintf(
+								/* translators: %s: a list of comma separated error messages */
+								__(
+									'Some errors occurred while deleting the template parts: %s'
+								),
+								[ ...errorMessages ].join( ',' )
+						  );
+				}
+			}
+			registry
+				.dispatch( noticesStore )
+				.createErrorNotice( errorMessage, { type: 'snackbar' } );
+		}
+	};

package/src/store/private-selectors.js

@@ -1,13 +1,8 @@
-/**
- * External dependencies
- */
-import createSelector from 'rememo';
-
 /**
  * WordPress dependencies
  */
 import { store as blockEditorStore } from '@wordpress/block-editor';
-import { createRegistrySelector } from '@wordpress/data';
+import { createSelector, createRegistrySelector } from '@wordpress/data';
 import {
 	layout,
 	symbol,

package/src/store/selectors.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import createSelector from 'rememo';
-
 /**
  * WordPress dependencies
  */
@@ -14,7 +9,7 @@ import {
 } from '@wordpress/blocks';
 import { isInTheFuture, getDate } from '@wordpress/date';
 import { addQueryArgs, cleanForSlug } from '@wordpress/url';
-import { createRegistrySelector } from '@wordpress/data';
+import { createSelector, createRegistrySelector } from '@wordpress/data';
 import deprecated from '@wordpress/deprecated';
 import { Platform } from '@wordpress/element';
 import { layout } from '@wordpress/icons';

package/src/store/utils/is-template-revertable.js

@@ -0,0 +1,23 @@
+/**
+ * Internal dependencies
+ */
+import { TEMPLATE_ORIGINS } from '../constants';
+
+// Copy of the function from packages/edit-site/src/utils/is-template-revertable.js
+
+/**
+ * Check if a template is revertable to its original theme-provided template file.
+ *
+ * @param {Object} template The template entity to check.
+ * @return {boolean} Whether the template is revertable.
+ */
+export default function isTemplateRevertable( template ) {
+	if ( ! template ) {
+		return false;
+	}
+	/* eslint-disable camelcase */
+	return (
+		template?.source === TEMPLATE_ORIGINS.custom && template?.has_theme_file
+	);
+	/* eslint-enable camelcase */
+}

package/src/style.scss

@@ -1,3 +1,5 @@
+@import "../../interface/src/style.scss";
+
 @import "./components/autocompleters/style.scss";
 @import "./components/block-manager/style.scss";
 @import "./components/document-bar/style.scss";
@@ -7,8 +9,10 @@
 @import "./components/entities-saved-states/style.scss";
 @import "./components/error-boundary/style.scss";
 @import "./components/inserter-sidebar/style.scss";
+@import "./components/keyboard-shortcut-help-modal/style.scss";
 @import "./components/list-view-sidebar/style.scss";
 @import "./components/post-author/style.scss";
+@import "./components/post-actions/style.scss";
 @import "./components/post-card-panel/style.scss";
 @import "./components/post-excerpt/style.scss";
 @import "./components/post-featured-image/style.scss";
@@ -16,10 +20,10 @@
 @import "./components/post-last-revision/style.scss";
 @import "./components/post-locked-modal/style.scss";
 @import "./components/post-panel-row/style.scss";
-@import "./components/post-publish-button/style.scss";
 @import "./components/post-publish-panel/style.scss";
 @import "./components/post-saved-state/style.scss";
 @import "./components/post-schedule/style.scss";
+@import "./components/post-status/style.scss";
 @import "./components/post-sync-status/style.scss";
 @import "./components/post-taxonomies/style.scss";
 @import "./components/post-template/style.scss";
@@ -29,6 +33,6 @@
 @import "./components/post-visibility/style.scss";
 @import "./components/post-trash/style.scss";
 @import "./components/preview-dropdown/style.scss";
+@import "./components/start-page-options/style.scss";
 @import "./components/table-of-contents/style.scss";
 @import "./components/template-areas/style.scss";
-@import "./components/template-validation-notice/style.scss";

package/src/components/post-publish-button/style.scss

@@ -1,8 +0,0 @@
-.editor-post-publish-button__button.has-changes-dot::before {
-	background: currentcolor;
-	border-radius: 4px;
-	content: "";
-	height: 8px;
-	margin: auto 5px auto -3px;
-	width: 8px;
-}

package/src/components/provider/test/disable-non-page-content-blocks.js

@@ -1,111 +0,0 @@
-/**
- * External dependencies
- */
-import { render } from '@testing-library/react';
-
-/**
- * WordPress dependencies
- */
-import { createRegistry, RegistryProvider } from '@wordpress/data';
-
-/**
- * Internal dependencies
- */
-import DisableNonPageContentBlocks from '../disable-non-page-content-blocks';
-
-describe( 'DisableNonPageContentBlocks', () => {
-	it( 'disables page content blocks', () => {
-		const testBlocks = {
-			0: 'core/template-part',
-			/**/ '00': 'core/site-title',
-			/**/ '01': 'core/navigation',
-			1: 'core/group',
-			/**/ 10: 'core/post-title',
-			/**/ 11: 'core/post-featured-image',
-			/**/ 12: 'core/post-content',
-			/**/ /**/ 120: 'core/paragraph',
-			/**/ /**/ 121: 'core/post-featured-image',
-			2: 'core/query',
-			/**/ 20: 'core/post-title',
-			/**/ 21: 'core/post-featured-image',
-			/**/ 22: 'core/post-content',
-			3: 'core/template-part',
-			/**/ 30: 'core/paragraph',
-		};
-
-		const setBlockEditingMode = jest.fn( () => ( {
-			type: 'SET_BLOCK_EDITING_MODE',
-		} ) );
-		const unsetBlockEditingMode = jest.fn( () => ( {
-			type: 'UNSET_BLOCK_EDITING_MODE',
-		} ) );
-
-		const registry = createRegistry( {
-			'core/block-editor': {
-				reducer: () => {},
-				selectors: {
-					getBlocksByName( state, blockNames ) {
-						return Object.keys( testBlocks ).filter( ( clientId ) =>
-							blockNames.includes( testBlocks[ clientId ] )
-						);
-					},
-					getBlockParents( state, clientId ) {
-						return clientId.slice( 0, -1 ).split( '' );
-					},
-					getBlockName( state, clientId ) {
-						return testBlocks[ clientId ];
-					},
-					getBlockOrder( state, rootClientId ) {
-						return Object.keys( testBlocks ).filter(
-							( clientId ) =>
-								clientId.startsWith( rootClientId ) &&
-								clientId !== rootClientId
-						);
-					},
-				},
-				actions: {
-					setBlockEditingMode,
-					unsetBlockEditingMode,
-				},
-			},
-		} );
-
-		const { unmount } = render(
-			<RegistryProvider value={ registry }>
-				<DisableNonPageContentBlocks />
-			</RegistryProvider>
-		);
-
-		expect( setBlockEditingMode.mock.calls ).toEqual(
-			expect.arrayContaining( [
-				[ '', 'disabled' ], // root
-				[ '0', 'contentOnly' ], // core/template-part
-				[ '00', 'disabled' ], // core/site-title
-				[ '01', 'disabled' ], // core/navigation
-				[ '10', 'contentOnly' ], // post-title
-				[ '11', 'contentOnly' ], // post-featured-image
-				[ '12', 'contentOnly' ], // post-content
-				[ '3', 'contentOnly' ], // core/template-part
-				[ '30', 'disabled' ], // core/paragraph
-				// NOT the post-featured-image nested within post-content
-				// NOT any of the content blocks within query
-			] )
-		);
-
-		unmount();
-
-		expect( unsetBlockEditingMode.mock.calls ).toEqual(
-			expect.arrayContaining( [
-				[ '' ], // root
-				[ '0' ], // core/template-part
-				[ '00' ], // core/site-title
-				[ '01' ], // core/navigation
-				[ '10' ], // post-title
-				[ '11' ], // post-featured-image
-				[ '12' ], // post-content
-				[ '3' ], // core/template-part
-				[ '30' ], // core/paragraph
-			] )
-		);
-	} );
-} );

package/src/components/template-validation-notice/style.scss

@@ -1,9 +0,0 @@
-.editor-template-validation-notice {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-
-	.components-button {
-		margin-left: 5px;
-	}
-}