From 70d0e6b411afc284a4f427b5694ac10ed5691108 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Mon, 18 Jan 2021 17:55:30 +1100
Subject: [PATCH 01/16] Add basic pages block

---
 lib/blocks.php                                |  1 +
 packages/block-library/src/index.js           |  2 +
 packages/block-library/src/navigation/edit.js |  1 +
 packages/block-library/src/pages/block.json   | 20 +++++++++
 packages/block-library/src/pages/edit.js      | 34 ++++++++++++++
 packages/block-library/src/pages/index.js     | 23 ++++++++++
 packages/block-library/src/pages/index.php    | 45 +++++++++++++++++++
 7 files changed, 126 insertions(+)
 create mode 100644 packages/block-library/src/pages/block.json
 create mode 100644 packages/block-library/src/pages/edit.js
 create mode 100644 packages/block-library/src/pages/index.js
 create mode 100644 packages/block-library/src/pages/index.php

diff --git a/lib/blocks.php b/lib/blocks.php
index d1428770e3540..cf6eed7ff6253 100644
--- a/lib/blocks.php
+++ b/lib/blocks.php
@@ -63,6 +63,7 @@ function gutenberg_reregister_core_block_types() {
 					'shortcode.php'                 => 'core/shortcode',
 					'social-link.php'               => 'core/social-link',
 					'tag-cloud.php'                 => 'core/tag-cloud',
+					'pages.php'                     => 'core/pages',
 					'post-author.php'               => 'core/post-author',
 					'post-comment.php'              => 'core/post-comment',
 					'post-comment-author.php'       => 'core/post-comment-author',
diff --git a/packages/block-library/src/index.js b/packages/block-library/src/index.js
index 376757f2bfb87..b9b77dea9247f 100644
--- a/packages/block-library/src/index.js
+++ b/packages/block-library/src/index.js
@@ -42,6 +42,7 @@ import * as list from './list';
 import * as missing from './missing';
 import * as more from './more';
 import * as nextpage from './nextpage';
+import * as pages from './pages';
 import * as preformatted from './preformatted';
 import * as pullquote from './pullquote';
 import * as reusableBlock from './block';
@@ -148,6 +149,7 @@ export const __experimentalGetCoreBlocks = () => [
 	missing,
 	more,
 	nextpage,
+	pages,
 	preformatted,
 	pullquote,
 	rss,
diff --git a/packages/block-library/src/navigation/edit.js b/packages/block-library/src/navigation/edit.js
index c22be04525c8c..91bc44e020791 100644
--- a/packages/block-library/src/navigation/edit.js
+++ b/packages/block-library/src/navigation/edit.js
@@ -79,6 +79,7 @@ function Navigation( {
 				'core/navigation-link',
 				'core/search',
 				'core/social-links',
+				'core/pages',
 			],
 			orientation: attributes.orientation || 'horizontal',
 			renderAppender:
diff --git a/packages/block-library/src/pages/block.json b/packages/block-library/src/pages/block.json
new file mode 100644
index 0000000000000..060b3bd7014d4
--- /dev/null
+++ b/packages/block-library/src/pages/block.json
@@ -0,0 +1,20 @@
+{
+	"apiVersion": 2,
+	"name": "core/pages",
+	"category": "widgets",
+	"attributes": {
+		"orientation": {
+			"type": "string"
+		},
+		"showSubmenuIcon": {
+			"type": "boolean",
+			"default": true
+		}
+	},
+	"supports": {
+		"align": true,
+		"html": false
+	},
+	"editorStyle": "wp-block-pages-editor",
+	"style": "wp-block-pages"
+}
\ No newline at end of file
diff --git a/packages/block-library/src/pages/edit.js b/packages/block-library/src/pages/edit.js
new file mode 100644
index 0000000000000..331b26fba0fd5
--- /dev/null
+++ b/packages/block-library/src/pages/edit.js
@@ -0,0 +1,34 @@
+/**
+ * WordPress dependencies
+ */
+import { PanelBody, ToggleControl } from '@wordpress/components';
+import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
+import { __ } from '@wordpress/i18n';
+import ServerSideRender from '@wordpress/server-side-render';
+
+export default function PagesEdit( {
+	attributes,
+	setAttributes,
+	hasSubmenuIndicatorSetting = true,
+} ) {
+	return (
+		<div { ...useBlockProps() }>
+			<InspectorControls>
+				{ hasSubmenuIndicatorSetting && (
+					<PanelBody title={ __( 'Display settings' ) }>
+						<ToggleControl
+							checked={ attributes.showSubmenuIcon }
+							onChange={ ( value ) => {
+								setAttributes( {
+									showSubmenuIcon: value,
+								} );
+							} }
+							label={ __( 'Show submenu indicator icons' ) }
+						/>
+					</PanelBody>
+				) }
+			</InspectorControls>
+			<ServerSideRender block="core/pages" attributes={ attributes } />
+		</div>
+	);
+}
diff --git a/packages/block-library/src/pages/index.js b/packages/block-library/src/pages/index.js
new file mode 100644
index 0000000000000..30d9dd0a7cde8
--- /dev/null
+++ b/packages/block-library/src/pages/index.js
@@ -0,0 +1,23 @@
+/**
+ * WordPress dependencies
+ */
+import { page as icon } from '@wordpress/icons';
+import { __, _x } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import metadata from './block.json';
+import edit from './edit.js';
+
+const { name } = metadata;
+
+export { metadata, name };
+
+export const settings = {
+	title: _x( 'Pages', 'block title' ),
+	description: __( 'Display a list of all pages.' ),
+	icon,
+	example: {},
+	edit,
+};
diff --git a/packages/block-library/src/pages/index.php b/packages/block-library/src/pages/index.php
new file mode 100644
index 0000000000000..45e26caae608e
--- /dev/null
+++ b/packages/block-library/src/pages/index.php
@@ -0,0 +1,45 @@
+<?php
+/**
+ * Server-side rendering of the `core/pages` block.
+ *
+ * @package WordPress
+ */
+
+/**
+ * Renders the `core/pages` block on server.
+ *
+ * @return string Returns the pages list/dropdown markup.
+ */
+function render_block_core_pages() {
+	static $block_id = 0;
+	$block_id++;
+
+	$args = array(
+		'echo'     => false,
+		'title_li' => '',
+	);
+
+	$wrapper_markup = '<ul %1$s>%2$s</ul>';
+	$items_markup   = wp_list_pages( $args );
+
+	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => 'wp-block-page-list' ) );
+
+	return sprintf(
+		$wrapper_markup,
+		$wrapper_attributes,
+		$items_markup
+	);
+}
+
+/**
+ * Registers the `core/pages` block on server.
+ */
+function register_block_core_pages() {
+	register_block_type_from_metadata(
+		__DIR__ . '/pages',
+		array(
+			'render_callback' => 'render_block_core_pages',
+		)
+	);
+}
+add_action( 'init', 'register_block_core_pages' );

From d6e8af62639ea3fa07f89bd80642eb25543c8f11 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Tue, 19 Jan 2021 17:52:23 +1100
Subject: [PATCH 02/16] Add dropdowns and indicators

---
 lib/class-walker-pages-block.php            | 35 +++++++++
 lib/load.php                                |  3 +
 packages/block-library/src/pages/index.php  | 15 +++-
 packages/block-library/src/pages/style.scss | 87 +++++++++++++++++++++
 packages/block-library/src/style.scss       |  1 +
 5 files changed, 139 insertions(+), 2 deletions(-)
 create mode 100644 lib/class-walker-pages-block.php
 create mode 100644 packages/block-library/src/pages/style.scss

diff --git a/lib/class-walker-pages-block.php b/lib/class-walker-pages-block.php
new file mode 100644
index 0000000000000..06b0b4eab96d3
--- /dev/null
+++ b/lib/class-walker-pages-block.php
@@ -0,0 +1,35 @@
+<?php
+/**
+ * Walker_Pages_Block class.
+ *
+ * @package gutenberg
+ */
+
+/**
+ * Class that adds submenu dropdown indicators to Pages block.
+ */
+class Walker_Pages_Block extends Walker_Page {
+	/**
+	 * Outputs the beginning of the current level in the tree before elements are output.
+	 *
+	 * @since 2.1.0
+	 *
+	 * @see Walker::start_lvl()
+	 *
+	 * @param string $output Used to append additional content (passed by reference).
+	 * @param int    $depth  Optional. Depth of page. Used for padding. Default 0.
+	 * @param array  $args   Optional. Arguments for outputting the next level.
+	 *                       Default empty array.
+	 */
+	public function start_lvl( &$output, $depth = 0, $args = array() ) {
+		if ( isset( $args['item_spacing'] ) && 'preserve' === $args['item_spacing'] ) {
+			$t = "\t";
+			$n = "\n";
+		} else {
+			$t = '';
+			$n = '';
+		}
+		$indent  = str_repeat( $t, $depth );
+		$output .= "<span class='wp-block-pages__submenu-icon'><svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' transform='rotate(90)'><path d='M8 5v14l11-7z'/><path d='M0 0h24v24H0z' fill='none'/></svg></span>{$n}{$indent}<ul class='children'>{$n}";
+	}
+}
diff --git a/lib/load.php b/lib/load.php
index 7772cac90e15e..84151f4932f48 100644
--- a/lib/load.php
+++ b/lib/load.php
@@ -123,3 +123,6 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/block-supports/typography.php';
 require __DIR__ . '/block-supports/custom-classname.php';
 require __DIR__ . '/block-supports/border.php';
+
+/* Page Walker class extension for Pages Block */
+require_once __DIR__ . '/class-walker-pages-block.php';
diff --git a/packages/block-library/src/pages/index.php b/packages/block-library/src/pages/index.php
index 45e26caae608e..e6c971896512e 100644
--- a/packages/block-library/src/pages/index.php
+++ b/packages/block-library/src/pages/index.php
@@ -8,21 +8,32 @@
 /**
  * Renders the `core/pages` block on server.
  *
+ * @param array $attributes The block attributes.
+ *
  * @return string Returns the pages list/dropdown markup.
  */
-function render_block_core_pages() {
+function render_block_core_pages( $attributes ) {
 	static $block_id = 0;
 	$block_id++;
 
+	$walker = new Walker_Pages_Block;
+
 	$args = array(
 		'echo'     => false,
 		'title_li' => '',
+		'walker'   => $walker,
 	);
 
 	$wrapper_markup = '<ul %1$s>%2$s</ul>';
 	$items_markup   = wp_list_pages( $args );
 
-	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => 'wp-block-page-list' ) );
+	$classes = 'wp-block-page-list';
+
+	if ( isset( $attributes['showSubmenuIcon'] ) && $attributes['showSubmenuIcon'] ) {
+		$classes .= ' show-submenu-icons';
+	}
+
+	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classes ) );
 
 	return sprintf(
 		$wrapper_markup,
diff --git a/packages/block-library/src/pages/style.scss b/packages/block-library/src/pages/style.scss
new file mode 100644
index 0000000000000..91a9a77430104
--- /dev/null
+++ b/packages/block-library/src/pages/style.scss
@@ -0,0 +1,87 @@
+.wp-block-navigation-link__submenu-icon {
+	display: none;
+}
+
+.show-submenu-icons {
+	.wp-block-navigation-link__submenu-icon {
+		display: block;
+	}
+}
+
+// The Pages block should inherit navigation styles when nested within it
+.wp-block-navigation {
+	.wp-block-page-list {
+		display: flex;
+		flex-wrap: wrap;
+	}
+	.page_item a {
+		display: block;
+		color: inherit;
+		padding: 0.5em 1em;
+	}
+
+	.page_item_has_children {
+		display: flex;
+		position: relative;
+
+		> a {
+			padding-right: 0.5em;
+		}
+		> .children {
+			border: $border-width solid rgba(0, 0, 0, 0.15);
+			background-color: inherit;
+			color: inherit;
+			position: absolute;
+			left: 0;
+			top: 100%;
+			width: fit-content;
+			z-index: 2;
+			opacity: 0;
+			transition: opacity 0.1s linear;
+			visibility: hidden;
+
+			@include break-medium {
+				left: 1.5em;
+
+				// Nested submenus sit to the left on large breakpoints
+				.children {
+					left: 100%;
+					top: -1px;
+
+					// Prevent the menu from disappearing when the mouse is over the gap
+					&::before {
+						content: "";
+						position: absolute;
+						right: 100%;
+						height: 100%;
+						display: block;
+						width: 0.5em;
+						background: transparent;
+					}
+				}
+
+				.wp-block-navigation-link__submenu-icon svg {
+					transform: rotate(0);
+				}
+			}
+		}
+
+		&:hover {
+			cursor: pointer;
+
+			> .children {
+				visibility: visible;
+				opacity: 1;
+			}
+		}
+
+		&:focus-within {
+			cursor: pointer;
+
+			> .children {
+				visibility: visible;
+				opacity: 1;
+			}
+		}
+	}
+}
diff --git a/packages/block-library/src/style.scss b/packages/block-library/src/style.scss
index a8d23e1563793..b2339a6dd6fea 100644
--- a/packages/block-library/src/style.scss
+++ b/packages/block-library/src/style.scss
@@ -23,6 +23,7 @@
 @import "./media-text/style.scss";
 @import "./navigation/style.scss";
 @import "./navigation-link/style.scss";
+@import "./pages/style.scss";
 @import "./paragraph/style.scss";
 @import "./post-author/style.scss";
 @import "./post-comments-form/style.scss";

From 2e4190e153e8d38ba36419df9608cd2e75311cd3 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Thu, 21 Jan 2021 11:15:09 +1100
Subject: [PATCH 03/16] Inherit settings from parent Nav block

---
 packages/block-library/src/editor.scss       |   1 +
 packages/block-library/src/pages/block.json  |  20 ++--
 packages/block-library/src/pages/edit.js     |  59 ++++++-----
 packages/block-library/src/pages/editor.scss |   7 ++
 packages/block-library/src/pages/index.php   | 106 ++++++++++++++++++-
 packages/block-library/src/pages/style.scss  |  10 +-
 6 files changed, 161 insertions(+), 42 deletions(-)
 create mode 100644 packages/block-library/src/pages/editor.scss

diff --git a/packages/block-library/src/editor.scss b/packages/block-library/src/editor.scss
index 45449c927bac0..0b9a4def4a4d6 100644
--- a/packages/block-library/src/editor.scss
+++ b/packages/block-library/src/editor.scss
@@ -27,6 +27,7 @@
 @import "./navigation/editor.scss";
 @import "./navigation-link/editor.scss";
 @import "./nextpage/editor.scss";
+@import "./pages/editor.scss";
 @import "./paragraph/editor.scss";
 @import "./post-content/editor.scss";
 @import "./post-excerpt/editor.scss";
diff --git a/packages/block-library/src/pages/block.json b/packages/block-library/src/pages/block.json
index 060b3bd7014d4..07557c45c3fb5 100644
--- a/packages/block-library/src/pages/block.json
+++ b/packages/block-library/src/pages/block.json
@@ -2,17 +2,17 @@
 	"apiVersion": 2,
 	"name": "core/pages",
 	"category": "widgets",
-	"attributes": {
-		"orientation": {
-			"type": "string"
-		},
-		"showSubmenuIcon": {
-			"type": "boolean",
-			"default": true
-		}
-	},
+	"usesContext": [
+		"textColor",
+		"customTextColor",
+		"backgroundColor",
+		"customBackgroundColor",
+		"fontSize",
+		"customFontSize",
+		"showSubmenuIcon"
+	],
 	"supports": {
-		"align": true,
+		"reusable": false,
 		"html": false
 	},
 	"editorStyle": "wp-block-pages-editor",
diff --git a/packages/block-library/src/pages/edit.js b/packages/block-library/src/pages/edit.js
index 331b26fba0fd5..49dde6e585b8b 100644
--- a/packages/block-library/src/pages/edit.js
+++ b/packages/block-library/src/pages/edit.js
@@ -1,34 +1,43 @@
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-import { PanelBody, ToggleControl } from '@wordpress/components';
-import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
-import { __ } from '@wordpress/i18n';
+
+import { useBlockProps } from '@wordpress/block-editor';
 import ServerSideRender from '@wordpress/server-side-render';
+import { useSelect } from '@wordpress/data';
+
+export default function PagesEdit( { clientId } ) {
+	const navigationBlockAttributes = useSelect( ( select ) => {
+		const { getBlockAttributes, getBlockParentsByBlockName } = select(
+			'core/block-editor'
+		);
+		const parentBlock = getBlockParentsByBlockName(
+			clientId,
+			'core/navigation'
+		)[ 0 ];
+		return getBlockAttributes( parentBlock );
+	} );
+	const showSubmenuIcon = !! navigationBlockAttributes?.showSubmenuIcon;
+	const { textColor, backgroundColor } = navigationBlockAttributes || {};
+
+	const blockProps = useBlockProps( {
+		className: classnames( {
+			'has-text-color': !! textColor,
+			[ `has-${ textColor }-color` ]: !! textColor,
+			'has-background': !! backgroundColor,
+			[ `has-${ backgroundColor }-background-color` ]: !! backgroundColor,
+			'show-submenu-icons': showSubmenuIcon,
+		} ),
+	} );
 
-export default function PagesEdit( {
-	attributes,
-	setAttributes,
-	hasSubmenuIndicatorSetting = true,
-} ) {
 	return (
-		<div { ...useBlockProps() }>
-			<InspectorControls>
-				{ hasSubmenuIndicatorSetting && (
-					<PanelBody title={ __( 'Display settings' ) }>
-						<ToggleControl
-							checked={ attributes.showSubmenuIcon }
-							onChange={ ( value ) => {
-								setAttributes( {
-									showSubmenuIcon: value,
-								} );
-							} }
-							label={ __( 'Show submenu indicator icons' ) }
-						/>
-					</PanelBody>
-				) }
-			</InspectorControls>
-			<ServerSideRender block="core/pages" attributes={ attributes } />
+		<div { ...blockProps }>
+			<ServerSideRender block="core/pages" />
 		</div>
 	);
 }
diff --git a/packages/block-library/src/pages/editor.scss b/packages/block-library/src/pages/editor.scss
new file mode 100644
index 0000000000000..28b5277361b51
--- /dev/null
+++ b/packages/block-library/src/pages/editor.scss
@@ -0,0 +1,7 @@
+.wp-block-navigation {
+	// Block wrapper gets the classes in the editor, and there's an extra div wrapper for now, so background styles need to be inherited.
+	.wp-blokc-pages > div,
+	.wp-block-page-list {
+		background-color: inherit;
+	}
+}
diff --git a/packages/block-library/src/pages/index.php b/packages/block-library/src/pages/index.php
index e6c971896512e..d33079578353a 100644
--- a/packages/block-library/src/pages/index.php
+++ b/packages/block-library/src/pages/index.php
@@ -5,14 +5,96 @@
  * @package WordPress
  */
 
+/**
+ * Build an array with CSS classes and inline styles defining the colors
+ * 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 Colors CSS classes and inline styles.
+ */
+function block_core_pages_build_css_colors( $context ) {
+	$colors = array(
+		'css_classes'   => array(),
+		'inline_styles' => '',
+	);
+
+	// Text color.
+	$has_named_text_color  = array_key_exists( 'textColor', $context );
+	$has_custom_text_color = array_key_exists( 'customTextColor', $context );
+
+	// 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['customTextColor'] );
+	}
+
+	// Background color.
+	$has_named_background_color  = array_key_exists( 'backgroundColor', $context );
+	$has_custom_background_color = array_key_exists( 'customBackgroundColor', $context );
+
+	// 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['customBackgroundColor'] );
+	}
+
+	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_pages_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 = array_key_exists( 'customFontSize', $context );
+
+	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['customFontSize'] );
+	}
+
+	return $font_sizes;
+}
+
 /**
  * Renders the `core/pages` 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 pages list/dropdown markup.
  */
