diff --git a/packages/edit-site/src/hooks/commands/use-common-commands.js b/packages/edit-site/src/hooks/commands/use-common-commands.js index e10a04526bee1..0933776e7bb14 100644 --- a/packages/edit-site/src/hooks/commands/use-common-commands.js +++ b/packages/edit-site/src/hooks/commands/use-common-commands.js @@ -114,13 +114,68 @@ function useGlobalStylesOpenCssCommands() { }; } -export function useCommonCommands() { +function useGlobalStylesOpenRevisionsCommands() { const { openGeneralSidebar, setEditorCanvasContainerView, setCanvasMode } = unlock( useDispatch( editSiteStore ) ); + const { getCanvasMode } = unlock( useSelect( editSiteStore ) ); const { params } = useLocation(); const isMobileViewport = useViewportMatch( 'medium', '<' ); - const isListPage = getIsListPage( params, isMobileViewport ); - const isEditorPage = ! isListPage; + const isEditorPage = ! getIsListPage( params, isMobileViewport ); + const history = useHistory(); + const hasRevisions = useSelect( + ( select ) => + select( coreStore ).getCurrentThemeGlobalStylesRevisions()?.length, + [] + ); + const commands = useMemo( () => { + if ( ! hasRevisions ) { + return []; + } + + return [ + { + name: 'core/edit-site/open-global-styles-revisions', + label: __( 'Open styles revisions' ), + icon: backup, + callback: ( { close } ) => { + close(); + if ( ! isEditorPage ) { + history.push( { + path: '/wp_global_styles', + canvas: 'edit', + } ); + } + if ( isEditorPage && getCanvasMode() !== 'edit' ) { + setCanvasMode( 'edit' ); + } + openGeneralSidebar( 'edit-site/global-styles' ); + setEditorCanvasContainerView( 'global-styles-revisions' ); + }, + }, + ]; + }, [ + hasRevisions, + history, + openGeneralSidebar, + setEditorCanvasContainerView, + isEditorPage, + getCanvasMode, + setCanvasMode, + ] ); + + return { + isLoading: false, + commands, + }; +} + +export function useCommonCommands() { + const { openGeneralSidebar, setCanvasMode } = unlock( + useDispatch( editSiteStore ) + ); + const { params } = useLocation(); + const isMobileViewport = useViewportMatch( 'medium', '<' ); + const isEditorPage = ! getIsListPage( params, isMobileViewport ); const { getCanvasMode } = unlock( useSelect( editSiteStore ) ); const { set } = useDispatch( preferencesStore ); const { createInfoNotice } = useDispatch( noticesStore ); @@ -139,26 +194,6 @@ export function useCommonCommands() { }; }, [] ); - useCommand( { - name: 'core/edit-site/open-global-styles-revisions', - label: __( 'Open styles revisions' ), - icon: backup, - callback: ( { close } ) => { - close(); - if ( ! isEditorPage ) { - history.push( { - path: '/wp_global_styles', - canvas: 'edit', - } ); - } - if ( isEditorPage && getCanvasMode() !== 'edit' ) { - setCanvasMode( 'edit' ); - } - openGeneralSidebar( 'edit-site/global-styles' ); - setEditorCanvasContainerView( 'global-styles-revisions' ); - }, - } ); - useCommand( { name: 'core/edit-site/open-styles', label: __( 'Open styles' ), @@ -228,4 +263,9 @@ export function useCommonCommands() { name: 'core/edit-site/open-styles-css', hook: useGlobalStylesOpenCssCommands, } ); + + useCommandLoader( { + name: 'core/edit-site/open-styles-revisions', + hook: useGlobalStylesOpenRevisionsCommands, + } ); } diff --git a/test/e2e/specs/site-editor/user-global-styles-revisions.spec.js b/test/e2e/specs/site-editor/user-global-styles-revisions.spec.js index cb90ebe5edf25..ada0dc3152ac2 100644 --- a/test/e2e/specs/site-editor/user-global-styles-revisions.spec.js +++ b/test/e2e/specs/site-editor/user-global-styles-revisions.spec.js @@ -26,22 +26,6 @@ test.describe( 'Global styles revisions', () => { await admin.visitSiteEditor(); } ); - test( 'should display no revisions message if landing via command center', async ( { - page, - } ) => { - await page - .getByRole( 'button', { name: 'Open command palette' } ) - .focus(); - await page.keyboard.press( 'Meta+k' ); - await page.keyboard.type( 'styles revisions' ); - await page - .getByRole( 'option', { name: 'Open styles revisions' } ) - .click(); - await expect( - page.getByTestId( 'global-styles-no-revisions' ) - ).toHaveText( 'No results found.' ); - } ); - test( 'should display revisions UI when there is more than 1 revision', async ( { page, editor,