@wordpress/editor 14.2.0 → 14.4.0

package/src/dataviews/actions/reset-post.tsx

@@ -0,0 +1,144 @@
+/**
+ * WordPress dependencies
+ */
+import { backup } from '@wordpress/icons';
+import { useDispatch } from '@wordpress/data';
+import { store as coreStore } from '@wordpress/core-data';
+import { __, sprintf } from '@wordpress/i18n';
+import { store as noticesStore } from '@wordpress/notices';
+import { useState } from '@wordpress/element';
+import {
+	Button,
+	__experimentalText as Text,
+	__experimentalHStack as HStack,
+	__experimentalVStack as VStack,
+} from '@wordpress/components';
+import type { Action } from '@wordpress/dataviews';
+import type { StoreDescriptor } from '@wordpress/data';
+
+/**
+ * Internal dependencies
+ */
+import { TEMPLATE_POST_TYPE, TEMPLATE_ORIGINS } from '../../store/constants';
+import { store as editorStore } from '../../store';
+import { unlock } from '../../lock-unlock';
+import type { Post, CoreDataError } from '../types';
+import { isTemplateOrTemplatePart, getItemTitle } from './utils';
+
+const resetPost: Action< Post > = {
+	id: 'reset-post',
+	label: __( 'Reset' ),
+	isEligible: ( item ) => {
+		return (
+			isTemplateOrTemplatePart( item ) &&
+			item?.source === TEMPLATE_ORIGINS.custom &&
+			item?.has_theme_file
+		);
+	},
+	icon: backup,
+	supportsBulk: true,
+	hideModalHeader: true,
+	RenderModal: ( { items, closeModal, onActionPerformed } ) => {
+		const [ isBusy, setIsBusy ] = useState( false );
+		const { revertTemplate } = unlock(
+			useDispatch( editorStore as StoreDescriptor )
+		);
+		const { saveEditedEntityRecord } = useDispatch( coreStore );
+		const { createSuccessNotice, createErrorNotice } =
+			useDispatch( noticesStore );
+		const onConfirm = async () => {
+			try {
+				for ( const template of items ) {
+					await revertTemplate( template, {
+						allowUndo: false,
+					} );
+					await saveEditedEntityRecord(
+						'postType',
+						template.type,
+						template.id
+					);
+				}
+				createSuccessNotice(
+					items.length > 1
+						? sprintf(
+								/* translators: The number of items. */
+								__( '%s items reset.' ),
+								items.length
+						  )
+						: sprintf(
+								/* translators: The template/part's name. */
+								__( '"%s" reset.' ),
+								getItemTitle( items[ 0 ] )
+						  ),
+					{
+						type: 'snackbar',
+						id: 'revert-template-action',
+					}
+				);
+			} catch ( error ) {
+				let fallbackErrorMessage;
+				if ( items[ 0 ].type === TEMPLATE_POST_TYPE ) {
+					fallbackErrorMessage =
+						items.length === 1
+							? __(
+									'An error occurred while reverting the template.'
+							  )
+							: __(
+									'An error occurred while reverting the templates.'
+							  );
+				} else {
+					fallbackErrorMessage =
+						items.length === 1
+							? __(
+									'An error occurred while reverting the template part.'
+							  )
+							: __(
+									'An error occurred while reverting the template parts.'
+							  );
+				}
+
+				const typedError = error as CoreDataError;
+				const errorMessage =
+					typedError.message && typedError.code !== 'unknown_error'
+						? typedError.message
+						: fallbackErrorMessage;
+
+				createErrorNotice( errorMessage, { type: 'snackbar' } );
+			}
+		};
+		return (
+			<VStack spacing="5">
+				<Text>
+					{ __( 'Reset to default and clear all customizations?' ) }
+				</Text>
+				<HStack justify="right">
+					<Button
+						variant="tertiary"
+						onClick={ closeModal }
+						disabled={ isBusy }
+						accessibleWhenDisabled
+					>
+						{ __( 'Cancel' ) }
+					</Button>
+					<Button
+						variant="primary"
+						onClick={ async () => {
+							setIsBusy( true );
+							await onConfirm();
+							onActionPerformed?.( items );
+							setIsBusy( false );
+							closeModal?.();
+						} }
+						isBusy={ isBusy }
+						disabled={ isBusy }
+						accessibleWhenDisabled
+					>
+						{ __( 'Reset' ) }
+					</Button>
+				</HStack>
+			</VStack>
+		);
+	},
+};
+
+export default resetPost;

