Add save shortcut for navigation menu screen (#21342)

* Add save shortcut for navigation menu screen

* Remove option that is not an option

* Update package lock to reflect new keyboard shortcuts dependency

packages/edit-navigation/package.json

@@ -33,6 +33,7 @@
 		"@wordpress/element": "file:../element",
 		"@wordpress/hooks": "file:../hooks",
 		"@wordpress/i18n": "file:../i18n",
+		"@wordpress/keyboard-shortcuts": "file:../keyboard-shortcuts",
 		"@wordpress/media-utils": "file:../media-utils",
 		"@wordpress/notices": "file:../notices",
 		"lodash": "^4.17.15",

packages/edit-navigation/src/components/menu-editor/index.js

@@ -16,13 +16,15 @@ import { Panel, PanelBody, Button } from '@wordpress/components';
  * Internal dependencies
  */
 import useNavigationBlocks from './use-navigation-blocks';
+import MenuEditorShortcuts from './shortcuts';
 
 export default function MenuEditor( { menuId, blockEditorSettings } ) {
 	const [ blocks, setBlocks, saveBlocks ] = useNavigationBlocks( menuId );
 
 	return (
 		<div className="edit-navigation-menu-editor">
 			<BlockEditorKeyboardShortcuts.Register />
+			<MenuEditorShortcuts.Register />
 
 			<BlockEditorProvider
 				value={ blocks }
@@ -34,6 +36,7 @@ export default function MenuEditor( { menuId, blockEditorSettings } ) {
 				} }
 			>
 				<BlockEditorKeyboardShortcuts />
+				<MenuEditorShortcuts saveBlocks={ saveBlocks } />
 				<Panel className="edit-navigation-menu-editor__panel">
 					<PanelBody title={ __( 'Navigation structure' ) }>
 						{ !! blocks.length && (

packages/edit-navigation/src/components/menu-editor/shortcuts.js

@@ -0,0 +1,43 @@
+/**
+ * WordPress dependencies
+ */
+import { useEffect, useCallback } from '@wordpress/element';
+import { useDispatch } from '@wordpress/data';
+import { useShortcut } from '@wordpress/keyboard-shortcuts';
+import { __ } from '@wordpress/i18n';
+
+function MenuEditorShortcuts( { saveBlocks } ) {
+	useShortcut(
+		'core/edit-navigation/save-menu',
+		useCallback( ( event ) => {
+			event.preventDefault();
+			saveBlocks();
+		} ),
+		{
+			bindGlobal: true,
+		}
+	);
+
+	return null;
+}
+
+function RegisterMenuEditorShortcuts() {
+	const { registerShortcut } = useDispatch( 'core/keyboard-shortcuts' );
+	useEffect( () => {
+		registerShortcut( {
+			name: 'core/edit-navigation/save-menu',
+			category: 'global',
+			description: __( 'Save the menu currently being edited.' ),
+			keyCombination: {
+				modifier: 'primary',
+				character: 's',
+			},
+		} );
+	}, [ registerShortcut ] );
+
+	return null;
+}
+
+MenuEditorShortcuts.Register = RegisterMenuEditorShortcuts;
+
+export default MenuEditorShortcuts;