diff --git a/packages/edit-site/src/components/page-actions/index.js b/packages/edit-site/src/components/page-actions/index.js index d42a706c36796e..546b90a7dd1501 100644 --- a/packages/edit-site/src/components/page-actions/index.js +++ b/packages/edit-site/src/components/page-actions/index.js @@ -9,20 +9,30 @@ import { moreVertical } from '@wordpress/icons'; * Internal dependencies */ import TrashPageMenuItem from './trash-page-menu-item'; +import RenamePostMenuItem from '../rename-post-menu-item'; -export default function PageActions( { postId, toggleProps, onRemove } ) { +export default function PageActions( { + className, + onRemove, + page, + toggleProps, +} ) { return ( { () => ( - + + { !! onRemove && ( + + ) } ) } diff --git a/packages/edit-site/src/components/page-actions/trash-page-menu-item.js b/packages/edit-site/src/components/page-actions/trash-page-menu-item.js index 6005465c8fa5f0..4015378c48b83b 100644 --- a/packages/edit-site/src/components/page-actions/trash-page-menu-item.js +++ b/packages/edit-site/src/components/page-actions/trash-page-menu-item.js @@ -1,28 +1,32 @@ /** * WordPress dependencies */ -import { useDispatch, useSelect } from '@wordpress/data'; +import { useDispatch } from '@wordpress/data'; import { decodeEntities } from '@wordpress/html-entities'; import { store as coreStore } from '@wordpress/core-data'; import { __, sprintf } from '@wordpress/i18n'; import { MenuItem } from '@wordpress/components'; import { store as noticesStore } from '@wordpress/notices'; -export default function TrashPageMenuItem( { postId, onRemove } ) { +export default function TrashPageMenuItem( { page, onRemove } ) { const { createSuccessNotice, createErrorNotice } = useDispatch( noticesStore ); const { deleteEntityRecord } = useDispatch( coreStore ); - const page = useSelect( - ( select ) => - select( coreStore ).getEntityRecord( 'postType', 'page', postId ), - [ postId ] + + if ( page?.status === 'trash' ) { + return; + } + + const title = decodeEntities( + typeof page.title === 'string' ? page.title : page.title.rendered ); + async function removePage() { try { await deleteEntityRecord( 'postType', 'page', - postId, + page.id, {}, { throwOnError: true } ); @@ -30,7 +34,7 @@ export default function TrashPageMenuItem( { postId, onRemove } ) { sprintf( /* translators: The page's title. */ __( '"%s" moved to the Trash.' ), - decodeEntities( page.title.rendered ) + title ), { type: 'snackbar', @@ -50,14 +54,8 @@ export default function TrashPageMenuItem( { postId, onRemove } ) { } } return ( - <> - removePage() } - isDestructive - variant="secondary" - > - { __( 'Move to Trash' ) } - - + removePage() } isDestructive> + { __( 'Move to Trash' ) } + ); } diff --git a/packages/edit-site/src/components/template-actions/rename-menu-item.js b/packages/edit-site/src/components/rename-post-menu-item/index.js similarity index 75% rename from packages/edit-site/src/components/template-actions/rename-menu-item.js rename to packages/edit-site/src/components/rename-post-menu-item/index.js index 730bdba803ab55..59b3fd55123ee1 100644 --- a/packages/edit-site/src/components/template-actions/rename-menu-item.js +++ b/packages/edit-site/src/components/rename-post-menu-item/index.js @@ -21,8 +21,10 @@ import { decodeEntities } from '@wordpress/html-entities'; */ import { TEMPLATE_POST_TYPE } from '../../utils/constants'; -export default function RenameMenuItem( { template, onClose } ) { - const title = decodeEntities( template.title.rendered ); +export default function RenamePostMenuItem( { post } ) { + const title = decodeEntities( + typeof post.title === 'string' ? post.title : post.title.rendered + ); const [ editedTitle, setEditedTitle ] = useState( title ); const [ isModalOpen, setIsModalOpen ] = useState( false ); @@ -33,53 +35,46 @@ export default function RenameMenuItem( { template, onClose } ) { const { createSuccessNotice, createErrorNotice } = useDispatch( noticesStore ); - if ( template.type === TEMPLATE_POST_TYPE && ! template.is_custom ) { + if ( post.type === TEMPLATE_POST_TYPE && ! post.is_custom ) { return null; } - async function onTemplateRename( event ) { + async function onRename( event ) { event.preventDefault(); + if ( editedTitle === title ) { + return; + } + try { - await editEntityRecord( 'postType', template.type, template.id, { + await editEntityRecord( 'postType', post.type, post.id, { title: editedTitle, } ); // Update state before saving rerenders the list. setEditedTitle( '' ); setIsModalOpen( false ); - onClose(); // Persist edited entity. await saveSpecifiedEntityEdits( 'postType', - template.type, - template.id, + post.type, + post.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', - } - ); + createSuccessNotice( __( 'Name updated.' ), { + id: 'template-update', + type: 'snackbar', + } ); } 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; + : __( 'An error occurred while updating the name.' ); createErrorNotice( errorMessage, { type: 'snackbar' } ); } @@ -102,8 +97,9 @@ export default function RenameMenuItem( { template, onClose } ) { setIsModalOpen( false ); } } overlayClassName="edit-site-list__rename-modal" + focusOnMount="firstContentElement" > -
+ { - const { getEditedPostContext } = select( editSiteStore ); - const { getEditedEntityRecord, hasFinishedResolution } = - select( coreStore ); - const { getRenderingMode } = select( editorStore ); - const context = getEditedPostContext(); - const queryArgs = [ 'postType', context.postType, context.postId ]; - const page = getEditedEntityRecord( ...queryArgs ); - return { - hasResolved: hasFinishedResolution( - 'getEditedEntityRecord', - queryArgs - ), - id: page?.id, - type: page?.type, - status: page?.status, - date: page?.date, - password: page?.password, - renderingMode: getRenderingMode(), - }; - }, [] ); + const { hasResolved, page, renderingMode } = useSelect( ( select ) => { + const { getEditedPostContext } = select( editSiteStore ); + const { getEditedEntityRecord, hasFinishedResolution } = + select( coreStore ); + const { getRenderingMode } = select( editorStore ); + const context = getEditedPostContext(); + const queryArgs = [ 'postType', context.postType, context.postId ]; + return { + hasResolved: hasFinishedResolution( + 'getEditedEntityRecord', + queryArgs + ), + page: getEditedEntityRecord( ...queryArgs ), + renderingMode: getRenderingMode(), + }; + }, [] ); + const history = useHistory(); + + const { id, type, status, date, password } = page; if ( ! hasResolved ) { return null; @@ -56,7 +57,20 @@ export default function PagePanels() { return ( <> - + { + history.push( { + path: '/page', + } ); + } } + /> + } + /> { goTo( '/page' ); diff --git a/packages/edit-site/src/components/template-actions/index.js b/packages/edit-site/src/components/template-actions/index.js index 81f8b806e6276d..06a644f79c29e0 100644 --- a/packages/edit-site/src/components/template-actions/index.js +++ b/packages/edit-site/src/components/template-actions/index.js @@ -21,7 +21,7 @@ import { decodeEntities } from '@wordpress/html-entities'; import { store as editSiteStore } from '../../store'; import isTemplateRemovable from '../../utils/is-template-removable'; import isTemplateRevertable from '../../utils/is-template-revertable'; -import RenameMenuItem from './rename-menu-item'; +import RenamePostMenuItem from '../rename-post-menu-item'; import { TEMPLATE_POST_TYPE } from '../../utils/constants'; export default function TemplateActions( { @@ -55,8 +55,8 @@ export default function TemplateActions( { { isRemovable && ( <> -