Return a promise that resolves to the converted navigation menu from …

…the convertClassicMenu function (#43081)
WordPress · Aug 15, 2022 · 390167c · 390167c
1 parent 9031960
commit 390167c
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 55 deletions.
diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
@@ -231,10 +231,9 @@ function Navigation( {
 	const isDraftNavigationMenu = navigationMenu?.status === 'draft';
 
 	const {
-		convert,
+		convert: convertClassicMenu,
 		status: classicMenuConversionStatus,
 		error: classicMenuConversionError,
-		value: classicMenuConversionResult,
 	} = useConvertClassicToBlockMenu( clientId );
 
 	const isConvertingClassicMenu =
@@ -328,11 +327,7 @@ function Navigation( {
 			speak( __( 'Classic menu importing.' ) );
 		}
 
-		if (
-			classicMenuConversionStatus === CLASSIC_MENU_CONVERSION_SUCCESS &&
-			classicMenuConversionResult
-		) {
-			handleUpdateMenu( classicMenuConversionResult?.id );
+		if ( classicMenuConversionStatus === CLASSIC_MENU_CONVERSION_SUCCESS ) {
 			showClassicMenuConversionNotice(
 				__( 'Classic menu imported successfully.' )
 			);
@@ -343,11 +338,7 @@ function Navigation( {
 				__( 'Classic menu import failed.' )
 			);
 		}
-	}, [
-		classicMenuConversionStatus,
-		classicMenuConversionResult,
-		classicMenuConversionError,
-	] );
+	}, [ classicMenuConversionStatus, classicMenuConversionError ] );
 
 	// Spacer block needs orientation from context. This is a patch until
 	// https://github.com/WordPress/gutenberg/issues/36197 is addressed.
@@ -681,9 +672,15 @@ function Navigation( {
 						handleUpdateMenu( menuId );
 						setShouldFocusNavigationSelector( true );
 					} }
-					onSelectClassicMenu={ ( classicMenu ) => {
-						convert( classicMenu.id, classicMenu.name );
-						setShouldFocusNavigationSelector( true );
+					onSelectClassicMenu={ async ( classicMenu ) => {
+						const navMenu = await convertClassicMenu(
+							classicMenu.id,
+							classicMenu.name
+						);
+						if ( navMenu ) {
+							handleUpdateMenu( navMenu.id );
+							setShouldFocusNavigationSelector( true );
+						}
 					} }
 					onCreateEmpty={ () => createNavigationMenu( '', [] ) }
 				/>
@@ -705,9 +702,17 @@ function Navigation( {
 									handleUpdateMenu( menuId );
 									setShouldFocusNavigationSelector( true );
 								} }
-								onSelectClassicMenu={ ( classicMenu ) => {
-									convert( classicMenu.id, classicMenu.name );
-									setShouldFocusNavigationSelector( true );
+								onSelectClassicMenu={ async ( classicMenu ) => {
+									const navMenu = await convertClassicMenu(
+										classicMenu.id,
+										classicMenu.name
+									);
+									if ( navMenu ) {
+										handleUpdateMenu( navMenu.id );
+										setShouldFocusNavigationSelector(
+											true
+										);
+									}
 								} }
 								onCreateNew={ resetToEmptyBlock }
 								/* translators: %s: The name of a menu. */

diff --git a/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js b/packages/block-library/src/navigation/edit/use-convert-classic-menu-to-block-menu.js
@@ -23,7 +23,6 @@ function useConvertClassicToBlockMenu( clientId ) {
 	const registry = useRegistry();
 
 	const [ status, setStatus ] = useState( CLASSIC_MENU_CONVERSION_IDLE );
-	const [ value, setValue ] = useState( null );
 	const [ error, setError ] = useState( null );
 
 	async function convertClassicMenuToBlockMenu( menuId, menuName ) {
@@ -88,47 +87,42 @@ function useConvertClassicToBlockMenu( clientId ) {
 		return navigationMenu;
 	}
 
-	const convert = useCallback(
-		( menuId, menuName ) => {
-			if ( ! menuId || ! menuName ) {
-				setError( 'Unable to convert menu. Missing menu details.' );
+	const convert = useCallback( async ( menuId, menuName ) => {
+		if ( ! menuId || ! menuName ) {
+			setError( 'Unable to convert menu. Missing menu details.' );
+			setStatus( CLASSIC_MENU_CONVERSION_ERROR );
+			return;
+		}
+
+		setStatus( CLASSIC_MENU_CONVERSION_PENDING );
+		setError( null );
+
+		return await convertClassicMenuToBlockMenu( menuId, menuName )
+			.then( ( navigationMenu ) => {
+				setStatus( CLASSIC_MENU_CONVERSION_SUCCESS );
+				return navigationMenu;
+			} )
+			.catch( ( err ) => {
+				setError( err?.message );
 				setStatus( CLASSIC_MENU_CONVERSION_ERROR );
-				return;
-			}
-
-			setStatus( CLASSIC_MENU_CONVERSION_PENDING );
-			setValue( null );
-			setError( null );
-
-			convertClassicMenuToBlockMenu( menuId, menuName )
-				.then( ( navMenu ) => {
-					setValue( navMenu );
-					setStatus( CLASSIC_MENU_CONVERSION_SUCCESS );
-				} )
-				.catch( ( err ) => {
-					setError( err?.message );
-					setStatus( CLASSIC_MENU_CONVERSION_ERROR );
-
-					// Rethrow error for debugging.
-					throw new Error(
-						sprintf(
-							// translators: %s: the name of a menu (e.g. Header navigation).
-							__( `Unable to create Navigation Menu "%s".` ),
-							menuName
-						),
-						{
-							cause: err,
-						}
-					);
-				} );
-		},
-		[ clientId ]
-	);
+
+				// Rethrow error for debugging.
+				throw new Error(
+					sprintf(
+						// translators: %s: the name of a menu (e.g. Header navigation).
+						__( `Unable to create Navigation Menu "%s".` ),
+						menuName
+					),
+					{
+						cause: err,
+					}
+				);
+			} );
+	}, [] );
 
 	return {
 		convert,
 		status,
-		value,
 		error,
 	};
 }