-
Notifications
You must be signed in to change notification settings - Fork 4.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Replace Starter Content modal with inserter panel (#66836)
* Inserter: Add 'Starter Content' category to the inserter * Add cat condition * Replace Starter Content modal with inserter panel * remove option condition * remove duplicated category * Attempt to fix media panel test * Attempt to fix style variations test * Attempt to fix recursive pattern test * Attempt to fix template resolution test * Attempt to fix new page test * Tweak template resolution test * Remove categoryObject * Fix aria-current on category tabs * Fix selected cat in patterns explorer * pass postId so that the inserter gets reopened when a new page is created using the command palette * Take control of zoom if a new page is created * Add post Id back --------- Co-authored-by: Andrei Draganescu <[email protected]> Co-authored-by: Sarah Norris <[email protected]> Co-authored-by: Ben Dwyer <[email protected]>
- Loading branch information
1 parent
a9f93d8
commit 1185005
Showing
12 changed files
with
68 additions
and
151 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
147 changes: 28 additions & 119 deletions
147
packages/editor/src/components/start-page-options/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,141 +1,50 @@ | ||
/** | ||
* WordPress dependencies | ||
*/ | ||
import { Modal } from '@wordpress/components'; | ||
import { __ } from '@wordpress/i18n'; | ||
import { useState, useMemo } from '@wordpress/element'; | ||
import { | ||
store as blockEditorStore, | ||
__experimentalBlockPatternsList as BlockPatternsList, | ||
} from '@wordpress/block-editor'; | ||
import { useEffect } from '@wordpress/element'; | ||
import { useSelect, useDispatch } from '@wordpress/data'; | ||
import { store as coreStore } from '@wordpress/core-data'; | ||
import { __unstableSerializeAndClean } from '@wordpress/blocks'; | ||
import { store as preferencesStore } from '@wordpress/preferences'; | ||
import { store as interfaceStore } from '@wordpress/interface'; | ||
|
||
/** | ||
* Internal dependencies | ||
*/ | ||
import { store as editorStore } from '../../store'; | ||
import { TEMPLATE_POST_TYPE } from '../../store/constants'; | ||
|
||
export function useStartPatterns() { | ||
// A pattern is a start pattern if it includes 'core/post-content' in its blockTypes, | ||
// and it has no postTypes declared and the current post type is page or if | ||
// the current post type is part of the postTypes declared. | ||
const { blockPatternsWithPostContentBlockType, postType } = useSelect( | ||
( select ) => { | ||
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', | ||
rootClientId | ||
), | ||
postType: getCurrentPostType(), | ||
}; | ||
}, | ||
[] | ||
); | ||
|
||
return useMemo( () => { | ||
if ( ! blockPatternsWithPostContentBlockType?.length ) { | ||
return []; | ||
} | ||
|
||
/* | ||
* Filter patterns without postTypes declared if the current postType is page | ||
* or patterns that declare the current postType in its post type array. | ||
*/ | ||
return blockPatternsWithPostContentBlockType.filter( ( pattern ) => { | ||
return ( | ||
( postType === 'page' && ! pattern.postTypes ) || | ||
( Array.isArray( pattern.postTypes ) && | ||
pattern.postTypes.includes( postType ) ) | ||
); | ||
} ); | ||
}, [ postType, blockPatternsWithPostContentBlockType ] ); | ||
} | ||
|
||
function PatternSelection( { blockPatterns, onChoosePattern } ) { | ||
const { editEntityRecord } = useDispatch( coreStore ); | ||
const { postType, postId } = useSelect( ( select ) => { | ||
const { getCurrentPostType, getCurrentPostId } = select( editorStore ); | ||
|
||
return { | ||
postType: getCurrentPostType(), | ||
postId: getCurrentPostId(), | ||
}; | ||
}, [] ); | ||
return ( | ||
<BlockPatternsList | ||
blockPatterns={ blockPatterns } | ||
onClickPattern={ ( _pattern, blocks ) => { | ||
editEntityRecord( 'postType', postType, postId, { | ||
blocks, | ||
content: ( { blocks: blocksForSerialization = [] } ) => | ||
__unstableSerializeAndClean( blocksForSerialization ), | ||
} ); | ||
onChoosePattern(); | ||
} } | ||
/> | ||
); | ||
} | ||
|
||
function StartPageOptionsModal( { onClose } ) { | ||
const startPatterns = useStartPatterns(); | ||
const hasStartPattern = startPatterns.length > 0; | ||
|
||
if ( ! hasStartPattern ) { | ||
return null; | ||
} | ||
|
||
return ( | ||
<Modal | ||
title={ __( 'Choose a pattern' ) } | ||
isFullScreen | ||
onRequestClose={ onClose } | ||
> | ||
<div className="editor-start-page-options__modal-content"> | ||
<PatternSelection | ||
blockPatterns={ startPatterns } | ||
onChoosePattern={ onClose } | ||
/> | ||
</div> | ||
</Modal> | ||
); | ||
} | ||
|
||
export default function StartPageOptions() { | ||
const [ isClosed, setIsClosed ] = useState( false ); | ||
const shouldEnableModal = useSelect( ( select ) => { | ||
const { isEditedPostDirty, isEditedPostEmpty, getCurrentPostType } = | ||
select( editorStore ); | ||
const { postId, shouldEnable } = useSelect( ( select ) => { | ||
const { | ||
isEditedPostDirty, | ||
isEditedPostEmpty, | ||
getCurrentPostId, | ||
getCurrentPostType, | ||
} = select( editorStore ); | ||
const preferencesModalActive = | ||
select( interfaceStore ).isModalActive( 'editor/preferences' ); | ||
const choosePatternModalEnabled = select( preferencesStore ).get( | ||
'core', | ||
'enableChoosePatternModal' | ||
); | ||
return ( | ||
choosePatternModalEnabled && | ||
! preferencesModalActive && | ||
! isEditedPostDirty() && | ||
isEditedPostEmpty() && | ||
TEMPLATE_POST_TYPE !== getCurrentPostType() | ||
); | ||
return { | ||
postId: getCurrentPostId(), | ||
shouldEnable: | ||
choosePatternModalEnabled && | ||
! preferencesModalActive && | ||
! isEditedPostDirty() && | ||
isEditedPostEmpty() && | ||
'page' === getCurrentPostType(), | ||
}; | ||
}, [] ); | ||
const { setIsInserterOpened } = useDispatch( editorStore ); | ||
|
||
useEffect( () => { | ||
if ( shouldEnable ) { | ||
setIsInserterOpened( { | ||
tab: 'patterns', | ||
category: 'core/starter-content', | ||
} ); | ||
} | ||
}, [ postId, shouldEnable, setIsInserterOpened ] ); | ||
|
||
if ( ! shouldEnableModal || isClosed ) { | ||
return null; | ||
} | ||
|
||
return <StartPageOptionsModal onClose={ () => setIsClosed( true ) } />; | ||
return null; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
1185005
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Flaky tests detected in 1185005.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.
🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/12433111235
📝 Reported issues:
/test/e2e/specs/site-editor/dataviews-list-layout-keyboard.spec.js