@wordpress/edit-post 7.29.0 → 7.30.0

package/src/components/header/index.js

@@ -8,6 +8,7 @@ import classnames from 'classnames';
  */
 import {
 	BlockToolbar,
+	privateApis as blockEditorPrivateApis,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
 import {
@@ -40,6 +41,7 @@ import MainDashboardButton from './main-dashboard-button';
 import { store as editPostStore } from '../../store';
 import { unlock } from '../../lock-unlock';
 
+const { useShowBlockTools } = unlock( blockEditorPrivateApis );
 const { DocumentTools, PostViewLink, PreviewDropdown } =
 	unlock( editorPrivateApis );
 
@@ -61,9 +63,8 @@ function Header( { setEntitiesSavedStatesCallback, initialPost } ) {
 	const blockToolbarRef = useRef();
 	const {
 		isTextEditor,
-		hasBlockSelection,
+		blockSelectionStart,
 		hasActiveMetaboxes,
-		hasFixedToolbar,
 		isPublishSidebarOpened,
 		showIconLabels,
 		hasHistory,
@@ -73,28 +74,31 @@ function Header( { setEntitiesSavedStatesCallback, initialPost } ) {
 
 		return {
 			isTextEditor: getEditorMode() === 'text',
-			hasBlockSelection:
-				!! select( blockEditorStore ).getBlockSelectionStart(),
+			blockSelectionStart:
+				select( blockEditorStore ).getBlockSelectionStart(),
 			hasActiveMetaboxes: select( editPostStore ).hasMetaBoxes(),
 			hasHistory:
 				!! select( editorStore ).getEditorSettings()
 					.onNavigateToPreviousEntityRecord,
 			isPublishSidebarOpened:
 				select( editPostStore ).isPublishSidebarOpened(),
-			hasFixedToolbar: getPreference( 'core', 'fixedToolbar' ),
 			showIconLabels: getPreference( 'core', 'showIconLabels' ),
 		};
 	}, [] );
 
+	const { showFixedToolbar } = useShowBlockTools();
+	const showTopToolbar = isLargeViewport && showFixedToolbar;
+
 	const [ isBlockToolsCollapsed, setIsBlockToolsCollapsed ] =
 		useState( true );
+	const hasBlockSelection = !! blockSelectionStart;
 
 	useEffect( () => {
 		// If we have a new block selection, show the block tools
-		if ( hasBlockSelection ) {
+		if ( blockSelectionStart ) {
 			setIsBlockToolsCollapsed( false );
 		}
-	}, [ hasBlockSelection ] );
+	}, [ blockSelectionStart ] );
 
 	return (
 		<div className="edit-post-header">
@@ -115,13 +119,15 @@ function Header( { setEntitiesSavedStatesCallback, initialPost } ) {
 				className="edit-post-header__toolbar"
 			>
 				<DocumentTools disableBlockTools={ isTextEditor } />
-				{ hasFixedToolbar && isLargeViewport && (
+				{ showTopToolbar && (
 					<>
 						<div
 							className={ classnames(
 								'selected-block-tools-wrapper',
 								{
-									'is-collapsed': isBlockToolsCollapsed,
+									'is-collapsed':
+										isBlockToolsCollapsed ||
+										! hasBlockSelection,
 								}
 							) }
 						>
@@ -131,32 +137,29 @@ function Header( { setEntitiesSavedStatesCallback, initialPost } ) {
 							ref={ blockToolbarRef }
 							name="block-toolbar"
 						/>
-						{ hasBlockSelection && (
-							<Button
-								className="edit-post-header__block-tools-toggle"
-								icon={ isBlockToolsCollapsed ? next : previous }
-								onClick={ () => {
-									setIsBlockToolsCollapsed(
-										( collapsed ) => ! collapsed
-									);
-								} }
-								label={
-									isBlockToolsCollapsed
-										? __( 'Show block tools' )
-										: __( 'Hide block tools' )
-								}
-							/>
-						) }
+						<Button
+							className="edit-post-header__block-tools-toggle"
+							icon={ isBlockToolsCollapsed ? next : previous }
+							onClick={ () => {
+								setIsBlockToolsCollapsed(
+									( collapsed ) => ! collapsed
+								);
+							} }
+							label={
+								isBlockToolsCollapsed
+									? __( 'Show block tools' )
+									: __( 'Hide block tools' )
+							}
+							size="compact"
+						/>
 					</>
 				) }
 				<div
 					className={ classnames( 'edit-post-header__center', {
 						'is-collapsed':
 							hasHistory &&
-							hasBlockSelection &&
 							! isBlockToolsCollapsed &&
-							hasFixedToolbar &&
-							isLargeViewport,
+							showTopToolbar,
 					} ) }
 				>
 					{ hasHistory && <DocumentBar /> }

package/src/components/header/more-menu/index.js

@@ -2,14 +2,11 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { MenuGroup } from '@wordpress/components';
-import {
-	ActionItem,
-	MoreMenuDropdown,
-	PinnedItems,
-} from '@wordpress/interface';
+import { MenuGroup, DropdownMenu } from '@wordpress/components';
+import { ActionItem, PinnedItems } from '@wordpress/interface';
 import { useViewportMatch } from '@wordpress/compose';
 import { privateApis as editorPrivateApis } from '@wordpress/editor';
+import { moreVertical } from '@wordpress/icons';
 
 /**
  * Internal dependencies
@@ -25,10 +22,17 @@ const MoreMenu = ( { showIconLabels } ) => {
 	const isLargeViewport = useViewportMatch( 'large' );
 
 	return (
-		<MoreMenuDropdown
+		<DropdownMenu
+			icon={ moreVertical }
+			label={ __( 'Options' ) }
+			popoverProps={ {
+				placement: 'bottom-end',
+				className: 'more-menu-dropdown__content',
+			} }
 			toggleProps={ {
-				showTooltip: ! showIconLabels,
 				...( showIconLabels && { variant: 'tertiary' } ),
+				tooltipPosition: 'bottom',
+				showTooltip: ! showIconLabels,
 				size: 'compact',
 			} }
 		>
@@ -54,7 +58,7 @@ const MoreMenu = ( { showIconLabels } ) => {
 					</MenuGroup>
 				</>
 			) }
-		</MoreMenuDropdown>
+		</DropdownMenu>
 	);
 };
 

package/src/components/header/style.scss

@@ -322,3 +322,7 @@
 		z-index: 35;
 	}
 }
+
+.components-popover.more-menu-dropdown__content {
+	z-index: z-index(".components-popover.more-menu__content");
+}

package/src/components/header/test/index.js

@@ -10,19 +10,14 @@ import { PostPublishButtonOrToggle } from '../post-publish-button-or-toggle';
 
 describe( 'PostPublishButtonOrToggle should render a', () => {
 	it( 'button when the post is published (1)', () => {
-		render( <PostPublishButtonOrToggle isPublished={ true } /> );
+		render( <PostPublishButtonOrToggle isPublished /> );
 		expect(
 			screen.getByRole( 'button', { name: 'Submit for Review' } )
 		).toBeVisible();
 	} );
 
 	it( 'button when the post is scheduled (2)', () => {
-		render(
-			<PostPublishButtonOrToggle
-				isScheduled={ true }
-				isBeingScheduled={ true }
-			/>
-		);
+		render( <PostPublishButtonOrToggle isScheduled isBeingScheduled /> );
 		expect(
 			screen.getByRole( 'button', { name: 'Submit for Review' } )
 		).toBeVisible();
@@ -30,10 +25,7 @@ describe( 'PostPublishButtonOrToggle should render a', () => {
 
 	it( 'button when the post is pending and cannot be published but the viewport is >= medium (3)', () => {
 		render(
-			<PostPublishButtonOrToggle
-				isPending={ true }
-				hasPublishAction={ false }
-			/>
+			<PostPublishButtonOrToggle isPending hasPublishAction={ false } />
 		);
 
 		expect(
@@ -42,9 +34,7 @@ describe( 'PostPublishButtonOrToggle should render a', () => {
 	} );
 
 	it( 'toggle when post is not (1), (2), (3), the viewport is >= medium, and the publish sidebar is enabled', () => {
-		render(
-			<PostPublishButtonOrToggle isPublishSidebarEnabled={ true } />
-		);
+		render( <PostPublishButtonOrToggle isPublishSidebarEnabled /> );
 		expect(
 			screen.getByRole( 'button', { name: 'Publish' } )
 		).toBeVisible();

package/src/components/sidebar/plugin-post-publish-panel/test/index.js

@@ -20,7 +20,7 @@ describe( 'PluginPostPublishPanel', () => {
 				<PluginPostPublishPanel
 					className="my-plugin-post-publish-panel"
 					title="My panel title"
-					initialOpen={ true }
+					initialOpen
 				>
 					My panel content
 				</PluginPostPublishPanel>

package/src/editor.js

@@ -12,8 +12,6 @@ import { useMemo } from '@wordpress/element';
 import { SlotFillProvider } from '@wordpress/components';
 import { store as coreStore } from '@wordpress/core-data';
 import { CommandMenu } from '@wordpress/commands';
-import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
-import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
@@ -25,14 +23,6 @@ import { unlock } from './lock-unlock';
 import useNavigateToEntityRecord from './hooks/use-navigate-to-entity-record';
 
 const { ExperimentalEditorProvider } = unlock( editorPrivateApis );
-const { BlockRemovalWarningModal } = unlock( blockEditorPrivateApis );
-// Prevent accidental removal of certain blocks, asking the user for
-// confirmation.
-const blockRemovalRules = {
-	'bindings/core/pattern-overrides': __(
-		'Blocks from synced patterns that can have overriden content.'
-	),
-};
 
 function Editor( {
 	postId: initialPostId,
@@ -106,9 +96,8 @@ function Editor( {
 			>
 				<ErrorBoundary>
 					<CommandMenu />
-					<EditorInitialization postId={ currentPost.postId } />
+					<EditorInitialization />
 					<Layout initialPost={ initialPost } />
-					<BlockRemovalWarningModal rules={ blockRemovalRules } />
 				</ErrorBoundary>
 				<PostLockedModal />
 			</ExperimentalEditorProvider>

package/src/store/selectors.js

@@ -538,7 +538,7 @@ export const isEditingTemplate = createRegistrySelector( ( select ) => () => {
 		since: '6.5',
 		alternative: `select( 'core/editor' ).getRenderingMode`,
 	} );
-	return select( editorStore ).getCurrentPostType() !== 'post-only';
+	return select( editorStore ).getCurrentPostType() === 'wp_template';
 } );
 
 /**