remove the additional button from edit site

WordPress · Nov 18, 2022 · 9cbe8ac · 9cbe8ac
1 parent 21cb5d6
commit 9cbe8ac
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 64 deletions.
diff --git a/packages/edit-post/src/plugins/index.js b/packages/edit-post/src/plugins/index.js
@@ -14,6 +14,7 @@ import CopyContentMenuItem from './copy-content-menu-item';
 import KeyboardShortcutsHelpMenuItem from './keyboard-shortcuts-help-menu-item';
 import ToolsMoreMenuGroup from '../components/header/tools-more-menu-group';
 import WelcomeGuideMenuItem from './welcome-guide-menu-item';
+import NavigationEditMenuItem from './navigation-edit-menu-item';
 
 registerPlugin( 'edit-post', {
 	render() {
@@ -55,6 +56,7 @@ registerPlugin( 'edit-post', {
 						</>
 					) }
 				</ToolsMoreMenuGroup>
+				<NavigationEditMenuItem />
 			</>
 		);
 	},

diff --git a/packages/edit-post/src/plugins/navigation-edit-menu-item.js b/packages/edit-post/src/plugins/navigation-edit-menu-item.js
@@ -8,21 +8,45 @@ import {
 	__unstableBlockNameContext,
 } from '@wordpress/block-editor';
 import { ToolbarButton, ToolbarGroup } from '@wordpress/components';
-import { useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
 import { Fragment } from '@wordpress/element';
 import { ReusableBlocksMenuItems } from '@wordpress/reusable-blocks';
 import { __ } from '@wordpress/i18n';
 
 const NavMenuSidebarToggle = () => {
+ 	// Blocks can be loaded into both post and site editors.
+	// We use this to determine which editor we are in so that
+	// we can determine which inspector controls to open.
+	const {
+		isPostEditor,
+	} = useSelect(
+		( select ) => {
+			// eslint-disable-next-line @wordpress/data-no-store-string-literals
+			const editorSelectors = select( 'core/editor' );
+			return {
+				isPostEditor: !! editorSelectors.getEditedPostAttribute( 'type' )
+			};
+		}
+	);
+
 	// eslint-disable-next-line @wordpress/data-no-store-string-literals
 	const { openGeneralSidebar } = useDispatch( 'core/edit-post' );
+	// eslint-disable-next-line @wordpress/data-no-store-string-literals
+	const { enableComplementaryArea } = useDispatch( 'core/interface' );
+	const openBlockInspector = () => {
+		if ( isPostEditor ) {
+			openGeneralSidebar( 'edit-post/block' );
+		} else {
+			enableComplementaryArea( 'core/edit-site', 'edit-site/block-inspector' );
+		}
+	};
 
 	return (
 		<ToolbarGroup>
 			<ToolbarButton
 				className="components-toolbar__control"
 				label={ __( 'Open navigation list view' ) }
-				onClick={ () => openGeneralSidebar( 'edit-post/block' ) }
+				onClick={ openBlockInspector }
 			>
 				{ __( 'Edit' ) }
 			</ToolbarButton>

diff --git a/packages/edit-site/src/components/block-editor/index.js b/packages/edit-site/src/components/block-editor/index.js
@@ -7,27 +7,21 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 import { useSelect, useDispatch } from '@wordpress/data';
-import { useCallback, useMemo, useRef, Fragment } from '@wordpress/element';
+import { useCallback, useMemo, useRef } from '@wordpress/element';
 import { useEntityBlockEditor, store as coreStore } from '@wordpress/core-data';
 import {
 	BlockList,
 	BlockEditorProvider,
 	__experimentalLinkControl,
 	BlockInspector,
 	BlockTools,
-	__unstableBlockToolbarLastItem,
 	__unstableBlockSettingsMenuFirstItem,
 	__unstableUseTypingObserver as useTypingObserver,
 	BlockEditorKeyboardShortcuts,
 	store as blockEditorStore,
-	__unstableBlockNameContext,
 } from '@wordpress/block-editor';
 import { useMergeRefs, useViewportMatch } from '@wordpress/compose';
 import { ReusableBlocksMenuItems } from '@wordpress/reusable-blocks';
-import { listView } from '@wordpress/icons';
-import { ToolbarButton, ToolbarGroup } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
-import { store as interfaceStore } from '@wordpress/interface';
 
 /**
  * Internal dependencies
@@ -46,16 +40,8 @@ const LAYOUT = {
 	alignments: [],
 };
 
-const NAVIGATION_SIDEBAR_NAME = 'edit-site/navigation-menu';
-
 export default function BlockEditor( { setIsInserterOpen } ) {
-	const {
-		storedSettings,
-		templateType,
-		templateId,
-		page,
-		isNavigationSidebarOpen,
-	} = useSelect(
+	const { storedSettings, templateType, templateId, page } = useSelect(
 		( select ) => {
 			const { getSettings, getEditedPostType, getEditedPostId, getPage } =
 				select( editSiteStore );
@@ -65,10 +51,6 @@ export default function BlockEditor( { setIsInserterOpen } ) {
 				templateType: getEditedPostType(),
 				templateId: getEditedPostId(),
 				page: getPage(),
-				isNavigationSidebarOpen:
-					select( interfaceStore ).getActiveComplementaryArea(
-						editSiteStore.name
-					) === NAVIGATION_SIDEBAR_NAME,
 			};
 		},
 		[ setIsInserterOpen ]
@@ -141,14 +123,6 @@ export default function BlockEditor( { setIsInserterOpen } ) {
 		templateType
 	);
 	const { setPage } = useDispatch( editSiteStore );
-	const { enableComplementaryArea, disableComplementaryArea } =
-		useDispatch( interfaceStore );
-	const toggleNavigationSidebar = useCallback( () => {
-		const toggleComplementaryArea = isNavigationSidebarOpen
-			? disableComplementaryArea
-			: enableComplementaryArea;
-		toggleComplementaryArea( editSiteStore.name, NAVIGATION_SIDEBAR_NAME );
-	}, [ isNavigationSidebarOpen ] );
 	const contentRef = useRef();
 	const mergedRefs = useMergeRefs( [ contentRef, useTypingObserver() ] );
 	const isMobileViewport = useViewportMatch( 'small', '<' );
@@ -157,31 +131,6 @@ export default function BlockEditor( { setIsInserterOpen } ) {
 	const isTemplatePart = templateType === 'wp_template_part';
 	const hasBlocks = blocks.length !== 0;
 
-	const NavMenuSidebarToggle = () => (
-		<ToolbarGroup>
-			<ToolbarButton
-				className="components-toolbar__control"
-				label={
-					isNavigationSidebarOpen
-						? __( 'Close list view' )
-						: __( 'Open list view' )
-				}
-				onClick={ toggleNavigationSidebar }
-				icon={ listView }
-				isActive={ isNavigationSidebarOpen }
-			/>
-		</ToolbarGroup>
-	);
-
-	// Conditionally include NavMenu sidebar in Plugin only.
-	// Optimise for dead code elimination.
-	// See https://github.com/WordPress/gutenberg/blob/trunk/docs/how-to-guides/feature-flags.md#dead-code-elimination.
-	let MaybeNavMenuSidebarToggle = Fragment;
-
-	if ( process.env.IS_GUTENBERG_PLUGIN ) {
-		MaybeNavMenuSidebarToggle = NavMenuSidebarToggle;
-	}
-
 	return (
 		<BlockEditorProvider
 			settings={ settings }
@@ -244,15 +193,6 @@ export default function BlockEditor( { setIsInserterOpen } ) {
 						<BlockInspectorButton onClick={ onClose } />
 					) }
 				</__unstableBlockSettingsMenuFirstItem>
-				<__unstableBlockToolbarLastItem>
-					<__unstableBlockNameContext.Consumer>
-						{ ( blockName ) =>
-							blockName === 'core/navigation' && (
-								<MaybeNavMenuSidebarToggle />
-							)
-						}
-					</__unstableBlockNameContext.Consumer>
-				</__unstableBlockToolbarLastItem>
 			</BlockTools>
 			<ReusableBlocksMenuItems />
 		</BlockEditorProvider>