@wordpress/core-commands 0.26.0 → 1.0.0

package/src/site-editor-navigation-commands.js

@@ -10,22 +10,23 @@ import {
 	post,
 	page,
 	layout,
+	symbol,
 	symbolFilled,
 	styles,
 	navigation,
 } from '@wordpress/icons';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
-import { getQueryArg, addQueryArgs, getPath } from '@wordpress/url';
+import { addQueryArgs, getPath } from '@wordpress/url';
 import { useDebounce } from '@wordpress/compose';
 
 /**
  * Internal dependencies
  */
-import { useIsTemplatesAccessible, useIsBlockBasedTheme } from './hooks';
+import { useIsBlockBasedTheme } from './hooks';
 import { unlock } from './lock-unlock';
 import { orderEntityRecordsBySearch } from './utils/order-entity-records-by-search';
 
-const { useHistory, useLocation } = unlock( routerPrivateApis );
+const { useHistory } = unlock( routerPrivateApis );
 
 const icons = {
 	post,
@@ -118,14 +119,6 @@ const getNavigationCommandLoaderPerPostType = ( postType ) =>
 				const isSiteEditor = getPath( window.location.href )?.includes(
 					'site-editor.php'
 				);
-				const extraArgs = isSiteEditor
-					? {
-							canvas: getQueryArg(
-								window.location.href,
-								'canvas'
-							),
-					  }
-					: {};
 
 				return {
 					...command,
@@ -133,7 +126,7 @@ const getNavigationCommandLoaderPerPostType = ( postType ) =>
 						const args = {
 							postType,
 							postId: record.id,
-							...extraArgs,
+							canvas: 'edit',
 						};
 						const targetUrl = addQueryArgs(
 							'site-editor.php',
@@ -159,14 +152,6 @@ const getNavigationCommandLoaderPerPostType = ( postType ) =>
 const getNavigationCommandLoaderPerTemplate = ( templateType ) =>
 	function useNavigationCommandLoader( { search } ) {
 		const history = useHistory();
-		const location = useLocation();
-
-		const isPatternsPage =
-			location?.params?.path === '/patterns' ||
-			location?.params?.postType === 'wp_block';
-		const didAccessPatternsPage =
-			!! location?.params?.didAccessPatternsPage;
-
 		const isBlockBasedTheme = useIsBlockBasedTheme();
 		const { records, isLoading } = useSelect( ( select ) => {
 			const { getEntityRecords } = select( coreStore );
@@ -196,31 +181,52 @@ const getNavigationCommandLoaderPerTemplate = ( templateType ) =>
 			) {
 				return [];
 			}
-			return orderedRecords.map( ( record ) => {
-				const isSiteEditor = getPath( window.location.href )?.includes(
-					'site-editor.php'
-				);
-				const extraArgs = isSiteEditor
-					? { canvas: getQueryArg( window.location.href, 'canvas' ) }
-					: {};
+			const isSiteEditor = getPath( window.location.href )?.includes(
+				'site-editor.php'
+			);
+			const result = [];
+			result.push(
+				...orderedRecords.map( ( record ) => {
+					return {
+						name: templateType + '-' + record.id,
+						searchLabel: record.title?.rendered + ' ' + record.id,
+						label: record.title?.rendered
+							? record.title?.rendered
+							: __( '(no title)' ),
+						icon: icons[ templateType ],
+						callback: ( { close } ) => {
+							const args = {
+								postType: templateType,
+								postId: record.id,
+								canvas: 'edit',
+							};
+							const targetUrl = addQueryArgs(
+								'site-editor.php',
+								args
+							);
+							if ( isSiteEditor ) {
+								history.push( args );
+							} else {
+								document.location = targetUrl;
+							}
+							close();
+						},
+					};
+				} )
+			);
 
-				return {
-					name: templateType + '-' + record.id,
-					searchLabel: record.title?.rendered + ' ' + record.id,
-					label: record.title?.rendered
-						? record.title?.rendered
-						: __( '(no title)' ),
-					icon: icons[ templateType ],
+			if (
+				orderedRecords?.length > 0 &&
+				templateType === 'wp_template_part'
+			) {
+				result.push( {
+					name: 'core/edit-site/open-template-parts',
+					label: __( 'Template parts' ),
+					icon: symbolFilled,
 					callback: ( { close } ) => {
 						const args = {
-							postType: templateType,
-							postId: record.id,
-							didAccessPatternsPage:
-								! isBlockBasedTheme &&
-								( isPatternsPage || didAccessPatternsPage )
-									? 1
-									: undefined,
-							...extraArgs,
+							postType: 'wp_template_part',
+							categoryId: 'all-parts',
 						};
 						const targetUrl = addQueryArgs(
 							'site-editor.php',
@@ -233,8 +239,9 @@ const getNavigationCommandLoaderPerTemplate = ( templateType ) =>
 						}
 						close();
 					},
-				};
-			} );
+				} );
+			}
+			return result;
 		}, [ isBlockBasedTheme, orderedRecords, history ] );
 
 		return {
@@ -257,89 +264,112 @@ function useSiteEditorBasicNavigationCommands() {
 	const isSiteEditor = getPath( window.location.href )?.includes(
 		'site-editor.php'
 	);
-	const isTemplatesAccessible = useIsTemplatesAccessible();
+	const canCreateTemplate = useSelect( ( select ) => {
+		return select( coreStore ).canUser( 'create', 'templates' );
+	}, [] );
 	const isBlockBasedTheme = useIsBlockBasedTheme();
 	const commands = useMemo( () => {
 		const result = [];
 
-		if ( ! isTemplatesAccessible || ! isBlockBasedTheme ) {
-			return result;
-		}
+		if ( canCreateTemplate && isBlockBasedTheme ) {
+			result.push( {
+				name: 'core/edit-site/open-navigation',
+				label: __( 'Navigation' ),
+				icon: navigation,
+				callback: ( { close } ) => {
+					const args = {
+						postType: 'wp_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 = {
+						post_type: '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 = {
+						postType: '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 = {
+						postType: 'wp_block',
+					};
+					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();
 			},
 		} );
 
 		return result;
-	}, [ history, isSiteEditor, isTemplatesAccessible, isBlockBasedTheme ] );
+	}, [ history, isSiteEditor, canCreateTemplate, isBlockBasedTheme ] );
 
 	return {
 		commands,