diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/index.js index 5ae860d4bb829..562b18def4fcf 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menu/index.js @@ -22,9 +22,10 @@ import buildNavigationLabel from '../sidebar-navigation-screen-navigation-menus/ export const postType = `wp_navigation`; export default function SidebarNavigationScreenNavigationMenu() { - const { - params: { postId }, - } = useNavigator(); + const { params } = useNavigator(); + + // See https://github.com/WordPress/gutenberg/pull/52120. + const postId = Number( params?.postId ); const { record: navigationMenu, isResolving } = useEntityRecord( 'postType', diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-page/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-page/index.js index c5799d97a8064..cd5869cfceb8f 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-page/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-page/index.js @@ -30,9 +30,9 @@ import SidebarNavigationScreenDetailsFooter from '../sidebar-navigation-screen-d export default function SidebarNavigationScreenPage() { const navigator = useNavigator(); const { setCanvasMode } = unlock( useDispatch( editSiteStore ) ); - const { - params: { postId }, - } = useNavigator(); + const { params } = useNavigator(); + + const postId = Number( params?.postId ); const { record } = useEntityRecord( 'postType', 'page', postId ); const { featuredMediaAltText, featuredMediaSourceUrl } = useSelect( diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-pattern/index.js b/packages/edit-site/src/components/sidebar-navigation-screen-pattern/index.js index 39f28dba6d520..5815c4818fe9b 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-pattern/index.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-pattern/index.js @@ -16,13 +16,16 @@ import useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-e import usePatternDetails from './use-pattern-details'; import { store as editSiteStore } from '../../store'; import { unlock } from '../../lock-unlock'; +import normalizeRecordKey from '../../utils/normalize-record-key'; export default function SidebarNavigationScreenPattern() { - const { params } = useNavigator(); const { categoryType } = getQueryArgs( window.location.href ); - const { postType, postId } = params; const { setCanvasMode } = unlock( useDispatch( editSiteStore ) ); + const { params } = useNavigator(); + const { postType } = params; + const postId = normalizeRecordKey( params?.postId ); + useInitEditedEntityFromURL(); const patternDetails = usePatternDetails( postType, postId ); diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js b/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js index 9853e2e6de23b..a889e3f6ffcf5 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-pattern/use-pattern-details.js @@ -19,8 +19,11 @@ import { SidebarNavigationScreenDetailsPanelLabel, SidebarNavigationScreenDetailsPanelValue, } from '../sidebar-navigation-screen-details-panel'; +import normalizeRecordKey from '../../utils/normalize-record-key'; export default function usePatternDetails( postType, postId ) { + postId = normalizeRecordKey( postId ); + const { getDescription, getTitle, record } = useEditedEntityRecord( postType, postId diff --git a/packages/edit-site/src/components/sync-state-with-url/use-init-edited-entity-from-url.js b/packages/edit-site/src/components/sync-state-with-url/use-init-edited-entity-from-url.js index 19518f650c0be..dee20963cfc60 100644 --- a/packages/edit-site/src/components/sync-state-with-url/use-init-edited-entity-from-url.js +++ b/packages/edit-site/src/components/sync-state-with-url/use-init-edited-entity-from-url.js @@ -11,11 +11,17 @@ import { privateApis as routerPrivateApis } from '@wordpress/router'; */ import { store as editSiteStore } from '../../store'; import { unlock } from '../../lock-unlock'; +import normalizeRecordKey from '../../utils/normalize-record-key'; const { useLocation } = unlock( routerPrivateApis ); export default function useInitEditedEntityFromURL() { - const { params: { postId, postType } = {} } = useLocation(); + const { params } = useLocation(); + + const { postType } = params; + + const postId = normalizeRecordKey( params?.postId ); + const { isRequestingSite, homepageId, url } = useSelect( ( select ) => { const { getSite, getUnstableBase } = select( coreDataStore ); const siteData = getSite(); @@ -66,7 +72,7 @@ export default function useInitEditedEntityFromURL() { // In all other cases, we need to set the home page in the site editor view. if ( homepageId ) { setPage( { - context: { postType: 'page', postId: homepageId }, + context: { postType: 'page', postId: Number( homepageId ) }, } ); } else if ( ! isRequestingSite ) { setPage( { diff --git a/packages/edit-site/src/components/use-edited-entity-record/index.js b/packages/edit-site/src/components/use-edited-entity-record/index.js index 22a8bdc32a94a..30d1429ff9247 100644 --- a/packages/edit-site/src/components/use-edited-entity-record/index.js +++ b/packages/edit-site/src/components/use-edited-entity-record/index.js @@ -10,6 +10,7 @@ import { decodeEntities } from '@wordpress/html-entities'; * Internal dependencies */ import { store as editSiteStore } from '../../store'; +import normalizeRecordKey from '../../utils/normalize-record-key'; export default function useEditedEntityRecord( postType, postId ) { const { record, title, description, isLoaded, icon } = useSelect( @@ -21,7 +22,11 @@ export default function useEditedEntityRecord( postType, postId ) { const { __experimentalGetTemplateInfo: getTemplateInfo } = select( editorStore ); const usedPostType = postType ?? getEditedPostType(); - const usedPostId = postId ?? getEditedPostId(); + + let usedPostId = postId ?? getEditedPostId(); + + usedPostId = normalizeRecordKey( usedPostId, usedPostType ); + const _record = getEditedEntityRecord( 'postType', usedPostType, diff --git a/packages/edit-site/src/utils/normalize-record-key.js b/packages/edit-site/src/utils/normalize-record-key.js new file mode 100644 index 0000000000000..48036656c8a64 --- /dev/null +++ b/packages/edit-site/src/utils/normalize-record-key.js @@ -0,0 +1,11 @@ +function isNumericID( str ) { + return /^\s*\d+\s*$/.test( str ); +} + +export default function normalizeRecordKey( postId ) { + if ( isNumericID( postId ) ) { + postId = Number( postId ); + } + + return postId; +}