From ee89dfc637a4b444c620a201b86ff24f61fb7fce Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 13:35:07 +0100 Subject: [PATCH 1/9] Extract selectors from useResolveEditedEntity hook --- packages/core-data/src/private-selectors.ts | 127 ++++++++++++++ .../editor/use-resolve-edited-entity.js | 157 +++--------------- 2 files changed, 150 insertions(+), 134 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index b2f6fa7def9858..a5af0904befeb3 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -8,6 +8,7 @@ import { createSelector, createRegistrySelector } from '@wordpress/data'; */ import type { State } from './selectors'; import { STORE_NAME } from './name'; +import { unlock } from './lock-unlock'; type EntityRecordKey = string | number; @@ -105,3 +106,129 @@ export function getEntityRecordPermissions( export function getRegisteredPostMeta( state: State, postType: string ) { return state.registeredPostMeta?.[ postType ] ?? {}; } + +interface SiteData { + show_on_front?: string; + page_on_front?: string | number; + page_for_posts?: string | number; +} + +export const getHomePage = createRegistrySelector( ( select ) => () => { + const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as + | SiteData + | undefined; + const homepageId = + siteData?.show_on_front === 'page' && + [ 'number', 'string' ].includes( typeof siteData.page_on_front ) && + siteData.page_on_front && + !! +siteData.page_on_front // We also need to check if it's not zero(`0`). + ? siteData.page_on_front.toString() + : null; + const isSiteLoaded = !! siteData; + if ( isSiteLoaded && homepageId ) { + return { postType: 'page', postId: homepageId }; + } + if ( isSiteLoaded && ! homepageId ) { + const frontPageTemplateId = select( STORE_NAME ).getDefaultTemplateId( { + slug: 'front-page', + } ); + return { postType: 'wp_template', postId: frontPageTemplateId }; + } + return null; +} ); + +export const getPostsPageId = createRegistrySelector( ( select ) => () => { + const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as + | SiteData + | undefined; + return siteData?.show_on_front === 'page' && + siteData.page_for_posts && + [ 'number', 'string' ].includes( typeof siteData.page_for_posts ) + ? siteData.page_for_posts.toString() + : null; +} ); + +export const getTemplateId = createRegistrySelector( + ( select ) => ( state, postType, postId ) => { + const homepage = unlock( select( STORE_NAME ) ).getHomePage(); + + // For the front page, we always use the front page template if existing. + if ( + postType === 'page' && + postType === homepage?.postType && + postId === homepage?.postId + ) { + // The /lookup endpoint cannot currently handle a lookup + // when a page is set as the front page, so specifically in + // that case, we want to check if there is a front page + // template, and instead of falling back to the home + // template, we want to fall back to the page template. + const templates = select( STORE_NAME ).getEntityRecords( + 'postType', + 'wp_template', + { + per_page: -1, + } + ); + if ( templates ) { + const id = templates?.find( + ( { slug } ) => slug === 'front-page' + )?.id; + if ( id ) { + return id; + } + + // If no front page template is found, continue with the + // logic below (fetching the page template). + } else { + // Still resolving `templates`. + return undefined; + } + } + + const editedEntity = select( STORE_NAME ).getEditedEntityRecord( + 'postType', + postType, + postId + ); + if ( ! editedEntity ) { + return undefined; + } + const postsPageId = unlock( select( STORE_NAME ) ).getPostsPageId(); + // Check if the current page is the posts page. + if ( postType === 'page' && postsPageId === postId ) { + return select( STORE_NAME ).getDefaultTemplateId( { + slug: 'home', + } ); + } + // First see if the post/page has an assigned template and fetch it. + const currentTemplateSlug = editedEntity.template; + if ( currentTemplateSlug ) { + const currentTemplate = select( STORE_NAME ) + .getEntityRecords( 'postType', 'wp_template', { + per_page: -1, + } ) + ?.find( ( { slug } ) => slug === currentTemplateSlug ); + if ( currentTemplate ) { + return currentTemplate.id; + } + } + // If no template is assigned, use the default template. + let slugToCheck; + // In `draft` status we might not have a slug available, so we use the `single` + // post type templates slug(ex page, single-post, single-product etc..). + // Pages do not need the `single` prefix in the slug to be prioritized + // through template hierarchy. + if ( editedEntity.slug ) { + slugToCheck = + postType === 'page' + ? `${ postType }-${ editedEntity.slug }` + : `single-${ postType }-${ editedEntity.slug }`; + } else { + slugToCheck = postType === 'page' ? 'page' : `single-${ postType }`; + } + return select( STORE_NAME ).getDefaultTemplateId( { + slug: slugToCheck, + } ); + } +); diff --git a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js index eb19b3cea95375..65fdd7bcb7c91f 100644 --- a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js +++ b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js @@ -32,33 +32,14 @@ const authorizedPostTypes = [ 'page', 'post' ]; export function useResolveEditedEntity() { const { params = {} } = useLocation(); const { postId, postType } = params; - const { hasLoadedAllDependencies, homepageId, postsPageId } = useSelect( - ( select ) => { - const { getEntityRecord } = select( coreDataStore ); - const siteData = getEntityRecord( 'root', 'site' ); - const _homepageId = - siteData?.show_on_front === 'page' && - [ 'number', 'string' ].includes( - typeof siteData.page_on_front - ) && - !! +siteData.page_on_front // We also need to check if it's not zero(`0`). - ? siteData.page_on_front.toString() - : null; - const _postsPageId = - siteData?.show_on_front === 'page' && - [ 'number', 'string' ].includes( - typeof siteData.page_for_posts - ) - ? siteData.page_for_posts.toString() - : null; - return { - hasLoadedAllDependencies: !! siteData, - homepageId: _homepageId, - postsPageId: _postsPageId, - }; - }, - [] - ); + const { homepagePostType, homepagePostId } = useSelect( ( select ) => { + const { getHomePage } = unlock( select( coreDataStore ) ); + const homePage = getHomePage(); + return { + homepagePostType: homePage?.postType, + homepagePostId: homePage?.postId, + }; + }, [] ); /** * This is a hook that recreates the logic to resolve a template for a given WordPress postID postTypeId @@ -82,103 +63,7 @@ export function useResolveEditedEntity() { return undefined; } - const { - getEditedEntityRecord, - getEntityRecords, - getDefaultTemplateId, - } = select( coreDataStore ); - - function resolveTemplateForPostTypeAndId( - postTypeToResolve, - postIdToResolve - ) { - // For the front page, we always use the front page template if existing. - if ( - postTypeToResolve === 'page' && - homepageId === postIdToResolve - ) { - // The /lookup endpoint cannot currently handle a lookup - // when a page is set as the front page, so specifically in - // that case, we want to check if there is a front page - // template, and instead of falling back to the home - // template, we want to fall back to the page template. - const templates = getEntityRecords( - 'postType', - TEMPLATE_POST_TYPE, - { - per_page: -1, - } - ); - if ( templates ) { - const id = templates?.find( - ( { slug } ) => slug === 'front-page' - )?.id; - if ( id ) { - return id; - } - - // If no front page template is found, continue with the - // logic below (fetching the page template). - } else { - // Still resolving `templates`. - return undefined; - } - } - - const editedEntity = getEditedEntityRecord( - 'postType', - postTypeToResolve, - postIdToResolve - ); - if ( ! editedEntity ) { - return undefined; - } - // Check if the current page is the posts page. - if ( - postTypeToResolve === 'page' && - postsPageId === postIdToResolve - ) { - return getDefaultTemplateId( { slug: 'home' } ); - } - // First see if the post/page has an assigned template and fetch it. - const currentTemplateSlug = editedEntity.template; - if ( currentTemplateSlug ) { - const currentTemplate = getEntityRecords( - 'postType', - TEMPLATE_POST_TYPE, - { - per_page: -1, - } - )?.find( ( { slug } ) => slug === currentTemplateSlug ); - if ( currentTemplate ) { - return currentTemplate.id; - } - } - // If no template is assigned, use the default template. - let slugToCheck; - // In `draft` status we might not have a slug available, so we use the `single` - // post type templates slug(ex page, single-post, single-product etc..). - // Pages do not need the `single` prefix in the slug to be prioritized - // through template hierarchy. - if ( editedEntity.slug ) { - slugToCheck = - postTypeToResolve === 'page' - ? `${ postTypeToResolve }-${ editedEntity.slug }` - : `single-${ postTypeToResolve }-${ editedEntity.slug }`; - } else { - slugToCheck = - postTypeToResolve === 'page' - ? 'page' - : `single-${ postTypeToResolve }`; - } - return getDefaultTemplateId( { - slug: slugToCheck, - } ); - } - - if ( ! hasLoadedAllDependencies ) { - return undefined; - } + const { getTemplateId } = unlock( select( coreDataStore ) ); // If we're rendering a specific page, we need to resolve its template. // The site editor only supports pages for now, not other CPTs. @@ -187,18 +72,22 @@ export function useResolveEditedEntity() { postId && authorizedPostTypes.includes( postType ) ) { - return resolveTemplateForPostTypeAndId( postType, postId ); + return getTemplateId( postType, postId ); } // If we're rendering the home page, and we have a static home page, resolve its template. - if ( homepageId ) { - return resolveTemplateForPostTypeAndId( 'page', homepageId ); + if ( homepagePostType === 'page' ) { + return getTemplateId( 'page', homepagePostId ); + } + + if ( homepagePostType === 'wp_template' ) { + return homepagePostId; } - // If we're not rendering a specific page, use the front page template. - return getDefaultTemplateId( { slug: 'front-page' } ); + // This can only happen when homepage is being loaded. + return null; }, - [ homepageId, postsPageId, hasLoadedAllDependencies, postId, postType ] + [ homepagePostId, homepagePostType, postId, postType ] ); const context = useMemo( () => { @@ -211,18 +100,18 @@ export function useResolveEditedEntity() { } // TODO: for post types lists we should probably not render the front page, but maybe a placeholder // with a message like "Select a page" or something similar. - if ( homepageId ) { - return { postType: 'page', postId: homepageId }; + if ( homepagePostType === 'page' ) { + return { postType: 'page', postId: homepagePostId }; } return {}; - }, [ homepageId, postType, postId ] ); + }, [ homepagePostId, homepagePostType, postType, postId ] ); if ( postTypesWithoutParentTemplate.includes( postType ) && postId ) { return { isReady: true, postType, postId, context }; } - if ( hasLoadedAllDependencies ) { + if ( !! homepagePostType ) { return { isReady: resolvedTemplateId !== undefined, postType: TEMPLATE_POST_TYPE, From e6cbc37a546af91d962039595a67fdab0de98189 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 13:45:04 +0100 Subject: [PATCH 2/9] Remove duplicated selector in edit-post --- .../edit-post/src/components/layout/index.js | 15 +++-- packages/edit-post/src/store/index.js | 3 - .../edit-post/src/store/private-selectors.js | 61 ------------------- packages/edit-post/src/store/selectors.js | 11 ++-- 4 files changed, 17 insertions(+), 73 deletions(-) delete mode 100644 packages/edit-post/src/store/private-selectors.js diff --git a/packages/edit-post/src/components/layout/index.js b/packages/edit-post/src/components/layout/index.js index 225788a15a8e1d..aec14eab989f03 100644 --- a/packages/edit-post/src/components/layout/index.js +++ b/packages/edit-post/src/components/layout/index.js @@ -399,10 +399,10 @@ function Layout( { } = useSelect( ( select ) => { const { get } = select( preferencesStore ); - const { isFeatureActive, getEditedPostTemplateId } = unlock( - select( editPostStore ) + const { isFeatureActive } = select( editPostStore ); + const { canUser, getPostType, getTemplateId } = unlock( + select( coreStore ) ); - const { canUser, getPostType } = select( coreStore ); const supportsTemplateMode = settings.supportsTemplateMode; const isViewable = @@ -433,7 +433,7 @@ function Layout( { isViewable && canViewTemplate && ! isEditingTemplate - ? getEditedPostTemplateId() + ? getTemplateId( currentPostType, currentPostId ) : null, enablePaddingAppender: ! isZoomOut() && @@ -441,7 +441,12 @@ function Layout( { ! DESIGN_POST_TYPES.includes( currentPostType ), }; }, - [ currentPostType, isEditingTemplate, settings.supportsTemplateMode ] + [ + currentPostType, + currentPostId, + isEditingTemplate, + settings.supportsTemplateMode, + ] ); const [ paddingAppenderRef, paddingStyle ] = usePaddingAppender( enablePaddingAppender diff --git a/packages/edit-post/src/store/index.js b/packages/edit-post/src/store/index.js index 17033b759292d7..93dae7606d0e3c 100644 --- a/packages/edit-post/src/store/index.js +++ b/packages/edit-post/src/store/index.js @@ -9,9 +9,7 @@ import { createReduxStore, register } from '@wordpress/data'; import reducer from './reducer'; import * as actions from './actions'; import * as selectors from './selectors'; -import * as privateSelectors from './private-selectors'; import { STORE_NAME } from './constants'; -import { unlock } from '../lock-unlock'; /** * Store definition for the edit post namespace. @@ -26,4 +24,3 @@ export const store = createReduxStore( STORE_NAME, { selectors, } ); register( store ); -unlock( store ).registerPrivateSelectors( privateSelectors ); diff --git a/packages/edit-post/src/store/private-selectors.js b/packages/edit-post/src/store/private-selectors.js deleted file mode 100644 index 246b2754d895ab..00000000000000 --- a/packages/edit-post/src/store/private-selectors.js +++ /dev/null @@ -1,61 +0,0 @@ -/** - * WordPress dependencies - */ -import { createRegistrySelector } from '@wordpress/data'; -import { store as coreStore } from '@wordpress/core-data'; -import { store as editorStore } from '@wordpress/editor'; - -export const getEditedPostTemplateId = createRegistrySelector( - ( select ) => () => { - const { - id: postId, - type: postType, - slug, - } = select( editorStore ).getCurrentPost(); - const { getEntityRecord, getEntityRecords, canUser } = - select( coreStore ); - const siteSettings = canUser( 'read', { - kind: 'root', - name: 'site', - } ) - ? getEntityRecord( 'root', 'site' ) - : undefined; - // First check if the current page is set as the posts page. - const isPostsPage = +postId === siteSettings?.page_for_posts; - if ( isPostsPage ) { - return select( coreStore ).getDefaultTemplateId( { slug: 'home' } ); - } - const currentTemplate = - select( editorStore ).getEditedPostAttribute( 'template' ); - if ( currentTemplate ) { - const templateWithSameSlug = getEntityRecords( - 'postType', - 'wp_template', - { per_page: -1 } - )?.find( ( template ) => template.slug === currentTemplate ); - if ( ! templateWithSameSlug ) { - return templateWithSameSlug; - } - return templateWithSameSlug.id; - } - let slugToCheck; - // In `draft` status we might not have a slug available, so we use the `single` - // post type templates slug(ex page, single-post, single-product etc..). - // Pages do not need the `single` prefix in the slug to be prioritized - // through template hierarchy. - if ( slug ) { - slugToCheck = - postType === 'page' - ? `${ postType }-${ slug }` - : `single-${ postType }-${ slug }`; - } else { - slugToCheck = postType === 'page' ? 'page' : `single-${ postType }`; - } - - if ( postType ) { - return select( coreStore ).getDefaultTemplateId( { - slug: slugToCheck, - } ); - } - } -); diff --git a/packages/edit-post/src/store/selectors.js b/packages/edit-post/src/store/selectors.js index 8d85249e8100ba..f6516dd0206c00 100644 --- a/packages/edit-post/src/store/selectors.js +++ b/packages/edit-post/src/store/selectors.js @@ -14,8 +14,6 @@ import deprecated from '@wordpress/deprecated'; * Internal dependencies */ import { unlock } from '../lock-unlock'; -import { getEditedPostTemplateId } from './private-selectors'; - const { interfaceStore } = unlock( editorPrivateApis ); const EMPTY_ARRAY = []; const EMPTY_OBJECT = {}; @@ -555,8 +553,13 @@ export function areMetaBoxesInitialized( state ) { * @return {Object?} Post Template. */ export const getEditedPostTemplate = createRegistrySelector( - ( select ) => ( state ) => { - const templateId = getEditedPostTemplateId( state ); + ( select ) => () => { + const { id: postId, type: postType } = + select( editorStore ).getCurrentPost(); + const templateId = unlock( select( coreStore ) ).getTemplateId( + postType, + postId + ); if ( ! templateId ) { return undefined; } From d32abeb02398a187a0aa661acaea721c7ee2d246 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 14:29:48 +0100 Subject: [PATCH 3/9] Normalize page id --- packages/core-data/src/private-selectors.ts | 26 ++++++++++++++------- 1 file changed, 17 insertions(+), 9 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index a5af0904befeb3..fe003087257156 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -107,6 +107,19 @@ export function getRegisteredPostMeta( state: State, postType: string ) { return state.registeredPostMeta?.[ postType ] ?? {}; } +function normalizePageId( value: number | string | undefined ): string | null { + if ( ! value || ! [ 'number', 'string' ].includes( typeof value ) ) { + return null; + } + + // We also need to check if it's not zero (`'0'`). + if ( Number( value ) === 0 ) { + return null; + } + + return value.toString(); +} + interface SiteData { show_on_front?: string; page_on_front?: string | number; @@ -118,11 +131,8 @@ export const getHomePage = createRegistrySelector( ( select ) => () => { | SiteData | undefined; const homepageId = - siteData?.show_on_front === 'page' && - [ 'number', 'string' ].includes( typeof siteData.page_on_front ) && - siteData.page_on_front && - !! +siteData.page_on_front // We also need to check if it's not zero(`0`). - ? siteData.page_on_front.toString() + siteData?.show_on_front === 'page' + ? normalizePageId( siteData.page_on_front ) : null; const isSiteLoaded = !! siteData; if ( isSiteLoaded && homepageId ) { @@ -141,10 +151,8 @@ export const getPostsPageId = createRegistrySelector( ( select ) => () => { const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as | SiteData | undefined; - return siteData?.show_on_front === 'page' && - siteData.page_for_posts && - [ 'number', 'string' ].includes( typeof siteData.page_for_posts ) - ? siteData.page_for_posts.toString() + return siteData?.show_on_front === 'page' + ? normalizePageId( siteData.page_for_posts ) : null; } ); From ca727865c3b2381ca9815af5604b461ad11ed1d2 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 14:31:46 +0100 Subject: [PATCH 4/9] Simplify selector with early return --- packages/core-data/src/private-selectors.ts | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index fe003087257156..c1abcb0d5c9372 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -130,21 +130,20 @@ export const getHomePage = createRegistrySelector( ( select ) => () => { const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as | SiteData | undefined; + if ( ! siteData ) { + return null; + } const homepageId = siteData?.show_on_front === 'page' ? normalizePageId( siteData.page_on_front ) : null; - const isSiteLoaded = !! siteData; - if ( isSiteLoaded && homepageId ) { + if ( homepageId ) { return { postType: 'page', postId: homepageId }; } - if ( isSiteLoaded && ! homepageId ) { - const frontPageTemplateId = select( STORE_NAME ).getDefaultTemplateId( { - slug: 'front-page', - } ); - return { postType: 'wp_template', postId: frontPageTemplateId }; - } - return null; + const frontPageTemplateId = select( STORE_NAME ).getDefaultTemplateId( { + slug: 'front-page', + } ); + return { postType: 'wp_template', postId: frontPageTemplateId }; } ); export const getPostsPageId = createRegistrySelector( ( select ) => () => { From a6db741f33895f1ddd1bec0db62656b84b594682 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 14:36:52 +0100 Subject: [PATCH 5/9] Small tweaks --- packages/core-data/src/private-selectors.ts | 28 ++++++++++----------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index c1abcb0d5c9372..5e943aa516b1cc 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -159,6 +159,10 @@ export const getTemplateId = createRegistrySelector( ( select ) => ( state, postType, postId ) => { const homepage = unlock( select( STORE_NAME ) ).getHomePage(); + if ( ! homepage ) { + return; + } + // For the front page, we always use the front page template if existing. if ( postType === 'page' && @@ -177,20 +181,16 @@ export const getTemplateId = createRegistrySelector( per_page: -1, } ); - if ( templates ) { - const id = templates?.find( - ( { slug } ) => slug === 'front-page' - )?.id; - if ( id ) { - return id; - } - - // If no front page template is found, continue with the - // logic below (fetching the page template). - } else { - // Still resolving `templates`. - return undefined; + if ( ! templates ) { + return; + } + const id = templates.find( ( { slug } ) => slug === 'front-page' ) + ?.id; + if ( id ) { + return id; } + // If no front page template is found, continue with the + // logic below (fetching the page template). } const editedEntity = select( STORE_NAME ).getEditedEntityRecord( @@ -199,7 +199,7 @@ export const getTemplateId = createRegistrySelector( postId ); if ( ! editedEntity ) { - return undefined; + return; } const postsPageId = unlock( select( STORE_NAME ) ).getPostsPageId(); // Check if the current page is the posts page. From c33d5601169a024bb28d74f6d900ca5f0ed062ac Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 14:43:26 +0100 Subject: [PATCH 6/9] Memoize selector --- packages/core-data/src/private-selectors.ts | 51 ++++++++++++------- .../editor/use-resolve-edited-entity.js | 26 ++++------ 2 files changed, 43 insertions(+), 34 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index 5e943aa516b1cc..f32fb285e15b52 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -126,25 +126,38 @@ interface SiteData { page_for_posts?: string | number; } -export const getHomePage = createRegistrySelector( ( select ) => () => { - const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as - | SiteData - | undefined; - if ( ! siteData ) { - return null; - } - const homepageId = - siteData?.show_on_front === 'page' - ? normalizePageId( siteData.page_on_front ) - : null; - if ( homepageId ) { - return { postType: 'page', postId: homepageId }; - } - const frontPageTemplateId = select( STORE_NAME ).getDefaultTemplateId( { - slug: 'front-page', - } ); - return { postType: 'wp_template', postId: frontPageTemplateId }; -} ); +export const getHomePage = createRegistrySelector( ( select ) => + createSelector( + () => { + const siteData = select( STORE_NAME ).getEntityRecord( + 'root', + 'site' + ) as SiteData | undefined; + if ( ! siteData ) { + return null; + } + const homepageId = + siteData?.show_on_front === 'page' + ? normalizePageId( siteData.page_on_front ) + : null; + if ( homepageId ) { + return { postType: 'page', postId: homepageId }; + } + const frontPageTemplateId = select( + STORE_NAME + ).getDefaultTemplateId( { + slug: 'front-page', + } ); + return { postType: 'wp_template', postId: frontPageTemplateId }; + }, + () => [ + select( STORE_NAME ).getEntityRecord( 'root', 'site' ), + select( STORE_NAME ).getDefaultTemplateId( { + slug: 'front-page', + } ), + ] + ) +); export const getPostsPageId = createRegistrySelector( ( select ) => () => { const siteData = select( STORE_NAME ).getEntityRecord( 'root', 'site' ) as diff --git a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js index 65fdd7bcb7c91f..9c92ae967457b6 100644 --- a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js +++ b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js @@ -32,13 +32,9 @@ const authorizedPostTypes = [ 'page', 'post' ]; export function useResolveEditedEntity() { const { params = {} } = useLocation(); const { postId, postType } = params; - const { homepagePostType, homepagePostId } = useSelect( ( select ) => { + const homePage = useSelect( ( select ) => { const { getHomePage } = unlock( select( coreDataStore ) ); - const homePage = getHomePage(); - return { - homepagePostType: homePage?.postType, - homepagePostId: homePage?.postId, - }; + return getHomePage(); }, [] ); /** @@ -76,18 +72,18 @@ export function useResolveEditedEntity() { } // If we're rendering the home page, and we have a static home page, resolve its template. - if ( homepagePostType === 'page' ) { - return getTemplateId( 'page', homepagePostId ); + if ( homePage?.postType === 'page' ) { + return getTemplateId( 'page', homePage?.postId ); } - if ( homepagePostType === 'wp_template' ) { - return homepagePostId; + if ( homePage?.postType === 'wp_template' ) { + return homePage?.postId; } // This can only happen when homepage is being loaded. return null; }, - [ homepagePostId, homepagePostType, postId, postType ] + [ homePage, postId, postType ] ); const context = useMemo( () => { @@ -100,18 +96,18 @@ export function useResolveEditedEntity() { } // TODO: for post types lists we should probably not render the front page, but maybe a placeholder // with a message like "Select a page" or something similar. - if ( homepagePostType === 'page' ) { - return { postType: 'page', postId: homepagePostId }; + if ( homePage?.postType === 'page' ) { + return { postType: 'page', postId: homePage?.postId }; } return {}; - }, [ homepagePostId, homepagePostType, postType, postId ] ); + }, [ homePage, postType, postId ] ); if ( postTypesWithoutParentTemplate.includes( postType ) && postId ) { return { isReady: true, postType, postId, context }; } - if ( !! homepagePostType ) { + if ( !! homePage ) { return { isReady: resolvedTemplateId !== undefined, postType: TEMPLATE_POST_TYPE, From 99ef52f5c6c084870f645735bc65d28866daad55 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 14:47:28 +0100 Subject: [PATCH 7/9] normalize resolved template id --- .../src/components/editor/use-resolve-edited-entity.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js index 9c92ae967457b6..4f873738704141 100644 --- a/packages/edit-site/src/components/editor/use-resolve-edited-entity.js +++ b/packages/edit-site/src/components/editor/use-resolve-edited-entity.js @@ -51,12 +51,12 @@ export function useResolveEditedEntity() { postTypesWithoutParentTemplate.includes( postType ) && postId ) { - return undefined; + return; } // Don't trigger resolution for multi-selected posts. if ( postId && postId.includes( ',' ) ) { - return undefined; + return; } const { getTemplateId } = unlock( select( coreDataStore ) ); @@ -79,9 +79,6 @@ export function useResolveEditedEntity() { if ( homePage?.postType === 'wp_template' ) { return homePage?.postId; } - - // This can only happen when homepage is being loaded. - return null; }, [ homePage, postId, postType ] ); From f66b9c4cdd538bbd85d1f1f8cd39aece1c027a08 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Fri, 15 Nov 2024 15:32:29 +0100 Subject: [PATCH 8/9] Fix e2e tests --- packages/core-data/src/private-selectors.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index f32fb285e15b52..20cf8315afec9b 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -180,7 +180,7 @@ export const getTemplateId = createRegistrySelector( if ( postType === 'page' && postType === homepage?.postType && - postId === homepage?.postId + postId.toString() === homepage?.postId ) { // The /lookup endpoint cannot currently handle a lookup // when a page is set as the front page, so specifically in @@ -216,7 +216,7 @@ export const getTemplateId = createRegistrySelector( } const postsPageId = unlock( select( STORE_NAME ) ).getPostsPageId(); // Check if the current page is the posts page. - if ( postType === 'page' && postsPageId === postId ) { + if ( postType === 'page' && postsPageId === postId.toString() ) { return select( STORE_NAME ).getDefaultTemplateId( { slug: 'home', } ); From 98ee372fee6234a4bfd0585039a0ab630f85f050 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Mon, 18 Nov 2024 08:46:27 +0100 Subject: [PATCH 9/9] Use raw selectors for the dependencies --- packages/core-data/src/private-selectors.ts | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/packages/core-data/src/private-selectors.ts b/packages/core-data/src/private-selectors.ts index 20cf8315afec9b..02fe152ed0abb6 100644 --- a/packages/core-data/src/private-selectors.ts +++ b/packages/core-data/src/private-selectors.ts @@ -6,7 +6,7 @@ import { createSelector, createRegistrySelector } from '@wordpress/data'; /** * Internal dependencies */ -import type { State } from './selectors'; +import { getDefaultTemplateId, getEntityRecord, type State } from './selectors'; import { STORE_NAME } from './name'; import { unlock } from './lock-unlock'; @@ -150,9 +150,10 @@ export const getHomePage = createRegistrySelector( ( select ) => } ); return { postType: 'wp_template', postId: frontPageTemplateId }; }, - () => [ - select( STORE_NAME ).getEntityRecord( 'root', 'site' ), - select( STORE_NAME ).getDefaultTemplateId( { + ( state ) => [ + // @ts-expect-error + getEntityRecord( state, 'root', 'site' ), + getDefaultTemplateId( state, { slug: 'front-page', } ), ]