From 8f3f218dc356abafe60d2706465ced6e808ed590 Mon Sep 17 00:00:00 2001 From: Robert Anderson Date: Thu, 21 Sep 2023 08:57:45 +1000 Subject: [PATCH] Site Editor: Add 'Show template' toggle when editing pages (#52674) * Site Editor: First pass at adding a Show Template toggle when editing pages * Bit of clean up * Use a toggle in sidebar * Make toggling 'Show template' on/off faster * Use blocks in same order as template * Tidy up code * Add unit tests * Add doc comment * Formatting Remove unused component import Doc update * With icon and updated copy * Use only the check icon and set min width of dropdown to minimize the effect of the dropdown width toggling between narrow and wide * This commit tries to get around a peculiarity of __experimentalGetGlobalBlocksByName, which doesn't seem to be able to find the post-content block in a new block tree (if it even exists in state). We're sidestepping the issue, but with fewer selectors, so overall hopefully it's more sustainable. * Removing the filter iteration layer and adding it to the flattenBlock helper function Checking for disallowed blocks as well, e.g., core/query * Extract usePageContentBlocks and write basic tests Moving PAGE_CONTENT_BLOCK_TYPES to utils/constants and creating a map * Updates selectors to include canvas mode so we can show any hidden templates in focus mode * Moving getPageContentFocusType and setPageContentFocusType selector/action to locked, private methods In the use-page-content-blocks.js test, add innerblocks to the query test block --------- Co-authored-by: ramon --- .../default-block-editor-provider.js | 70 +++++++++++++++ .../block-editor-provider/index.js | 28 ++++++ .../navigation-block-editor-provider.js | 0 .../test/use-page-content-blocks.js | 87 +++++++++++++++++++ .../use-page-content-blocks.js | 77 ++++++++++++++++ .../block-editor/get-block-editor-provider.js | 29 ------- .../src/components/block-editor/index.js | 15 +--- .../default-block-editor-provider.js | 44 ---------- .../disable-non-page-content-blocks.js | 10 +-- .../page-panels/edit-template.js | 68 ++++++++++----- .../sidebar-edit-mode/page-panels/style.scss | 6 ++ .../edit-site/src/store/private-actions.js | 19 ++++ .../edit-site/src/store/private-selectors.js | 22 +++++ packages/edit-site/src/store/reducer.js | 18 ++++ packages/edit-site/src/store/test/reducer.js | 18 ++++ packages/edit-site/src/utils/constants.js | 10 +++ 16 files changed, 406 insertions(+), 115 deletions(-) create mode 100644 packages/edit-site/src/components/block-editor/block-editor-provider/default-block-editor-provider.js create mode 100644 packages/edit-site/src/components/block-editor/block-editor-provider/index.js rename packages/edit-site/src/components/block-editor/{providers => block-editor-provider}/navigation-block-editor-provider.js (100%) create mode 100644 packages/edit-site/src/components/block-editor/block-editor-provider/test/use-page-content-blocks.js create mode 100644 packages/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js delete mode 100644 packages/edit-site/src/components/block-editor/get-block-editor-provider.js delete mode 100644 packages/edit-site/src/components/block-editor/providers/default-block-editor-provider.js diff --git a/packages/edit-site/src/components/block-editor/block-editor-provider/default-block-editor-provider.js b/packages/edit-site/src/components/block-editor/block-editor-provider/default-block-editor-provider.js new file mode 100644 index 00000000000000..9ffee1ca687228 --- /dev/null +++ b/packages/edit-site/src/components/block-editor/block-editor-provider/default-block-editor-provider.js @@ -0,0 +1,70 @@ +/** + * WordPress dependencies + */ +import { useEntityBlockEditor } from '@wordpress/core-data'; +import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; +import { useSelect } from '@wordpress/data'; + +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../../store'; +import { unlock } from '../../../lock-unlock'; +import useSiteEditorSettings from '../use-site-editor-settings'; +import usePageContentBlocks from './use-page-content-blocks'; + +const { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis ); + +const noop = () => {}; + +/** + * The default block editor provider for the site editor. Typically used when + * the post type is `'wp_template_part'` or `'wp_template'` and allows editing + * of the template and its nested entities. + * + * If the page content focus type is `'hideTemplate'`, the provider will provide + * a set of page content blocks wrapped in a container that, together, + * mimic the look and feel of the post editor and + * allow editing of the page content only. + * + * @param {Object} props + * @param {WPElement} props.children + */ +export default function DefaultBlockEditorProvider( { children } ) { + const settings = useSiteEditorSettings(); + + const { templateType, isTemplateHidden } = useSelect( ( select ) => { + const { getEditedPostType } = select( editSiteStore ); + const { getPageContentFocusType, getCanvasMode } = unlock( + select( editSiteStore ) + ); + return { + templateType: getEditedPostType(), + isTemplateHidden: + getCanvasMode() === 'edit' && + getPageContentFocusType() === 'hideTemplate', + canvasMode: unlock( select( editSiteStore ) ).getCanvasMode(), + }; + }, [] ); + + const [ blocks, onInput, onChange ] = useEntityBlockEditor( + 'postType', + templateType + ); + const pageContentBlock = usePageContentBlocks( blocks, isTemplateHidden ); + return ( + + { children } + + ); +} diff --git a/packages/edit-site/src/components/block-editor/block-editor-provider/index.js b/packages/edit-site/src/components/block-editor/block-editor-provider/index.js new file mode 100644 index 00000000000000..36c7c72066a88d --- /dev/null +++ b/packages/edit-site/src/components/block-editor/block-editor-provider/index.js @@ -0,0 +1,28 @@ +/** + * WordPress dependencies + */ +import { useSelect } from '@wordpress/data'; + +/** + * Internal dependencies + */ +import { store as editSiteStore } from '../../../store'; +import DefaultBlockEditorProvider from './default-block-editor-provider'; +import NavigationBlockEditorProvider from './navigation-block-editor-provider'; + +export default function BlockEditorProvider( { children } ) { + const entityType = useSelect( + ( select ) => select( editSiteStore ).getEditedPostType(), + [] + ); + if ( entityType === 'wp_navigation' ) { + return ( + + { children } + + ); + } + return ( + { children } + ); +} diff --git a/packages/edit-site/src/components/block-editor/providers/navigation-block-editor-provider.js b/packages/edit-site/src/components/block-editor/block-editor-provider/navigation-block-editor-provider.js similarity index 100% rename from packages/edit-site/src/components/block-editor/providers/navigation-block-editor-provider.js rename to packages/edit-site/src/components/block-editor/block-editor-provider/navigation-block-editor-provider.js diff --git a/packages/edit-site/src/components/block-editor/block-editor-provider/test/use-page-content-blocks.js b/packages/edit-site/src/components/block-editor/block-editor-provider/test/use-page-content-blocks.js new file mode 100644 index 00000000000000..533ed0f8f3d100 --- /dev/null +++ b/packages/edit-site/src/components/block-editor/block-editor-provider/test/use-page-content-blocks.js @@ -0,0 +1,87 @@ +/** + * External dependencies + */ +import { renderHook } from '@testing-library/react'; +/** + * WordPress dependencies + */ +import { createBlock } from '@wordpress/blocks'; + +/** + * Internal dependencies + */ +import usePageContentBlocks from '../use-page-content-blocks'; + +jest.mock( '@wordpress/blocks', () => { + return { + __esModule: true, + ...jest.requireActual( '@wordpress/blocks' ), + createBlock( name, attributes = {}, innerBlocks = [] ) { + return { + name, + attributes, + innerBlocks, + }; + }, + }; +} ); + +describe( 'usePageContentBlocks', () => { + const blocksList = [ + createBlock( 'core/group', {}, [ + createBlock( 'core/post-title' ), + createBlock( 'core/post-featured-image' ), + createBlock( 'core/query', {}, [ + createBlock( 'core/post-title' ), + createBlock( 'core/post-featured-image' ), + createBlock( 'core/post-content' ), + ] ), + createBlock( 'core/post-content' ), + ] ), + createBlock( 'core/query' ), + createBlock( 'core/paragraph' ), + createBlock( 'core/post-content' ), + ]; + it( 'should return empty array if `isPageContentFocused` is `false`', () => { + const { result } = renderHook( () => + usePageContentBlocks( blocksList, false ) + ); + expect( result.current ).toEqual( [] ); + } ); + it( 'should return empty array if `blocks` is undefined', () => { + const { result } = renderHook( () => + usePageContentBlocks( undefined, true ) + ); + expect( result.current ).toEqual( [] ); + } ); + it( 'should return empty array if `blocks` is an empty array', () => { + const { result } = renderHook( () => usePageContentBlocks( [], true ) ); + expect( result.current ).toEqual( [] ); + } ); + it( 'should return new block list', () => { + const { result } = renderHook( () => + usePageContentBlocks( blocksList, true ) + ); + expect( result.current ).toEqual( [ + { + name: 'core/group', + attributes: { + layout: { type: 'constrained' }, + style: { + spacing: { + margin: { + top: '4em', // Mimics the post editor. + }, + }, + }, + }, + innerBlocks: [ + createBlock( 'core/post-title' ), + createBlock( 'core/post-featured-image' ), + createBlock( 'core/post-content' ), + createBlock( 'core/post-content' ), + ], + }, + ] ); + } ); +} ); diff --git a/packages/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js b/packages/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js new file mode 100644 index 00000000000000..17e907113c5155 --- /dev/null +++ b/packages/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js @@ -0,0 +1,77 @@ +/** + * WordPress dependencies + */ +import { useMemo } from '@wordpress/element'; +import { createBlock } from '@wordpress/blocks'; + +/** + * Internal dependencies + */ +import { PAGE_CONTENT_BLOCK_TYPES } from '../../../utils/constants'; + +/** + * Helper method to iterate through all blocks, recursing into allowed inner blocks. + * Returns a flattened object of transformed blocks. + * + * @param {Array} blocks Blocks to flatten. + * @param {Function} transform Transforming function to be applied to each block. If transform returns `undefined`, the block is skipped. + * + * @return {Array} Flattened object. + */ +function flattenBlocks( blocks, transform ) { + const result = []; + for ( let i = 0; i < blocks.length; i++ ) { + // Since the Query Block could contain PAGE_CONTENT_BLOCK_TYPES block types, + // we skip it because we only want to render stand-alone page content blocks in the block list. + if ( [ 'core/query' ].includes( blocks[ i ].name ) ) { + continue; + } + const transformedBlock = transform( blocks[ i ] ); + if ( transformedBlock ) { + result.push( transformedBlock ); + } + result.push( ...flattenBlocks( blocks[ i ].innerBlocks, transform ) ); + } + + return result; +} + +/** + * Returns a memoized array of blocks that contain only page content blocks, + * surrounded by a group block to mimic the post editor. + * + * @param {Array} blocks Block list. + * @param {boolean} isPageContentFocused Whether the page content has focus. If `true` return page content blocks. Default `false`. + * + * @return {Array} Page content blocks. + */ +export default function usePageContentBlocks( + blocks, + isPageContentFocused = false +) { + return useMemo( () => { + if ( ! isPageContentFocused || ! blocks || ! blocks.length ) { + return []; + } + return [ + createBlock( + 'core/group', + { + layout: { type: 'constrained' }, + style: { + spacing: { + margin: { + top: '4em', // Mimics the post editor. + }, + }, + }, + }, + flattenBlocks( blocks, ( block ) => { + if ( PAGE_CONTENT_BLOCK_TYPES[ block.name ] ) { + return createBlock( block.name ); + } + } ) + ), + ]; + }, [ blocks, isPageContentFocused ] ); +} diff --git a/packages/edit-site/src/components/block-editor/get-block-editor-provider.js b/packages/edit-site/src/components/block-editor/get-block-editor-provider.js deleted file mode 100644 index df8185605f13aa..00000000000000 --- a/packages/edit-site/src/components/block-editor/get-block-editor-provider.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Internal dependencies - */ -import DefaultBlockEditor from './providers/default-block-editor-provider'; -import NavigationBlockEditor from './providers/navigation-block-editor-provider'; - -/** - * Factory to isolate choosing the appropriate block editor - * component to handle a given entity type. - * - * @param {string} entityType the entity type being edited - * @return {JSX.Element} the block editor component to use. - */ -export default function getBlockEditorProvider( entityType ) { - let Provider = null; - - switch ( entityType ) { - case 'wp_navigation': - Provider = NavigationBlockEditor; - break; - case 'wp_template': - case 'wp_template_part': - default: - Provider = DefaultBlockEditor; - break; - } - - return Provider; -} diff --git a/packages/edit-site/src/components/block-editor/index.js b/packages/edit-site/src/components/block-editor/index.js index 5bfcdb012d1f7e..2c635ff860a5bd 100644 --- a/packages/edit-site/src/components/block-editor/index.js +++ b/packages/edit-site/src/components/block-editor/index.js @@ -1,7 +1,6 @@ /** * WordPress dependencies */ -import { useSelect } from '@wordpress/data'; import { BlockInspector } from '@wordpress/block-editor'; import { privateApis as editPatternsPrivateApis } from '@wordpress/patterns'; @@ -10,31 +9,19 @@ import { privateApis as editPatternsPrivateApis } from '@wordpress/patterns'; */ import TemplatePartConverter from '../template-part-converter'; import { SidebarInspectorFill } from '../sidebar-edit-mode'; -import { store as editSiteStore } from '../../store'; import SiteEditorCanvas from './site-editor-canvas'; -import getBlockEditorProvider from './get-block-editor-provider'; +import BlockEditorProvider from './block-editor-provider'; import { unlock } from '../../lock-unlock'; const { PatternsMenuItems } = unlock( editPatternsPrivateApis ); export default function BlockEditor() { - const entityType = useSelect( - ( select ) => select( editSiteStore ).getEditedPostType(), - [] - ); - - // Choose the provider based on the entity type currently - // being edited. - const BlockEditorProvider = getBlockEditorProvider( entityType ); - return ( - - ); diff --git a/packages/edit-site/src/components/block-editor/providers/default-block-editor-provider.js b/packages/edit-site/src/components/block-editor/providers/default-block-editor-provider.js deleted file mode 100644 index 2ee0ae467f8d65..00000000000000 --- a/packages/edit-site/src/components/block-editor/providers/default-block-editor-provider.js +++ /dev/null @@ -1,44 +0,0 @@ -/** - * WordPress dependencies - */ -import { useEntityBlockEditor } from '@wordpress/core-data'; -import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; -import { useSelect } from '@wordpress/data'; - -/** - * Internal dependencies - */ -import { store as editSiteStore } from '../../../store'; -import { unlock } from '../../../lock-unlock'; -import useSiteEditorSettings from '../use-site-editor-settings'; - -const { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis ); - -export default function DefaultBlockEditorProvider( { children } ) { - const settings = useSiteEditorSettings(); - - const { templateType } = useSelect( ( select ) => { - const { getEditedPostType } = unlock( select( editSiteStore ) ); - - return { - templateType: getEditedPostType(), - }; - }, [] ); - - const [ blocks, onInput, onChange ] = useEntityBlockEditor( - 'postType', - templateType - ); - - return ( - - { children } - - ); -} diff --git a/packages/edit-site/src/components/page-content-focus-manager/disable-non-page-content-blocks.js b/packages/edit-site/src/components/page-content-focus-manager/disable-non-page-content-blocks.js index 9d28c01164f29b..f3e021ba885244 100644 --- a/packages/edit-site/src/components/page-content-focus-manager/disable-non-page-content-blocks.js +++ b/packages/edit-site/src/components/page-content-focus-manager/disable-non-page-content-blocks.js @@ -9,12 +9,7 @@ import { useEffect } from '@wordpress/element'; /** * Internal dependencies */ - -const PAGE_CONTENT_BLOCK_TYPES = [ - 'core/post-title', - 'core/post-featured-image', - 'core/post-content', -]; +import { PAGE_CONTENT_BLOCK_TYPES } from '../../utils/constants'; /** * Component that when rendered, makes it so that the site editor allows only @@ -48,8 +43,7 @@ const withDisableNonPageContentBlocks = createHigherOrderComponent( ( BlockEdit ) => ( props ) => { const isDescendentOfQueryLoop = props.context.queryId !== undefined; const isPageContent = - PAGE_CONTENT_BLOCK_TYPES.includes( props.name ) && - ! isDescendentOfQueryLoop; + PAGE_CONTENT_BLOCK_TYPES[ props.name ] && ! isDescendentOfQueryLoop; const mode = isPageContent ? 'contentOnly' : undefined; useBlockEditingMode( mode ); return ; diff --git a/packages/edit-site/src/components/sidebar-edit-mode/page-panels/edit-template.js b/packages/edit-site/src/components/sidebar-edit-mode/page-panels/edit-template.js index 2295ee12f45049..9e0b9e37c33ff6 100644 --- a/packages/edit-site/src/components/sidebar-edit-mode/page-panels/edit-template.js +++ b/packages/edit-site/src/components/sidebar-edit-mode/page-panels/edit-template.js @@ -12,6 +12,7 @@ import { } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { store as coreStore } from '@wordpress/core-data'; +import { check } from '@wordpress/icons'; /** * Internal dependencies @@ -19,6 +20,7 @@ import { store as coreStore } from '@wordpress/core-data'; import { store as editSiteStore } from '../../../store'; import SwapTemplateButton from './swap-template-button'; import ResetDefaultTemplate from './reset-default-template'; +import { unlock } from '../../../lock-unlock'; const POPOVER_PROPS = { className: 'edit-site-page-panels-edit-template__dropdown', @@ -26,28 +28,40 @@ const POPOVER_PROPS = { }; export default function EditTemplate() { - const { hasResolved, template } = useSelect( ( select ) => { - const { getEditedPostContext, getEditedPostType, getEditedPostId } = - select( editSiteStore ); - const { getEditedEntityRecord, hasFinishedResolution } = - select( coreStore ); - const _context = getEditedPostContext(); - const queryArgs = [ - 'postType', - getEditedPostType(), - getEditedPostId(), - ]; - return { - context: _context, - hasResolved: hasFinishedResolution( - 'getEditedEntityRecord', - queryArgs - ), - template: getEditedEntityRecord( ...queryArgs ), - }; - }, [] ); + const { hasResolved, template, isTemplateHidden } = useSelect( + ( select ) => { + const { getEditedPostContext, getEditedPostType, getEditedPostId } = + select( editSiteStore ); + const { getCanvasMode, getPageContentFocusType } = unlock( + select( editSiteStore ) + ); + const { getEditedEntityRecord, hasFinishedResolution } = + select( coreStore ); + const _context = getEditedPostContext(); + const queryArgs = [ + 'postType', + getEditedPostType(), + getEditedPostId(), + ]; + return { + context: _context, + hasResolved: hasFinishedResolution( + 'getEditedEntityRecord', + queryArgs + ), + template: getEditedEntityRecord( ...queryArgs ), + isTemplateHidden: + getCanvasMode() === 'edit' && + getPageContentFocusType() === 'hideTemplate', + }; + }, + [] + ); const { setHasPageContentFocus } = useDispatch( editSiteStore ); + // Disable reason: `useDispatch` can't be called conditionally. + // eslint-disable-next-line @wordpress/no-unused-vars-before-return + const { setPageContentFocusType } = unlock( useDispatch( editSiteStore ) ); if ( ! hasResolved ) { return null; @@ -83,6 +97,20 @@ export default function EditTemplate() { + + { + setPageContentFocusType( + isTemplateHidden + ? 'disableTemplate' + : 'hideTemplate' + ); + } } + > + { __( 'Template preview' ) } + + ) } diff --git a/packages/edit-site/src/components/sidebar-edit-mode/page-panels/style.scss b/packages/edit-site/src/components/sidebar-edit-mode/page-panels/style.scss index aedcf5e46ca9ea..5501fe49e5876b 100644 --- a/packages/edit-site/src/components/sidebar-edit-mode/page-panels/style.scss +++ b/packages/edit-site/src/components/sidebar-edit-mode/page-panels/style.scss @@ -79,3 +79,9 @@ width: 30%; } } + +.edit-site-page-panels-edit-template__dropdown { + .components-popover__content { + min-width: 240px; + } +} diff --git a/packages/edit-site/src/store/private-actions.js b/packages/edit-site/src/store/private-actions.js index f3dd4c10cec43e..3e2bfe2ee47b24 100644 --- a/packages/edit-site/src/store/private-actions.js +++ b/packages/edit-site/src/store/private-actions.js @@ -49,3 +49,22 @@ export const setEditorCanvasContainerView = view, } ); }; + +/** + * Sets the type of page content focus. Can be one of: + * + * - `'disableTemplate'`: Disable the blocks belonging to the page's template. + * - `'hideTemplate'`: Hide the blocks belonging to the page's template. + * + * @param {'disableTemplate'|'hideTemplate'} pageContentFocusType The type of page content focus. + * + * @return {Object} Action object. + */ +export const setPageContentFocusType = + ( pageContentFocusType ) => + ( { dispatch } ) => { + dispatch( { + type: 'SET_PAGE_CONTENT_FOCUS_TYPE', + pageContentFocusType, + } ); + }; diff --git a/packages/edit-site/src/store/private-selectors.js b/packages/edit-site/src/store/private-selectors.js index 1f1f6e999fdb29..0d4cf2b3eefdaa 100644 --- a/packages/edit-site/src/store/private-selectors.js +++ b/packages/edit-site/src/store/private-selectors.js @@ -1,3 +1,8 @@ +/** + * Internal dependencies + */ +import { hasPageContentFocus } from './selectors'; + /** * Returns the current canvas mode. * @@ -19,3 +24,20 @@ export function getCanvasMode( state ) { export function getEditorCanvasContainerView( state ) { return state.editorCanvasContainerView; } + +/** + * Returns the type of the current page content focus, or null if there is no + * page content focus. + * + * Possible values are: + * + * - `'disableTemplate'`: Disable the blocks belonging to the page's template. + * - `'hideTemplate'`: Hide the blocks belonging to the page's template. + * + * @param {Object} state Global application state. + * + * @return {'disableTemplate'|'hideTemplate'|null} Type of the current page content focus. + */ +export function getPageContentFocusType( state ) { + return hasPageContentFocus( state ) ? state.pageContentFocusType : null; +} diff --git a/packages/edit-site/src/store/reducer.js b/packages/edit-site/src/store/reducer.js index 4b4689e26c561e..e99c6dda1fc1d0 100644 --- a/packages/edit-site/src/store/reducer.js +++ b/packages/edit-site/src/store/reducer.js @@ -177,6 +177,23 @@ export function hasPageContentFocus( state = false, action ) { return state; } +/** + * Reducer used to track the type of page content focus. + * + * @param {string} state Current state. + * @param {Object} action Dispatched action. + * + * @return {string} Updated state. + */ +export function pageContentFocusType( state = 'disableTemplate', action ) { + switch ( action.type ) { + case 'SET_PAGE_CONTENT_FOCUS_TYPE': + return action.pageContentFocusType; + } + + return state; +} + export default combineReducers( { deviceType, settings, @@ -187,4 +204,5 @@ export default combineReducers( { canvasMode, editorCanvasContainerView, hasPageContentFocus, + pageContentFocusType, } ); diff --git a/packages/edit-site/src/store/test/reducer.js b/packages/edit-site/src/store/test/reducer.js index d3816f6ac0ac2a..a5e47ec5bbbaf3 100644 --- a/packages/edit-site/src/store/test/reducer.js +++ b/packages/edit-site/src/store/test/reducer.js @@ -12,6 +12,7 @@ import { blockInserterPanel, listViewPanel, hasPageContentFocus, + pageContentFocusType, } from '../reducer'; import { setIsInserterOpened } from '../actions'; @@ -191,4 +192,21 @@ describe( 'state', () => { ).toBe( false ); } ); } ); + + describe( 'pageContentFocusType', () => { + it( 'defaults to disableTemplate', () => { + expect( pageContentFocusType( undefined, {} ) ).toBe( + 'disableTemplate' + ); + } ); + + it( 'can be set', () => { + expect( + pageContentFocusType( 'disableTemplate', { + type: 'SET_PAGE_CONTENT_FOCUS_TYPE', + pageContentFocusType: 'enableTemplate', + } ) + ).toBe( 'enableTemplate' ); + } ); + } ); } ); diff --git a/packages/edit-site/src/utils/constants.js b/packages/edit-site/src/utils/constants.js index d12c7f84cc356c..1dcbdc0cc6fa3b 100644 --- a/packages/edit-site/src/utils/constants.js +++ b/packages/edit-site/src/utils/constants.js @@ -32,6 +32,16 @@ export const FOCUSABLE_ENTITIES = [ PATTERN_TYPES.user, ]; +/** + * Block types that are considered to be page content. These are the only blocks + * editable when hasPageContentFocus() is true. + */ +export const PAGE_CONTENT_BLOCK_TYPES = { + 'core/post-title': true, + 'core/post-featured-image': true, + 'core/post-content': true, +}; + export const POST_TYPE_LABELS = { [ TEMPLATE_POST_TYPE ]: __( 'Template' ), [ TEMPLATE_PART_POST_TYPE ]: __( 'Template Part' ),