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 b539b82736467e..c5799d97a80645 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
@@ -9,7 +9,7 @@ import {
ExternalLink,
__experimentalTruncate as Truncate,
} from '@wordpress/components';
-import { store as coreStore } from '@wordpress/core-data';
+import { store as coreStore, useEntityRecord } from '@wordpress/core-data';
import { decodeEntities } from '@wordpress/html-entities';
import { pencil } from '@wordpress/icons';
import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
@@ -27,26 +27,27 @@ import PageDetails from './page-details';
import PageActions from '../page-actions';
import SidebarNavigationScreenDetailsFooter from '../sidebar-navigation-screen-details-footer';
-function usePageDetails( postId ) {
- const { record, featuredMediaSourceUrl, featuredMediaAltText } = useSelect(
+export default function SidebarNavigationScreenPage() {
+ const navigator = useNavigator();
+ const { setCanvasMode } = unlock( useDispatch( editSiteStore ) );
+ const {
+ params: { postId },
+ } = useNavigator();
+ const { record } = useEntityRecord( 'postType', 'page', postId );
+
+ const { featuredMediaAltText, featuredMediaSourceUrl } = useSelect(
( select ) => {
const { getEntityRecord } = select( coreStore );
- const pageRecord = select( coreStore ).getEntityRecord(
- 'postType',
- 'page',
- postId
- );
-
// Featured image.
- const attachedMedia = pageRecord?.featured_media
+ const attachedMedia = record?.featured_media
? getEntityRecord(
'postType',
'attachment',
- pageRecord?.featured_media
+ record?.featured_media
)
: null;
+
return {
- record: pageRecord,
featuredMediaSourceUrl:
attachedMedia?.media_details.sizes?.medium?.source_url ||
attachedMedia?.source_url,
@@ -57,74 +58,18 @@ function usePageDetails( postId ) {
),
};
},
- [ postId ]
- );
-
- const title = decodeEntities(
- record?.title?.rendered || __( '(no title)' )
+ [ record ]
);
const featureImageAltText = featuredMediaAltText
? decodeEntities( featuredMediaAltText )
: decodeEntities( record?.title?.rendered || __( 'Featured image' ) );
- const content = (
- <>
- { !! featuredMediaSourceUrl && (
-
-
-
-
-
- ) }
- { !! record?.excerpt?.rendered && (
-
- { stripHTML( record.excerpt.rendered ) }
-
- ) }
-
- >
- );
-
- const meta = record?.link ? (
-
- { filterURLForDisplay( safeDecodeURIComponent( record.link ) ) }
-
- ) : null;
-
- const footer = !! record?.modified ? (
-
- ) : null;
-
- return { title, meta, content, footer };
-}
-
-export default function SidebarNavigationScreenPage() {
- const navigator = useNavigator();
- const { setCanvasMode } = unlock( useDispatch( editSiteStore ) );
- const {
- params: { postId },
- } = useNavigator();
- const { title, meta, content, footer } = usePageDetails( postId );
-
- return (
+ return record ? (
>
}
- meta={ meta }
- content={ content }
- footer={ footer }
+ meta={
+
+ { filterURLForDisplay(
+ safeDecodeURIComponent( record.link )
+ ) }
+
+ }
+ content={
+ <>
+ { !! featuredMediaSourceUrl && (
+
+
+
+
+
+ ) }
+ { !! record?.excerpt?.rendered && (
+
+ { stripHTML( record.excerpt.rendered ) }
+
+ ) }
+
+ >
+ }
+ footer={
+
+ }
/>
- );
+ ) : null;
}