From 0d4bdbf835625281073f60c6a681bf793479f5db Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Tue, 8 Jun 2021 18:11:31 +0000 Subject: [PATCH] Block Editor: Include the page list block server-side code. On a previous package update, this block's server-side code has been missed. This was causing the block to not render properly. Props Chouby, desrosj, mcsf. Fixes #53309. git-svn-id: https://develop.svn.wordpress.org/trunk@51105 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/blocks/index.php | 1 + src/wp-includes/blocks/page-list.php | 227 ++++++++++++++++++++ src/wp-includes/blocks/page-list/block.json | 25 +++ tests/phpunit/includes/functions.php | 1 + tools/webpack/packages.js | 1 + 5 files changed, 255 insertions(+) create mode 100644 src/wp-includes/blocks/page-list.php create mode 100644 src/wp-includes/blocks/page-list/block.json diff --git a/src/wp-includes/blocks/index.php b/src/wp-includes/blocks/index.php index c06618372e..326fc043b0 100644 --- a/src/wp-includes/blocks/index.php +++ b/src/wp-includes/blocks/index.php @@ -15,6 +15,7 @@ require ABSPATH . WPINC . '/blocks/latest-comments.php'; require ABSPATH . WPINC . '/blocks/latest-posts.php'; require ABSPATH . WPINC . '/blocks/legacy-widget.php'; require ABSPATH . WPINC . '/blocks/loginout.php'; +require ABSPATH . WPINC . '/blocks/page-list.php'; require ABSPATH . WPINC . '/blocks/post-content.php'; require ABSPATH . WPINC . '/blocks/post-date.php'; require ABSPATH . WPINC . '/blocks/post-excerpt.php'; diff --git a/src/wp-includes/blocks/page-list.php b/src/wp-includes/blocks/page-list.php new file mode 100644 index 0000000000..a0cadde487 --- /dev/null +++ b/src/wp-includes/blocks/page-list.php @@ -0,0 +1,227 @@ + array(), + 'inline_styles' => '', + ); + + // Text color. + $has_named_text_color = array_key_exists( 'textColor', $context ); + $has_custom_text_color = isset( $context['style']['color']['text'] ); + + // If has text color. + if ( $has_custom_text_color || $has_named_text_color ) { + // Add has-text-color class. + $colors['css_classes'][] = 'has-text-color'; + } + + if ( $has_named_text_color ) { + // Add the color class. + $colors['css_classes'][] = sprintf( 'has-%s-color', $context['textColor'] ); + } elseif ( $has_custom_text_color ) { + // Add the custom color inline style. + $colors['inline_styles'] .= sprintf( 'color: %s;', $context['style']['color']['text'] ); + } + + // Background color. + $has_named_background_color = array_key_exists( 'backgroundColor', $context ); + $has_custom_background_color = isset( $context['style']['color']['background'] ); + + // If has background color. + if ( $has_custom_background_color || $has_named_background_color ) { + // Add has-background class. + $colors['css_classes'][] = 'has-background'; + } + + if ( $has_named_background_color ) { + // Add the background-color class. + $colors['css_classes'][] = sprintf( 'has-%s-background-color', $context['backgroundColor'] ); + } elseif ( $has_custom_background_color ) { + // Add the custom background-color inline style. + $colors['inline_styles'] .= sprintf( 'background-color: %s;', $context['style']['color']['background'] ); + } + + return $colors; +} + +/** + * Build an array with CSS classes and inline styles defining the font sizes + * which will be applied to the pages markup in the front-end when it is a descendant of navigation. + * + * @param array $context Navigation block context. + * @return array Font size CSS classes and inline styles. + */ +function block_core_page_list_build_css_font_sizes( $context ) { + // CSS classes. + $font_sizes = array( + 'css_classes' => array(), + 'inline_styles' => '', + ); + + $has_named_font_size = array_key_exists( 'fontSize', $context ); + $has_custom_font_size = isset( $context['style']['typography']['fontSize'] ); + + if ( $has_named_font_size ) { + // Add the font size class. + $font_sizes['css_classes'][] = sprintf( 'has-%s-font-size', $context['fontSize'] ); + } elseif ( $has_custom_font_size ) { + // Add the custom font size inline style. + $font_sizes['inline_styles'] = sprintf( 'font-size: %spx;', $context['style']['typography']['fontSize'] ); + } + + return $font_sizes; +} + +/** + * Outputs Page list markup from an array of pages with nested children. + * + * @param array $nested_pages The array of nested pages. + * + * @return string List markup. + */ +function render_nested_page_list( $nested_pages ) { + if ( empty( $nested_pages ) ) { + return; + } + $markup = ''; + foreach ( (array) $nested_pages as $page ) { + $css_class = 'wp-block-pages-list__item'; + if ( isset( $page['children'] ) ) { + $css_class .= ' has-child'; + } + $markup .= '
  • '; + $markup .= '' . wp_kses( + $page['title'], + wp_kses_allowed_html( 'post' ) + ) . ''; + if ( isset( $page['children'] ) ) { + $markup .= ''; + $markup .= ''; + } + $markup .= '
    • '; + } + return $markup; +} + +/** + * Outputs nested array of pages + * + * @param array $current_level The level being iterated through. + * @param array $children The children grouped by parent post ID. + * + * @return array The nested array of pages. + */ +function nest_pages( $current_level, $children ) { + if ( empty( $current_level ) ) { + return; + } + foreach ( (array) $current_level as $key => $current ) { + if ( isset( $children[ $key ] ) ) { + $current_level[ $key ]['children'] = nest_pages( $children[ $key ], $children ); + } + } + return $current_level; +} + +/** + * Renders the `core/page-list` block on server. + * + * @param array $attributes The block attributes. + * @param array $content The saved content. + * @param array $block The parsed block. + * + * @return string Returns the page list markup. + */ +function render_block_core_page_list( $attributes, $content, $block ) { + static $block_id = 0; + $block_id++; + + // TODO: When https://core.trac.wordpress.org/ticket/39037 REST API support for multiple orderby values is resolved, + // update 'sort_column' to 'menu_order, post_title'. Sorting by both menu_order and post_title ensures a stable sort. + // Otherwise with pages that have the same menu_order value, we can see different ordering depending on how DB + // queries are constructed internally. For example we might see a different order when a limit is set to <499 + // versus >= 500. + $all_pages = get_pages( + array( + 'sort_column' => 'menu_order', + 'order' => 'asc', + ) + ); + + $top_level_pages = array(); + + $pages_with_children = array(); + + foreach ( (array) $all_pages as $page ) { + if ( $page->post_parent ) { + $pages_with_children[ $page->post_parent ][ $page->ID ] = array( + 'title' => $page->post_title, + 'link' => get_permalink( $page->ID ), + ); + } else { + $top_level_pages[ $page->ID ] = array( + 'title' => $page->post_title, + 'link' => get_permalink( $page->ID ), + ); + + } + } + + $nested_pages = nest_pages( $top_level_pages, $pages_with_children ); + + $wrapper_markup = ''; + + $items_markup = render_nested_page_list( $nested_pages ); + + $colors = block_core_page_list_build_css_colors( $block->context ); + $font_sizes = block_core_page_list_build_css_font_sizes( $block->context ); + $classes = array_merge( + $colors['css_classes'], + $font_sizes['css_classes'] + ); + $style_attribute = ( $colors['inline_styles'] . $font_sizes['inline_styles'] ); + $css_classes = trim( implode( ' ', $classes ) ); + + if ( $block->context && $block->context['showSubmenuIcon'] ) { + $css_classes .= ' show-submenu-icons'; + } + + $wrapper_attributes = get_block_wrapper_attributes( + array( + 'class' => $css_classes, + 'style' => $style_attribute, + ) + ); + + return sprintf( + $wrapper_markup, + $wrapper_attributes, + $items_markup + ); +} + + /** + * Registers the `core/pages` block on server. + */ +function register_block_core_page_list() { + register_block_type_from_metadata( + __DIR__ . '/page-list', + array( + 'render_callback' => 'render_block_core_page_list', + ) + ); +} + add_action( 'init', 'register_block_core_page_list' ); diff --git a/src/wp-includes/blocks/page-list/block.json b/src/wp-includes/blocks/page-list/block.json new file mode 100644 index 0000000000..25118d2dbe --- /dev/null +++ b/src/wp-includes/blocks/page-list/block.json @@ -0,0 +1,25 @@ +{ + "apiVersion": 2, + "name": "core/page-list", + "title": "Page List", + "category": "widgets", + "description": "Display a list of all pages.", + "keywords": [ "menu", "navigation" ], + "textdomain": "default", + "usesContext": [ + "textColor", + "customTextColor", + "backgroundColor", + "customBackgroundColor", + "fontSize", + "customFontSize", + "showSubmenuIcon", + "style" + ], + "supports": { + "reusable": false, + "html": false + }, + "editorStyle": "wp-block-page-list-editor", + "style": "wp-block-page-list" +} diff --git a/tests/phpunit/includes/functions.php b/tests/phpunit/includes/functions.php index 2341304edd..a2ad83c7de 100644 --- a/tests/phpunit/includes/functions.php +++ b/tests/phpunit/includes/functions.php @@ -310,6 +310,7 @@ function _unhook_block_registration() { remove_action( 'init', 'register_block_core_loginout' ); remove_action( 'init', 'register_block_core_latest_comments' ); remove_action( 'init', 'register_block_core_latest_posts' ); + remove_action( 'init', 'register_block_core_page_list' ); remove_action( 'init', 'register_block_core_post_author' ); remove_action( 'init', 'register_block_core_post_content' ); remove_action( 'init', 'register_block_core_post_date' ); diff --git a/tools/webpack/packages.js b/tools/webpack/packages.js index 0c57717301..c45563ea02 100644 --- a/tools/webpack/packages.js +++ b/tools/webpack/packages.js @@ -114,6 +114,7 @@ module.exports = function( env = { environment: 'production', watch: false, buil 'latest-posts', 'legacy-widget', 'loginout', + 'page-list', 'post-content', 'post-date', 'post-excerpt',