From 9e5240db7e74b4aa100011900c3ab78673635b5c Mon Sep 17 00:00:00 2001
From: yogeshbhutkar <yogesh.bhutkar@rtcamp.com>
Date: Thu, 9 Jan 2025 15:42:41 +0530
Subject: [PATCH] Refactor: label updation logic to use refs

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

diff --git a/docs/reference-guides/core-blocks.md b/docs/reference-guides/core-blocks.md
index 20da4e74f322d2..0715b1e3547e2a 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, menuTitle, openSubmenusOnClick, overlayBackgroundColor, overlayMenu, overlayTextColor, ref, rgbBackgroundColor, rgbTextColor, showSubmenuIcon, templateLock, textColor
+-	**Attributes:** __unstableLocation, backgroundColor, customBackgroundColor, customOverlayBackgroundColor, customOverlayTextColor, customTextColor, hasIcon, icon, maxNestingLevel, 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 eac3511a3df430..c65e0c6224616e 100644
--- a/packages/block-library/src/navigation/block.json
+++ b/packages/block-library/src/navigation/block.json
@@ -24,9 +24,6 @@
 		"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 1fb2a50863f10a..ae7dd60bd0c5ba 100644
--- a/packages/block-library/src/navigation/edit/index.js
+++ b/packages/block-library/src/navigation/edit/index.js
@@ -205,7 +205,6 @@ function Navigation( {
 	__unstableLayoutClassNames: layoutClassNames,
 } ) {
 	const {
-		menuTitle,
 		openSubmenusOnClick,
 		overlayMenu,
 		showSubmenuIcon,
@@ -301,7 +300,6 @@ function Navigation( {
 		canUserCreateNavigationMenus,
 		isResolvingCanUserCreateNavigationMenus,
 		hasResolvedCanUserCreateNavigationMenus,
-		navigationMenu,
 	} = useNavigationMenu( ref );
 
 	const navMenuResolvedButMissing =
@@ -344,20 +342,6 @@ 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 3da6caac2d6e2f..250d3f85099a6c 100644
--- a/packages/block-library/src/navigation/index.js
+++ b/packages/block-library/src/navigation/index.js
@@ -3,6 +3,8 @@
  */
 import { __, sprintf } from '@wordpress/i18n';
 import { navigation as icon } from '@wordpress/icons';
+import { select } from '@wordpress/data';
+import { store as coreStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
@@ -52,12 +54,22 @@ export const settings = {
 	},
 	edit,
 	save,
-	__experimentalLabel: ( { menuTitle } ) => {
-		return menuTitle
+	__experimentalLabel: ( { ref } ) => {
+		if ( ! ref ) {
+			return __( 'Navigation' );
+		}
+
+		const navigation = select( coreStore ).getEntityRecord(
+			'postType',
+			'wp_navigation',
+			ref
+		);
+
+		return navigation?.title?.rendered
 			? sprintf(
 					/* translators: %s: menu title */
 					__( 'Navigation (%s)' ),
-					menuTitle
+					navigation.title.rendered
 			  )
 			: __( 'Navigation' );
 	},