package/src/dataviews/actions/utils.ts

@@ -0,0 +1,54 @@
+/**
+ * WordPress dependencies
+ */
+import { decodeEntities } from '@wordpress/html-entities';
+
+/**
+ * Internal dependencies
+ */
+import {
+	TEMPLATE_ORIGINS,
+	TEMPLATE_PART_POST_TYPE,
+	TEMPLATE_POST_TYPE,
+} from '../../store/constants';
+
+import type { Post, TemplateOrTemplatePart } from '../types';
+
+export function isTemplateOrTemplatePart(
+	p: Post
+): p is TemplateOrTemplatePart {
+	return p.type === TEMPLATE_POST_TYPE || p.type === TEMPLATE_PART_POST_TYPE;
+}
+
+export function getItemTitle( item: Post ) {
+	if ( typeof item.title === 'string' ) {
+		return decodeEntities( item.title );
+	}
+	if ( 'rendered' in item.title ) {
+		return decodeEntities( item.title.rendered );
+	}
+	if ( 'raw' in item.title ) {
+		return decodeEntities( item.title.raw );
+	}
+	return '';
+}
+
+/**
+ * Check if a template is removable.
+ *
+ * @param template The template entity to check.
+ * @return Whether the template is removable.
+ */
+export function isTemplateRemovable( template: TemplateOrTemplatePart ) {
+	if ( ! template ) {
+		return false;
+	}
+	// In patterns list page we map the templates parts to a different object
+	// than the one returned from the endpoint. This is why we need to check for
+	// two props whether is custom or has a theme file.
+	return (
+		[ template.source, template.source ].includes(
+			TEMPLATE_ORIGINS.custom
+		) && ! template.has_theme_file
+	);
+}

package/src/dataviews/store/private-actions.ts

@@ -1,9 +1,9 @@
 /**
  * WordPress dependencies
  */
-import type { Action, AnyItem } from '@wordpress/dataviews';
+import type { Action } from '@wordpress/dataviews';
 
