Allow accessing the patterns screen when the classic theme supports block-template-parts

packages/core-commands/src/admin-navigation-commands.js

@@ -10,7 +10,11 @@ import { privateApis as routerPrivateApis } from '@wordpress/router';
 /**
  * Internal dependencies
  */
-import { useIsTemplatesAccessible, useIsBlockBasedTheme } from './hooks';
+import {
+	useIsTemplatesAccessible,
+	useIsBlockBasedTheme,
+	useSupportsBlockTemplateParts,
+} from './hooks';
 import { unlock } from './lock-unlock';
 
 const { useHistory } = unlock( routerPrivateApis );
@@ -19,6 +23,7 @@ export function useAdminNavigationCommands() {
 	const history = useHistory();
 	const isTemplatesAccessible = useIsTemplatesAccessible();
 	const isBlockBasedTheme = useIsBlockBasedTheme();
+	const supportsBlockTemplateParts = useSupportsBlockTemplateParts();
 
 	const isSiteEditor = getPath( window.location.href )?.includes(
 		'site-editor.php'
@@ -45,7 +50,10 @@ export function useAdminNavigationCommands() {
 		label: __( 'Patterns' ),
 		icon: symbol,
 		callback: ( { close } ) => {
-			if ( isTemplatesAccessible && isBlockBasedTheme ) {
+			if (
+				isTemplatesAccessible &&
+				( isBlockBasedTheme || supportsBlockTemplateParts )
+			) {
 				const args = {
 					path: '/patterns',
 				};

packages/core-commands/src/hooks.js

@@ -17,3 +17,11 @@ export function useIsBlockBasedTheme() {
 		[]
 	);
 }
+
+export function useSupportsBlockTemplateParts() {
+	return useSelect(
+		( select ) =>
+			!! select( coreStore ).getThemeSupports()[ 'block-template-parts' ],
+		[]
+	);
+}

packages/edit-post/src/plugins/index.js

@@ -20,10 +20,12 @@ import WelcomeGuideMenuItem from './welcome-guide-menu-item';
 
 function ManagePatternsMenuItem() {
 	const url = useSelect( ( select ) => {
-		const { canUser } = select( coreStore );
+		const { canUser, getThemeSupports } = select( coreStore );
 		const { getEditorSettings } = select( editorStore );
 
 		const isBlockTheme = getEditorSettings().__unstableIsBlockBasedTheme;
+		const supportsBlockTemplateParts =
+			!! getThemeSupports()[ 'block-template-parts' ];
 		const defaultUrl = addQueryArgs( 'edit.php', {
 			post_type: 'wp_block',
 		} );
@@ -34,7 +36,8 @@ function ManagePatternsMenuItem() {
 		// The site editor and templates both check whether the user has
 		// edit_theme_options capabilities. We can leverage that here and not
 		// display the manage patterns link if the user can't access it.
-		return canUser( 'read', 'templates' ) && isBlockTheme
+		return canUser( 'read', 'templates' ) &&
+			( isBlockTheme || supportsBlockTemplateParts )
 			? patternsUrl
 			: defaultUrl;
 	}, [] );

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
@@ -105,6 +107,10 @@ export default function SidebarNavigationScreenPatterns() {
 		useTemplatePartAreas();
 	const { patternCategories, hasPatterns } = usePatternCategories();
 	const { myPatterns } = useMyPatterns();
+	const isBlockBasedTheme = useSelect(
+		( select ) => !! select( coreStore ).getCurrentTheme()?.is_block_theme,
+		[]
+	);
 
 	const templatePartsLink = useLink( { path: '/wp_template_part/all' } );
 	const footer = ! isMobileViewport ? (
@@ -124,6 +130,7 @@ export default function SidebarNavigationScreenPatterns() {
 
 	return (
 		<SidebarNavigationScreen
+			isRoot={ ! isBlockBasedTheme }
 			title={ __( 'Patterns' ) }
 			description={ __(
 				'Manage what patterns are available when editing the site.'

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 }

packages/patterns/src/components/patterns-manage-button.js

@@ -20,9 +20,11 @@ function PatternsManageButton( { clientId } ) {
 			( select ) => {
 				const { getBlock, canRemoveBlock, getBlockCount, getSettings } =
 					select( blockEditorStore );
-				const { canUser } = select( coreStore );
+				const { canUser, getThemeSupports } = select( coreStore );
 				const reusableBlock = getBlock( clientId );
 				const isBlockTheme = getSettings().__unstableIsBlockBasedTheme;
+				const supportsBlockTemplateParts =
+					!! getThemeSupports()[ 'block-template-parts' ];
 
 				return {
 					canRemove: canRemoveBlock( clientId ),
@@ -39,7 +41,8 @@ function PatternsManageButton( { clientId } ) {
 					// has edit_theme_options capabilities. We can leverage that here
 					// and omit the manage patterns link if the user can't access it.
 					managePatternsUrl:
-						isBlockTheme && canUser( 'read', 'templates' )
+						( isBlockTheme || supportsBlockTemplateParts ) &&
+						canUser( 'read', 'templates' )
 							? addQueryArgs( 'site-editor.php', {
 									path: '/patterns',
 							  } )

packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-blocks-manage-button.js

@@ -20,9 +20,11 @@ function ReusableBlocksManageButton( { clientId } ) {
 			( select ) => {
 				const { getBlock, canRemoveBlock, getBlockCount, getSettings } =
 					select( blockEditorStore );
-				const { canUser } = select( coreStore );
+				const { canUser, getThemeSupports } = select( coreStore );
 				const reusableBlock = getBlock( clientId );
 				const isBlockTheme = getSettings().__unstableIsBlockBasedTheme;
+				const supportsBlockTemplateParts =
+					!! getThemeSupports()[ 'block-template-parts' ];
 
 				return {
 					canRemove: canRemoveBlock( clientId ),
@@ -39,7 +41,8 @@ function ReusableBlocksManageButton( { clientId } ) {
 					// has edit_theme_options capabilities. We can leverage that here
 					// and omit the manage patterns link if the user can't access it.
 					managePatternsUrl:
-						isBlockTheme && canUser( 'read', 'templates' )
+						( isBlockTheme || supportsBlockTemplateParts ) &&
+						canUser( 'read', 'templates' )
 							? addQueryArgs( 'site-editor.php', {
 									path: '/patterns',
 							  } )