Navigation Screen: Decode entities in the menu names (#34263)

* Navigation Screen: Decode entities in the menu names * Fix menu switcher
WordPress · Aug 27, 2021 · 23bd592 · 23bd592
1 parent be41e01
commit 23bd592
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 7 deletions.
diff --git a/packages/edit-navigation/src/components/header/index.js b/packages/edit-navigation/src/components/header/index.js
@@ -4,6 +4,7 @@
 import { DropdownMenu } from '@wordpress/components';
 import { PinnedItems } from '@wordpress/interface';
 import { __, sprintf } from '@wordpress/i18n';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -42,7 +43,7 @@ export default function Header( {
 				{ __( 'Navigation' ) }
 			</h1>
 			<h2 className="edit-navigation-header__subtitle">
-				{ isMenuSelected && actionHeaderText }
+				{ isMenuSelected && decodeEntities( actionHeaderText ) }
 			</h2>
 			{ isMenuSelected && (
 				<div className="edit-navigation-header__actions">

diff --git a/packages/edit-navigation/src/components/menu-switcher/index.js b/packages/edit-navigation/src/components/menu-switcher/index.js
@@ -14,6 +14,7 @@ import {
 } from '@wordpress/components';
 import { useState } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -37,7 +38,7 @@ export default function MenuSwitcher( {
 					onSelect={ onSelectMenu }
 					choices={ menus.map( ( { id, name } ) => ( {
 						value: id,
-						label: name,
+						label: decodeEntities( name ),
 						'aria-label': sprintf(
 							/* translators: %s: The name of a menu. */
 							__( "Switch to '%s'" ),

diff --git a/packages/edit-navigation/src/components/name-display/index.js b/packages/edit-navigation/src/components/name-display/index.js
@@ -7,6 +7,7 @@ import { BlockControls } from '@wordpress/block-editor';
 import { useDispatch } from '@wordpress/data';
 import { store as interfaceStore } from '@wordpress/interface';
 import { sprintf, __ } from '@wordpress/i18n';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -27,7 +28,7 @@ export default function NameDisplay() {
 		IsMenuNameControlFocusedContext
 	);
 
-	const menuName = name ?? untitledMenu;
+	const menuName = decodeEntities( name ?? untitledMenu );
 
 	return (
 		<BlockControls>

diff --git a/packages/edit-navigation/src/components/name-editor/index.js b/packages/edit-navigation/src/components/name-editor/index.js
@@ -4,6 +4,7 @@
 import { __ } from '@wordpress/i18n';
 import { TextControl } from '@wordpress/components';
 import { useEffect, useRef, useContext } from '@wordpress/element';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -36,7 +37,7 @@ export function NameEditor() {
 			label={ __( 'Name' ) }
 			onBlur={ () => setIsMenuNameEditFocused( false ) }
 			className="edit-navigation-name-editor__text-control"
-			value={ name || '' }
+			value={ decodeEntities( name || '' ) }
 			onChange={ setName }
 		/>
 	);

diff --git a/packages/edit-navigation/src/components/sidebar/manage-locations.js b/packages/edit-navigation/src/components/sidebar/manage-locations.js
@@ -11,6 +11,7 @@ import {
 	Spinner,
 	SelectControl,
 } from '@wordpress/components';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -82,7 +83,7 @@ export default function ManageLocations( {
 							sprintf(
 								// translators: menu name.
 								__( 'Currently using %s' ),
-								menuOnLocation.name
+								decodeEntities( menuOnLocation.name )
 							)
 						}
 					/>
@@ -101,13 +102,13 @@ export default function ManageLocations( {
 				className="edit-navigation-manage-locations__select-menu"
 				label={ menuLocation.description }
 				labelPosition="top"
-				value={ menuLocation.menu }
+				value={ decodeEntities( menuLocation.menu ) }
 				options={ [
 					{ value: 0, label: __( 'Select a Menu' ), key: 0 },
 					...menus.map( ( { id, name } ) => ( {
 						key: id,
 						value: id,
-						label: name,
+						label: decodeEntities( name ),
 					} ) ),
 				] }
 				onChange={ ( menuId ) => {