Site Editor: Publish Patterns page to non-block themes

WordPress · Sep 5, 2023 · 494985e · 494985e
1 parent c162b0d
commit 494985e
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 60 deletions.
diff --git a/packages/core-commands/src/admin-navigation-commands.js b/packages/core-commands/src/admin-navigation-commands.js
@@ -3,27 +3,9 @@
  */
 import { useCommand } from '@wordpress/commands';
 import { __ } from '@wordpress/i18n';
-import { plus, symbol } from '@wordpress/icons';
-import { addQueryArgs, getPath } from '@wordpress/url';
-import { privateApis as routerPrivateApis } from '@wordpress/router';
-
-/**
- * Internal dependencies
- */
-import { useIsTemplatesAccessible, useIsBlockBasedTheme } from './hooks';
-import { unlock } from './lock-unlock';
-
-const { useHistory } = unlock( routerPrivateApis );
+import { plus } from '@wordpress/icons';
 
 export function useAdminNavigationCommands() {
-	const history = useHistory();
-	const isTemplatesAccessible = useIsTemplatesAccessible();
-	const isBlockBasedTheme = useIsBlockBasedTheme();
-
-	const isSiteEditor = getPath( window.location.href )?.includes(
-		'site-editor.php'
-	);
-
 	useCommand( {
 		name: 'core/add-new-post',
 		label: __( 'Add new post' ),
@@ -40,24 +22,4 @@ export function useAdminNavigationCommands() {
 			document.location.href = 'post-new.php?post_type=page';
 		},
 	} );
-	useCommand( {
-		name: 'core/manage-reusable-blocks',
-		label: __( 'Patterns' ),
-		icon: symbol,
-		callback: ( { close } ) => {
-			if ( isTemplatesAccessible && isBlockBasedTheme ) {
-				const args = {
-					path: '/patterns',
-				};
-				if ( isSiteEditor ) {
-					history.push( args );
-				} else {
-					document.location = addQueryArgs( 'site-editor.php', args );
-				}
-				close();
-			} else {
-				document.location.href = 'edit.php?post_type=wp_block';
-			}
-		},
-	} );
 }
