From 54b93645a0a20653735330ab496081fe12044c7d Mon Sep 17 00:00:00 2001
From: yogeshbhutkar <yogesh.bhutkar@rtcamp.com>
Date: Wed, 1 Jan 2025 14:48:16 +0530
Subject: [PATCH] Add menuTitle attribute to navigation block and update label
 display

---
 docs/reference-guides/core-blocks.md             |  2 +-
 packages/block-library/src/navigation/block.json |  3 +++
 .../block-library/src/navigation/edit/index.js   | 16 ++++++++++++++++
 packages/block-library/src/navigation/index.js   | 11 ++++++++++-
 4 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md
index 0715b1e3547e2a..20da4e74f322d2 100644
--- a/docs/reference-guides/core-blocks.md
+++ b/docs/reference-guides/core-blocks.md
@@ -473,7 +473,7 @@ A collection of blocks that allow visitors to get around your site. ([Source](ht
 -	**Category:** theme
 -	**Allowed Blocks:** core/navigation-link, core/search, core/social-links, core/page-list, core/spacer, core/home-link, core/site-title, core/site-logo, core/navigation-submenu, core/loginout, core/buttons
 -	**Supports:** align (full, wide), ariaLabel, inserter, interactivity, layout (allowSizingOnChildren, default, ~~allowInheriting~~, ~~allowSwitching~~, ~~allowVerticalAlignment~~), spacing (blockGap, units), typography (fontSize, lineHeight), ~~html~~, ~~renaming~~
--	**Attributes:** __unstableLocation, backgroundColor, customBackgroundColor, customOverlayBackgroundColor, customOverlayTextColor, customTextColor, hasIcon, icon, maxNestingLevel, openSubmenusOnClick, overlayBackgroundColor, overlayMenu, overlayTextColor, ref, rgbBackgroundColor, rgbTextColor, showSubmenuIcon, templateLock, textColor
+-	**Attributes:** __unstableLocation, backgroundColor, customBackgroundColor, customOverlayBackgroundColor, customOverlayTextColor, customTextColor, hasIcon, icon, maxNestingLevel, menuTitle, openSubmenusOnClick, overlayBackgroundColor, overlayMenu, overlayTextColor, ref, rgbBackgroundColor, rgbTextColor, showSubmenuIcon, templateLock, textColor
 
 ## Custom Link
 
diff --git a/packages/block-library/src/navigation/block.json b/packages/block-library/src/navigation/block.json
index c65e0c6224616e..eac3511a3df430 100644
--- a/packages/block-library/src/navigation/block.json
+++ b/packages/block-library/src/navigation/block.json
@@ -24,6 +24,9 @@
 		"ref": {
 			"type": "number"
 		},
+		"menuTitle": {
+			"type": "string"
+		},
 		"textColor": {
 			"type": "string"
 		},
diff --git a/packages/block-library/src/navigation/edit/index.js b/packages/block-library/src/navigation/edit/index.js
index ae7dd60bd0c5ba..1fb2a50863f10a 100644
--- a/packages/block-library/src/navigation/edit/index.js
+++ b/packages/block-library/src/navigation/edit/index.js
@@ -205,6 +205,7 @@ function Navigation( {
 	__unstableLayoutClassNames: layoutClassNames,
 } ) {
 	const {
+		menuTitle,
 		openSubmenusOnClick,
 		overlayMenu,
 		showSubmenuIcon,
@@ -300,6 +301,7 @@ function Navigation( {
 		canUserCreateNavigationMenus,
 		isResolvingCanUserCreateNavigationMenus,
 		hasResolvedCanUserCreateNavigationMenus,
+		navigationMenu,
 	} = useNavigationMenu( ref );
 
 	const navMenuResolvedButMissing =
@@ -342,6 +344,20 @@ function Navigation( {
 		? getNavigationFallbackId()
 		: null;
 
+	const initializeMenuTitle = useCallback( () => {
+		const { title: navTitle } = navigationMenu || {};
+
+		if ( ! menuTitle || ! navTitle || menuTitle === navTitle ) {
+			return;
+		}
+
+		setAttributes( { menuTitle: navTitle } );
+	}, [ navigationMenu, menuTitle, setAttributes ] );
+
+	useEffect( () => {
+		initializeMenuTitle();
+	}, [ initializeMenuTitle ] );
+
 	useEffect( () => {
 		// If:
 		// - there is an existing menu, OR
diff --git a/packages/block-library/src/navigation/index.js b/packages/block-library/src/navigation/index.js
index d0405be794ffe8..3da6caac2d6e2f 100644
--- a/packages/block-library/src/navigation/index.js
+++ b/packages/block-library/src/navigation/index.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
 import { navigation as icon } from '@wordpress/icons';
 
 /**
@@ -52,6 +52,15 @@ export const settings = {
 	},
 	edit,
 	save,
+	__experimentalLabel: ( { menuTitle } ) => {
+		return menuTitle
+			? sprintf(
+					/* translators: %s: menu title */
+					__( 'Navigation (%s)' ),
+					menuTitle
+			  )
+			: __( 'Navigation' );
+	},
 	deprecated,
 };