-export function registerEntityAction< Item extends AnyItem >(
+export function registerEntityAction< Item >(
 	kind: string,
 	name: string,
 	config: Action< Item >

package/src/dataviews/store/private-selectors.ts

@@ -1,15 +1,22 @@
 /**
  * WordPress dependencies
  */
-import type { Action } from '@wordpress/dataviews';
+import { createSelector } from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
 import type { State } from './reducer';
 
-const EMPTY_ARRAY: Action< any >[] = [];
-
-export function getEntityActions( state: State, kind: string, name: string ) {
-	return state.actions[ kind ]?.[ name ] ?? EMPTY_ARRAY;
-}
+export const getEntityActions = createSelector(
+	( state: State, kind: string, name: string ) => {
+		return [
+			...( state.actions[ kind ]?.[ name ] ?? [] ),
+			...( state.actions[ kind ]?.[ '*' ] ?? [] ),
+		];
+	},
+	( state: State, kind: string, name: string ) => [
+		state.actions[ kind ]?.[ name ],
+		state.actions[ kind ]?.[ '*' ],
+	]
+);

package/src/dataviews/store/reducer.ts

@@ -2,7 +2,6 @@
  * WordPress dependencies
  */
 import { combineReducers } from '@wordpress/data';
-import { __ } from '@wordpress/i18n';
 import type { Action } from '@wordpress/dataviews';
 
 type ReduxAction =
@@ -20,8 +19,13 @@ function actions( state: ActionState = {}, action: ReduxAction ) {
 			return {
 				...state,
 				[ action.kind ]: {
+					...state[ action.kind ],
 					[ action.name ]: [
-						...( state[ action.kind ]?.[ action.name ] ?? [] ),
+						...(
+							state[ action.kind ]?.[ action.name ] ?? []
+						).filter(
+							( _action ) => _action.id !== action.config.id
+						),
 						action.config,
 					],
 				},
@@ -29,9 +33,12 @@ function actions( state: ActionState = {}, action: ReduxAction ) {
 		case 'UNREGISTER_ENTITY_ACTION': {
 			return {
 				...state,
-				[ action.kind ]: (
-					state[ action.kind ]?.[ action.name ] ?? []
-				).filter( ( _action ) => _action.id !== action.actionId ),
+				[ action.kind ]: {
+					...state[ action.kind ],
+					[ action.name ]: (
+						state[ action.kind ]?.[ action.name ] ?? []
+					).filter( ( _action ) => _action.id !== action.actionId ),
+				},
 			};
 		}
 	}

package/src/dataviews/types.ts

@@ -0,0 +1,33 @@
+type PostStatus =
+	| 'published'
+	| 'draft'
+	| 'pending'
+	| 'private'
+	| 'future'
+	| 'auto-draft'
+	| 'trash';
+
+export interface BasePost {
+	status?: PostStatus;
+	title: string | { rendered: string } | { raw: string };
+	type: string;
+	id: string | number;
+}
+export interface TemplateOrTemplatePart extends BasePost {
+	type: 'wp_template' | 'wp_template_part';
+	source: string;
+	has_theme_file: boolean;
+	id: string;
+}
+
+export interface Pattern extends BasePost {
+	slug: string;
+	title: { raw: string };
+	content: { raw: string } | string;
+	wp_pattern_sync_status: string;
+}
+
+export type Post = TemplateOrTemplatePart | Pattern | BasePost;
+
+// Will be unnecessary after typescript 5.0 upgrade.
+export type CoreDataError = { message?: string; code?: string };

package/src/hooks/pattern-overrides.js

@@ -14,6 +14,8 @@ import { store as blocksStore } from '@wordpress/blocks';
 import { store as editorStore } from '../store';
 import { unlock } from '../lock-unlock';
 
+/** @typedef {import('@wordpress/blocks').WPBlockSettings} WPBlockSettings */
+
 const {
 	PatternOverridesControls,
 	ResetOverridesControl,
@@ -39,14 +41,15 @@ const withPatternOverrideControls = createHigherOrderComponent(
 
 		return (
 			<>
-				<BlockEdit { ...props } />
+				<BlockEdit key="edit" { ...props } />
 				{ props.isSelected && isSupportedBlock && (
 					<ControlsWithStoreSubscription { ...props } />
 				) }
 				{ isSupportedBlock && <PatternOverridesBlockControls /> }
 			</>
 		);
-	}
+	},
+	'withPatternOverrideControls'
 );
 
 // Split into a separate component to avoid a store subscription

package/src/index.js

@@ -1,7 +1,6 @@
 /**
  * Internal dependencies
  */
-import './bindings';
 import './hooks';
 
 export { storeConfig, store } from './store';

package/src/private-apis.js

@@ -23,6 +23,11 @@ import {
 	mergeBaseAndUserConfigs,
 	GlobalStylesProvider,
 } from './components/global-styles-provider';
+import registerDefaultActions from './dataviews/actions';
+import {
+	registerCoreBlockBindingsSources,
+	bootstrapBlockBindingsSourcesFromServer,
+} from './bindings/api';
 
 const { store: interfaceStore, ...remainingInterfaceApis } = interfaceApis;
 
@@ -41,6 +46,9 @@ lock( privateApis, {
 	ToolsMoreMenuGroup,
 	ViewMoreMenuGroup,
 	ResizableEditor,
+	registerDefaultActions,
+	registerCoreBlockBindingsSources,
+	bootstrapBlockBindingsSourcesFromServer,
 
 	// This is a temporary private API while we're updating the site editor to use EditorProvider.
 	useBlockEditorSettings,

package/src/private-apis.native.js

@@ -12,7 +12,6 @@ import { EntitiesSavedStatesExtensible } from './components/entities-saved-state
 import useBlockEditorSettings from './components/provider/use-block-editor-settings';
 import PluginPostExcerpt from './components/post-excerpt/plugin';
 import PreferencesModal from './components/preferences-modal';
-import { usePostActions } from './components/post-actions/actions';
 import ToolsMoreMenuGroup from './components/more-menu/tools-more-menu-group';
 import ViewMoreMenuGroup from './components/more-menu/view-more-menu-group';
 
@@ -24,7 +23,6 @@ lock( privateApis, {
 	EntitiesSavedStatesExtensible,
 	PluginPostExcerpt,
 	PreferencesModal,
-	usePostActions,
 	ToolsMoreMenuGroup,
 	ViewMoreMenuGroup,
 

package/src/store/private-actions.js

@@ -370,12 +370,7 @@ export const revertTemplate =
 export const removeTemplates =
 	( items ) =>
 	async ( { registry } ) => {
-		const isResetting = items.every(
-			( item ) =>
-				!! item &&
-				( item.has_theme_file ||
-					( item.templatePart && item.templatePart.has_theme_file ) )
-		);
+		const isResetting = items.every( ( item ) => item?.has_theme_file );
 
 		const promiseResult = await Promise.allSettled(
 			items.map( ( item ) => {

package/src/store/private-selectors.js

@@ -25,8 +25,6 @@ import {
 	getCurrentPost,
 	__experimentalGetDefaultTemplatePartAreas,
 } from './selectors';
-import { TEMPLATE_PART_POST_TYPE } from './constants';
-import { getFilteredTemplatePartBlocks } from './utils/get-filtered-template-parts';
 import { getEntityActions as _getEntityActions } from '../dataviews/store/private-selectors';
 
 const EMPTY_INSERTION_POINT = {
@@ -120,29 +118,6 @@ export const getPostIcon = createRegistrySelector(
 	}
 );
 
-/**
- * Returns the template parts and their blocks for the current edited template.
- *
- * @param {Object} state Global application state.
- * @return {Array} Template parts and their blocks in an array.
- */
-export const getCurrentTemplateTemplateParts = createRegistrySelector(
-	( select ) => () => {
-		const templateParts = select( coreStore ).getEntityRecords(
-			'postType',
-			TEMPLATE_PART_POST_TYPE,
-			{ per_page: -1 }
-		);
-
-		const clientIds =
-			select( blockEditorStore ).getBlocksByName( 'core/template-part' );
-		const blocks =
-			select( blockEditorStore ).getBlocksByClientId( clientIds );
-
-		return getFilteredTemplatePartBlocks( blocks, templateParts );
-	}
-);
-
 /**
  * Returns true if there are unsaved changes to the
  * post's meta fields, and false otherwise.

package/src/store/test/actions.js

@@ -90,7 +90,9 @@ describe( 'Post actions', () => {
 					method === 'GET' &&
 					path.startsWith( '/wp/v2/types/post' )
 				) {
-					return {};
+					return {
+						json: () => Promise.resolve( {} ),
+					};
 				}
 
 				throw {
@@ -178,7 +180,9 @@ describe( 'Post actions', () => {
 						path.startsWith( '/wp/v2/types/post' ) ||
 						path.startsWith( `/wp/v2/posts/${ postId }` )
 					) {
-						return {};
+						return {
+							json: () => Promise.resolve( {} ),
+						};
 					}
 				}
 
@@ -262,7 +266,9 @@ describe( 'Post actions', () => {
 					method === 'GET' &&
 					path.startsWith( '/wp/v2/types/post' )
 				) {
-					return {};
+					return {
+						json: () => Promise.resolve( {} ),
+					};
 				}
 
 				throw {

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

@@ -6,18 +6,18 @@ 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.
+ * Check if a template or template part is revertable to its original theme-provided file.
  *
- * @param {Object} template The template entity to check.
- * @return {boolean} Whether the template is revertable.
+ * @param {Object} templateOrTemplatePart The entity to check.
+ * @return {boolean} Whether the entity is revertable.
  */
-export default function isTemplateRevertable( template ) {
-	if ( ! template ) {
+export default function isTemplateRevertable( templateOrTemplatePart ) {
+	if ( ! templateOrTemplatePart ) {
 		return false;
 	}
-	/* eslint-disable camelcase */
+
 	return (
-		template?.source === TEMPLATE_ORIGINS.custom && template?.has_theme_file
+		templateOrTemplatePart.source === TEMPLATE_ORIGINS.custom &&
+		templateOrTemplatePart.has_theme_file
 	);
-	/* eslint-enable camelcase */
 }

package/src/style.scss

@@ -54,6 +54,5 @@
 @import "./components/sidebar/style.scss";
 @import "./components/site-discussion/style.scss";
 @import "./components/table-of-contents/style.scss";
-@import "./components/template-areas/style.scss";
 @import "./components/text-editor/style.scss";
 @import "./components/visual-editor/style.scss";

package/src/utils/media-upload/index.js

@@ -1,7 +1,12 @@
+/**
+ * External dependencies
+ */
+import { v4 as uuid } from 'uuid';
+
 /**
  * WordPress dependencies
  */
-import { select } from '@wordpress/data';
+import { select, dispatch } from '@wordpress/data';
 import { uploadMedia } from '@wordpress/media-utils';
 
 /**
@@ -32,7 +37,16 @@ export default function mediaUpload( {
 	onFileChange,
 } ) {
 	const { getCurrentPost, getEditorSettings } = select( editorStore );
+	const {
+		lockPostAutosaving,
+		unlockPostAutosaving,
+		lockPostSaving,
+		unlockPostSaving,
+	} = dispatch( editorStore );
+
 	const wpAllowedMimeTypes = getEditorSettings().allowedMimeTypes;
+	const lockKey = `image-upload-${ uuid() }`;
+	let imageIsUploading = false;
 	maxUploadFileSize =
 		maxUploadFileSize || getEditorSettings().maxUploadFileSize;
 	const currentPost = getCurrentPost();
@@ -41,18 +55,39 @@ export default function mediaUpload( {
 		typeof currentPost?.id === 'number'
 			? currentPost.id
 			: currentPost?.wp_id;
+	const setSaveLock = () => {
+		lockPostSaving( lockKey );
+		lockPostAutosaving( lockKey );
+		imageIsUploading = true;
+	};
+
 	const postData = currentPostId ? { post: currentPostId } : {};
+	const clearSaveLock = () => {
+		unlockPostSaving( lockKey );
+		unlockPostAutosaving( lockKey );
+		imageIsUploading = false;
+	};
 
 	uploadMedia( {
 		allowedTypes,
 		filesList,
-		onFileChange,
+		onFileChange: ( file ) => {
+			if ( ! imageIsUploading ) {
+				setSaveLock();
+			} else {
+				clearSaveLock();
+			}
+			onFileChange( file );
+		},
 		additionalData: {
 			...postData,
 			...additionalData,
 		},
 		maxUploadFileSize,
-		onError: ( { message } ) => onError( message ),
+		onError: ( { message } ) => {
+			clearSaveLock();
+			onError( message );
+		},
 		wpAllowedMimeTypes,
 	} );
 }

package/tsconfig.json

@@ -3,7 +3,8 @@
 	"extends": "../../tsconfig.base.json",
 	"compilerOptions": {
 		"rootDir": "src",
-		"declarationDir": "build-types"
+		"declarationDir": "build-types",
+		"checkJs": false
 	},
 	"references": [
 		{ "path": "../a11y" },
@@ -32,5 +33,5 @@
 		{ "path": "../warning" },
 		{ "path": "../wordcount" }
 	],
-	"include": [ "src/**/*.ts", "src/**/*.tsx" ]
+	"include": [ "src" ]
 }