diff --git a/packages/block-library/src/block/test/edit.native.js b/packages/block-library/src/block/test/edit.native.js index 0b719dd06609df..f184fa164ce71b 100644 --- a/packages/block-library/src/block/test/edit.native.js +++ b/packages/block-library/src/block/test/edit.native.js @@ -45,6 +45,7 @@ const getMockedReusableBlock = ( id ) => ( { title: { raw: `Reusable block - ${ id }` }, type: 'wp_block', meta: { footnotes: '' }, + wp_pattern_category: [], } ); beforeAll( () => { diff --git a/packages/edit-post/src/components/layout/index.js b/packages/edit-post/src/components/layout/index.js index 6fc9ab570e5ac9..bc5ad7fe04851e 100644 --- a/packages/edit-post/src/components/layout/index.js +++ b/packages/edit-post/src/components/layout/index.js @@ -56,7 +56,6 @@ import SettingsSidebar from '../sidebar/settings-sidebar'; import MetaBoxes from '../meta-boxes'; import WelcomeGuide from '../welcome-guide'; import ActionsPanel from './actions-panel'; -import StartPageOptions from '../start-page-options'; import { store as editPostStore } from '../../store'; import { unlock } from '../../lock-unlock'; import useCommonCommands from '../../hooks/commands/use-common-commands'; @@ -364,7 +363,6 @@ function Layout( { initialPost } ) { - { ! isDistractionFree && } diff --git a/packages/edit-post/src/style.scss b/packages/edit-post/src/style.scss index 4ba063905d8b2e..c46246c8df1502 100644 --- a/packages/edit-post/src/style.scss +++ b/packages/edit-post/src/style.scss @@ -11,7 +11,6 @@ @import "./components/text-editor/style.scss"; @import "./components/visual-editor/style.scss"; @import "./components/welcome-guide/style.scss"; -@import "./components/start-page-options/style.scss"; /** * Animations diff --git a/packages/editor/src/components/provider/index.js b/packages/editor/src/components/provider/index.js index 5d4b2c0079a741..b1a2164e1274ef 100644 --- a/packages/editor/src/components/provider/index.js +++ b/packages/editor/src/components/provider/index.js @@ -26,6 +26,7 @@ import NavigationBlockEditingMode from './navigation-block-editing-mode'; import { useHideBlocksFromInserter } from './use-hide-blocks-from-inserter'; import useCommands from '../commands'; import BlockRemovalWarnings from '../block-removal-warnings'; +import StartPageOptions from '../start-page-options'; const { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis ); const { PatternsMenuItems } = unlock( editPatternsPrivateApis ); @@ -267,6 +268,7 @@ export const ExperimentalEditorProvider = withRegistryProvider( ) } + diff --git a/packages/edit-post/src/components/start-page-options/index.js b/packages/editor/src/components/start-page-options/index.js similarity index 58% rename from packages/edit-post/src/components/start-page-options/index.js rename to packages/editor/src/components/start-page-options/index.js index 0ef3e166e8ee1a..70e7ecd642d4c5 100644 --- a/packages/edit-post/src/components/start-page-options/index.js +++ b/packages/editor/src/components/start-page-options/index.js @@ -3,19 +3,19 @@ */ import { Modal } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; -import { useState, useMemo } from '@wordpress/element'; +import { useState, useMemo, useEffect } from '@wordpress/element'; import { store as blockEditorStore, __experimentalBlockPatternsList as BlockPatternsList, } from '@wordpress/block-editor'; import { useSelect, useDispatch } from '@wordpress/data'; import { useAsyncList } from '@wordpress/compose'; -import { store as editorStore } from '@wordpress/editor'; +import { store as coreStore } from '@wordpress/core-data'; /** * Internal dependencies */ -import { store as editPostStore } from '../../store'; +import { store as editorStore } from '../../store'; function useStartPatterns() { // A pattern is a start pattern if it includes 'core/post-content' in its blockTypes, @@ -23,11 +23,19 @@ function useStartPatterns() { // the current post type is part of the postTypes declared. const { blockPatternsWithPostContentBlockType, postType } = useSelect( ( select ) => { - const { getPatternsByBlockTypes } = select( blockEditorStore ); - const { getCurrentPostType } = select( editorStore ); + const { getPatternsByBlockTypes, getBlocksByName } = + select( blockEditorStore ); + const { getCurrentPostType, getRenderingMode } = + select( editorStore ); + const rootClientId = + getRenderingMode() === 'post-only' + ? '' + : getBlocksByName( 'core/post-content' )?.[ 0 ]; return { - blockPatternsWithPostContentBlockType: - getPatternsByBlockTypes( 'core/post-content' ), + blockPatternsWithPostContentBlockType: getPatternsByBlockTypes( + 'core/post-content', + rootClientId + ), postType: getCurrentPostType(), }; }, @@ -49,13 +57,21 @@ function useStartPatterns() { function PatternSelection( { blockPatterns, onChoosePattern } ) { const shownBlockPatterns = useAsyncList( blockPatterns ); - const { resetEditorBlocks } = useDispatch( editorStore ); + const { editEntityRecord } = useDispatch( coreStore ); + const { postType, postId } = useSelect( ( select ) => { + const { getCurrentPostType, getCurrentPostId } = select( editorStore ); + + return { + postType: getCurrentPostType(), + postId: getCurrentPostId(), + }; + }, [] ); return ( { - resetEditorBlocks( blocks ); + editEntityRecord( 'postType', postType, postId, { blocks } ); onChoosePattern(); } } /> @@ -72,12 +88,11 @@ function StartPageOptionsModal( { onClose } ) { return ( -
+
{ - const { isCleanNewPost, getRenderingMode } = select( editorStore ); - const { isFeatureActive } = select( editPostStore ); + const { shouldEnableModal, postType, postId } = useSelect( ( select ) => { + const { + isEditedPostDirty, + isEditedPostEmpty, + getCurrentPostType, + getCurrentPostId, + getEditorSettings, + } = select( editorStore ); + const { __unstableIsPreviewMode: isPreviewMode } = getEditorSettings(); - return ( - getRenderingMode() === 'post-only' && - ! isFeatureActive( 'welcomeGuide' ) && - isCleanNewPost() - ); + return { + shouldEnableModal: + ! isPreviewMode && ! isEditedPostDirty() && isEditedPostEmpty(), + postType: getCurrentPostType(), + postId: getCurrentPostId(), + }; }, [] ); + useEffect( () => { + // Should reset the modal state when navigating to a new page/post. + setIsClosed( false ); + }, [ postType, postId ] ); + if ( ! shouldEnableModal || isClosed ) { return null; } diff --git a/packages/edit-post/src/components/start-page-options/style.scss b/packages/editor/src/components/start-page-options/style.scss similarity index 83% rename from packages/edit-post/src/components/start-page-options/style.scss rename to packages/editor/src/components/start-page-options/style.scss index 52f3f5ff9a8889..129d670526c709 100644 --- a/packages/edit-post/src/components/start-page-options/style.scss +++ b/packages/editor/src/components/start-page-options/style.scss @@ -1,5 +1,5 @@ // 2 column masonry layout. -.edit-post-start-page-options__modal-content .block-editor-block-patterns-list { +.editor-start-page-options__modal-content .block-editor-block-patterns-list { column-count: 2; column-gap: $grid-unit-30; diff --git a/packages/editor/src/style.scss b/packages/editor/src/style.scss index 865635f228891e..da3cd2b297ba71 100644 --- a/packages/editor/src/style.scss +++ b/packages/editor/src/style.scss @@ -30,5 +30,6 @@ @import "./components/post-visibility/style.scss"; @import "./components/post-trash/style.scss"; @import "./components/preview-dropdown/style.scss"; +@import "./components/start-page-options/style.scss"; @import "./components/table-of-contents/style.scss"; @import "./components/template-areas/style.scss";