[Block Library]Rename QueryLoop to PostTemplate and change Query label

lib/block-patterns.php

@@ -21,15 +21,15 @@ function register_gutenberg_patterns() {
 			'categories' => array( 'query' ),
 			'content'    => '<!-- wp:query {"query":{"perPage":1,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false}} -->
 							<div class="wp-block-query">
-							<!-- wp:query-loop -->
+							<!-- wp:post-template -->
 							<!-- wp:post-title {"isLink":true} /-->
 							<!-- wp:post-featured-image  {"isLink":true,"align":"wide"} /-->
 							<!-- wp:post-excerpt /-->
 							<!-- wp:separator -->
 							<hr class="wp-block-separator"/>
 							<!-- /wp:separator -->
 							<!-- wp:post-date /-->
-							<!-- /wp:query-loop -->
+							<!-- /wp:post-template -->
 							</div>
 							<!-- /wp:query -->',
 		),
@@ -39,7 +39,7 @@ function register_gutenberg_patterns() {
 			'categories' => array( 'query' ),
 			'content'    => '<!-- wp:query {"query":{"perPage":1,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false}} -->
 							<div class="wp-block-query">
-							<!-- wp:query-loop -->
+							<!-- wp:post-template -->
 							<!-- wp:columns {"align":"wide"} -->
 							<div class="wp-block-columns alignwide"><!-- wp:column {"width":"66.66%"} -->
 							<div class="wp-block-column" style="flex-basis:66.66%"><!-- wp:post-featured-image {"isLink":true} /--></div>
@@ -49,7 +49,7 @@ function register_gutenberg_patterns() {
 							<!-- wp:post-excerpt /--></div>
 							<!-- /wp:column --></div>
 							<!-- /wp:columns -->
-							<!-- /wp:query-loop -->
+							<!-- /wp:post-template -->
 							</div>
 							<!-- /wp:query -->',
 		),
@@ -59,7 +59,7 @@ function register_gutenberg_patterns() {
 			'categories' => array( 'query' ),
 			'content'    => '<!-- wp:query {"query":{"perPage":1,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false}} -->
 							<div class="wp-block-query">
-							<!-- wp:query-loop -->
+							<!-- wp:post-template -->
 							<!-- wp:columns {"verticalAlignment":"center"} -->
 							<div class="wp-block-columns are-vertically-aligned-center"><!-- wp:column {"verticalAlignment":"center","width":"25%"} -->
 							<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:25%"><!-- wp:post-featured-image {"isLink":true} /--></div>
@@ -68,7 +68,7 @@ function register_gutenberg_patterns() {
 							<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:75%"><!-- wp:post-title {"isLink":true} /--></div>
 							<!-- /wp:column --></div>
 							<!-- /wp:columns -->
-							<!-- /wp:query-loop -->
+							<!-- /wp:post-template -->
 							</div>
 							<!-- /wp:query -->',
 		),
@@ -78,13 +78,13 @@ function register_gutenberg_patterns() {
 			'categories' => array( 'query' ),
 			'content'    => '<!-- wp:query {"query":{"perPage":6,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"flex","columns":3}} -->
 							<div class="wp-block-query">
-							<!-- wp:query-loop -->
+							<!-- wp:post-template -->
 							<!-- wp:group {"tagName":"main","style":{"spacing":{"padding":{"top":"30px","right":"30px","bottom":"30px","left":"30px"}}},"layout":{"inherit":false}} -->
 							<main class="wp-block-group" style="padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px"><!-- wp:post-title {"isLink":true} /-->
 							<!-- wp:post-excerpt {"wordCount":20} /-->
 							<!-- wp:post-date /--></div>
 							<!-- /wp:group -->
-							<!-- /wp:query-loop -->
+							<!-- /wp:post-template -->
 							</div>
 							<!-- /wp:query -->',
 		),
@@ -94,7 +94,7 @@ function register_gutenberg_patterns() {
 			'categories' => array( 'query' ),
 			'content'    => '<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"100px","right":"100px","bottom":"100px","left":"100px"}},"color":{"text":"#ffffff","background":"#000000"}}} -->
 							<div class="wp-block-group alignfull has-text-color has-background" style="background-color:#000000;color:#ffffff;padding-top:100px;padding-right:100px;padding-bottom:100px;padding-left:100px"><!-- wp:query {"query":{"perPage":3,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":false}} -->
-							<div class="wp-block-query"><!-- wp:query-loop -->
+							<div class="wp-block-query"><!-- wp:post-template -->
 							<!-- wp:separator {"customColor":"#ffffff","align":"wide","className":"is-style-wide"} -->
 							<hr class="wp-block-separator alignwide has-text-color has-background is-style-wide" style="background-color:#ffffff;color:#ffffff"/>
 							<!-- /wp:separator -->
@@ -108,7 +108,7 @@ function register_gutenberg_patterns() {
 							<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:80%"><!-- wp:post-title {"isLink":true,"style":{"typography":{"fontSize":"72px","lineHeight":"1.1"},"color":{"text":"#ffffff","link":"#ffffff"}}} /--></div>
 							<!-- /wp:column --></div>
 							<!-- /wp:columns -->
-							<!-- /wp:query-loop --></div>
+							<!-- /wp:post-template --></div>
 							<!-- /wp:query --></div>
 							<!-- /wp:group -->',
 		),
@@ -120,26 +120,26 @@ function register_gutenberg_patterns() {
 							<main class="wp-block-group" style="padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px"><!-- wp:columns -->
 							<div class="wp-block-columns"><!-- wp:column {"width":"50%"} -->
 							<div class="wp-block-column" style="flex-basis:50%"><!-- wp:query {"query":{"perPage":2,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"list"}} -->
-							<div class="wp-block-query"><!-- wp:query-loop -->
+							<div class="wp-block-query"><!-- wp:post-template -->
 							<!-- wp:post-featured-image /-->
 							<!-- wp:post-title /-->
 							<!-- wp:post-date /-->
 							<!-- wp:spacer {"height":200} -->
 							<div style="height:200px" aria-hidden="true" class="wp-block-spacer"></div>
 							<!-- /wp:spacer -->
-							<!-- /wp:query-loop --></div>
+							<!-- /wp:post-template --></div>
 							<!-- /wp:query --></div>
 							<!-- /wp:column -->
 							<!-- wp:column {"width":"50%"} -->
 							<div class="wp-block-column" style="flex-basis:50%"><!-- wp:query {"query":{"perPage":2,"pages":0,"offset":2,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"exclude","inherit":false},"displayLayout":{"type":"list"}} -->
-							<div class="wp-block-query"><!-- wp:query-loop -->
+							<div class="wp-block-query"><!-- wp:post-template -->
 							<!-- wp:spacer {"height":200} -->
 							<div style="height:200px" aria-hidden="true" class="wp-block-spacer"></div>
 							<!-- /wp:spacer -->
 							<!-- wp:post-featured-image /-->
 							<!-- wp:post-title /-->
 							<!-- wp:post-date /-->
-							<!-- /wp:query-loop --></div>
+							<!-- /wp:post-template --></div>
 							<!-- /wp:query --></div>
 							<!-- /wp:column --></div>
 							<!-- /wp:columns --></main>

lib/blocks.php

@@ -102,7 +102,7 @@ function gutenberg_reregister_core_block_types() {
 				'post-navigation-link.php'      => 'core/post-navigation-link',
 				'post-title.php'                => 'core/post-title',
 				'query.php'                     => 'core/query',
-				'query-loop.php'                => 'core/query-loop',
+				'post-template.php'             => 'core/post-template',
 				'query-title.php'               => 'core/query-title',
 				'query-pagination.php'          => 'core/query-pagination',
 				'query-pagination-next.php'     => 'core/query-pagination-next',

packages/block-library/src/editor.scss

@@ -46,7 +46,7 @@
 @import "./text-columns/editor.scss";
 @import "./video/editor.scss";
 @import "./query-title/editor.scss";
-@import "./query-loop/editor.scss";
+@import "./post-template/editor.scss";
 @import "./query/editor.scss";
 @import "./query-pagination/editor.scss";
 @import "./query-pagination-numbers/editor.scss";

packages/block-library/src/index.js

@@ -70,7 +70,7 @@ import * as siteTagline from './site-tagline';
 import * as siteTitle from './site-title';
 import * as templatePart from './template-part';
 import * as query from './query';
-import * as queryLoop from './query-loop';
+import * as postTemplate from './post-template';
 import * as queryTitle from './query-title';
 import * as queryPagination from './query-pagination';
 import * as queryPaginationNext from './query-pagination-next';
@@ -175,7 +175,7 @@ export const __experimentalGetCoreBlocks = () => [
 	siteTitle,
 
 	query,
-	queryLoop,
+	postTemplate,
 	queryTitle,
 	queryPagination,
 	queryPaginationNext,

packages/block-library/src/query-loop/block.json → packages/block-library/src/post-template/block.json

@@ -1,10 +1,10 @@
 {
 	"apiVersion": 2,
-	"name": "core/query-loop",
-	"title": "Query Loop",
+	"name": "core/post-template",
+	"title": "Post Template",
 	"category": "design",
 	"parent": [ "core/query" ],
-	"description": "Query loop.",
+	"description": "Post Template.",
 	"textdomain": "default",
 	"usesContext": [
 		"queryId",
@@ -18,6 +18,6 @@
 		"html": false,
 		"align": true
 	},
-	"style": "wp-block-query-loop",
-	"editorStyle": "wp-block-query-loop-editor"
+	"style": "wp-block-post-template",
+	"editorStyle": "wp-block-post-template-editor"
 }

packages/block-library/src/query-loop/edit.js → packages/block-library/src/post-template/edit.js

@@ -24,7 +24,7 @@ const TEMPLATE = [
 	[ 'core/post-date' ],
 	[ 'core/post-excerpt' ],
 ];
-export default function QueryLoopEdit( {
+export default function PostTemplateEdit( {
 	clientId,
 	context: {
 		query: {

packages/block-library/src/query-loop/editor.scss → packages/block-library/src/post-template/editor.scss

@@ -1,5 +1,5 @@
 .editor-styles-wrapper {
-	ul.wp-block-query-loop {
+	ul.wp-block-post-template {
 		padding-left: 0;
 		margin-left: 0;
 		list-style: none;

packages/block-library/src/post-template/index.php

@@ -0,0 +1,149 @@
+<?php
+/**
+ * Server-side rendering of the `core/post-template` block.
+ *
+ * @package WordPress
+ */
+
+/**
+ * Renders the `core/post-template` block on the server.
+ *
+ * @param array    $attributes Block attributes.
+ * @param string   $content    Block default content.
+ * @param WP_Block $block      Block instance.
+ *
+ * @return string Returns the output of the query, structured using the layout defined by the block's inner blocks.
+ */
+function render_block_core_post_template( $attributes, $content, $block ) {
+	$page_key = isset( $block->context['queryId'] ) ? 'query-' . $block->context['queryId'] . '-page' : 'query-page';
+	$page     = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ];
+
+	$query_args = build_query_vars_from_query_block( $block, $page );
+	// Override the custom query with the global query if needed.
+	$use_global_query = ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] );
+	if ( $use_global_query ) {
+		global $wp_query;
+		if ( $wp_query && isset( $wp_query->query_vars ) && is_array( $wp_query->query_vars ) ) {
+			// Unset `offset` because if is set, $wp_query overrides/ignores the paged parameter and breaks pagination.
+			unset( $query_args['offset'] );
+			$query_args = wp_parse_args( $wp_query->query_vars, $query_args );
+
+			if ( empty( $query_args['post_type'] ) && is_singular() ) {
+				$query_args['post_type'] = get_post_type( get_the_ID() );
+			}
+		}
+	}
+
+	$query = new WP_Query( $query_args );
+
+	if ( ! $query->have_posts() ) {
+		return '';
+	}
+
+	$classnames = '';
+	if ( isset( $block->context['displayLayout'] ) && isset( $block->context['query'] ) ) {
+		if ( isset( $block->context['displayLayout']['type'] ) && 'flex' === $block->context['displayLayout']['type'] ) {
+			$classnames = "is-flex-container columns-{$block->context['displayLayout']['columns']}";
+		}
+	}
+
+	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classnames ) );
+
+	$content = '';
+	while ( $query->have_posts() ) {
+		$query->the_post();
+		$block_content = (
+			new WP_Block(
+				$block->parsed_block,
+				array(
+					'postType' => get_post_type(),
+					'postId'   => get_the_ID(),
+				)
+			)
+		)->render( array( 'dynamic' => false ) );
+		$content      .= "<li>{$block_content}</li>";
+	}
+
+	wp_reset_postdata();
+
+	return sprintf(
+		'<ul %1$s>%2$s</ul>',
+		$wrapper_attributes,
+		$content
+	);
+}
+
+/**
+ * Registers the `core/post-template` block on the server.
+ */
+function register_block_core_post_template() {
+	register_block_type_from_metadata(
+		__DIR__ . '/post-template',
+		array(
+			'render_callback'   => 'render_block_core_post_template',
+			'skip_inner_blocks' => true,
+		)
+	);
+}
+add_action( 'init', 'register_block_core_post_template' );
+
+
+/**
+ * Renders the legacy `core/query-loop` block on the server.
+ * It triggers a developer warning and then calls the renamed
+ * block's `render_callback` function output.
+ *
+ * This can be removed when WordPress 5.9 is released.
+ *
+ * @param array    $attributes Block attributes.
+ * @param string   $content    Block default content.
+ * @param WP_Block $block      Block instance.
+ *
+ * @return string Returns the output of the query, structured using the layout defined by the block's inner blocks.
+ */
+function render_legacy_query_loop_block( $attributes, $content, $block ) {
+	trigger_error(
+		/* translators: %1$s: Block type */
+		sprintf( __( 'Block %1$s has been renamed to Post Template. %1$s will be supported until WordPress version 5.9.', 'gutenberg' ), $block->name ),
+		headers_sent() || WP_DEBUG ? E_USER_WARNING : E_USER_NOTICE
+	);
+	return render_block_core_post_template( $attributes, $content, $block );
+}
+
+/**
+ * Complements the renaming of `Query Loop` to `Post Template`.
+ * This ensures backwards compatibility for any users running the Gutenberg
+ * plugin who have used Query Loop prior to its renaming.
+ *
+ * This can be removed when WordPress 5.9 is released.
+ *
+ * @see https://github.com/WordPress/gutenberg/pull/32514
+ */
+function gutenberg_register_legacy_query_loop_block() {
+	$registry = WP_Block_Type_Registry::get_instance();
+	if ( $registry->is_registered( 'core/query-loop' ) ) {
+		unregister_block_type( 'core/query-loop' );
+	}
+	register_block_type(
+		'core/query-loop',
+		array(
+			'category'          => 'design',
+			'uses_context'      => array(
+				'queryId',
+				'query',
+				'queryContext',
+				'displayLayout',
+				'templateSlug',
+			),
+			'supports'          => array(
+				'reusable' => false,
+				'html'     => false,
+				'align'    => true,
+			),
+			'style'             => 'wp-block-post-template',
+			'render_callback'   => 'render_legacy_query_loop_block',
+			'skip_inner_blocks' => true,
+		)
+	);
+}
+add_action( 'wp_loaded', 'gutenberg_register_legacy_query_loop_block' );

packages/block-library/src/query-loop/save.js → packages/block-library/src/post-template/save.js

@@ -3,6 +3,6 @@
  */
 import { InnerBlocks } from '@wordpress/block-editor';
 
-export default function QueryLoopSave() {
+export default function PostTemplateSave() {
 	return <InnerBlocks.Content />;
 }

packages/block-library/src/query-loop/style.scss → packages/block-library/src/post-template/style.scss

@@ -1,3 +1,9 @@
+.wp-block-post-template,
+// We have kept `wp-block-query-loop` class as well for backwards
+// compatibility with existing `QueryLoop` blocks that haven't been
+// updated, after the renaming of the block to `Post Template`.
+// See: https://github.com/WordPress/gutenberg/pull/32514.
+// TODO: Remove this class when WordPress 5.9 is released.
 .wp-block-query-loop {
 	max-width: 100%;
 	list-style: none;