-function render_block_core_pages( $attributes ) {
+function render_block_core_pages( $attributes, $content, $block ) {
 	static $block_id = 0;
 	$block_id++;
 
@@ -27,13 +109,27 @@ function render_block_core_pages( $attributes ) {
 	$wrapper_markup = '<ul %1$s>%2$s</ul>';
 	$items_markup   = wp_list_pages( $args );
 
-	$classes = 'wp-block-page-list';
+	$colors          = block_core_pages_build_css_colors( $block->context );
+	$font_sizes      = block_core_pages_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 ) );
+
+	$css_classes .= ' wp-block-page-list';
 
-	if ( isset( $attributes['showSubmenuIcon'] ) && $attributes['showSubmenuIcon'] ) {
-		$classes .= ' show-submenu-icons';
+	if ( $block->context && $block->context['showSubmenuIcon'] ) {
+		$css_classes .= ' show-submenu-icons';
 	}
 
-	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classes ) );
+	$wrapper_attributes = get_block_wrapper_attributes(
+		array(
+			'class' => $css_classes,
+			'style' => $style_attribute,
+		)
+	);
 
 	return sprintf(
 		$wrapper_markup,
diff --git a/packages/block-library/src/pages/style.scss b/packages/block-library/src/pages/style.scss
index 91a9a77430104..9edec3c1f9aa1 100644
--- a/packages/block-library/src/pages/style.scss
+++ b/packages/block-library/src/pages/style.scss
@@ -1,10 +1,11 @@
-.wp-block-navigation-link__submenu-icon {
+.wp-block-pages__submenu-icon {
 	display: none;
 }
 
 .show-submenu-icons {
-	.wp-block-navigation-link__submenu-icon {
+	.wp-block-pages__submenu-icon {
 		display: block;
+		padding: 0.375em 1em 0.375em 0;
 	}
 }
 
@@ -23,6 +24,7 @@
 	.page_item_has_children {
 		display: flex;
 		position: relative;
+		background-color: inherit;
 
 		> a {
 			padding-right: 0.5em;
@@ -84,4 +86,8 @@
 			}
 		}
 	}
+
+	.children {
+		padding: 0;
+	}
 }

From 66eb631613c373f3c890337816d0e574b63069c3 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 22 Jan 2021 14:47:12 +1100
Subject: [PATCH 04/16] Add pages button adds the block and styling
 improvements

---
 .../src/navigation/placeholder.js             | 27 ++-----------------
 packages/block-library/src/pages/editor.scss  |  6 ++++-
 packages/block-library/src/pages/style.scss   |  6 +++++
 3 files changed, 13 insertions(+), 26 deletions(-)

diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js
index 28dc39fe0142c..1988b5afb42b5 100644
--- a/packages/block-library/src/navigation/placeholder.js
+++ b/packages/block-library/src/navigation/placeholder.js
@@ -97,29 +97,6 @@ function convertMenuItemsToBlocks( menuItems ) {
 	return mapMenuItemsToBlocks( menuTree );
 }
 
-/**
- * Convert pages to blocks.
- *
- * @param {Object[]} pages An array of pages.
- *
- * @return {WPBlock[]} An array of blocks.
- */
-function convertPagesToBlocks( pages ) {
-	if ( ! pages ) {
-		return null;
-	}
-
-	return pages.map( ( { title, type, link: url, id } ) =>
-		createBlock( 'core/navigation-link', {
-			type,
-			id,
-			url,
-			label: ! title.rendered ? __( '(no title)' ) : title.rendered,
-			opensInNewTab: false,
-		} )
-	);
-}
-
 function NavigationPlaceholder( { onCreate }, ref ) {
 	const [ selectedMenu, setSelectedMenu ] = useState();
 
@@ -220,9 +197,9 @@ function NavigationPlaceholder( { onCreate }, ref ) {
 	};
 
 	const onCreateAllPages = () => {
-		const blocks = convertPagesToBlocks( pages );
+		const block = [ createBlock( 'core/pages' ) ];
 		const selectNavigationBlock = true;
-		onCreate( blocks, selectNavigationBlock );
+		onCreate( block, selectNavigationBlock );
 	};
 
 	useEffect( () => {
diff --git a/packages/block-library/src/pages/editor.scss b/packages/block-library/src/pages/editor.scss
index 28b5277361b51..8402b2a00e936 100644
--- a/packages/block-library/src/pages/editor.scss
+++ b/packages/block-library/src/pages/editor.scss
@@ -1,7 +1,11 @@
 .wp-block-navigation {
 	// Block wrapper gets the classes in the editor, and there's an extra div wrapper for now, so background styles need to be inherited.
-	.wp-blokc-pages > div,
+	.wp-block-pages > div,
 	.wp-block-page-list {
 		background-color: inherit;
 	}
+	// Make links unclickable in the editor
+	.page_item a {
+		pointer-events: none;
+	}
 }
diff --git a/packages/block-library/src/pages/style.scss b/packages/block-library/src/pages/style.scss
index 9edec3c1f9aa1..7c5aa3a496cdb 100644
--- a/packages/block-library/src/pages/style.scss
+++ b/packages/block-library/src/pages/style.scss
@@ -91,3 +91,9 @@
 		padding: 0;
 	}
 }
+
+.is-vertical .wp-block-navigation__container {
+	.wp-block-page-list {
+		display: block;
+	}
+}

From 13355234e4a5451e50c9a71810f3eb7ced82e9ef Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Wed, 27 Jan 2021 17:50:31 +1100
Subject: [PATCH 05/16] Change name to page list

---
 lib/blocks.php                                |  2 +-
 ...k.php => class-walker-page-list-block.php} |  8 +++----
 lib/load.php                                  |  4 ++--
 packages/block-library/src/editor.scss        |  2 +-
 packages/block-library/src/index.js           |  4 ++--
 packages/block-library/src/navigation/edit.js |  2 +-
 .../src/navigation/placeholder.js             |  2 +-
 .../src/{pages => page-list}/block.json       |  6 ++---
 .../src/{pages => page-list}/edit.js          |  4 ++--
 .../src/{pages => page-list}/editor.scss      |  2 +-
 .../src/{pages => page-list}/index.js         |  2 +-
 .../src/{pages => page-list}/index.php        | 24 +++++++++----------
 .../src/{pages => page-list}/style.scss       |  4 ++--
 packages/block-library/src/style.scss         |  2 +-
 14 files changed, 34 insertions(+), 34 deletions(-)
 rename lib/{class-walker-pages-block.php => class-walker-page-list-block.php} (63%)
 rename packages/block-library/src/{pages => page-list}/block.json (71%)
 rename packages/block-library/src/{pages => page-list}/edit.js (91%)
 rename packages/block-library/src/{pages => page-list}/editor.scss (91%)
 rename packages/block-library/src/{pages => page-list}/index.js (90%)
 rename packages/block-library/src/{pages => page-list}/index.php (85%)
 rename packages/block-library/src/{pages => page-list}/style.scss (95%)

diff --git a/lib/blocks.php b/lib/blocks.php
index cf6eed7ff6253..a7442d71e8409 100644
--- a/lib/blocks.php
+++ b/lib/blocks.php
@@ -63,7 +63,7 @@ function gutenberg_reregister_core_block_types() {
 					'shortcode.php'                 => 'core/shortcode',
 					'social-link.php'               => 'core/social-link',
 					'tag-cloud.php'                 => 'core/tag-cloud',
-					'pages.php'                     => 'core/pages',
+					'page-list.php'                 => 'core/page-list',
 					'post-author.php'               => 'core/post-author',
 					'post-comment.php'              => 'core/post-comment',
 					'post-comment-author.php'       => 'core/post-comment-author',
diff --git a/lib/class-walker-pages-block.php b/lib/class-walker-page-list-block.php
similarity index 63%
rename from lib/class-walker-pages-block.php
rename to lib/class-walker-page-list-block.php
index 06b0b4eab96d3..46db174a1c28a 100644
--- a/lib/class-walker-pages-block.php
+++ b/lib/class-walker-page-list-block.php
@@ -1,14 +1,14 @@
 <?php
 /**
- * Walker_Pages_Block class.
+ * Walker_Page_List_Block class.
  *
  * @package gutenberg
  */
 
 /**
- * Class that adds submenu dropdown indicators to Pages block.
+ * Class that adds submenu dropdown indicators to Page List block.
  */
-class Walker_Pages_Block extends Walker_Page {
+class Walker_Page_List_Block extends Walker_Page {
 	/**
 	 * Outputs the beginning of the current level in the tree before elements are output.
 	 *
@@ -30,6 +30,6 @@ public function start_lvl( &$output, $depth = 0, $args = array() ) {
 			$n = '';
 		}
 		$indent  = str_repeat( $t, $depth );
-		$output .= "<span class='wp-block-pages__submenu-icon'><svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' transform='rotate(90)'><path d='M8 5v14l11-7z'/><path d='M0 0h24v24H0z' fill='none'/></svg></span>{$n}{$indent}<ul class='children'>{$n}";
+		$output .= "<span class='wp-block-page-list__submenu-icon'><svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' transform='rotate(90)'><path d='M8 5v14l11-7z'/><path d='M0 0h24v24H0z' fill='none'/></svg></span>{$n}{$indent}<ul class='children'>{$n}";
 	}
 }
diff --git a/lib/load.php b/lib/load.php
index 84151f4932f48..723117502e315 100644
--- a/lib/load.php
+++ b/lib/load.php
@@ -124,5 +124,5 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/block-supports/custom-classname.php';
 require __DIR__ . '/block-supports/border.php';
 
-/* Page Walker class extension for Pages Block */
-require_once __DIR__ . '/class-walker-pages-block.php';
+/* Page Walker class extension for Page List Block */
+require_once __DIR__ . '/class-walker-page-list-block.php';
diff --git a/packages/block-library/src/editor.scss b/packages/block-library/src/editor.scss
index 0b9a4def4a4d6..2113c72dade39 100644
--- a/packages/block-library/src/editor.scss
+++ b/packages/block-library/src/editor.scss
@@ -27,7 +27,7 @@
 @import "./navigation/editor.scss";
 @import "./navigation-link/editor.scss";
 @import "./nextpage/editor.scss";
-@import "./pages/editor.scss";
+@import "./page-list/editor.scss";
 @import "./paragraph/editor.scss";
 @import "./post-content/editor.scss";
 @import "./post-excerpt/editor.scss";
diff --git a/packages/block-library/src/index.js b/packages/block-library/src/index.js
index b9b77dea9247f..d470f555e20ba 100644
--- a/packages/block-library/src/index.js
+++ b/packages/block-library/src/index.js
@@ -42,7 +42,7 @@ import * as list from './list';
 import * as missing from './missing';
 import * as more from './more';
 import * as nextpage from './nextpage';
-import * as pages from './pages';
+import * as pageList from './page-list';
 import * as preformatted from './preformatted';
 import * as pullquote from './pullquote';
 import * as reusableBlock from './block';
@@ -149,7 +149,7 @@ export const __experimentalGetCoreBlocks = () => [
 	missing,
 	more,
 	nextpage,
-	pages,
+	pageList,
 	preformatted,
 	pullquote,
 	rss,
diff --git a/packages/block-library/src/navigation/edit.js b/packages/block-library/src/navigation/edit.js
index 91bc44e020791..9c801008d5bf3 100644
--- a/packages/block-library/src/navigation/edit.js
+++ b/packages/block-library/src/navigation/edit.js
@@ -79,7 +79,7 @@ function Navigation( {
 				'core/navigation-link',
 				'core/search',
 				'core/social-links',
-				'core/pages',
+				'core/page-list',
 			],
 			orientation: attributes.orientation || 'horizontal',
 			renderAppender:
diff --git a/packages/block-library/src/navigation/placeholder.js b/packages/block-library/src/navigation/placeholder.js
index 1988b5afb42b5..9f6c58267caab 100644
--- a/packages/block-library/src/navigation/placeholder.js
+++ b/packages/block-library/src/navigation/placeholder.js
@@ -197,7 +197,7 @@ function NavigationPlaceholder( { onCreate }, ref ) {
 	};
 
 	const onCreateAllPages = () => {
-		const block = [ createBlock( 'core/pages' ) ];
+		const block = [ createBlock( 'core/page-list' ) ];
 		const selectNavigationBlock = true;
 		onCreate( block, selectNavigationBlock );
 	};
diff --git a/packages/block-library/src/pages/block.json b/packages/block-library/src/page-list/block.json
similarity index 71%
rename from packages/block-library/src/pages/block.json
rename to packages/block-library/src/page-list/block.json
index 07557c45c3fb5..f148ab71852af 100644
--- a/packages/block-library/src/pages/block.json
+++ b/packages/block-library/src/page-list/block.json
@@ -1,6 +1,6 @@
 {
 	"apiVersion": 2,
-	"name": "core/pages",
+	"name": "core/page-list",
 	"category": "widgets",
 	"usesContext": [
 		"textColor",
@@ -15,6 +15,6 @@
 		"reusable": false,
 		"html": false
 	},
-	"editorStyle": "wp-block-pages-editor",
-	"style": "wp-block-pages"
+	"editorStyle": "wp-block-page-list-editor",
+	"style": "wp-block-page-list"
 }
\ No newline at end of file
diff --git a/packages/block-library/src/pages/edit.js b/packages/block-library/src/page-list/edit.js
similarity index 91%
rename from packages/block-library/src/pages/edit.js
rename to packages/block-library/src/page-list/edit.js
index 49dde6e585b8b..56f051479b611 100644
--- a/packages/block-library/src/pages/edit.js
+++ b/packages/block-library/src/page-list/edit.js
@@ -11,7 +11,7 @@ import { useBlockProps } from '@wordpress/block-editor';
 import ServerSideRender from '@wordpress/server-side-render';
 import { useSelect } from '@wordpress/data';
 
-export default function PagesEdit( { clientId } ) {
+export default function PageListEdit( { clientId } ) {
 	const navigationBlockAttributes = useSelect( ( select ) => {
 		const { getBlockAttributes, getBlockParentsByBlockName } = select(
 			'core/block-editor'
@@ -37,7 +37,7 @@ export default function PagesEdit( { clientId } ) {
 
 	return (
 		<div { ...blockProps }>
-			<ServerSideRender block="core/pages" />
+			<ServerSideRender block="core/page-list" />
 		</div>
 	);
 }
diff --git a/packages/block-library/src/pages/editor.scss b/packages/block-library/src/page-list/editor.scss
similarity index 91%
rename from packages/block-library/src/pages/editor.scss
rename to packages/block-library/src/page-list/editor.scss
index 8402b2a00e936..a09a91f4d60c7 100644
--- a/packages/block-library/src/pages/editor.scss
+++ b/packages/block-library/src/page-list/editor.scss
@@ -1,6 +1,6 @@
 .wp-block-navigation {
 	// Block wrapper gets the classes in the editor, and there's an extra div wrapper for now, so background styles need to be inherited.
-	.wp-block-pages > div,
+	.wp-block-page-list > div,
 	.wp-block-page-list {
 		background-color: inherit;
 	}
diff --git a/packages/block-library/src/pages/index.js b/packages/block-library/src/page-list/index.js
similarity index 90%
rename from packages/block-library/src/pages/index.js
rename to packages/block-library/src/page-list/index.js
index 30d9dd0a7cde8..aff5f2028fc5b 100644
--- a/packages/block-library/src/pages/index.js
+++ b/packages/block-library/src/page-list/index.js
@@ -15,7 +15,7 @@ const { name } = metadata;
 export { metadata, name };
 
 export const settings = {
-	title: _x( 'Pages', 'block title' ),
+	title: _x( 'Page List', 'block title' ),
 	description: __( 'Display a list of all pages.' ),
 	icon,
 	example: {},
diff --git a/packages/block-library/src/pages/index.php b/packages/block-library/src/page-list/index.php
similarity index 85%
rename from packages/block-library/src/pages/index.php
rename to packages/block-library/src/page-list/index.php
index d33079578353a..0169fa4ea4bdd 100644
--- a/packages/block-library/src/pages/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -12,7 +12,7 @@
  * @param  array $context Navigation block context.
  * @return array Colors CSS classes and inline styles.
  */
-function block_core_pages_build_css_colors( $context ) {
+function block_core_page_list_build_css_colors( $context ) {
 	$colors = array(
 		'css_classes'   => array(),
 		'inline_styles' => '',
@@ -64,7 +64,7 @@ function block_core_pages_build_css_colors( $context ) {
  * @param  array $context Navigation block context.
  * @return array Font size CSS classes and inline styles.
  */
-function block_core_pages_build_css_font_sizes( $context ) {
+function block_core_page_list_build_css_font_sizes( $context ) {
 	// CSS classes.
 	$font_sizes = array(
 		'css_classes'   => array(),
@@ -86,19 +86,19 @@ function block_core_pages_build_css_font_sizes( $context ) {
 }
 
 /**
- * Renders the `core/pages` block on server.
+ * 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 pages list/dropdown markup.
+ * @return string Returns the page list markup.
  */
-function render_block_core_pages( $attributes, $content, $block ) {
+function render_block_core_page_list( $attributes, $content, $block ) {
 	static $block_id = 0;
 	$block_id++;
 
-	$walker = new Walker_Pages_Block;
+	$walker = new Walker_Page_List_Block;
 
 	$args = array(
 		'echo'     => false,
@@ -109,8 +109,8 @@ function render_block_core_pages( $attributes, $content, $block ) {
 	$wrapper_markup = '<ul %1$s>%2$s</ul>';
 	$items_markup   = wp_list_pages( $args );
 
-	$colors          = block_core_pages_build_css_colors( $block->context );
-	$font_sizes      = block_core_pages_build_css_font_sizes( $block->context );
+	$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']
@@ -141,12 +141,12 @@ function render_block_core_pages( $attributes, $content, $block ) {
 /**
  * Registers the `core/pages` block on server.
  */
-function register_block_core_pages() {
+function register_block_core_page_list() {
 	register_block_type_from_metadata(
-		__DIR__ . '/pages',
+		__DIR__ . '/page-list',
 		array(
-			'render_callback' => 'render_block_core_pages',
+			'render_callback' => 'render_block_core_page_list',
 		)
 	);
 }
-add_action( 'init', 'register_block_core_pages' );
+add_action( 'init', 'register_block_core_page_list' );
diff --git a/packages/block-library/src/pages/style.scss b/packages/block-library/src/page-list/style.scss
similarity index 95%
rename from packages/block-library/src/pages/style.scss
rename to packages/block-library/src/page-list/style.scss
index 7c5aa3a496cdb..a1467168e7608 100644
--- a/packages/block-library/src/pages/style.scss
+++ b/packages/block-library/src/page-list/style.scss
@@ -1,9 +1,9 @@
-.wp-block-pages__submenu-icon {
+.wp-block-page-list__submenu-icon {
 	display: none;
 }
 
 .show-submenu-icons {
-	.wp-block-pages__submenu-icon {
+	.wp-block-page-list__submenu-icon {
 		display: block;
 		padding: 0.375em 1em 0.375em 0;
 	}
diff --git a/packages/block-library/src/style.scss b/packages/block-library/src/style.scss
index b2339a6dd6fea..f4c68ba875bb4 100644
--- a/packages/block-library/src/style.scss
+++ b/packages/block-library/src/style.scss
@@ -23,7 +23,7 @@
 @import "./media-text/style.scss";
 @import "./navigation/style.scss";
 @import "./navigation-link/style.scss";
-@import "./pages/style.scss";
+@import "./page-list/style.scss";
 @import "./paragraph/style.scss";
 @import "./post-author/style.scss";
 @import "./post-comments-form/style.scss";

From 16acfdaac4e86bd172db00b8901f394d262bef81 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Wed, 27 Jan 2021 17:58:33 +1100
Subject: [PATCH 06/16] Add pages icon

---
 packages/block-library/src/page-list/index.js |  2 +-
 packages/icons/src/index.js                   |  1 +
 packages/icons/src/library/pages.js           | 12 ++++++++++++
 3 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 packages/icons/src/library/pages.js

diff --git a/packages/block-library/src/page-list/index.js b/packages/block-library/src/page-list/index.js
index aff5f2028fc5b..bdda381adc02b 100644
--- a/packages/block-library/src/page-list/index.js
+++ b/packages/block-library/src/page-list/index.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { page as icon } from '@wordpress/icons';
+import { pages as icon } from '@wordpress/icons';
 import { __, _x } from '@wordpress/i18n';
 
 /**
diff --git a/packages/icons/src/index.js b/packages/icons/src/index.js
index 346c1cb42eba3..3e8aa25dd641d 100644
--- a/packages/icons/src/index.js
+++ b/packages/icons/src/index.js
@@ -119,6 +119,7 @@ export { default as moreVertical } from './library/more-vertical';
 export { default as navigation } from './library/navigation';
 export { default as pageBreak } from './library/page-break';
 export { default as page } from './library/page';
+export { default as pages } from './library/pages';
 export { default as paragraph } from './library/paragraph';
 export { default as payment } from './library/payment';
 export { default as percent } from './library/percent';
diff --git a/packages/icons/src/library/pages.js b/packages/icons/src/library/pages.js
new file mode 100644
index 0000000000000..7e7dff92cc71d
--- /dev/null
+++ b/packages/icons/src/library/pages.js
@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { SVG, Path } from '@wordpress/primitives';
+
+const pages = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M7 13.8h6v-1.5H7v1.5zM18 16V4c0-1.1-.9-2-2-2H6c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2zM5.5 16V4c0-.3.2-.5.5-.5h10c.3 0 .5.2.5.5v12c0 .3-.2.5-.5.5H6c-.3 0-.5-.2-.5-.5zM7 10.5h8V9H7v1.5zm0-3.3h8V5.8H7v1.4zM20.2 6v13c0 .7-.6 1.2-1.2 1.2H8v1.5h11c1.5 0 2.7-1.2 2.7-2.8V6h-1.5z" />
+	</SVG>
+);
+
+export default pages;

From 109433a7a14683e8b546fe6cb19ee6c462036936 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Thu, 28 Jan 2021 12:47:19 +1100
Subject: [PATCH 07/16] Add page list fixture

---
 .../e2e-tests/fixtures/blocks/core__page-list.html     |  1 +
 .../e2e-tests/fixtures/blocks/core__page-list.json     | 10 ++++++++++
 .../fixtures/blocks/core__page-list.parsed.json        |  9 +++++++++
 .../fixtures/blocks/core__page-list.serialized.html    |  1 +
 4 files changed, 21 insertions(+)
 create mode 100644 packages/e2e-tests/fixtures/blocks/core__page-list.html
 create mode 100644 packages/e2e-tests/fixtures/blocks/core__page-list.json
 create mode 100644 packages/e2e-tests/fixtures/blocks/core__page-list.parsed.json
 create mode 100644 packages/e2e-tests/fixtures/blocks/core__page-list.serialized.html

diff --git a/packages/e2e-tests/fixtures/blocks/core__page-list.html b/packages/e2e-tests/fixtures/blocks/core__page-list.html
new file mode 100644
index 0000000000000..c17450f4f34a9
--- /dev/null
+++ b/packages/e2e-tests/fixtures/blocks/core__page-list.html
@@ -0,0 +1 @@
+<!-- wp:core/page-list /-->
\ No newline at end of file
diff --git a/packages/e2e-tests/fixtures/blocks/core__page-list.json b/packages/e2e-tests/fixtures/blocks/core__page-list.json
new file mode 100644
index 0000000000000..df189be152f5b
--- /dev/null
+++ b/packages/e2e-tests/fixtures/blocks/core__page-list.json
@@ -0,0 +1,10 @@
+[
+    {
+        "clientId": "_clientId_0",
+        "name": "core/page-list",
+        "isValid": true,
+        "attributes": {},
+        "innerBlocks": [],
+        "originalContent": ""
+    }
+]
diff --git a/packages/e2e-tests/fixtures/blocks/core__page-list.parsed.json b/packages/e2e-tests/fixtures/blocks/core__page-list.parsed.json
new file mode 100644
index 0000000000000..3cc84a0f5c4ed
--- /dev/null
+++ b/packages/e2e-tests/fixtures/blocks/core__page-list.parsed.json
@@ -0,0 +1,9 @@
+[
+    {
+        "blockName": "core/page-list",
+        "attrs": {},
+        "innerBlocks": [],
+        "innerHTML": "",
+        "innerContent": []
+    }
+]
diff --git a/packages/e2e-tests/fixtures/blocks/core__page-list.serialized.html b/packages/e2e-tests/fixtures/blocks/core__page-list.serialized.html
new file mode 100644
index 0000000000000..8f4e614a2eaa0
--- /dev/null
+++ b/packages/e2e-tests/fixtures/blocks/core__page-list.serialized.html
@@ -0,0 +1 @@
+<!-- wp:page-list /-->

From a47670aae1a2c769002aed33bb65a1cb16c64cea Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Thu, 28 Jan 2021 13:40:10 +1100
Subject: [PATCH 08/16] Update nav screen snapshot

---
 .../__snapshots__/navigation-editor.test.js.snap            | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/packages/e2e-tests/specs/experiments/__snapshots__/navigation-editor.test.js.snap b/packages/e2e-tests/specs/experiments/__snapshots__/navigation-editor.test.js.snap
index a611ece15ba24..67b195b021c0e 100644
--- a/packages/e2e-tests/specs/experiments/__snapshots__/navigation-editor.test.js.snap
+++ b/packages/e2e-tests/specs/experiments/__snapshots__/navigation-editor.test.js.snap
@@ -2,11 +2,7 @@
 
 exports[`Navigation editor allows creation of a menu 1`] = `
 "<!-- wp:navigation -->
-<!-- wp:navigation-link {\\"label\\":\\"Home\\",\\"type\\":\\"page\\",\\"id\\":1,\\"url\\":\\"https://this/is/a/test/page/home\\"} /-->
-
-<!-- wp:navigation-link {\\"label\\":\\"About\\",\\"type\\":\\"page\\",\\"id\\":2,\\"url\\":\\"https://this/is/a/test/page/about\\"} /-->
-
-<!-- wp:navigation-link {\\"label\\":\\"Contact\\",\\"type\\":\\"page\\",\\"id\\":3,\\"url\\":\\"https://this/is/a/test/page/contact\\"} /-->
+<!-- wp:page-list /-->
 <!-- /wp:navigation -->"
 `;
 

From f99a55e965bac4814f7717c62a9201299d1618a8 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 29 Jan 2021 15:39:07 +1100
Subject: [PATCH 09/16] Fix placeholder and dropdown background

---
 .../block-library/src/page-list/editor.scss     | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/packages/block-library/src/page-list/editor.scss b/packages/block-library/src/page-list/editor.scss
index a09a91f4d60c7..cb4474c05f8ef 100644
--- a/packages/block-library/src/page-list/editor.scss
+++ b/packages/block-library/src/page-list/editor.scss
@@ -8,4 +8,21 @@
 	.page_item a {
 		pointer-events: none;
 	}
+	// Make the dropdown background white if there's no background color set.
+	&:not(.has-background) {
+		.children {
+			color: $gray-900;
+			background-color: $white;
+		}
+	}
+}
+
+.wp-block-page-list .components-placeholder {
+	min-height: 0;
+	padding: 0;
+	background-color: inherit;
+
+	.components-spinner {
+		margin-top: 0;
+	}
 }

From 1c59e8f11fdb50d43e5e51a913892cc029dd21d5 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 29 Jan 2021 16:32:43 +1100
Subject: [PATCH 10/16] Use context and add keywords

---
 packages/block-library/src/page-list/edit.js  | 18 +++---------------
 packages/block-library/src/page-list/index.js |  1 +
 2 files changed, 4 insertions(+), 15 deletions(-)

diff --git a/packages/block-library/src/page-list/edit.js b/packages/block-library/src/page-list/edit.js
index 56f051479b611..8d9b42603b354 100644
--- a/packages/block-library/src/page-list/edit.js
+++ b/packages/block-library/src/page-list/edit.js
@@ -9,21 +9,9 @@ import classnames from 'classnames';
 
 import { useBlockProps } from '@wordpress/block-editor';
 import ServerSideRender from '@wordpress/server-side-render';
-import { useSelect } from '@wordpress/data';
 
-export default function PageListEdit( { clientId } ) {
-	const navigationBlockAttributes = useSelect( ( select ) => {
-		const { getBlockAttributes, getBlockParentsByBlockName } = select(
-			'core/block-editor'
-		);
-		const parentBlock = getBlockParentsByBlockName(
-			clientId,
-			'core/navigation'
-		)[ 0 ];
-		return getBlockAttributes( parentBlock );
-	} );
-	const showSubmenuIcon = !! navigationBlockAttributes?.showSubmenuIcon;
-	const { textColor, backgroundColor } = navigationBlockAttributes || {};
+export default function PageListEdit( { context } ) {
+	const { textColor, backgroundColor, showSubmenuIcon } = context || {};
 
 	const blockProps = useBlockProps( {
 		className: classnames( {
@@ -31,7 +19,7 @@ export default function PageListEdit( { clientId } ) {
 			[ `has-${ textColor }-color` ]: !! textColor,
 			'has-background': !! backgroundColor,
 			[ `has-${ backgroundColor }-background-color` ]: !! backgroundColor,
-			'show-submenu-icons': showSubmenuIcon,
+			'show-submenu-icons': !! showSubmenuIcon,
 		} ),
 	} );
 
diff --git a/packages/block-library/src/page-list/index.js b/packages/block-library/src/page-list/index.js
index bdda381adc02b..f75a945716b50 100644
--- a/packages/block-library/src/page-list/index.js
+++ b/packages/block-library/src/page-list/index.js
@@ -17,6 +17,7 @@ export { metadata, name };
 export const settings = {
 	title: _x( 'Page List', 'block title' ),
 	description: __( 'Display a list of all pages.' ),
+	keywords: [ __( 'menu' ), __( 'navigation' ) ],
 	icon,
 	example: {},
 	edit,

From b5bf8654966340dff601342670efbbf94b10f5b9 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Mon, 1 Feb 2021 14:04:12 +1100
Subject: [PATCH 11/16] Fix clickability and remove extra classname.

---
 packages/block-library/src/page-list/editor.scss | 11 +++++++----
 packages/block-library/src/page-list/index.php   |  2 --
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/packages/block-library/src/page-list/editor.scss b/packages/block-library/src/page-list/editor.scss
index cb4474c05f8ef..294bcfae46252 100644
--- a/packages/block-library/src/page-list/editor.scss
+++ b/packages/block-library/src/page-list/editor.scss
@@ -4,10 +4,6 @@
 	.wp-block-page-list {
 		background-color: inherit;
 	}
-	// Make links unclickable in the editor
-	.page_item a {
-		pointer-events: none;
-	}
 	// Make the dropdown background white if there's no background color set.
 	&:not(.has-background) {
 		.children {
@@ -17,6 +13,13 @@
 	}
 }
 
+.wp-block-page-list {
+	// Make links unclickable in the editor
+	.page_item a {
+		pointer-events: none;
+	}
+}
+
 .wp-block-page-list .components-placeholder {
 	min-height: 0;
 	padding: 0;
diff --git a/packages/block-library/src/page-list/index.php b/packages/block-library/src/page-list/index.php
index 0169fa4ea4bdd..82de64cf70907 100644
--- a/packages/block-library/src/page-list/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -118,8 +118,6 @@ function render_block_core_page_list( $attributes, $content, $block ) {
 	$style_attribute = ( $colors['inline_styles'] || $font_sizes['inline_styles'] );
 	$css_classes     = trim( implode( ' ', $classes ) );
 
-	$css_classes .= ' wp-block-page-list';
-
 	if ( $block->context && $block->context['showSubmenuIcon'] ) {
 		$css_classes .= ' show-submenu-icons';
 	}

From 7544616ff7b213e5792bd4f650d6f95a55fa7881 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Mon, 1 Feb 2021 15:36:43 +1100
Subject: [PATCH 12/16] Test presence of pages block items

---
 .../e2e-tests/specs/experiments/navigation-editor.test.js   | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/e2e-tests/specs/experiments/navigation-editor.test.js b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
index 44a6d5a802986..32345e8e6db51 100644
--- a/packages/e2e-tests/specs/experiments/navigation-editor.test.js
+++ b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
@@ -204,7 +204,13 @@ describe( 'Navigation editor', () => {
 		);
 		await addAllPagesButton.click();
 
+		await page.waitForXPath( '//a[contains(., "Sample Page")]' );
+
 		expect( await getSerializedBlocks() ).toMatchSnapshot();
+
+		const allPageItems = await page.$$( '.page_item' );
+
+		expect( allPageItems.length ).toBe( 1 );
 	} );
 
 	it( 'displays the first menu from the REST response when at least one menu exists', async () => {

From 02ce0c0bd3ce2210f9aeb00d56282b2f405f5e97 Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Wed, 3 Feb 2021 14:16:57 +1100
Subject: [PATCH 13/16] Replace walker with manual iteration

---
 lib/class-walker-page-list-block.php          | 35 -------
 lib/load.php                                  |  3 -
 .../block-library/src/page-list/editor.scss   | 10 +-
 .../block-library/src/page-list/index.php     | 99 ++++++++++++++++---
 .../block-library/src/page-list/style.scss    | 18 ++--
 5 files changed, 98 insertions(+), 67 deletions(-)
 delete mode 100644 lib/class-walker-page-list-block.php

diff --git a/lib/class-walker-page-list-block.php b/lib/class-walker-page-list-block.php
deleted file mode 100644
index 46db174a1c28a..0000000000000
--- a/lib/class-walker-page-list-block.php
+++ /dev/null
@@ -1,35 +0,0 @@
-<?php
-/**
- * Walker_Page_List_Block class.
- *
- * @package gutenberg
- */
-
-/**
- * Class that adds submenu dropdown indicators to Page List block.
- */
-class Walker_Page_List_Block extends Walker_Page {
-	/**
-	 * Outputs the beginning of the current level in the tree before elements are output.
-	 *
-	 * @since 2.1.0
-	 *
-	 * @see Walker::start_lvl()
-	 *
-	 * @param string $output Used to append additional content (passed by reference).
-	 * @param int    $depth  Optional. Depth of page. Used for padding. Default 0.
-	 * @param array  $args   Optional. Arguments for outputting the next level.
-	 *                       Default empty array.
-	 */
-	public function start_lvl( &$output, $depth = 0, $args = array() ) {
-		if ( isset( $args['item_spacing'] ) && 'preserve' === $args['item_spacing'] ) {
-			$t = "\t";
-			$n = "\n";
-		} else {
-			$t = '';
-			$n = '';
-		}
-		$indent  = str_repeat( $t, $depth );
-		$output .= "<span class='wp-block-page-list__submenu-icon'><svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' transform='rotate(90)'><path d='M8 5v14l11-7z'/><path d='M0 0h24v24H0z' fill='none'/></svg></span>{$n}{$indent}<ul class='children'>{$n}";
-	}
-}
diff --git a/lib/load.php b/lib/load.php
index 723117502e315..7772cac90e15e 100644
--- a/lib/load.php
+++ b/lib/load.php
@@ -123,6 +123,3 @@ function gutenberg_is_experiment_enabled( $name ) {
 require __DIR__ . '/block-supports/typography.php';
 require __DIR__ . '/block-supports/custom-classname.php';
 require __DIR__ . '/block-supports/border.php';
-
-/* Page Walker class extension for Page List Block */
-require_once __DIR__ . '/class-walker-page-list-block.php';
diff --git a/packages/block-library/src/page-list/editor.scss b/packages/block-library/src/page-list/editor.scss
index 294bcfae46252..1cda12d87ac8c 100644
--- a/packages/block-library/src/page-list/editor.scss
+++ b/packages/block-library/src/page-list/editor.scss
@@ -6,18 +6,16 @@
 	}
 	// Make the dropdown background white if there's no background color set.
 	&:not(.has-background) {
-		.children {
+		.submenu-container {
 			color: $gray-900;
 			background-color: $white;
 		}
 	}
 }
 
-.wp-block-page-list {
-	// Make links unclickable in the editor
-	.page_item a {
-		pointer-events: none;
-	}
+// Make links unclickable in the editor
+.wp-block-pages-list__item__link {
+	pointer-events: none;
 }
 
 .wp-block-page-list .components-placeholder {
diff --git a/packages/block-library/src/page-list/index.php b/packages/block-library/src/page-list/index.php
index 82de64cf70907..3188395b51a1a 100644
--- a/packages/block-library/src/page-list/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -86,28 +86,95 @@ function block_core_page_list_build_css_font_sizes( $context ) {
 }
 
 /**
- * Renders the `core/page-list` block on server.
+ * Outputs Page list markup from an array of pages with nested children.
  *
- * @param array $attributes The block attributes.
- * @param array $content The saved content.
- * @param array $block The parsed block.
+ * @param array $nested_pages The array of nested pages.
+ * @param bool  $render_submenu_icon Whether to render a submenu icon for nested lists.
  *
- * @return string Returns the page list markup.
+ * @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 = array( 'wp-block-pages-list__item' );
+		if ( isset( $page['children'] ) ) {
+			$css_class[] = 'has-child';
+		}
+		$markup .= '<li class="' . implode( ' ', $css_class ) . '">';
+		$markup .= '<a class="wp-block-pages-list__item__link" href="' . $page['link'] . '">' . $page['title'] . '</a>';
+		if ( isset( $page['children'] ) ) {
+			$markup .= '<span class="wp-block-page-list__submenu-icon"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" transform="rotate(90)"><path d="M8 5v14l11-7z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span>';
+			$markup .= '<ul class="submenu-container">' . render_nested_page_list( $page['children'] ) . '</ul>';
+		}
+		$markup .= '</li>';
+	}
+	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;
+	}
+	$nested_array = array();
+	foreach ( (array) $current_level as $key => $current ) {
+		if ( isset( $children[ $key ] ) ) {
+			$current['children'] = nest_pages( $children[ $key ], $children );
+		}
+		$nested_array[] = $current;
+	}
+	return $nested_array;
+}
+
+	/**
+	 * 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++;
 
-	$walker = new Walker_Page_List_Block;
+	$all_pages = get_pages();
 
-	$args = array(
-		'echo'     => false,
-		'title_li' => '',
-		'walker'   => $walker,
-	);
+	$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 = '<ul %1$s>%2$s</ul>';
-	$items_markup   = wp_list_pages( $args );
+
+	$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 );
@@ -136,9 +203,9 @@ function render_block_core_page_list( $attributes, $content, $block ) {
 	);
 }
 
-/**
- * Registers the `core/pages` block on server.
- */
+	/**
+	 * Registers the `core/pages` block on server.
+	 */
 function register_block_core_page_list() {
 	register_block_type_from_metadata(
 		__DIR__ . '/page-list',
@@ -147,4 +214,4 @@ function register_block_core_page_list() {
 		)
 	);
 }
-add_action( 'init', 'register_block_core_page_list' );
+	add_action( 'init', 'register_block_core_page_list' );
diff --git a/packages/block-library/src/page-list/style.scss b/packages/block-library/src/page-list/style.scss
index a1467168e7608..9c65b730255b2 100644
--- a/packages/block-library/src/page-list/style.scss
+++ b/packages/block-library/src/page-list/style.scss
@@ -6,6 +6,10 @@
 	.wp-block-page-list__submenu-icon {
 		display: block;
 		padding: 0.375em 1em 0.375em 0;
+
+		svg {
+			fill: currentColor;
+		}
 	}
 }
 
@@ -15,13 +19,13 @@
 		display: flex;
 		flex-wrap: wrap;
 	}
-	.page_item a {
+	.wp-block-pages-list__item__link {
 		display: block;
 		color: inherit;
 		padding: 0.5em 1em;
 	}
 
-	.page_item_has_children {
+	.wp-block-pages-list__item.has-child {
 		display: flex;
 		position: relative;
 		background-color: inherit;
@@ -29,7 +33,7 @@
 		> a {
 			padding-right: 0.5em;
 		}
-		> .children {
+		> .submenu-container {
 			border: $border-width solid rgba(0, 0, 0, 0.15);
 			background-color: inherit;
 			color: inherit;
@@ -46,7 +50,7 @@
 				left: 1.5em;
 
 				// Nested submenus sit to the left on large breakpoints
-				.children {
+				.submenu-container {
 					left: 100%;
 					top: -1px;
 
@@ -71,7 +75,7 @@
 		&:hover {
 			cursor: pointer;
 
-			> .children {
+			> .submenu-container {
 				visibility: visible;
 				opacity: 1;
 			}
@@ -80,14 +84,14 @@
 		&:focus-within {
 			cursor: pointer;
 
-			> .children {
+			> .submenu-container {
 				visibility: visible;
 				opacity: 1;
 			}
 		}
 	}
 
-	.children {
+	.submenu-container {
 		padding: 0;
 	}
 }

From 15e8a89f8b4fddb1af9331be61833f5f22824a6b Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Wed, 3 Feb 2021 15:06:04 +1100
Subject: [PATCH 14/16] Fix tests

---
 packages/block-library/src/page-list/index.php                 | 1 -
 packages/e2e-tests/specs/experiments/navigation-editor.test.js | 2 +-
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/block-library/src/page-list/index.php b/packages/block-library/src/page-list/index.php
index 3188395b51a1a..5fd37f9ed79f9 100644
--- a/packages/block-library/src/page-list/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -89,7 +89,6 @@ function block_core_page_list_build_css_font_sizes( $context ) {
  * Outputs Page list markup from an array of pages with nested children.
  *
  * @param array $nested_pages The array of nested pages.
- * @param bool  $render_submenu_icon Whether to render a submenu icon for nested lists.
  *
  * @return string List markup.
  */
diff --git a/packages/e2e-tests/specs/experiments/navigation-editor.test.js b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
index 32345e8e6db51..35bc799ead1f9 100644
--- a/packages/e2e-tests/specs/experiments/navigation-editor.test.js
+++ b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
@@ -208,7 +208,7 @@ describe( 'Navigation editor', () => {
 
 		expect( await getSerializedBlocks() ).toMatchSnapshot();
 
-		const allPageItems = await page.$$( '.page_item' );
+		const allPageItems = await page.$$( '.wp-block-pages-list__item' );
 
 		expect( allPageItems.length ).toBe( 1 );
 	} );

From a2ee2593b24b22bba5ac2a331acedd2804ef690a Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Fri, 5 Feb 2021 15:25:06 +1100
Subject: [PATCH 15/16] Address review feedback

---
 .../block-library/src/page-list/block.json    |  2 +-
 .../block-library/src/page-list/index.php     | 17 +++----
 .../experiments/navigation-editor.test.js     | 45 -------------------
 3 files changed, 10 insertions(+), 54 deletions(-)

diff --git a/packages/block-library/src/page-list/block.json b/packages/block-library/src/page-list/block.json
index f148ab71852af..1f7a1fe999350 100644
--- a/packages/block-library/src/page-list/block.json
+++ b/packages/block-library/src/page-list/block.json
@@ -17,4 +17,4 @@
 	},
 	"editorStyle": "wp-block-page-list-editor",
 	"style": "wp-block-page-list"
-}
\ No newline at end of file
+}
diff --git a/packages/block-library/src/page-list/index.php b/packages/block-library/src/page-list/index.php
index 5fd37f9ed79f9..018af65f2b6d5 100644
--- a/packages/block-library/src/page-list/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -98,12 +98,15 @@ function render_nested_page_list( $nested_pages ) {
 	}
 	$markup = '';
 	foreach ( (array) $nested_pages as $page ) {
-		$css_class = array( 'wp-block-pages-list__item' );
+		$css_class = 'wp-block-pages-list__item';
 		if ( isset( $page['children'] ) ) {
-			$css_class[] = 'has-child';
+			$css_class .= ' has-child';
 		}
-		$markup .= '<li class="' . implode( ' ', $css_class ) . '">';
-		$markup .= '<a class="wp-block-pages-list__item__link" href="' . $page['link'] . '">' . $page['title'] . '</a>';
+		$markup .= '<li class="' . $css_class . '">';
+		$markup .= '<a class="wp-block-pages-list__item__link" href="' . esc_url( $page['link'] ) . '">' . wp_kses(
+			$page['title'],
+			wp_kses_allowed_html( 'post' )
+		) . '</a>';
 		if ( isset( $page['children'] ) ) {
 			$markup .= '<span class="wp-block-page-list__submenu-icon"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" transform="rotate(90)"><path d="M8 5v14l11-7z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span>';
 			$markup .= '<ul class="submenu-container">' . render_nested_page_list( $page['children'] ) . '</ul>';
@@ -125,14 +128,12 @@ function nest_pages( $current_level, $children ) {
 	if ( empty( $current_level ) ) {
 		return;
 	}
-	$nested_array = array();
 	foreach ( (array) $current_level as $key => $current ) {
 		if ( isset( $children[ $key ] ) ) {
-			$current['children'] = nest_pages( $children[ $key ], $children );
+			$current_level[ $key ]['children'] = nest_pages( $children[ $key ], $children );
 		}
-		$nested_array[] = $current;
 	}
-	return $nested_array;
+	return $current_level;
 }
 
 	/**
diff --git a/packages/e2e-tests/specs/experiments/navigation-editor.test.js b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
index 35bc799ead1f9..757f7e753523b 100644
--- a/packages/e2e-tests/specs/experiments/navigation-editor.test.js
+++ b/packages/e2e-tests/specs/experiments/navigation-editor.test.js
@@ -29,21 +29,6 @@ const menusFixture = [
 	},
 ];
 
-const pagesFixture = [
-	{
-		title: 'Home',
-		slug: 'home',
-	},
-	{
-		title: 'About',
-		slug: 'about',
-	},
-	{
-		title: 'Contact',
-		slug: 'contact',
-	},
-];
-
 // Matching against variations of the same URL encoded and non-encoded
 // produces the most reliable mocking.
 const REST_MENUS_ROUTES = [
@@ -54,10 +39,6 @@ const REST_MENU_ITEMS_ROUTES = [
 	'/__experimental/menu-items',
 	`rest_route=${ encodeURIComponent( '/__experimental/menu-items' ) }`,
 ];
-const REST_PAGES_ROUTES = [
-	'/wp/v2/pages',
-	`rest_route=${ encodeURIComponent( '/wp/v2/pages' ) }`,
-];
 
 /**
  * Determines if a given URL matches any of a given collection of
@@ -99,18 +80,6 @@ function assignMockMenuIds( menus ) {
 		: [];
 }
 
-function createMockPages( pages ) {
-	return pages.map( ( { title, slug }, index ) => ( {
-		id: index + 1,
-		type: 'page',
-		link: `https://this/is/a/test/page/${ slug }`,
-		title: {
-			rendered: title,
-			raw: title,
-		},
-	} ) );
-}
-
 function getMenuMocks( responsesByMethod ) {
 	return getEndpointMocks( REST_MENUS_ROUTES, responsesByMethod );
 }
@@ -119,10 +88,6 @@ function getMenuItemMocks( responsesByMethod ) {
 	return getEndpointMocks( REST_MENU_ITEMS_ROUTES, responsesByMethod );
 }
 
-function getPagesMocks( responsesByMethod ) {
-	return getEndpointMocks( REST_PAGES_ROUTES, responsesByMethod );
-}
-
 async function visitNavigationEditor() {
 	const query = addQueryArgs( '', {
 		page: 'gutenberg-navigation',
@@ -143,8 +108,6 @@ describe( 'Navigation editor', () => {
 	} );
 
 	it( 'allows creation of a menu', async () => {
-		const pagesResponse = createMockPages( pagesFixture );
-
 		const menuResponse = {
 			id: 4,
 			description: '',
@@ -158,7 +121,6 @@ describe( 'Navigation editor', () => {
 		await setUpResponseMocking( [
 			...getMenuMocks( { GET: [] } ),
 			...getMenuItemMocks( { GET: [] } ),
-			...getPagesMocks( { GET: pagesResponse } ),
 		] );
 		await visitNavigationEditor();
 
@@ -172,7 +134,6 @@ describe( 'Navigation editor', () => {
 				POST: menuResponse,
 			} ),
 			...getMenuItemMocks( { GET: [] } ),
-			...getPagesMocks( { GET: pagesResponse } ),
 		] );
 
 		// Add a new menu.
@@ -204,13 +165,7 @@ describe( 'Navigation editor', () => {
 		);
 		await addAllPagesButton.click();
 
-		await page.waitForXPath( '//a[contains(., "Sample Page")]' );
-
 		expect( await getSerializedBlocks() ).toMatchSnapshot();
-
-		const allPageItems = await page.$$( '.wp-block-pages-list__item' );
-
-		expect( allPageItems.length ).toBe( 1 );
 	} );
 
 	it( 'displays the first menu from the REST response when at least one menu exists', async () => {

From 014b7c1471c55749264001d7f22bcce8e79795bf Mon Sep 17 00:00:00 2001
From: tellthemachines <isabel@tellthemachines.com>
Date: Mon, 8 Feb 2021 11:31:48 +1100
Subject: [PATCH 16/16] Order menu items and de-indent comment.

---
 .../block-library/src/page-list/index.php     | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/packages/block-library/src/page-list/index.php b/packages/block-library/src/page-list/index.php
index 018af65f2b6d5..bd607ad4879d9 100644
--- a/packages/block-library/src/page-list/index.php
+++ b/packages/block-library/src/page-list/index.php
@@ -136,20 +136,20 @@ function nest_pages( $current_level, $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.
-	 */
+/**
+ * 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++;
 
-	$all_pages = get_pages();
+	$all_pages = get_pages( array( 'sort_column' => 'menu_order' ) );
 
 	$top_level_pages = array();