Navigation Menu Selector: Define the functions needed for the Navigat…

…ionMenuSelector at a higher level so that they can be shared rather than declared twice (#46053)
WordPress · Nov 25, 2022 · 92aa6c8 · 92aa6c8
1 parent 643865b
commit 92aa6c8
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 44 deletions.
diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
@@ -393,6 +393,23 @@ function Navigation( {
 		}
 	};
 
+	const onSelectClassicMenu = async ( classicMenu ) => {
+		const navMenu = await convertClassicMenu(
+			classicMenu.id,
+			classicMenu.name,
+			'draft'
+		);
+		if ( navMenu ) {
+			handleUpdateMenu( navMenu.id, {
+				focusNavigationBlock: true,
+			} );
+		}
+	};
+
+	const onSelectNavigationMenu = ( menuId ) => {
+		handleUpdateMenu( menuId );
+	};
+
 	useEffect( () => {
 		hideClassicMenuConversionNotice();
 		if ( classicMenuConversionStatus === CLASSIC_MENU_CONVERSION_PENDING ) {
@@ -667,17 +684,17 @@ function Navigation( {
 		return (
 			<TagName { ...blockProps }>
 				<MenuInspectorControls
-					convertClassicMenu={ convertClassicMenu }
 					createNavigationMenuIsSuccess={
 						createNavigationMenuIsSuccess
 					}
 					createNavigationMenuIsError={ createNavigationMenuIsError }
 					currentMenuId={ ref }
-					handleUpdateMenu={ handleUpdateMenu }
 					isNavigationMenuMissing={ isNavigationMenuMissing }
 					innerBlocks={ innerBlocks }
 					isManageMenusButtonDisabled={ isManageMenusButtonDisabled }
 					onCreateNew={ createUntitledEmptyNavigationMenu }
+					onSelectClassicMenu={ onSelectClassicMenu }
+					onSelectNavigationMenu={ onSelectNavigationMenu }
 				/>
 				{ stylingInspectorControls }
 				<ResponsiveWrapper
@@ -709,16 +726,16 @@ function Navigation( {
 		return (
 			<TagName { ...blockProps }>
 				<MenuInspectorControls
-					convertClassicMenu={ convertClassicMenu }
 					createNavigationMenuIsSuccess={
 						createNavigationMenuIsSuccess
 					}
 					createNavigationMenuIsError={ createNavigationMenuIsError }
-					handleUpdateMenu={ handleUpdateMenu }
 					isNavigationMenuMissing={ isNavigationMenuMissing }
 					innerBlocks={ innerBlocks }
 					isManageMenusButtonDisabled={ isManageMenusButtonDisabled }
 					onCreateNew={ createUntitledEmptyNavigationMenu }
+					onSelectClassicMenu={ onSelectClassicMenu }
+					onSelectNavigationMenu={ onSelectNavigationMenu }
 				/>
 				<Warning>
 					{ __(
@@ -770,21 +787,8 @@ function Navigation( {
 					isResolvingCanUserCreateNavigationMenu={
 						isResolvingCanUserCreateNavigationMenu
 					}
-					onSelectNavigationMenu={ ( menuId ) => {
-						handleUpdateMenu( menuId );
-					} }
-					onSelectClassicMenu={ async ( classicMenu ) => {
-						const navMenu = await convertClassicMenu(
-							classicMenu.id,
-							classicMenu.name,
-							'draft'
-						);
-						if ( navMenu ) {
-							handleUpdateMenu( navMenu.id, {
-								focusNavigationBlock: true,
-							} );
-						}
-					} }
+					onSelectNavigationMenu={ onSelectNavigationMenu }
+					onSelectClassicMenu={ onSelectClassicMenu }
 					onCreateEmpty={ createUntitledEmptyNavigationMenu }
 				/>
 			</TagName>
@@ -795,17 +799,17 @@ function Navigation( {
 		<EntityProvider kind="postType" type="wp_navigation" id={ ref }>
 			<RecursionProvider uniqueId={ recursionId }>
 				<MenuInspectorControls
-					convertClassicMenu={ convertClassicMenu }
 					createNavigationMenuIsSuccess={
 						createNavigationMenuIsSuccess
 					}
 					createNavigationMenuIsError={ createNavigationMenuIsError }
 					currentMenuId={ ref }
-					handleUpdateMenu={ handleUpdateMenu }
 					isNavigationMenuMissing={ isNavigationMenuMissing }
 					innerBlocks={ innerBlocks }
 					isManageMenusButtonDisabled={ isManageMenusButtonDisabled }
 					onCreateNew={ createUntitledEmptyNavigationMenu }
+					onSelectClassicMenu={ onSelectClassicMenu }
+					onSelectNavigationMenu={ onSelectNavigationMenu }
 				/>
 				{ stylingInspectorControls }
 				{ isEntityAvailable && (

diff --git a/packages/block-library/src/navigation/edit/menu-inspector-controls.js b/packages/block-library/src/navigation/edit/menu-inspector-controls.js
@@ -20,29 +20,16 @@ import NavigationMenuSelector from './navigation-menu-selector';
 
 const WrappedNavigationMenuSelector = ( {
 	currentMenuId,
-	handleUpdateMenu,
-	convertClassicMenu,
 	onCreateNew,
 	createNavigationMenuIsSuccess,
 	createNavigationMenuIsError,
+	onSelectClassicMenu,
+	onSelectNavigationMenu,
 } ) => (
 	<NavigationMenuSelector
 		currentMenuId={ currentMenuId }
-		onSelectNavigationMenu={ ( menuId ) => {
-			handleUpdateMenu( menuId );
-		} }
-		onSelectClassicMenu={ async ( classicMenu ) => {
-			const navMenu = await convertClassicMenu(
-				classicMenu.id,
-				classicMenu.name,
-				'draft'
-			);
-			if ( navMenu ) {
-				handleUpdateMenu( navMenu.id, {
-					focusNavigationBlock: true,
-				} );
-			}
-		} }
+		onSelectNavigationMenu={ onSelectNavigationMenu }
+		onSelectClassicMenu={ onSelectClassicMenu }
 		onCreateNew={ onCreateNew }
 		createNavigationMenuIsSuccess={ createNavigationMenuIsSuccess }
 		createNavigationMenuIsError={ createNavigationMenuIsError }
@@ -51,15 +38,15 @@ const WrappedNavigationMenuSelector = ( {
 	/>
 );
 const MenuInspectorControls = ( {
-	convertClassicMenu,
 	createNavigationMenuIsSuccess,
 	createNavigationMenuIsError,
 	currentMenuId = null,
-	handleUpdateMenu,
 	isNavigationMenuMissing,
 	innerBlocks,
 	isManageMenusButtonDisabled,
 	onCreateNew,
+	onSelectClassicMenu,
+	onSelectNavigationMenu,
 } ) => {
 	const isOffCanvasNavigationEditorEnabled =
 		window?.__experimentalEnableOffCanvasNavigationEditor === true;
@@ -85,8 +72,10 @@ const MenuInspectorControls = ( {
 							</Heading>
 							<WrappedNavigationMenuSelector
 								currentMenuId={ currentMenuId }
-								handleUpdateMenu={ handleUpdateMenu }
-								convertClassicMenu={ convertClassicMenu }
+								onSelectClassicMenu={ onSelectClassicMenu }
+								onSelectNavigationMenu={
+									onSelectNavigationMenu
+								}
 								onCreateNew={ onCreateNew }
 								createNavigationMenuIsSuccess={
 									createNavigationMenuIsSuccess
@@ -110,8 +99,8 @@ const MenuInspectorControls = ( {
 					<>
 						<WrappedNavigationMenuSelector
 							currentMenuId={ currentMenuId }
-							handleUpdateMenu={ handleUpdateMenu }
-							convertClassicMenu={ convertClassicMenu }
+							onSelectClassicMenu={ onSelectClassicMenu }
+							onSelectNavigationMenu={ onSelectNavigationMenu }
 							onCreateNew={ onCreateNew }
 							createNavigationMenuIsSuccess={
 								createNavigationMenuIsSuccess