From 9567968663408437ba35e206c7cb95446405440e Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Wed, 14 Apr 2021 15:28:56 -0400 Subject: [PATCH 01/13] (Optionally) rendering classic navigation data source in Navigation Block --- .../block-library/src/navigation/block.json | 3 + .../block-library/src/navigation/index.php | 66 +++++++++++++++++-- 2 files changed, 65 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/navigation/block.json b/packages/block-library/src/navigation/block.json index 28c7d25a89ea6..41afad308ea5c 100644 --- a/packages/block-library/src/navigation/block.json +++ b/packages/block-library/src/navigation/block.json @@ -3,6 +3,9 @@ "name": "core/navigation", "category": "design", "attributes": { + "source": { + "type": "string" + }, "orientation": { "type": "string" }, diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index b1fe553df3b3f..e35917ad2190a 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -85,6 +85,58 @@ function block_core_navigation_build_css_font_sizes( $attributes ) { return $font_sizes; } +function get_classic_navigation_elements( $attributes ){ + + $has_data_source = array_key_exists( 'source', $attributes ); + + if( !$has_data_source ) { + return ''; + } + + $data_source_key = $attributes['source']; + + $classic_menu_html = wp_nav_menu( + array( + 'theme_location' => $data_source_key, + 'container' => '', + 'items_wrap' => '%3$s', + 'link_before' => '', + 'link_after' => '', + 'depth' => 0, + 'fallback_cb' => false, + 'echo' => false, + ) + ); + + //What follows is a fair bit of hacky stuff to transform the markup from a classic menu + //to the markup of a new menu. + $DOM = new DOMDocument(); + $DOM->loadHTML($classic_menu_html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD); + $xpath = new DOMXpath($DOM); + + $anchors = $DOM->getElementsByTagName('a'); + $listItems = $DOM->getElementsByTagName('li'); + $subMenus = $xpath->query("//ul[contains(@class,'sub-menu')]"); + $menuItemsWithChildren = $xpath->query("//li[contains(@class,'menu-item-has-children')]"); + + foreach($anchors as $anchor) { + $anchor->setAttribute( 'class', 'wp-block-navigation-link__content' ); + } + foreach($listItems as $listItem) { + $listItemClasses = $listItem->getAttribute( 'class' ); + $listItem->setAttribute( 'class', $listItemClasses . ' wp-block-navigation-link' ); + } + foreach($menuItemsWithChildren as $listItem) { + $listItemClasses = $listItem->getAttribute( 'class' ); + $listItem->setAttribute( 'class', $listItemClasses . ' has-child' ); + } + foreach($subMenus as $subMenu) { + $subMenu->setAttribute( 'class', 'wp-block-navigation-link__container'); + } + + return $DOM->saveHTML(); +} + /** * Returns the top-level submenu SVG chevron icon. * @@ -121,7 +173,9 @@ function render_block_core_navigation( $attributes, $content, $block ) { unset( $attributes['rgbTextColor'], $attributes['rgbBackgroundColor'] ); - if ( empty( $block->inner_blocks ) ) { + $classic_navigation_elements = get_classic_navigation_elements ( $attributes ); + + if ( empty( $block->inner_blocks ) && $classic_navigation_elements === '' ) { return ''; } @@ -134,9 +188,13 @@ function render_block_core_navigation( $attributes, $content, $block ) { isset( $attributes['itemsJustification'] ) ? array( 'items-justified-' . $attributes['itemsJustification'] ) : array() ); - $inner_blocks_html = ''; - foreach ( $block->inner_blocks as $inner_block ) { - $inner_blocks_html .= $inner_block->render(); + if ( empty( $block->inner_blocks ) ) { + $inner_blocks_html = $classic_navigation_elements; + } else { + $inner_blocks_html = ''; + foreach ( $block->inner_blocks as $inner_block ) { + $inner_blocks_html .= $inner_block->render(); + } } $block_styles = isset( $attributes['styles'] ) ? $attributes['styles'] : ''; From 1d0e4c6ade0f1df0ece38b41230611d0470a56a6 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Thu, 15 Apr 2021 13:30:22 -0400 Subject: [PATCH 02/13] Refactored to use 'block-nav-menus' --- .../block-library/src/navigation/index.php | 53 ++++--------------- 1 file changed, 11 insertions(+), 42 deletions(-) diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index e35917ad2190a..1048bfc7a6f44 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -87,54 +87,25 @@ function block_core_navigation_build_css_font_sizes( $attributes ) { function get_classic_navigation_elements( $attributes ){ - $has_data_source = array_key_exists( 'source', $attributes ); - if( !$has_data_source ) { + if ( ! current_theme_supports( 'block-nav-menus' ) ) { return ''; } - $data_source_key = $attributes['source']; + if( ! array_key_exists( 'source', $attributes ) ) { + return ''; + } - $classic_menu_html = wp_nav_menu( + //TODO: There are $attributes here that need to be communicated through to this call in some way (such as orientation, justification, etc) + return wp_nav_menu( array( - 'theme_location' => $data_source_key, - 'container' => '', - 'items_wrap' => '%3$s', - 'link_before' => '', - 'link_after' => '', - 'depth' => 0, + 'theme_location' => $attributes['source'], + 'container' => '', + 'items_wrap' => '%3$s', 'fallback_cb' => false, 'echo' => false, ) ); - - //What follows is a fair bit of hacky stuff to transform the markup from a classic menu - //to the markup of a new menu. - $DOM = new DOMDocument(); - $DOM->loadHTML($classic_menu_html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD); - $xpath = new DOMXpath($DOM); - - $anchors = $DOM->getElementsByTagName('a'); - $listItems = $DOM->getElementsByTagName('li'); - $subMenus = $xpath->query("//ul[contains(@class,'sub-menu')]"); - $menuItemsWithChildren = $xpath->query("//li[contains(@class,'menu-item-has-children')]"); - - foreach($anchors as $anchor) { - $anchor->setAttribute( 'class', 'wp-block-navigation-link__content' ); - } - foreach($listItems as $listItem) { - $listItemClasses = $listItem->getAttribute( 'class' ); - $listItem->setAttribute( 'class', $listItemClasses . ' wp-block-navigation-link' ); - } - foreach($menuItemsWithChildren as $listItem) { - $listItemClasses = $listItem->getAttribute( 'class' ); - $listItem->setAttribute( 'class', $listItemClasses . ' has-child' ); - } - foreach($subMenus as $subMenu) { - $subMenu->setAttribute( 'class', 'wp-block-navigation-link__container'); - } - - return $DOM->saveHTML(); } /** @@ -173,10 +144,8 @@ function render_block_core_navigation( $attributes, $content, $block ) { unset( $attributes['rgbTextColor'], $attributes['rgbBackgroundColor'] ); - $classic_navigation_elements = get_classic_navigation_elements ( $attributes ); - - if ( empty( $block->inner_blocks ) && $classic_navigation_elements === '' ) { - return ''; + if ( empty( $block->inner_blocks ) ) { + return get_classic_navigation_elements ( $attributes ); } $colors = block_core_navigation_build_css_colors( $attributes ); From 7f4d146242864d4fb046656c38a647168b16dc69 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Thu, 15 Apr 2021 13:34:14 -0400 Subject: [PATCH 03/13] Removed the 'wrapping' of navigation block (since it's done via 'block-nav-menus' magic instead) --- packages/block-library/src/navigation/index.php | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 1048bfc7a6f44..0c6bbab461bc4 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -157,13 +157,9 @@ function render_block_core_navigation( $attributes, $content, $block ) { isset( $attributes['itemsJustification'] ) ? array( 'items-justified-' . $attributes['itemsJustification'] ) : array() ); - if ( empty( $block->inner_blocks ) ) { - $inner_blocks_html = $classic_navigation_elements; - } else { - $inner_blocks_html = ''; - foreach ( $block->inner_blocks as $inner_block ) { - $inner_blocks_html .= $inner_block->render(); - } + $inner_blocks_html = ''; + foreach ( $block->inner_blocks as $inner_block ) { + $inner_blocks_html .= $inner_block->render(); } $block_styles = isset( $attributes['styles'] ) ? $attributes['styles'] : ''; From 8decddd02ba3f5d9810345afd7df2e5dc36c2fa7 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Thu, 15 Apr 2021 16:19:07 -0400 Subject: [PATCH 04/13] Passed block attributes through to the generated block. --- lib/navigation.php | 7 +++++- .../block-library/src/navigation/index.php | 23 +++++++++++++------ 2 files changed, 22 insertions(+), 8 deletions(-) diff --git a/lib/navigation.php b/lib/navigation.php index b1e7d21b03158..1ef1e190b50e9 100644 --- a/lib/navigation.php +++ b/lib/navigation.php @@ -299,9 +299,14 @@ function gutenberg_output_block_nav_menu( $output, $args ) { $menu_items_by_parent_id[ $menu_item->menu_item_parent ][] = $menu_item; } + $block_attributes = array(); + if( isset( $args->block_attributes ) ) { + $block_attributes = $args->block_attributes; + } + $navigation_block = array( 'blockName' => 'core/navigation', - 'attrs' => array(), + 'attrs' => $block_attributes, 'innerBlocks' => gutenberg_convert_menu_items_to_blocks( isset( $menu_items_by_parent_id[0] ) ? $menu_items_by_parent_id[0] diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 0c6bbab461bc4..1ca26829e9965 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -85,9 +85,18 @@ function block_core_navigation_build_css_font_sizes( $attributes ) { return $font_sizes; } +/** + * Renders a Navigation Block derived from data from the theme_location source assigned + * via the block attribute 'source'. + * + * If the theme doesn't explicity support 'block-nav-menus' or no source was provided + * as a block attribute then an empty string is returned. + * + * @param array $attributes Navigation block attributes. + * @return string HTML markup of a generated Navigation Block. + */ function get_classic_navigation_elements( $attributes ){ - if ( ! current_theme_supports( 'block-nav-menus' ) ) { return ''; } @@ -96,14 +105,14 @@ function get_classic_navigation_elements( $attributes ){ return ''; } - //TODO: There are $attributes here that need to be communicated through to this call in some way (such as orientation, justification, etc) return wp_nav_menu( array( - 'theme_location' => $attributes['source'], - 'container' => '', - 'items_wrap' => '%3$s', - 'fallback_cb' => false, - 'echo' => false, + 'theme_location' => $attributes['source'], + 'block_attributes' => $attributes, + 'container' => '', + 'items_wrap' => '%3$s', + 'fallback_cb' => false, + 'echo' => false, ) ); } From 0cb51acd496a4c15a6ffe416b77cf56eccb2cd39 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Fri, 16 Apr 2021 11:29:43 -0400 Subject: [PATCH 05/13] Removed 'source' from attributes passed to renderer --- packages/block-library/src/navigation/index.php | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 1ca26829e9965..7b6c8e4d1b332 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -105,10 +105,13 @@ function get_classic_navigation_elements( $attributes ){ return ''; } + $block_attributes = $attributes; + unset($block_attributes['source']); + return wp_nav_menu( array( 'theme_location' => $attributes['source'], - 'block_attributes' => $attributes, + 'block_attributes' => $block_attributes, 'container' => '', 'items_wrap' => '%3$s', 'fallback_cb' => false, From 26d665a245751c4c1f8a25487dc58b79e2453657 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Fri, 16 Apr 2021 12:56:54 -0400 Subject: [PATCH 06/13] Fix PHP linting errors --- lib/navigation.php | 2 +- .../block-library/src/navigation/index.php | 20 +++++++++---------- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/lib/navigation.php b/lib/navigation.php index 1ef1e190b50e9..7bfe3416647c6 100644 --- a/lib/navigation.php +++ b/lib/navigation.php @@ -300,7 +300,7 @@ function gutenberg_output_block_nav_menu( $output, $args ) { } $block_attributes = array(); - if( isset( $args->block_attributes ) ) { + if ( isset( $args->block_attributes ) ) { $block_attributes = $args->block_attributes; } diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 7b6c8e4d1b332..0029933985eea 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -95,27 +95,27 @@ function block_core_navigation_build_css_font_sizes( $attributes ) { * @param array $attributes Navigation block attributes. * @return string HTML markup of a generated Navigation Block. */ -function get_classic_navigation_elements( $attributes ){ +function get_classic_navigation_elements( $attributes ) { if ( ! current_theme_supports( 'block-nav-menus' ) ) { return ''; } - if( ! array_key_exists( 'source', $attributes ) ) { + if ( ! array_key_exists( 'source', $attributes ) ) { return ''; } $block_attributes = $attributes; - unset($block_attributes['source']); + unset( $block_attributes['source'] ); return wp_nav_menu( array( - 'theme_location' => $attributes['source'], - 'block_attributes' => $block_attributes, - 'container' => '', - 'items_wrap' => '%3$s', - 'fallback_cb' => false, - 'echo' => false, + 'theme_location' => $attributes['source'], + 'block_attributes' => $block_attributes, + 'container' => '', + 'items_wrap' => '%3$s', + 'fallback_cb' => false, + 'echo' => false, ) ); } @@ -157,7 +157,7 @@ function render_block_core_navigation( $attributes, $content, $block ) { unset( $attributes['rgbTextColor'], $attributes['rgbBackgroundColor'] ); if ( empty( $block->inner_blocks ) ) { - return get_classic_navigation_elements ( $attributes ); + return get_classic_navigation_elements( $attributes ); } $colors = block_core_navigation_build_css_colors( $attributes ); From 204628506026333b5e38fe1b490fa03b9bafd28a Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Thu, 22 Apr 2021 12:23:47 -0400 Subject: [PATCH 07/13] Refactored to use 'location' --- packages/block-library/src/navigation/block.json | 2 +- packages/block-library/src/navigation/index.php | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/block-library/src/navigation/block.json b/packages/block-library/src/navigation/block.json index 41afad308ea5c..a354926b635b5 100644 --- a/packages/block-library/src/navigation/block.json +++ b/packages/block-library/src/navigation/block.json @@ -3,7 +3,7 @@ "name": "core/navigation", "category": "design", "attributes": { - "source": { + "location": { "type": "string" }, "orientation": { diff --git a/packages/block-library/src/navigation/index.php b/packages/block-library/src/navigation/index.php index 0029933985eea..be166b3894a4b 100644 --- a/packages/block-library/src/navigation/index.php +++ b/packages/block-library/src/navigation/index.php @@ -86,10 +86,10 @@ function block_core_navigation_build_css_font_sizes( $attributes ) { } /** - * Renders a Navigation Block derived from data from the theme_location source assigned - * via the block attribute 'source'. + * Renders a Navigation Block derived from data from the theme_location assigned + * via the block attribute 'location'. * - * If the theme doesn't explicity support 'block-nav-menus' or no source was provided + * If the theme doesn't explicity support 'block-nav-menus' or no location was provided * as a block attribute then an empty string is returned. * * @param array $attributes Navigation block attributes. @@ -101,16 +101,16 @@ function get_classic_navigation_elements( $attributes ) { return ''; } - if ( ! array_key_exists( 'source', $attributes ) ) { + if ( ! array_key_exists( 'location', $attributes ) ) { return ''; } $block_attributes = $attributes; - unset( $block_attributes['source'] ); + unset( $block_attributes['location'] ); return wp_nav_menu( array( - 'theme_location' => $attributes['source'], + 'theme_location' => $attributes['location'], 'block_attributes' => $block_attributes, 'container' => '', 'items_wrap' => '%3$s', From c96541d2aa5720b32da83d4e6d9dd866654d082a Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Thu, 22 Apr 2021 12:29:11 -0400 Subject: [PATCH 08/13] Tinkering with editor interface with location set --- packages/block-library/src/navigation/edit.js | 1 + .../src/navigation/placeholder.js | 148 +++++++++++++----- 2 files changed, 108 insertions(+), 41 deletions(-) diff --git a/packages/block-library/src/navigation/edit.js b/packages/block-library/src/navigation/edit.js index 18d9da732015c..aff3c5aa152ba 100644 --- a/packages/block-library/src/navigation/edit.js +++ b/packages/block-library/src/navigation/edit.js @@ -100,6 +100,7 @@ function Navigation( { return (
{ setIsPlaceholderShown( false ); updateInnerBlocks( blocks ); diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js index c0ac1b6ff4c30..f6d9d2c3db652 100644 --- a/packages/block-library/src/navigation/placeholder.js +++ b/packages/block-library/src/navigation/placeholder.js @@ -98,7 +98,7 @@ function convertMenuItemsToBlocks( menuItems ) { return mapMenuItemsToBlocks( menuTree ); } -function NavigationPlaceholder( { onCreate }, ref ) { +function NavigationPlaceholder( { onCreate, location }, ref ) { const [ selectedMenu, setSelectedMenu ] = useState(); const [ isCreatingFromMenu, setIsCreatingFromMenu ] = useState( false ); @@ -216,6 +216,109 @@ function NavigationPlaceholder( { onCreate }, ref ) { isPrimary: true, className: 'wp-block-navigation-placeholder__actions__dropdown', }; + + const setSelectedLocation = ( menu, location ) => { + console.log(menu, location); + }; + + const locationPlaceholder = () => { + if ( ! location ) { + return; + } + + //TODO: Get this from the gettin' place + const menuLocations = [ location ]; + + return ( + <> + { ' ' } + + { ( { onClose } ) => ( + + { menuLocations.map( ( menuLocation ) => { + return ( + { + setSelectedLocation( menuLocation ); + } } + isSelected={ menuLocation === location } + onClose={ onClose } + key={ menuLocation } + > + { menuLocation } + + ); + } ) } + + ) } + + + + + ); + }; + + const editExistingMenu = () => {}; + + const onConvertToBlocks = () => {}; + + const defaultPlaceholder = () => { + if ( location ) { + return; + } + return ( + <> + { hasMenus ? ( + + { ( { onClose } ) => ( + + { menus.map( ( menu ) => { + return ( + { + setSelectedMenu( menu.id ); + onCreateFromMenu(); + } } + onClose={ onClose } + key={ menu.id } + > + { menu.name } + + ); + } ) } + + ) } + + ) : undefined } + + { hasPages ? ( + + ) : undefined } + + + ); + }; + return (
@@ -234,46 +337,9 @@ function NavigationPlaceholder( { onCreate }, ref ) {
{ __( 'Navigation' ) }
- { hasMenus ? ( - - { ( { onClose } ) => ( - - { menus.map( ( menu ) => { - return ( - { - setSelectedMenu( - menu.id - ); - onCreateFromMenu(); - } } - onClose={ onClose } - key={ menu.id } - > - { menu.name } - - ); - } ) } - - ) } - - ) : undefined } - { hasPages ? ( - - ) : undefined } - + + { locationPlaceholder() } + { defaultPlaceholder() }
) }
From e56e59b5ff4be6d0559d41eb6b247c2f40aa5d9a Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Fri, 23 Apr 2021 11:47:44 +0100 Subject: [PATCH 09/13] Add real menu locations from the theme --- .../src/navigation/placeholder.js | 32 ++++++++++++------- 1 file changed, 21 insertions(+), 11 deletions(-) diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js index f6d9d2c3db652..2bdfadc11e5d2 100644 --- a/packages/block-library/src/navigation/placeholder.js +++ b/packages/block-library/src/navigation/placeholder.js @@ -108,6 +108,7 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { isResolvingPages, hasResolvedPages, menus, + menuLocations, isResolvingMenus, hasResolvedMenus, menuItems, @@ -118,6 +119,7 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { getEntityRecords, getMenus, getMenuItems, + getMenuLocations, isResolving, hasFinishedResolution, } = select( coreStore ); @@ -167,6 +169,7 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { menuItemsParameters ) : false, + menuLocations: getMenuLocations(), }; }, [ selectedMenu ] @@ -217,39 +220,46 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { className: 'wp-block-navigation-placeholder__actions__dropdown', }; - const setSelectedLocation = ( menu, location ) => { - console.log(menu, location); + const setSelectedLocation = ( menu ) => { + console.log( menu, location ); }; const locationPlaceholder = () => { - if ( ! location ) { + if ( ! location || ! menuLocations ) { return; } - //TODO: Get this from the gettin' place - const menuLocations = [ location ]; + const getDropDownText = () => { + return menuLocations.map( ( { name, description } ) => { + if ( name === location ) { + return description; + } + + return __( 'No location selected' ); + } ); + }; return ( <> { ' ' } { ( { onClose } ) => ( - { menuLocations.map( ( menuLocation ) => { + { menuLocations.map( ( { name, description } ) => { return ( { - setSelectedLocation( menuLocation ); + setSelectedLocation( name ); } } - isSelected={ menuLocation === location } + isSelected={ name === location } onClose={ onClose } - key={ menuLocation } + key={ name } > - { menuLocation } + { description } ); } ) } From a4cdf7274e59b0b4ab07efaff16f3762b1615203 Mon Sep 17 00:00:00 2001 From: Ben Dwyer Date: Fri, 23 Apr 2021 12:38:51 +0100 Subject: [PATCH 10/13] Select the correct menu using the dropdown --- packages/block-library/src/navigation/edit.js | 1 + .../src/navigation/placeholder.js | 20 ++++++++----------- 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/packages/block-library/src/navigation/edit.js b/packages/block-library/src/navigation/edit.js index aff3c5aa152ba..961cde395d570 100644 --- a/packages/block-library/src/navigation/edit.js +++ b/packages/block-library/src/navigation/edit.js @@ -101,6 +101,7 @@ function Navigation( {
{ setIsPlaceholderShown( false ); updateInnerBlocks( blocks ); diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js index 2bdfadc11e5d2..6ad174f625bd2 100644 --- a/packages/block-library/src/navigation/placeholder.js +++ b/packages/block-library/src/navigation/placeholder.js @@ -98,7 +98,7 @@ function convertMenuItemsToBlocks( menuItems ) { return mapMenuItemsToBlocks( menuTree ); } -function NavigationPlaceholder( { onCreate, location }, ref ) { +function NavigationPlaceholder( { location, onCreate, setAttributes }, ref ) { const [ selectedMenu, setSelectedMenu ] = useState(); const [ isCreatingFromMenu, setIsCreatingFromMenu ] = useState( false ); @@ -220,23 +220,19 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { className: 'wp-block-navigation-placeholder__actions__dropdown', }; - const setSelectedLocation = ( menu ) => { - console.log( menu, location ); - }; - const locationPlaceholder = () => { if ( ! location || ! menuLocations ) { return; } const getDropDownText = () => { - return menuLocations.map( ( { name, description } ) => { - if ( name === location ) { - return description; - } + const selectedMenuLocation = menuLocations.filter( + ( menuLocation ) => menuLocation.name === location + ); - return __( 'No location selected' ); - } ); + if ( selectedMenuLocation.length >= 0 ) { + return selectedMenuLocation[ 0 ].description; + } }; return ( @@ -253,7 +249,7 @@ function NavigationPlaceholder( { onCreate, location }, ref ) { return ( { - setSelectedLocation( name ); + setAttributes( { location: name } ); } } isSelected={ name === location } onClose={ onClose } From 30b12aaa59103c08198c41bf51a2fe7c95dec279 Mon Sep 17 00:00:00 2001 From: Jason Crist Date: Fri, 23 Apr 2021 13:05:06 -0400 Subject: [PATCH 11/13] Added 'edit' link to navigation --- .../src/navigation/placeholder.js | 20 ++++++++----------- 1 file changed, 8 insertions(+), 12 deletions(-) diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js index 6ad174f625bd2..3c0c4d2312394 100644 --- a/packages/block-library/src/navigation/placeholder.js +++ b/packages/block-library/src/navigation/placeholder.js @@ -225,21 +225,19 @@ function NavigationPlaceholder( { location, onCreate, setAttributes }, ref ) { return; } - const getDropDownText = () => { - const selectedMenuLocation = menuLocations.filter( - ( menuLocation ) => menuLocation.name === location - ); + const selectedMenuLocation = menuLocations.filter( + ( menuLocation ) => menuLocation.name === location + )?.[0]; - if ( selectedMenuLocation.length >= 0 ) { - return selectedMenuLocation[ 0 ].description; - } - }; + if( ! selectedMenuLocation ) { + return; + } return ( <> { ' ' } @@ -262,7 +260,7 @@ function NavigationPlaceholder( { location, onCreate, setAttributes }, ref ) { ) } - - ); }; - const onConvertToBlocks = () => {}; + const convertToBlocks = () => { + setAttributes( { location: null } ); + }; + + const convertToClassic = ( newLocation ) => { + setAttributes( { location: newLocation.name } ); + }; const defaultPlaceholder = () => { if ( location ) { return; } + + const defaultClassicMenuLocation = menuLocations?.[ 0 ]; + return ( <> { hasMenus ? ( @@ -320,6 +330,16 @@ function NavigationPlaceholder( { location, onCreate, setAttributes }, ref ) { + { !! defaultClassicMenuLocation ? ( + + ) : null } ); };