@wordpress/editor 13.32.0 → 13.34.0

package/src/components/post-actions/actions.js

@@ -6,7 +6,7 @@ import { addQueryArgs } from '@wordpress/url';
 import { useDispatch } from '@wordpress/data';
 import { decodeEntities } from '@wordpress/html-entities';
 import { store as coreStore } from '@wordpress/core-data';
-import { __, _n, sprintf } from '@wordpress/i18n';
+import { __, _n, sprintf, _x } from '@wordpress/i18n';
 import { store as noticesStore } from '@wordpress/notices';
 import { useMemo, useState } from '@wordpress/element';
 
@@ -18,6 +18,14 @@ import {
 	__experimentalVStack as VStack,
 } from '@wordpress/components';
 
+/**
+ * Internal dependencies
+ */
+import { TEMPLATE_ORIGINS, TEMPLATE_POST_TYPE } from '../../store/constants';
+import { store as editorStore } from '../../store';
+import { unlock } from '../../lock-unlock';
+import isTemplateRevertable from '../../store/utils/is-template-revertable';
+
 function getItemTitle( item ) {
 	if ( typeof item.title === 'string' ) {
 		return decodeEntities( item.title );
@@ -25,7 +33,7 @@ function getItemTitle( item ) {
 	return decodeEntities( item.title?.rendered || '' );
 }
 
-export const trashPostAction = {
+const trashPostAction = {
 	id: 'move-to-trash',
 	label: __( 'Move to Trash' ),
 	isPrimary: true,
@@ -96,7 +104,7 @@ export const trashPostAction = {
 								}
 								createSuccessNotice( successMessage, {
 									type: 'snackbar',
-									id: 'edit-site-page-trashed',
+									id: 'trash-post-action',
 								} );
 							} else {
 								// If there was at lease one failure.
@@ -145,10 +153,10 @@ export const trashPostAction = {
 											[ ...errorMessages ].join( ',' )
 										);
 									}
-									createErrorNotice( errorMessage, {
-										type: 'snackbar',
-									} );
 								}
+								createErrorNotice( errorMessage, {
+									type: 'snackbar',
+								} );
 							}
 							if ( onActionPerformed ) {
 								onActionPerformed( posts );
@@ -164,7 +172,7 @@ export const trashPostAction = {
 	},
 };
 
-export function usePermanentlyDeletePostAction() {
+function usePermanentlyDeletePostAction() {
 	const { createSuccessNotice, createErrorNotice } =
 		useDispatch( noticesStore );
 	const { deleteEntityRecord } = useDispatch( coreStore );
@@ -209,7 +217,7 @@ export function usePermanentlyDeletePostAction() {
 					}
 					createSuccessNotice( successMessage, {
 						type: 'snackbar',
-						id: 'edit-site-post-permanently-deleted',
+						id: 'permanently-delete-post-action',
 					} );
 					if ( onActionPerformed ) {
 						onActionPerformed( posts );
@@ -260,10 +268,10 @@ export function usePermanentlyDeletePostAction() {
 								[ ...errorMessages ].join( ',' )
 							);
 						}
-						createErrorNotice( errorMessage, {
-							type: 'snackbar',
-						} );
 					}
+					createErrorNotice( errorMessage, {
+						type: 'snackbar',
+					} );
 				}
 			},
 		} ),
@@ -271,7 +279,7 @@ export function usePermanentlyDeletePostAction() {
 	);
 }
 