diff --git a/packages/core-commands/src/site-editor-navigation-commands.js b/packages/core-commands/src/site-editor-navigation-commands.js
@@ -10,6 +10,7 @@ import {
 	post,
 	page,
 	layout,
+	symbol,
 	symbolFilled,
 	styles,
 	navigation,
@@ -224,7 +225,25 @@ function useSiteEditorBasicNavigationCommands() {
 	const isTemplatesAccessible = useIsTemplatesAccessible();
 	const isBlockBasedTheme = useIsBlockBasedTheme();
 	const commands = useMemo( () => {
-		const result = [];
+		const result = [
+			{
+				name: 'core/edit-site/open-patterns',
+				label: __( 'Patterns' ),
+				icon: symbol,
+				callback: ( { close } ) => {
+					const args = {
+						path: '/patterns',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
+				},
+			},
+		];
 
 		if ( ! isTemplatesAccessible || ! isBlockBasedTheme ) {
 			return result;

diff --git a/packages/edit-site/src/components/add-new-pattern/index.js b/packages/edit-site/src/components/add-new-pattern/index.js
@@ -8,14 +8,14 @@ import { plus, symbol, symbolFilled } from '@wordpress/icons';
 import { useSelect } from '@wordpress/data';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 import { privateApis as editPatternsPrivateApis } from '@wordpress/patterns';
+import { store as coreStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
  */
 import CreateTemplatePartModal from '../create-template-part-modal';
 import SidebarButton from '../sidebar-button';
 import { unlock } from '../../lock-unlock';
-import { store as editSiteStore } from '../../store';
 
 const { useHistory } = unlock( routerPrivateApis );
 const { CreatePatternModal } = unlock( editPatternsPrivateApis );
@@ -25,9 +25,9 @@ export default function AddNewPattern() {
 	const [ showPatternModal, setShowPatternModal ] = useState( false );
 	const [ showTemplatePartModal, setShowTemplatePartModal ] =
 		useState( false );
-	const isTemplatePartsMode = useSelect( ( select ) => {
-		const settings = select( editSiteStore ).getSettings();
-		return !! settings.supportsTemplatePartsMode;
+
+	const isBlockBasedTheme = useSelect( ( select ) => {
+		return select( coreStore ).getCurrentTheme()?.is_block_theme;
 	}, [] );
 
 	function handleCreatePattern( { pattern, categoryId } ) {
@@ -66,9 +66,7 @@ export default function AddNewPattern() {
 		},
 	];
 
-	// Remove condition when command palette issues are resolved.
-	// See: https://github.com/WordPress/gutenberg/issues/52154.
-	if ( ! isTemplatePartsMode ) {
+	if ( isBlockBasedTheme ) {
 		controls.push( {
 			icon: symbolFilled,
 			onClick: () => setShowTemplatePartModal( true ),

diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-patterns/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-patterns/index.js
@@ -14,6 +14,8 @@ import { getTemplatePartIcon } from '@wordpress/editor';
 import { __, sprintf } from '@wordpress/i18n';
 import { getQueryArgs } from '@wordpress/url';
 import { file, starFilled, lockSmall } from '@wordpress/icons';
+import { store as coreStore } from '@wordpress/core-data';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -27,6 +29,7 @@ import { useLink } from '../routes/link';
 import usePatternCategories from './use-pattern-categories';
 import useMyPatterns from './use-my-patterns';
 import useTemplatePartAreas from './use-template-part-areas';
+import { store as editSiteStore } from '../../store';
 
 function TemplatePartGroup( { areas, currentArea, currentType } ) {
 	return (
@@ -105,7 +108,14 @@ export default function SidebarNavigationScreenPatterns() {
 		useTemplatePartAreas();
 	const { patternCategories, hasPatterns } = usePatternCategories();
 	const { myPatterns } = useMyPatterns();
-
+	const isBlockBasedTheme = useSelect(
+		( select ) => select( coreStore ).getCurrentTheme()?.is_block_theme,
+		[]
+	);
+	const isTemplatePartsMode = useSelect( ( select ) => {
+		const settings = select( editSiteStore ).getSettings();
+		return !! settings.supportsTemplatePartsMode;
+	}, [] );
 	const templatePartsLink = useLink( { path: '/wp_template_part/all' } );
 	const footer = ! isMobileViewport ? (
 		<ItemGroup>
@@ -116,14 +126,17 @@ export default function SidebarNavigationScreenPatterns() {
 			>
 				{ __( 'Manage all of my patterns' ) }
 			</SidebarNavigationItem>
-			<SidebarNavigationItem withChevron { ...templatePartsLink }>
-				{ __( 'Manage all template parts' ) }
-			</SidebarNavigationItem>
+			{ ( isBlockBasedTheme || isTemplatePartsMode ) && (
+				<SidebarNavigationItem withChevron { ...templatePartsLink }>
+					{ __( 'Manage all template parts' ) }
+				</SidebarNavigationItem>
+			) }
 		</ItemGroup>
 	) : undefined;
 
 	return (
 		<SidebarNavigationScreen
+			isRoot={ ! isBlockBasedTheme }
 			title={ __( 'Patterns' ) }
 			description={ __(
 				'Manage what patterns are available when editing the site.'

diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-templates-browse/index.js
@@ -2,14 +2,12 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { useSelect } from '@wordpress/data';
 import { __experimentalUseNavigator as useNavigator } from '@wordpress/components';
 
 /**
  * Internal dependencies
  */
 import SidebarNavigationScreen from '../sidebar-navigation-screen';
-import { store as editSiteStore } from '../../store';
 
 const config = {
 	wp_template: {
@@ -32,15 +30,8 @@ export default function SidebarNavigationScreenTemplatesBrowse() {
 		params: { postType },
 	} = useNavigator();
 
-	const isTemplatePartsMode = useSelect( ( select ) => {
-		const settings = select( editSiteStore ).getSettings();
-
-		return !! settings.supportsTemplatePartsMode;
-	}, [] );
-
 	return (
 		<SidebarNavigationScreen
-			isRoot={ isTemplatePartsMode }
 			title={ config[ postType ].title }
 			description={ config[ postType ].description }
 			backPath={ config[ postType ].backPath }