From 6100ac34b2a0b2e6f5c555acb7d9d7efbc57f45a Mon Sep 17 00:00:00 2001
From: Ben Dwyer <ben@scruffian.com>
Date: Wed, 16 Nov 2022 16:40:10 +0000
Subject: [PATCH] Navigation: Reduce duplicate code (#45779)

---
 .../src/navigation/edit/index.js              | 160 +++++-------------
 1 file changed, 47 insertions(+), 113 deletions(-)

diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
index e15619a2cc74d..6cf5eea22e0a0 100644
--- a/packages/block-library/src/navigation/edit/index.js
+++ b/packages/block-library/src/navigation/edit/index.js
@@ -693,48 +693,54 @@ function Navigation( {
 	const isManageMenusButtonDisabled =
 		! hasManagePermissions || ! hasResolvedNavigationMenus;
 
+	const MenuInspectorControls = ( { currentMenuId = null } ) => (
+		<InspectorControls>
+			<PanelBody
+				title={
+					isOffCanvasNavigationEditorEnabled ? null : __( 'Menu' )
+				}
+			>
+				{ isOffCanvasNavigationEditorEnabled ? (
+					<>
+						<HStack className="wp-block-navigation-off-canvas-editor__header">
+							<Heading
+								className="wp-block-navigation-off-canvas-editor__title"
+								level={ 2 }
+							>
+								{ __( 'Menu' ) }
+							</Heading>
+							<WrappedNavigationMenuSelector
+								currentMenuId={ currentMenuId }
+							/>
+						</HStack>
+						{ currentMenuId && isNavigationMenuMissing ? (
+							<p>{ __( 'Select or create a menu' ) }</p>
+						) : (
+							<OffCanvasEditor
+								blocks={ innerBlocks }
+								isExpanded={ true }
+								selectBlockInCanvas={ false }
+							/>
+						) }
+					</>
+				) : (
+					<>
+						<WrappedNavigationMenuSelector
+							currentMenuId={ currentMenuId }
+						/>
+						<ManageMenusButton
+							disabled={ isManageMenusButtonDisabled }
+						/>
+					</>
+				) }
+			</PanelBody>
+		</InspectorControls>
+	);
+
 	if ( hasUnsavedBlocks && ! isCreatingNavigationMenu ) {
 		return (
 			<TagName { ...blockProps }>
-				<InspectorControls>
-					<PanelBody
-						title={
-							isOffCanvasNavigationEditorEnabled
-								? null
-								: __( 'Menu' )
-						}
-					>
-						{ isOffCanvasNavigationEditorEnabled ? (
-							<>
-								<HStack className="wp-block-navigation-off-canvas-editor__header">
-									<Heading
-										className="wp-block-navigation-off-canvas-editor__title"
-										level={ 2 }
-									>
-										{ __( 'Menu' ) }
-									</Heading>
-									<WrappedNavigationMenuSelector
-										currentMenuId={ ref }
-									/>
-								</HStack>
-								<OffCanvasEditor
-									blocks={ innerBlocks }
-									isExpanded={ true }
-									selectBlockInCanvas={ false }
-								/>
-							</>
-						) : (
-							<>
-								<WrappedNavigationMenuSelector
-									currentMenuId={ ref }
-								/>
-								<ManageMenusButton
-									disabled={ isManageMenusButtonDisabled }
-								/>
-							</>
-						) }
-					</PanelBody>
-				</InspectorControls>
+				<MenuInspectorControls currentMenuId={ ref } />
 				{ stylingInspectorControls }
 				<ResponsiveWrapper
 					id={ clientId }
@@ -764,41 +770,7 @@ function Navigation( {
 	if ( ref && isNavigationMenuMissing ) {
 		return (
 			<TagName { ...blockProps }>
-				<InspectorControls>
-					<PanelBody
-						title={
-							isOffCanvasNavigationEditorEnabled
-								? null
-								: __( 'Menu' )
-						}
-					>
-						{ isOffCanvasNavigationEditorEnabled ? (
-							<>
-								<HStack className="wp-block-navigation-off-canvas-editor__header">
-									<Heading
-										className="wp-block-navigation-off-canvas-editor__title"
-										level={ 2 }
-									>
-										{ __( 'Menu' ) }
-									</Heading>
-									<WrappedNavigationMenuSelector
-										currentMenuId={ null }
-									/>
-								</HStack>
-								<p>Select or create a menu</p>
-							</>
-						) : (
-							<>
-								<WrappedNavigationMenuSelector
-									currentMenuId={ null }
-								/>
-								<ManageMenusButton
-									disabled={ isManageMenusButtonDisabled }
-								/>
-							</>
-						) }
-					</PanelBody>
-				</InspectorControls>
+				<MenuInspectorControls />
 				<Warning>
 					{ __(
 						'Navigation menu has been deleted or is unavailable. '
@@ -873,45 +845,7 @@ function Navigation( {
 	return (
 		<EntityProvider kind="postType" type="wp_navigation" id={ ref }>
 			<RecursionProvider uniqueId={ recursionId }>
-				<InspectorControls>
-					<PanelBody
-						title={
-							isOffCanvasNavigationEditorEnabled
-								? null
-								: __( 'Menu' )
-						}
-					>
-						{ isOffCanvasNavigationEditorEnabled ? (
-							<>
-								<HStack className="wp-block-navigation-off-canvas-editor__header">
-									<Heading
-										className="wp-block-navigation-off-canvas-editor__title"
-										level={ 2 }
-									>
-										{ __( 'Menu' ) }
-									</Heading>
-									<WrappedNavigationMenuSelector
-										currentMenuId={ ref }
-									/>
-								</HStack>
-								<OffCanvasEditor
-									blocks={ innerBlocks }
-									isExpanded={ true }
-									selectBlockInCanvas={ false }
-								/>
-							</>
-						) : (
-							<>
-								<WrappedNavigationMenuSelector
-									currentMenuId={ ref }
-								/>
-								<ManageMenusButton
-									disabled={ isManageMenusButtonDisabled }
-								/>
-							</>
-						) }
-					</PanelBody>
-				</InspectorControls>
+				<MenuInspectorControls currentMenuId={ ref } />
 				{ stylingInspectorControls }
 				{ isEntityAvailable && (
 					<InspectorControls __experimentalGroup="advanced">