From 8a6a52888d2d5235ae81d661e6e4461e08766e28 Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Mon, 15 Apr 2024 18:28:04 +0100 Subject: [PATCH 1/2] Update: Reuse and unify template actions. --- .../sidebar-edit-mode/template-panel/index.js | 37 ++++++----- .../index.js | 28 +++++--- .../src/components/post-actions/actions.js | 65 ++++++++++++++----- .../src/components/post-actions/index.js | 11 ++-- .../src/store/utils/is-template-revertable.js | 12 +++- 5 files changed, 99 insertions(+), 54 deletions(-) diff --git a/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js b/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js index f656858e11fa2..3b986aaf2f233 100644 --- a/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js +++ b/packages/edit-site/src/components/sidebar-edit-mode/template-panel/index.js @@ -18,18 +18,18 @@ import { useAsyncList } from '@wordpress/compose'; import { serialize } from '@wordpress/blocks'; import { __experimentalBlockPatternsList as BlockPatternsList } from '@wordpress/block-editor'; import { privateApis as routerPrivateApis } from '@wordpress/router'; +import { useCallback } from '@wordpress/element'; /** * Internal dependencies */ import { store as editSiteStore } from '../../../store'; -import TemplateActions from '../../template-actions'; import PluginTemplateSettingPanel from '../../plugin-template-setting-panel'; import { useAvailablePatterns } from './hooks'; import { TEMPLATE_PART_POST_TYPE } from '../../../utils/constants'; import { unlock } from '../../../lock-unlock'; -const { PostCardPanel } = unlock( editorPrivateApis ); +const { PostCardPanel, PostActions } = unlock( editorPrivateApis ); const { PatternOverridesPanel } = unlock( editorPrivateApis ); const { useHistory } = unlock( routerPrivateApis ); @@ -50,11 +50,6 @@ function TemplatesList( { availableTemplates, onSelect } ) { ); } -const POST_TYPE_PATH = { - wp_template: '/wp_template', - wp_template_part: '/patterns', -}; - export default function TemplatePanel() { const { title, description, record, postType, postId } = useSelect( ( select ) => { @@ -81,6 +76,22 @@ export default function TemplatePanel() { [] ); const history = useHistory(); + const onActionPerformed = useCallback( + ( actionId, items ) => { + if ( actionId === 'delete-template' ) { + history.push( { + path: + items[ 0 ].type === TEMPLATE_PART_POST_TYPE + ? '/' + TEMPLATE_PART_POST_TYPE + '/all' + : '/' + items[ 0 ].type, + postId: undefined, + postType: undefined, + canvas: 'view', + } ); + } + }, + [ history ] + ); const availablePatterns = useAvailablePatterns( record ); const { editEntityRecord } = useDispatch( coreStore ); @@ -100,17 +111,7 @@ export default function TemplatePanel() { { - history.push( { - path: POST_TYPE_PATH[ postType ], - } ); - } } - /> + } /> diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js index 1ab45a1566cea..913519bc1cb31 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js @@ -6,6 +6,9 @@ import { useDispatch, useSelect } from '@wordpress/data'; import { pencil } from '@wordpress/icons'; import { Icon } from '@wordpress/components'; import { store as coreStore } from '@wordpress/core-data'; +import { useCallback } from '@wordpress/element'; +import { privateApis as editorPrivateApis } from '@wordpress/editor'; + import { privateApis as routerPrivateApis } from '@wordpress/router'; /** @@ -18,9 +21,11 @@ import { unlock } from '../../lock-unlock'; import { store as editSiteStore } from '../../store'; import SidebarButton from '../sidebar-button'; import { useAddedBy } from '../page-templates-template-parts/hooks'; -import TemplateActions from '../template-actions'; import HomeTemplateDetails from './home-template-details'; import SidebarNavigationScreenDetailsFooter from '../sidebar-navigation-screen-details-footer'; +import { TEMPLATE_PART_POST_TYPE } from '../../utils/constants'; + +const { PostActions } = unlock( editorPrivateApis ); const { useHistory, useLocation } = unlock( routerPrivateApis ); @@ -104,20 +109,25 @@ export default function SidebarNavigationScreenTemplate() { postType, postId ); + const onActionPerformed = useCallback( + ( actionId, items ) => { + if ( actionId === 'delete-template' ) { + navigator.goTo( + items[ 0 ].type === TEMPLATE_PART_POST_TYPE + ? '/' + TEMPLATE_PART_POST_TYPE + '/all' + : '/' + items[ 0 ].type + ); + } + }, + [ navigator ] + ); return ( - { - history.push( { path: '/' + postType } ); - } } - /> + setCanvasMode( 'edit' ) } label={ __( 'Edit' ) } diff --git a/packages/editor/src/components/post-actions/actions.js b/packages/editor/src/components/post-actions/actions.js index 7b91c2c5c96e3..f77f6c5b60061 100644 --- a/packages/editor/src/components/post-actions/actions.js +++ b/packages/editor/src/components/post-actions/actions.js @@ -21,7 +21,12 @@ import { /** * Internal dependencies */ -import { TEMPLATE_ORIGINS, TEMPLATE_POST_TYPE } from '../../store/constants'; +import { + TEMPLATE_ORIGINS, + TEMPLATE_POST_TYPE, + TEMPLATE_PART_POST_TYPE, + PATTERN_POST_TYPE, +} from '../../store/constants'; import { store as editorStore } from '../../store'; import { unlock } from '../../lock-unlock'; import isTemplateRevertable from '../../store/utils/is-template-revertable'; @@ -33,13 +38,19 @@ function getItemTitle( item ) { return decodeEntities( item.title?.rendered || '' ); } +const SITE_EDITING_POST_TYPES = [ + TEMPLATE_POST_TYPE, + TEMPLATE_PART_POST_TYPE, + PATTERN_POST_TYPE, +]; + const trashPostAction = { id: 'move-to-trash', label: __( 'Move to Trash' ), isPrimary: true, icon: trash, - isEligible( { status } ) { - return status !== 'trash'; + isEligible( { type, status } ) { + return status !== 'trash' && ! SITE_EDITING_POST_TYPES.includes( type ); }, supportsBulk: true, hideModalHeader: true, @@ -182,8 +193,11 @@ function usePermanentlyDeletePostAction() { id: 'permanently-delete', label: __( 'Permanently delete' ), supportsBulk: true, - isEligible( { status } ) { - return status === 'trash'; + isEligible( { status, type } ) { + return ( + status === 'trash' && + ! SITE_EDITING_POST_TYPES.includes( type ) + ); }, async callback( posts, onActionPerformed ) { const promiseResult = await Promise.allSettled( @@ -292,8 +306,11 @@ function useRestorePostAction() { isPrimary: true, icon: backup, supportsBulk: true, - isEligible( { status } ) { - return status === 'trash'; + isEligible( { status, type } ) { + return ( + status === 'trash' && + ! SITE_EDITING_POST_TYPES.includes( type ) + ); }, async callback( posts, onActionPerformed ) { try { @@ -371,7 +388,10 @@ const viewPostAction = { isPrimary: true, icon: external, isEligible( post ) { - return post.status !== 'trash'; + return ( + post.status !== 'trash' && + ! SITE_EDITING_POST_TYPES.includes( post.type ) + ); }, callback( posts, onActionPerformed ) { const post = posts[ 0 ]; @@ -387,8 +407,8 @@ const editPostAction = { label: __( 'Edit' ), isPrimary: true, icon: edit, - isEligible( { status } ) { - return status !== 'trash'; + isEligible( { status, type } ) { + return status !== 'trash' && ! SITE_EDITING_POST_TYPES.includes( type ); }, callback( posts, onActionPerformed ) { if ( onActionPerformed ) { @@ -396,12 +416,16 @@ const editPostAction = { } }, }; + const postRevisionsAction = { id: 'view-post-revisions', label: __( 'View revisions' ), isPrimary: false, isEligible: ( post ) => { - if ( post.status === 'trash' ) { + if ( + post.status === 'trash' || + SITE_EDITING_POST_TYPES.includes( post.type ) + ) { return false; } const lastRevisionId = @@ -426,7 +450,10 @@ const renamePostAction = { id: 'rename-post', label: __( 'Rename' ), isEligible( post ) { - return post.status !== 'trash'; + return ( + post.status !== 'trash' && + ! SITE_EDITING_POST_TYPES.includes( post.type ) + ); }, RenderModal: ( { items, closeModal, onActionPerformed } ) => { const [ item ] = items; @@ -534,7 +561,7 @@ const resetTemplateAction = { : sprintf( /* translators: The template/part's name. */ __( '"%s" reset.' ), - decodeEntities( items[ 0 ].title.rendered ) + getItemTitle( items[ 0 ] ) ), { type: 'snackbar', @@ -603,7 +630,11 @@ const resetTemplateAction = { * @return {boolean} Whether the template is revertable. */ function isTemplateRemovable( template ) { - if ( ! template ) { + if ( + ! template || + ( template.type !== TEMPLATE_POST_TYPE && + template.type !== TEMPLATE_PART_POST_TYPE ) + ) { return false; } @@ -636,9 +667,7 @@ const deleteTemplateAction = { : sprintf( // translators: %s: The template or template part's titles __( 'Delete "%s"?' ), - decodeEntities( - templates?.[ 0 ]?.title?.rendered - ) + getItemTitle( templates[ 0 ] ) ) } @@ -679,7 +708,7 @@ const renameTemplateAction = { }, RenderModal: ( { items: templates, closeModal, onActionPerformed } ) => { const template = templates[ 0 ]; - const title = decodeEntities( template.title.rendered ); + const title = getItemTitle( template ); const [ editedTitle, setEditedTitle ] = useState( title ); const { editEntityRecord, diff --git a/packages/editor/src/components/post-actions/index.js b/packages/editor/src/components/post-actions/index.js index 269748685758c..ac9ffd12ec058 100644 --- a/packages/editor/src/components/post-actions/index.js +++ b/packages/editor/src/components/post-actions/index.js @@ -35,7 +35,10 @@ const POST_ACTIONS_WHILE_EDITING = [ 'view-post', 'view-post-revisions', 'rename-post', + 'rename-template', 'move-to-trash', + 'reset-template', + 'delete-template', ]; export default function PostActions( { onActionPerformed, buttonProps } ) { @@ -51,13 +54,7 @@ export default function PostActions( { onActionPerformed, buttonProps } ) { POST_ACTIONS_WHILE_EDITING ); - if ( - [ - TEMPLATE_POST_TYPE, - TEMPLATE_PART_POST_TYPE, - PATTERN_POST_TYPE, - ].includes( postType ) - ) { + if ( PATTERN_POST_TYPE === postType ) { return null; } return ( diff --git a/packages/editor/src/store/utils/is-template-revertable.js b/packages/editor/src/store/utils/is-template-revertable.js index efe4647f21280..281c8b7c631ba 100644 --- a/packages/editor/src/store/utils/is-template-revertable.js +++ b/packages/editor/src/store/utils/is-template-revertable.js @@ -1,7 +1,11 @@ /** * Internal dependencies */ -import { TEMPLATE_ORIGINS } from '../constants'; +import { + TEMPLATE_ORIGINS, + TEMPLATE_POST_TYPE, + TEMPLATE_PART_POST_TYPE, +} from '../constants'; // Copy of the function from packages/edit-site/src/utils/is-template-revertable.js @@ -12,7 +16,11 @@ import { TEMPLATE_ORIGINS } from '../constants'; * @return {boolean} Whether the template is revertable. */ export default function isTemplateRevertable( template ) { - if ( ! template ) { + if ( + ! template || + ( template.type !== TEMPLATE_POST_TYPE && + template.type !== TEMPLATE_PART_POST_TYPE ) + ) { return false; } /* eslint-disable camelcase */ From b7fb7e34041875333c28bc98516b57f4d01247fb Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Mon, 22 Apr 2024 18:23:07 +0100 Subject: [PATCH 2/2] post rebase changes --- .../sidebar-navigation-screen-template/index.js | 13 +++++++------ .../editor/src/components/post-actions/index.js | 6 +----- 2 files changed, 8 insertions(+), 11 deletions(-) diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js index 913519bc1cb31..918acc959f7af 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-template/index.js @@ -112,14 +112,15 @@ export default function SidebarNavigationScreenTemplate() { const onActionPerformed = useCallback( ( actionId, items ) => { if ( actionId === 'delete-template' ) { - navigator.goTo( - items[ 0 ].type === TEMPLATE_PART_POST_TYPE - ? '/' + TEMPLATE_PART_POST_TYPE + '/all' - : '/' + items[ 0 ].type - ); + history.push( { + path: + items[ 0 ].type === TEMPLATE_PART_POST_TYPE + ? '/' + TEMPLATE_PART_POST_TYPE + '/all' + : '/' + items[ 0 ], + } ); } }, - [ navigator ] + [ history ] ); return ( diff --git a/packages/editor/src/components/post-actions/index.js b/packages/editor/src/components/post-actions/index.js index ac9ffd12ec058..4ef1d3d57bd94 100644 --- a/packages/editor/src/components/post-actions/index.js +++ b/packages/editor/src/components/post-actions/index.js @@ -17,11 +17,7 @@ import { moreVertical } from '@wordpress/icons'; import { unlock } from '../../lock-unlock'; import { usePostActions } from './actions'; import { store as editorStore } from '../../store'; -import { - TEMPLATE_POST_TYPE, - TEMPLATE_PART_POST_TYPE, - PATTERN_POST_TYPE, -} from '../../store/constants'; +import { PATTERN_POST_TYPE } from '../../store/constants'; const { DropdownMenuV2: DropdownMenu,