diff --git a/lib/experiments-page.php b/lib/experiments-page.php index b77a69b692ff1..c2c7beb01cff8 100644 --- a/lib/experiments-page.php +++ b/lib/experiments-page.php @@ -140,12 +140,12 @@ function gutenberg_initialize_experiments_settings() { add_settings_field( 'gutenberg-pattern-partial-syncing', - __( 'Synced patterns partial syncing', 'gutenberg' ), + __( 'Pattern overrides', 'gutenberg' ), 'gutenberg_display_experiment_field', 'gutenberg-experiments', 'gutenberg_experiments_section', array( - 'label' => __( 'Test partial syncing of patterns', 'gutenberg' ), + 'label' => __( 'Test overrides in synced patterns', 'gutenberg' ), 'id' => 'gutenberg-pattern-partial-syncing', ) ); diff --git a/packages/block-editor/src/components/block-inspector/index.js b/packages/block-editor/src/components/block-inspector/index.js index 18cd72cde057d..9cb3b89a7bc25 100644 --- a/packages/block-editor/src/components/block-inspector/index.js +++ b/packages/block-editor/src/components/block-inspector/index.js @@ -92,7 +92,9 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => { blockType: _blockType, topLevelLockedBlock: __unstableGetContentLockingParent( _selectedBlockClientId ) || - ( getTemplateLock( _selectedBlockClientId ) === 'contentOnly' + ( getTemplateLock( _selectedBlockClientId ) === 'contentOnly' || + ( _selectedBlockName === 'core/block' && + window.__experimentalPatternPartialSyncing ) ? _selectedBlockClientId : undefined ), }; diff --git a/packages/block-editor/src/components/block-list/use-in-between-inserter.js b/packages/block-editor/src/components/block-list/use-in-between-inserter.js index a60453716ff29..bd323ed057d73 100644 --- a/packages/block-editor/src/components/block-list/use-in-between-inserter.js +++ b/packages/block-editor/src/components/block-list/use-in-between-inserter.js @@ -28,6 +28,7 @@ export function useInBetweenInserter() { getTemplateLock, __unstableIsWithinBlockOverlay, getBlockEditingMode, + getBlockName, } = useSelect( blockEditorStore ); const { showInsertionPoint, hideInsertionPoint } = useDispatch( blockEditorStore ); @@ -75,7 +76,9 @@ export function useInBetweenInserter() { if ( getTemplateLock( rootClientId ) || - getBlockEditingMode( rootClientId ) === 'disabled' + getBlockEditingMode( rootClientId ) === 'disabled' || + ( getBlockName( rootClientId ) === 'core/block' && + window.__experimentalPatternPartialSyncing ) ) { return; } diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index b6d455333c7a5..94eebd32837a5 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -2742,8 +2742,11 @@ export const __unstableGetContentLockingParent = createSelector( while ( state.blocks.parents.has( current ) ) { current = state.blocks.parents.get( current ); if ( - current && - getTemplateLock( state, current ) === 'contentOnly' + ( current && + getBlockName( state, current ) === 'core/block' && + window.__experimentalPatternPartialSyncing ) || + ( current && + getTemplateLock( state, current ) === 'contentOnly' ) ) { result = current; } diff --git a/packages/block-library/src/block/edit.js b/packages/block-library/src/block/edit.js index 67b2680f6840e..1892d614dba2a 100644 --- a/packages/block-library/src/block/edit.js +++ b/packages/block-library/src/block/edit.js @@ -8,12 +8,12 @@ import classnames from 'classnames'; */ import { useRegistry, useSelect, useDispatch } from '@wordpress/data'; import { useRef, useMemo, useEffect } from '@wordpress/element'; -import { useEntityProp, useEntityRecord } from '@wordpress/core-data'; +import { useEntityRecord, store as coreStore } from '@wordpress/core-data'; import { Placeholder, Spinner, - TextControl, - PanelBody, + ToolbarButton, + ToolbarGroup, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { @@ -21,11 +21,11 @@ import { __experimentalRecursionProvider as RecursionProvider, __experimentalUseHasRecursion as useHasRecursion, InnerBlocks, - InspectorControls, useBlockProps, Warning, privateApis as blockEditorPrivateApis, store as blockEditorStore, + BlockControls, } from '@wordpress/block-editor'; import { getBlockSupport, parse } from '@wordpress/blocks'; @@ -132,6 +132,15 @@ function getOverridesFromBlocks( blocks, defaultValues ) { return Object.keys( overrides ).length > 0 ? overrides : undefined; } +function setBlockEditMode( setEditMode, blocks, mode ) { + blocks.forEach( ( block ) => { + const editMode = + mode || ( isPartiallySynced( block ) ? 'contentOnly' : 'disabled' ); + setEditMode( block.clientId, editMode ); + setBlockEditMode( setEditMode, block.innerBlocks, mode ); + } ); +} + export default function ReusableBlockEdit( { name, attributes: { ref, overrides }, @@ -149,14 +158,51 @@ export default function ReusableBlockEdit( { const isMissing = hasResolved && ! record; const initialOverrides = useRef( overrides ); const defaultValuesRef = useRef( {} ); + const { replaceInnerBlocks, __unstableMarkNextChangeAsNotPersistent, setBlockEditingMode, } = useDispatch( blockEditorStore ); - const { getBlockEditingMode } = useSelect( blockEditorStore ); const { syncDerivedUpdates } = unlock( useDispatch( blockEditorStore ) ); + const { innerBlocks, userCanEdit, getBlockEditingMode, getPostLinkProps } = + useSelect( + ( select ) => { + const { canUser } = select( coreStore ); + const { + getBlocks, + getBlockEditingMode: editingMode, + getSettings, + } = select( blockEditorStore ); + const blocks = getBlocks( patternClientId ); + const canEdit = canUser( 'update', 'blocks', ref ); + + // For editing link to the site editor if the theme and user permissions support it. + return { + innerBlocks: blocks, + userCanEdit: canEdit, + getBlockEditingMode: editingMode, + getPostLinkProps: + getSettings().__experimentalGetPostLinkProps, + }; + }, + [ patternClientId, ref ] + ); + + const editOriginalProps = getPostLinkProps + ? getPostLinkProps( { + postId: ref, + postType: 'wp_block', + canvas: 'edit', + } ) + : {}; + + useEffect( + () => setBlockEditMode( setBlockEditingMode, innerBlocks ), + [ innerBlocks, setBlockEditingMode ] + ); + // Apply the initial overrides from the pattern block to the inner blocks. useEffect( () => { const initialBlocks = @@ -193,18 +239,6 @@ export default function ReusableBlockEdit( { syncDerivedUpdates, ] ); - const innerBlocks = useSelect( - ( select ) => select( blockEditorStore ).getBlocks( patternClientId ), - [ patternClientId ] - ); - - const [ title, setTitle ] = useEntityProp( - 'postType', - 'wp_block', - 'title', - ref - ); - const { alignment, layout } = useInferredLayout( innerBlocks, parentLayout @@ -247,6 +281,11 @@ export default function ReusableBlockEdit( { }, blockEditorStore ); }, [ syncDerivedUpdates, patternClientId, registry, setAttributes ] ); + const handleEditOriginal = ( event ) => { + setBlockEditMode( setBlockEditingMode, innerBlocks, 'default' ); + editOriginalProps.onClick( event ); + }; + let children = null; if ( hasAlreadyRendered ) { @@ -275,17 +314,18 @@ export default function ReusableBlockEdit( { return ( - - - - - + { userCanEdit && editOriginalProps && ( + + + + { __( 'Edit original' ) } + + + + ) } { children === null ? (
) : ( diff --git a/packages/edit-post/src/components/browser-url/index.js b/packages/edit-post/src/components/browser-url/index.js index 798753cfea357..5f389c4c82818 100644 --- a/packages/edit-post/src/components/browser-url/index.js +++ b/packages/edit-post/src/components/browser-url/index.js @@ -43,7 +43,8 @@ export class BrowserURL extends Component { } componentDidUpdate( prevProps ) { - const { postId, postStatus, postType, isSavingPost } = this.props; + const { postId, postStatus, postType, isSavingPost, hasHistory } = + this.props; const { historyId } = this.state; // Posts are still dirty while saving so wait for saving to finish @@ -56,7 +57,8 @@ export class BrowserURL extends Component { if ( ( postId !== prevProps.postId || postId !== historyId ) && postStatus !== 'auto-draft' && - postId + postId && + ! hasHistory ) { this.setBrowserURL( postId ); } diff --git a/packages/edit-post/src/components/header/index.js b/packages/edit-post/src/components/header/index.js index 79229175185cd..1aba3738e9f40 100644 --- a/packages/edit-post/src/components/header/index.js +++ b/packages/edit-post/src/components/header/index.js @@ -67,6 +67,7 @@ function Header( { setEntitiesSavedStatesCallback } ) { isEditingTemplate, isPublishSidebarOpened, showIconLabels, + hasHistory, } = useSelect( ( select ) => { const { get: getPreference } = select( preferencesStore ); const { getEditorMode } = select( editPostStore ); @@ -76,6 +77,7 @@ function Header( { setEntitiesSavedStatesCallback } ) { hasBlockSelection: !! select( blockEditorStore ).getBlockSelectionStart(), hasActiveMetaboxes: select( editPostStore ).hasMetaBoxes(), + hasHistory: !! select( editorStore ).getEditorSettings().goBack, isEditingTemplate: select( editorStore ).getRenderingMode() === 'template-only', isPublishSidebarOpened: @@ -161,7 +163,7 @@ function Header( { setEntitiesSavedStatesCallback } ) { isLargeViewport, } ) } > - { isEditingTemplate && } + { ( isEditingTemplate || hasHistory ) && }
{ const { getEditorSettings, getPostTypeLabel } = select( editorStore ); const editorSettings = getEditorSettings(); @@ -201,6 +202,7 @@ function Layout() { documentLabel: postTypeLabel || _x( 'Document', 'noun' ), hasBlockSelected: !! select( blockEditorStore ).getBlockSelectionStart(), + hasHistory: !! getEditorSettings().goBack, }; }, [] ); @@ -290,7 +292,7 @@ function Layout() { return ( <> - + diff --git a/packages/edit-post/src/editor.js b/packages/edit-post/src/editor.js index aa9a4dd42b83b..7e03314b646f0 100644 --- a/packages/edit-post/src/editor.js +++ b/packages/edit-post/src/editor.js @@ -23,11 +23,22 @@ import Layout from './components/layout'; import EditorInitialization from './components/editor-initialization'; import { store as editPostStore } from './store'; import { unlock } from './lock-unlock'; +import usePostHistory from './hooks/use-post-history'; const { ExperimentalEditorProvider } = unlock( editorPrivateApis ); -function Editor( { postId, postType, settings, initialEdits, ...props } ) { +function Editor( { + postId: initialPostId, + postType: initialPostType, + settings, + initialEdits, + ...props +} ) { const isLargeViewport = useViewportMatch( 'medium' ); + const { currentPost, getPostLinkProps, goBack } = usePostHistory( + initialPostId, + initialPostType + ); const { hasFixedToolbar, @@ -52,22 +63,31 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) { const { getEditorSettings } = select( editorStore ); const { getBlockTypes } = select( blocksStore ); const isTemplate = [ 'wp_template', 'wp_template_part' ].includes( - postType + currentPost.postType ); // Ideally the initializeEditor function should be called using the ID of the REST endpoint. // to avoid the special case. let postObject; if ( isTemplate ) { - const posts = getEntityRecords( 'postType', postType, { - wp_id: postId, - } ); + const posts = getEntityRecords( + 'postType', + currentPost.postType, + { + wp_id: currentPost.postId, + } + ); postObject = posts?.[ 0 ]; } else { - postObject = getEntityRecord( 'postType', postType, postId ); + postObject = getEntityRecord( + 'postType', + currentPost.postType, + currentPost.postId + ); } const supportsTemplateMode = getEditorSettings().supportsTemplateMode; - const isViewable = getPostType( postType )?.viewable ?? false; + const isViewable = + getPostType( currentPost.postType )?.viewable ?? false; const canEditTemplate = canUser( 'create', 'templates' ); return { hasFixedToolbar: @@ -89,7 +109,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) { post: postObject, }; }, - [ postType, postId, isLargeViewport ] + [ currentPost.postType, currentPost.postId, isLargeViewport ] ); const { updatePreferredStyleVariations } = useDispatch( editPostStore ); @@ -97,6 +117,8 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) { const editorSettings = useMemo( () => { const result = { ...settings, + getPostLinkProps, + goBack, __experimentalPreferredStyleVariations: { value: preferredStyleVariations, onChange: updatePreferredStyleVariations, @@ -134,11 +156,13 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) { hasInlineToolbar, focusMode, isDistractionFree, + keepCaretInsideBlock, hiddenBlockTypes, blockTypes, preferredStyleVariations, updatePreferredStyleVariations, - keepCaretInsideBlock, + getPostLinkProps, + goBack, ] ); if ( ! post ) { @@ -157,7 +181,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) { > - + diff --git a/packages/edit-post/src/hooks/use-post-history.js b/packages/edit-post/src/hooks/use-post-history.js new file mode 100644 index 0000000000000..02c34a26727b1 --- /dev/null +++ b/packages/edit-post/src/hooks/use-post-history.js @@ -0,0 +1,73 @@ +/** + * WordPress dependencies + */ +import { useCallback, useReducer } from '@wordpress/element'; +import { addQueryArgs, getQueryArgs, removeQueryArgs } from '@wordpress/url'; + +/** + * A hook that records the 'entity' history in the post editor as a user + * navigates between editing a post and editing the post template or patterns. + * + * Implemented as a stack, so a little similar to the browser history API. + * + * Used to control displaying UI elements like the back button. + * + * @param {number} initialPostId The post id of the post when the editor loaded. + * @param {string} initialPostType The post type of the post when the editor loaded. + * + * @return {Object} An object containing the `currentPost` variable and + * `getPostLinkProps` and `goBack` functions. + */ +export default function usePostHistory( initialPostId, initialPostType ) { + const [ postHistory, dispatch ] = useReducer( + ( historyState, { type, post } ) => { + if ( type === 'push' ) { + return [ ...historyState, post ]; + } + if ( type === 'pop' ) { + // Try to leave one item in the history. + if ( historyState.length > 1 ) { + return historyState.slice( 0, -1 ); + } + } + return historyState; + }, + [ { postId: initialPostId, postType: initialPostType } ] + ); + + const getPostLinkProps = useCallback( ( params ) => { + const currentArgs = getQueryArgs( window.location.href ); + const currentUrlWithoutArgs = removeQueryArgs( + window.location.href, + ...Object.keys( currentArgs ) + ); + + const newUrl = addQueryArgs( currentUrlWithoutArgs, { + post: params.postId, + action: 'edit', + } ); + + return { + href: newUrl, + onClick: ( event ) => { + event.preventDefault(); + dispatch( { + type: 'push', + post: { postId: params.postId, postType: params.postType }, + } ); + }, + }; + }, [] ); + + const goBack = useCallback( () => { + dispatch( { type: 'pop' } ); + }, [] ); + + const currentPost = postHistory[ postHistory.length - 1 ]; + + return { + currentPost, + getPostLinkProps, + goBack: postHistory.length > 1 ? goBack : undefined, + }; +} diff --git a/packages/edit-site/src/components/block-editor/back-button.js b/packages/edit-site/src/components/block-editor/back-button.js index 924dedd4f853e..acd9cf7028e65 100644 --- a/packages/edit-site/src/components/block-editor/back-button.js +++ b/packages/edit-site/src/components/block-editor/back-button.js @@ -12,6 +12,7 @@ import { privateApis as routerPrivateApis } from '@wordpress/router'; import { TEMPLATE_PART_POST_TYPE, NAVIGATION_POST_TYPE, + PATTERN_TYPES, } from '../../utils/constants'; import { unlock } from '../../lock-unlock'; @@ -22,11 +23,12 @@ function BackButton() { const history = useHistory(); const isTemplatePart = location.params.postType === TEMPLATE_PART_POST_TYPE; const isNavigationMenu = location.params.postType === NAVIGATION_POST_TYPE; + const isPattern = location.params.postType === PATTERN_TYPES.user; const previousTemplateId = location.state?.fromTemplateId; - const isFocusMode = isTemplatePart || isNavigationMenu; + const isFocusMode = isTemplatePart || isNavigationMenu || isPattern; - if ( ! isFocusMode || ! previousTemplateId ) { + if ( ! isFocusMode || ( ! previousTemplateId && ! isPattern ) ) { return null; } diff --git a/packages/edit-site/src/components/block-editor/use-post-link-props.js b/packages/edit-site/src/components/block-editor/use-post-link-props.js new file mode 100644 index 0000000000000..dd02305393122 --- /dev/null +++ b/packages/edit-site/src/components/block-editor/use-post-link-props.js @@ -0,0 +1,20 @@ +/** + * WordPress dependencies + */ +import { privateApis as routerPrivateApis } from '@wordpress/router'; + +/** + * Internal dependencies + */ +import { unlock } from '../../lock-unlock'; +import { getPostLinkProps } from '../routes/link'; + +const { useHistory } = unlock( routerPrivateApis ); + +export function usePostLinkProps() { + const history = useHistory(); + + return ( params, state ) => { + return getPostLinkProps( history, params, state ); + }; +} diff --git a/packages/edit-site/src/components/block-editor/use-site-editor-settings.js b/packages/edit-site/src/components/block-editor/use-site-editor-settings.js index d1ccd9e73f15d..fcf50a724c8d1 100644 --- a/packages/edit-site/src/components/block-editor/use-site-editor-settings.js +++ b/packages/edit-site/src/components/block-editor/use-site-editor-settings.js @@ -13,6 +13,7 @@ import { store as preferencesStore } from '@wordpress/preferences'; */ import { store as editSiteStore } from '../../store'; import { unlock } from '../../lock-unlock'; +import { usePostLinkProps } from './use-post-link-props'; const { useBlockEditorSettings } = unlock( editorPrivateApis ); @@ -90,6 +91,7 @@ function useArchiveLabel( templateSlug ) { export function useSpecificEditorSettings() { const isLargeViewport = useViewportMatch( 'medium' ); + const getPostLinkProps = usePostLinkProps(); const { templateSlug, focusMode, @@ -152,21 +154,22 @@ export function useSpecificEditorSettings() { hasFixedToolbar, keepCaretInsideBlock, defaultRenderingMode, - + getPostLinkProps, // I wonder if they should be set in the post editor too __experimentalArchiveTitleTypeLabel: archiveLabels.archiveTypeLabel, __experimentalArchiveTitleNameLabel: archiveLabels.archiveNameLabel, }; }, [ settings, + canvasMode, focusMode, isDistractionFree, hasFixedToolbar, keepCaretInsideBlock, - canvasMode, + defaultRenderingMode, + getPostLinkProps, archiveLabels.archiveTypeLabel, archiveLabels.archiveNameLabel, - defaultRenderingMode, ] ); return defaultEditorSettings; diff --git a/packages/edit-site/src/components/routes/link.js b/packages/edit-site/src/components/routes/link.js index 3191e6b9c6f3a..9ee60b5ef8b9e 100644 --- a/packages/edit-site/src/components/routes/link.js +++ b/packages/edit-site/src/components/routes/link.js @@ -15,9 +15,12 @@ import { const { useHistory } = unlock( routerPrivateApis ); -export function useLink( params = {}, state, shouldReplace = false ) { - const history = useHistory(); - +export function getPostLinkProps( + history, + params = {}, + state, + shouldReplace = false +) { function onClick( event ) { event.preventDefault(); @@ -49,6 +52,11 @@ export function useLink( params = {}, state, shouldReplace = false ) { }; } +export function useLink( params, state, shouldReplace ) { + const history = useHistory(); + return getPostLinkProps( history, params, state, shouldReplace ); +} + export default function Link( { params = {}, state, diff --git a/packages/editor/src/components/document-bar/index.js b/packages/editor/src/components/document-bar/index.js index da43533bfa5bc..fdf9cbe55dbca 100644 --- a/packages/editor/src/components/document-bar/index.js +++ b/packages/editor/src/components/document-bar/index.js @@ -48,40 +48,51 @@ const icons = { }; export default function DocumentBar() { - const { isEditingTemplate, templateId, postType, postId } = useSelect( - ( select ) => { - const { - getRenderingMode, - getCurrentTemplateId, - getCurrentPostId, - getCurrentPostType, - } = select( editorStore ); - const _templateId = getCurrentTemplateId(); - return { - isEditingTemplate: - !! _templateId && getRenderingMode() === 'template-only', - templateId: _templateId, - postType: getCurrentPostType(), - postId: getCurrentPostId(), - }; - }, - [] - ); - const { getEditorSettings } = useSelect( editorStore ); + const { + isEditingTemplate, + templateId, + postType, + postId, + goBack, + getEditorSettings, + } = useSelect( ( select ) => { + const { + getRenderingMode, + getCurrentTemplateId, + getCurrentPostId, + getCurrentPostType, + getEditorSettings: getSettings, + } = select( editorStore ); + const _templateId = getCurrentTemplateId(); + const back = getSettings().goBack; + return { + isEditingTemplate: + !! _templateId && getRenderingMode() === 'template-only', + templateId: _templateId, + postType: getCurrentPostType(), + postId: getCurrentPostId(), + goBack: typeof back === 'function' ? back : undefined, + getEditorSettings: getSettings, + }; + }, [] ); + const { setRenderingMode } = useDispatch( editorStore ); + const handleOnBack = () => { + if ( isEditingTemplate ) { + setRenderingMode( getEditorSettings().defaultRenderingMode ); + return; + } + if ( goBack ) { + goBack(); + } + }; + return ( - setRenderingMode( - getEditorSettings().defaultRenderingMode - ) - : undefined - } + onBack={ isEditingTemplate || goBack ? handleOnBack : undefined } /> ); } diff --git a/packages/editor/src/components/editor-canvas/index.js b/packages/editor/src/components/editor-canvas/index.js index 6d4c51dc6a097..e5e663f821a64 100644 --- a/packages/editor/src/components/editor-canvas/index.js +++ b/packages/editor/src/components/editor-canvas/index.js @@ -91,6 +91,7 @@ function EditorCanvas( { wrapperBlockName, wrapperUniqueId, deviceType, + hasHistory, } = useSelect( ( select ) => { const { getCurrentPostId, @@ -127,7 +128,7 @@ function EditorCanvas( { return { renderingMode: _renderingMode, - postContentAttributes: getEditorSettings().postContentAttributes, + postContentAttributes: editorSettings.postContentAttributes, // Post template fetch returns a 404 on classic themes, which // messes with e2e tests, so check it's a block theme first. editedPostTemplate: @@ -137,6 +138,7 @@ function EditorCanvas( { wrapperBlockName: _wrapperBlockName, wrapperUniqueId: getCurrentPostId(), deviceType: getDeviceType(), + hasHistory: !! editorSettings.goBack, }; }, [] ); const { isCleanNewPost } = useSelect( editorStore ); @@ -299,6 +301,9 @@ function EditorCanvas( { styles={ styles } height="100%" iframeProps={ { + className: classnames( 'editor-canvas__iframe', { + 'has-history': hasHistory, + } ), ...iframeProps, style: { ...iframeProps?.style, diff --git a/packages/editor/src/components/editor-canvas/style.scss b/packages/editor/src/components/editor-canvas/style.scss new file mode 100644 index 0000000000000..d5baf48012452 --- /dev/null +++ b/packages/editor/src/components/editor-canvas/style.scss @@ -0,0 +1,5 @@ +.editor-canvas__iframe { + &.has-history { + padding: $grid-unit-60 $grid-unit-60 0; + } +} diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js index 1afbf98150d27..73d051e3d0542 100644 --- a/packages/editor/src/components/provider/use-block-editor-settings.js +++ b/packages/editor/src/components/provider/use-block-editor-settings.js @@ -76,6 +76,7 @@ const BLOCK_EDITOR_SETTINGS = [ '__unstableIsBlockBasedTheme', '__experimentalArchiveTitleTypeLabel', '__experimentalArchiveTitleNameLabel', + '__experimentalGetPostLinkProps', ]; /** @@ -99,6 +100,7 @@ function useBlockEditorSettings( settings, postType, postId ) { userPatternCategories, restBlockPatterns, restBlockPatternCategories, + getPostLinkProps, } = useSelect( ( select ) => { const isWeb = Platform.OS === 'web'; @@ -111,6 +113,8 @@ function useBlockEditorSettings( settings, postType, postId ) { getBlockPatterns, getBlockPatternCategories, } = select( coreStore ); + const { getPostLinkProps: postLinkProps } = + select( editorStore ).getEditorSettings(); const siteSettings = canUser( 'read', 'settings' ) ? getEntityRecord( 'root', 'site' ) @@ -138,6 +142,7 @@ function useBlockEditorSettings( settings, postType, postId ) { userPatternCategories: getUserPatternCategories(), restBlockPatterns: getBlockPatterns(), restBlockPatternCategories: getBlockPatternCategories(), + getPostLinkProps: postLinkProps, }; }, [ postType, postId ] @@ -245,6 +250,7 @@ function useBlockEditorSettings( settings, postType, postId ) { ? [ [ 'core/navigation', {}, [] ] ] : settings.template, __experimentalSetIsInserterOpened: setIsInserterOpened, + __experimentalGetPostLinkProps: getPostLinkProps, } ), [ allowRightClickOverrides, @@ -262,6 +268,7 @@ function useBlockEditorSettings( settings, postType, postId ) { pageForPosts, postType, setIsInserterOpened, + getPostLinkProps, ] ); } diff --git a/packages/editor/src/style.scss b/packages/editor/src/style.scss index 7515e20cd1d38..26c896acbde8c 100644 --- a/packages/editor/src/style.scss +++ b/packages/editor/src/style.scss @@ -28,3 +28,4 @@ @import "./components/preview-dropdown/style.scss"; @import "./components/table-of-contents/style.scss"; @import "./components/template-validation-notice/style.scss"; +@import "./components/editor-canvas/style.scss";