Moves "Patterns" command to site editor main navigation (#61416)

* moves pattern command to site editor main navigation * updates patterns command to properly display and link for non-block themes and non-admin-level users Co-authored-by: bacoords <[email protected]> Co-authored-by: t-hamano <[email protected]>
WordPress · May 9, 2024 · c3f74da · c3f74da
1 parent f2503b1
commit c3f74da
Show file tree

Hide file tree

Showing 2 changed files with 88 additions and 110 deletions.
diff --git a/packages/core-commands/src/admin-navigation-commands.js b/packages/core-commands/src/admin-navigation-commands.js
@@ -3,29 +3,9 @@
  */
 import { useCommand } from '@wordpress/commands';
 import { __ } from '@wordpress/i18n';
-import { plus, symbol } from '@wordpress/icons';
-import { useSelect } from '@wordpress/data';
-import { store as coreStore } from '@wordpress/core-data';
-import { addQueryArgs, getPath } from '@wordpress/url';
-import { privateApis as routerPrivateApis } from '@wordpress/router';
-
-/**
- * Internal dependencies
- */
-import { unlock } from './lock-unlock';
-
-const { useHistory } = unlock( routerPrivateApis );
+import { plus } from '@wordpress/icons';
 
 export function useAdminNavigationCommands() {
-	const history = useHistory();
-	const canCreateTemplate = useSelect( ( select ) => {
-		return select( coreStore ).canUser( 'create', 'templates' );
-	}, [] );
-
-	const isSiteEditor = getPath( window.location.href )?.includes(
-		'site-editor.php'
-	);
-
 	useCommand( {
 		name: 'core/add-new-post',
 		label: __( 'Add new post' ),
@@ -42,28 +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 } ) => {
-			// The site editor and templates both check whether the user
-			// can create templates. We can leverage that here and this
-			// command links to the classic dashboard manage patterns page
-			// if the user can't access it.
-			if ( canCreateTemplate ) {
-				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,
@@ -264,79 +265,100 @@ function useSiteEditorBasicNavigationCommands() {
 	const commands = useMemo( () => {
 		const result = [];
 
-		if ( ! canCreateTemplate || ! isBlockBasedTheme ) {
-			return result;
-		}
+		if ( canCreateTemplate && isBlockBasedTheme ) {
+			result.push( {
+				name: 'core/edit-site/open-navigation',
+				label: __( 'Navigation' ),
+				icon: navigation,
+				callback: ( { close } ) => {
+					const args = {
+						path: '/navigation',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
+				},
+			} );
 
-		result.push( {
-			name: 'core/edit-site/open-navigation',
-			label: __( 'Navigation' ),
-			icon: navigation,
-			callback: ( { close } ) => {
-				const args = {
-					path: '/navigation',
-				};
-				const targetUrl = addQueryArgs( 'site-editor.php', args );
-				if ( isSiteEditor ) {
-					history.push( args );
-				} else {
-					document.location = targetUrl;
-				}
-				close();
-			},
-		} );
+			result.push( {
+				name: 'core/edit-site/open-styles',
+				label: __( 'Styles' ),
+				icon: styles,
+				callback: ( { close } ) => {
+					const args = {
+						path: '/wp_global_styles',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
+				},
+			} );
 
-		result.push( {
-			name: 'core/edit-site/open-styles',
-			label: __( 'Styles' ),
-			icon: styles,
-			callback: ( { close } ) => {
-				const args = {
-					path: '/wp_global_styles',
-				};
-				const targetUrl = addQueryArgs( 'site-editor.php', args );
-				if ( isSiteEditor ) {
-					history.push( args );
-				} else {
-					document.location = targetUrl;
-				}
-				close();
-			},
-		} );
+			result.push( {
+				name: 'core/edit-site/open-pages',
+				label: __( 'Pages' ),
+				icon: page,
+				callback: ( { close } ) => {
+					const args = {
+						path: '/page',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
+				},
+			} );
 
-		result.push( {
-			name: 'core/edit-site/open-pages',
-			label: __( 'Pages' ),
-			icon: page,
-			callback: ( { close } ) => {
-				const args = {
-					path: '/page',
-				};
-				const targetUrl = addQueryArgs( 'site-editor.php', args );
-				if ( isSiteEditor ) {
-					history.push( args );
-				} else {
-					document.location = targetUrl;
-				}
-				close();
-			},
-		} );
+			result.push( {
+				name: 'core/edit-site/open-templates',
+				label: __( 'Templates' ),
+				icon: layout,
+				callback: ( { close } ) => {
+					const args = {
+						path: '/wp_template',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
+				},
+			} );
+		}
 
 		result.push( {
-			name: 'core/edit-site/open-templates',
-			label: __( 'Templates' ),
-			icon: layout,
+			name: 'core/edit-site/open-patterns',
+			label: __( 'Patterns' ),
+			icon: symbol,
 			callback: ( { close } ) => {
-				const args = {
-					path: '/wp_template',
-				};
-				const targetUrl = addQueryArgs( 'site-editor.php', args );
-				if ( isSiteEditor ) {
-					history.push( args );
+				if ( canCreateTemplate ) {
+					const args = {
+						path: '/patterns',
+					};
+					const targetUrl = addQueryArgs( 'site-editor.php', args );
+					if ( isSiteEditor ) {
+						history.push( args );
+					} else {
+						document.location = targetUrl;
+					}
+					close();
 				} else {
-					document.location = targetUrl;
+					// If a user cannot access the site editor
+					document.location.href = 'edit.php?post_type=wp_block';
 				}
-				close();
 			},
 		} );