-export function useRestorePostAction() {
+function useRestorePostAction() {
 	const { createSuccessNotice, createErrorNotice } =
 		useDispatch( noticesStore );
 	const { editEntityRecord, saveEditedEntityRecord } =
@@ -320,7 +328,7 @@ export function useRestorePostAction() {
 							  ),
 						{
 							type: 'snackbar',
-							id: 'edit-site-post-restored',
+							id: 'restore-post-action',
 						}
 					);
 					if ( onActionPerformed ) {
@@ -357,7 +365,7 @@ export function useRestorePostAction() {
 	);
 }
 
-export const viewPostAction = {
+const viewPostAction = {
 	id: 'view-post',
 	label: __( 'View' ),
 	isPrimary: true,
@@ -374,7 +382,7 @@ export const viewPostAction = {
 	},
 };
 
-export const editPostAction = {
+const editPostAction = {
 	id: 'edit-post',
 	label: __( 'Edit' ),
 	isPrimary: true,
@@ -388,7 +396,7 @@ export const editPostAction = {
 		}
 	},
 };
-export const postRevisionsAction = {
+const postRevisionsAction = {
 	id: 'view-post-revisions',
 	label: __( 'View revisions' ),
 	isPrimary: false,
@@ -414,13 +422,13 @@ export const postRevisionsAction = {
 	},
 };
 
-export const renamePostAction = {
+const renamePostAction = {
 	id: 'rename-post',
 	label: __( 'Rename' ),
 	isEligible( post ) {
 		return post.status !== 'trash';
 	},
-	RenderModal: ( { items, closeModal } ) => {
+	RenderModal: ( { items, closeModal, onActionPerformed } ) => {
 		const [ item ] = items;
 		const originalTitle = decodeEntities(
 			typeof item.title === 'string' ? item.title : item.title.rendered
@@ -447,6 +455,7 @@ export const renamePostAction = {
 				createSuccessNotice( __( 'Name updated' ), {
 					type: 'snackbar',
 				} );
+				onActionPerformed?.( items );
 			} catch ( error ) {
 				const errorMessage =
 					error.message && error.code !== 'unknown_error'
@@ -491,6 +500,388 @@ export const renamePostAction = {
 	},
 };
 
+export const duplicatePostAction = {
+	id: 'duplicate-post',
+	label: _x( 'Duplicate', 'action label' ),
+	isEligible( { status } ) {
+		return status !== 'trash';
+	},
+	RenderModal: ( { items, closeModal, onActionPerformed } ) => {
+		const [ item ] = items;
+		const [ isCreatingPage, setIsCreatingPage ] = useState( false );
+		const [ title, setTitle ] = useState(
+			sprintf(
+				/* translators: %s: Existing item title */
+				__( '%s (Copy)' ),
+				getItemTitle( item )
+			)
+		);
+
+		const { saveEntityRecord } = useDispatch( coreStore );
+		const { createSuccessNotice, createErrorNotice } =
+			useDispatch( noticesStore );
+
+		async function createPage( event ) {
+			event.preventDefault();
+
+			if ( isCreatingPage ) {
+				return;
+			}
+			setIsCreatingPage( true );
+			try {
+				const newItem = await saveEntityRecord(
+					'postType',
+					item.type,
+					{
+						status: 'draft',
+						title,
+						slug: title || __( 'No title' ),
+						author: item.author,
+						comment_status: item.comment_status,
+						content:
+							typeof item.content === 'string'
+								? item.content
+								: item.content.raw,
+						excerpt: item.excerpt.raw,
+						meta: item.meta,
+						parent: item.parent,
+						password: item.password,
+						template: item.template,
+						format: item.format,
+						featured_media: item.featured_media,
+						menu_order: item.menu_order,
+						ping_status: item.ping_status,
+						categories: item.categories,
+						tags: item.tags,
+					},
+					{ throwOnError: true }
+				);
+
+				createSuccessNotice(
+					sprintf(
+						// translators: %s: Title of the created template e.g: "Category".
+						__( '"%s" successfully created.' ),
+						newItem.title?.rendered || title
+					),
+					{
+						id: 'duplicate-post-action',
+						type: 'snackbar',
+					}
+				);
+
+				if ( onActionPerformed ) {
+					onActionPerformed( [ newItem ] );
+				}
+			} catch ( error ) {
+				const errorMessage =
+					error.message && error.code !== 'unknown_error'
+						? error.message
+						: __( 'An error occurred while duplicating the page.' );
+
+				createErrorNotice( errorMessage, {
+					type: 'snackbar',
+				} );
+			} finally {
+				setIsCreatingPage( false );
+				closeModal();
+			}
+		}
+		return (
+			<form onSubmit={ createPage }>
+				<VStack spacing={ 3 }>
+					<TextControl
+						label={ __( 'Title' ) }
+						onChange={ setTitle }
+						placeholder={ __( 'No title' ) }
+						value={ title }
+					/>
+					<HStack spacing={ 2 } justify="end">
+						<Button variant="tertiary" onClick={ closeModal }>
+							{ __( 'Cancel' ) }
+						</Button>
+						<Button
+							variant="primary"
+							type="submit"
+							isBusy={ isCreatingPage }
+							aria-disabled={ isCreatingPage }
+						>
+							{ _x( 'Duplicate', 'action label' ) }
+						</Button>
+					</HStack>
+				</VStack>
+			</form>
+		);
+	},
+};
+
+const resetTemplateAction = {
+	id: 'reset-template',
+	label: __( 'Reset' ),
+	isEligible: isTemplateRevertable,
+	supportsBulk: true,
+	hideModalHeader: true,
+	RenderModal: ( { items, closeModal, onActionPerformed } ) => {
+		const { revertTemplate } = unlock( useDispatch( editorStore ) );
+		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.' ),
+								decodeEntities( items[ 0 ].title.rendered )
+						  ),
+					{
+						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 errorMessage =
+					error.message && error.code !== 'unknown_error'
+						? error.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 }>
+						{ __( 'Cancel' ) }
+					</Button>
+					<Button
+						variant="primary"
+						onClick={ async () => {
+							await onConfirm( items );
+							onActionPerformed?.( items );
+							closeModal();
+						} }
+					>
+						{ __( 'Reset' ) }
+					</Button>
+				</HStack>
+			</VStack>
+		);
+	},
+};
+
+/**
+ * Check if a template is removable.
+ * Copy from packages/edit-site/src/utils/is-template-removable.js.
+ *
+ * @param {Object} template The template entity to check.
+ * @return {boolean} Whether the template is revertable.
+ */
+function isTemplateRemovable( template ) {
+	if ( ! template ) {
+		return false;
+	}
+
+	return (
+		template.source === TEMPLATE_ORIGINS.custom && ! template.has_theme_file
+	);
+}
+
+const deleteTemplateAction = {
+	id: 'delete-template',
+	label: __( 'Delete' ),
+	isEligible: isTemplateRemovable,
+	supportsBulk: true,
+	hideModalHeader: true,
+	RenderModal: ( { items: templates, closeModal, onActionPerformed } ) => {
+		const { removeTemplates } = unlock( useDispatch( editorStore ) );
+		return (
+			<VStack spacing="5">
+				<Text>
+					{ templates.length > 1
+						? sprintf(
+								// translators: %d: number of items to delete.
+								_n(
+									'Delete %d item?',
+									'Delete %d items?',
+									templates.length
+								),
+								templates.length
+						  )
+						: sprintf(
+								// translators: %s: The template or template part's titles
+								__( 'Delete "%s"?' ),
+								decodeEntities(
+									templates?.[ 0 ]?.title?.rendered
+								)
+						  ) }
+				</Text>
+				<HStack justify="right">
+					<Button variant="tertiary" onClick={ closeModal }>
+						{ __( 'Cancel' ) }
+					</Button>
+					<Button
+						variant="primary"
+						onClick={ async () => {
+							await removeTemplates( templates, {
+								allowUndo: false,
+							} );
+							onActionPerformed?.( templates );
+							closeModal();
+						} }
+					>
+						{ __( 'Delete' ) }
+					</Button>
+				</HStack>
+			</VStack>
+		);
+	},
+};
+
+const renameTemplateAction = {
+	id: 'rename-template',
+	label: __( 'Rename' ),
+	isEligible: ( template ) => {
+		// We can only remove templates or template parts that can be removed.
+		// Additionally in the case of templates, we can only remove custom templates.
+		if (
+			! isTemplateRemovable( template ) ||
+			( template.type === TEMPLATE_POST_TYPE && ! template.is_custom )
+		) {
+			return false;
+		}
+		return true;
+	},
+	RenderModal: ( { items: templates, closeModal, onActionPerformed } ) => {
+		const template = templates[ 0 ];
+		const title = decodeEntities( template.title.rendered );
+		const [ editedTitle, setEditedTitle ] = useState( title );
+		const {
+			editEntityRecord,
+			__experimentalSaveSpecifiedEntityEdits: saveSpecifiedEntityEdits,
+		} = useDispatch( coreStore );
+		const { createSuccessNotice, createErrorNotice } =
+			useDispatch( noticesStore );
+		async function onTemplateRename( event ) {
+			event.preventDefault();
+			try {
+				await editEntityRecord(
+					'postType',
+					template.type,
+					template.id,
+					{
+						title: editedTitle,
+					}
+				);
+				// Update state before saving rerenders the list.
+				setEditedTitle( '' );
+				closeModal();
+				// Persist edited entity.
+				await saveSpecifiedEntityEdits(
+					'postType',
+					template.type,
+					template.id,
+					[ 'title' ], // Only save title to avoid persisting other edits.
+					{
+						throwOnError: true,
+					}
+				);
+				createSuccessNotice(
+					template.type === TEMPLATE_POST_TYPE
+						? __( 'Template renamed.' )
+						: __( 'Template part renamed.' ),
+					{
+						type: 'snackbar',
+					}
+				);
+				onActionPerformed?.( templates );
+			} catch ( error ) {
+				const fallbackErrorMessage =
+					template.type === TEMPLATE_POST_TYPE
+						? __( 'An error occurred while renaming the template.' )
+						: __(
+								'An error occurred while renaming the template part.'
+						  );
+				const errorMessage =
+					error.message && error.code !== 'unknown_error'
+						? error.message
+						: fallbackErrorMessage;
+
+				createErrorNotice( errorMessage, { type: 'snackbar' } );
+			}
+		}
+		return (
+			<form onSubmit={ onTemplateRename }>
+				<VStack spacing="5">
+					<TextControl
+						__nextHasNoMarginBottom
+						__next40pxDefaultSize
+						label={ __( 'Name' ) }
+						value={ editedTitle }
+						onChange={ setEditedTitle }
+						required
+					/>
+					<HStack justify="right">
+						<Button
+							variant="tertiary"
+							onClick={ closeModal }
+							__next40pxDefaultSize
+						>
+							{ __( 'Cancel' ) }
+						</Button>
+						<Button
+							variant="primary"
+							type="submit"
+							__next40pxDefaultSize
+						>
+							{ __( 'Save' ) }
+						</Button>
+					</HStack>
+				</VStack>
+			</form>
+		);
+	},
+};
+
 export function usePostActions( onActionPerformed, actionIds = null ) {
 	const permanentlyDeletePostAction = usePermanentlyDeletePostAction();
 	const restorePostAction = useRestorePostAction();
@@ -499,11 +890,15 @@ export function usePostActions( onActionPerformed, actionIds = null ) {
 			// By default, return all actions...
 			const defaultActions = [
 				editPostAction,
+				resetTemplateAction,
 				viewPostAction,
 				restorePostAction,
+				deleteTemplateAction,
 				permanentlyDeletePostAction,
 				postRevisionsAction,
+				duplicatePostAction,
 				renamePostAction,
+				renameTemplateAction,
 				trashPostAction,
 			];