diff --git a/lib/full-site-editing/edit-site-page.php b/lib/full-site-editing/edit-site-page.php index 076beff97f12d6..d44c0826d6b4e0 100644 --- a/lib/full-site-editing/edit-site-page.php +++ b/lib/full-site-editing/edit-site-page.php @@ -223,6 +223,16 @@ function register_site_editor_homepage_settings() { 'description' => __( 'The ID of the page that should be displayed on the front page', 'gutenberg' ), ) ); + + register_setting( + 'reading', + 'page_for_posts', + array( + 'show_in_rest' => true, + 'type' => 'number', + 'description' => __( 'The ID of the page that should display the latest posts', 'gutenberg' ), + ) + ); } add_action( 'init', 'register_site_editor_homepage_settings', 10 ); diff --git a/packages/edit-post/src/components/sidebar/template/actions.js b/packages/edit-post/src/components/sidebar/template/actions.js index f4d6a7fb9ddbbf..6ab56bb5f60003 100644 --- a/packages/edit-post/src/components/sidebar/template/actions.js +++ b/packages/edit-post/src/components/sidebar/template/actions.js @@ -25,7 +25,7 @@ import { store as coreStore } from '@wordpress/core-data'; import { store as editPostStore } from '../../../store'; import { createBlock, serialize } from '@wordpress/blocks'; -function PostTemplateActions() { +function PostTemplateActions( { isPostsPage } ) { const [ isModalOpen, setIsModalOpen ] = useState( false ); const [ isBusy, setIsBusy ] = useState( false ); const [ title, setTitle ] = useState( '' ); @@ -128,12 +128,17 @@ function PostTemplateActions() { { __( 'Edit' ) } </Button> ) } - <Button variant="link" onClick={ () => setIsModalOpen( true ) }> - { - /* translators: button to create a new template */ - _x( 'New', 'action' ) - } - </Button> + { ! isPostsPage && ( + <Button + variant="link" + onClick={ () => setIsModalOpen( true ) } + > + { + /* translators: button to create a new template */ + _x( 'New', 'action' ) + } + </Button> + ) } </div> { isModalOpen && ( <Modal diff --git a/packages/edit-post/src/components/sidebar/template/index.js b/packages/edit-post/src/components/sidebar/template/index.js index 9488e5cf8befef..0aede4200ec868 100644 --- a/packages/edit-post/src/components/sidebar/template/index.js +++ b/packages/edit-post/src/components/sidebar/template/index.js @@ -8,7 +8,7 @@ import { partial, isEmpty, map, fromPairs } from 'lodash'; */ import { __, sprintf } from '@wordpress/i18n'; import { useMemo } from '@wordpress/element'; -import { PanelBody, SelectControl } from '@wordpress/components'; +import { Notice, PanelBody, SelectControl } from '@wordpress/components'; import { store as editorStore } from '@wordpress/editor'; import { useSelect, useDispatch } from '@wordpress/data'; import { store as coreStore } from '@wordpress/core-data'; @@ -28,6 +28,7 @@ export function TemplatePanel() { const { isEnabled, isOpened, + isPostsPage, selectedTemplate, availableTemplates, fetchedTemplates, @@ -44,10 +45,19 @@ export function TemplatePanel() { const { getEditedPostAttribute, getEditorSettings, + getCurrentPostId, getCurrentPostType, } = select( editorStore ); - const { getPostType, getEntityRecords, canUser } = select( coreStore ); + const { + getPostType, + getEntityRecord, + getEntityRecords, + canUser, + } = select( coreStore ); + + const currentPostId = getCurrentPostId(); const currentPostType = getCurrentPostType(); + const settings = getEntityRecord( 'root', 'site' ); const _isViewable = getPostType( currentPostType )?.viewable ?? false; const _supportsTemplateMode = select( editorStore ).getEditorSettings().supportsTemplateMode && @@ -61,6 +71,7 @@ export function TemplatePanel() { return { isEnabled: isEditorPanelEnabled( PANEL_NAME ), isOpened: isEditorPanelOpened( PANEL_NAME ), + isPostsPage: currentPostId === settings?.page_for_posts, selectedTemplate: getEditedPostAttribute( 'template' ), availableTemplates: getEditorSettings().availableTemplates, fetchedTemplates: templateRecords, @@ -112,25 +123,40 @@ export function TemplatePanel() { opened={ isOpened } onToggle={ onTogglePanel } > - <SelectControl - hideLabelFromVision - label={ __( 'Template:' ) } - value={ - Object.keys( templates ).includes( selectedTemplate ) - ? selectedTemplate - : '' - } - onChange={ ( templateSlug ) => { - editPost( { - template: templateSlug || '', - } ); - } } - options={ map( templates, ( templateName, templateSlug ) => ( { - value: templateSlug, - label: templateName, - } ) ) } - /> - { canUserCreate && <PostTemplateActions /> } + { isPostsPage ? ( + <Notice + className="edit-post-template__notice" + status="warning" + isDismissible={ false } + > + { __( 'The posts page template cannot be changed.' ) } + </Notice> + ) : ( + <SelectControl + hideLabelFromVision + label={ __( 'Template:' ) } + value={ + Object.keys( templates ).includes( selectedTemplate ) + ? selectedTemplate + : '' + } + onChange={ ( templateSlug ) => { + editPost( { + template: templateSlug || '', + } ); + } } + options={ map( + templates, + ( templateName, templateSlug ) => ( { + value: templateSlug, + label: templateName, + } ) + ) } + /> + ) } + { canUserCreate && ( + <PostTemplateActions isPostsPage={ isPostsPage } /> + ) } </PanelBody> ); } diff --git a/packages/edit-post/src/components/sidebar/template/style.scss b/packages/edit-post/src/components/sidebar/template/style.scss index 0a10546b96f46b..db11adbffd9400 100644 --- a/packages/edit-post/src/components/sidebar/template/style.scss +++ b/packages/edit-post/src/components/sidebar/template/style.scss @@ -28,6 +28,14 @@ } } +.edit-post-template__notice { + margin: 0 0 $grid-unit-10 0; + + .components-notice__content { + margin: 0; + } +} + .edit-post-template__actions { button:not(:last-child) { margin-right: $grid-unit-10;