diff --git a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js index 00cbf3b021f877..ccc0b92a211ba2 100644 --- a/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js +++ b/packages/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js @@ -7,7 +7,9 @@ import { BlockList, BlockTools, } from '@wordpress/block-editor'; -import { useSelect } from '@wordpress/data'; +import { useDispatch, useSelect } from '@wordpress/data'; +import { createBlock } from '@wordpress/blocks'; +import { useCallback } from '@wordpress/element'; /** * Internal dependencies @@ -30,9 +32,29 @@ export default function NavigationMenuContent( { rootClientId, onSelect } ) { }, [ rootClientId ] ); + const { replaceBlock, __unstableMarkNextChangeAsNotPersistent } = + useDispatch( blockEditorStore ); const { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis ); + const offCanvasOnselect = useCallback( + ( block ) => { + if ( + block.name === 'core/navigation-link' && + ! block.attributes.url + ) { + __unstableMarkNextChangeAsNotPersistent(); + replaceBlock( + block.clientId, + createBlock( 'core/navigation-link', block.attributes ) + ); + } else { + onSelect( block ); + } + }, + [ onSelect, __unstableMarkNextChangeAsNotPersistent, replaceBlock ] + ); + // The hidden block is needed because it makes block edit side effects trigger. // For example a navigation page list load its items has an effect on edit to load its items. return ( @@ -41,12 +63,12 @@ export default function NavigationMenuContent( { rootClientId, onSelect } ) { { ! isLoading && ( ) } -
+