Query block: Allow inheriting the global query arguments

packages/block-library/src/query-loop/edit.js

@@ -41,6 +41,7 @@ export default function QueryLoopEdit( {
 			search,
 			exclude,
 			sticky,
+			inherit,
 		} = {},
 		queryContext,
 		layout: { type: layoutType = 'flex', columns = 1 } = {},
@@ -78,6 +79,30 @@ export default function QueryLoopEdit( {
 			if ( sticky ) {
 				query.sticky = sticky === 'only';
 			}
+
+			// When you insert this block outside of the edit site then store
+			// does not exist therefore we check for its existence.
+			if ( inherit && select( 'core/edit-site' ) ) {
+				// This should be passed from the context exposed by edit site.
+				const { getTemplateId, getTemplateType } = select(
+					'core/edit-site'
+				);
+
+				if ( 'wp_template' === getTemplateType() ) {
+					const { slug } = select( 'core' ).getEntityRecord(
+						'postType',
+						'wp_template',
+						getTemplateId()
+					);
+
+					// Change the post-type if needed.
+					if ( slug?.startsWith( 'archive-' ) ) {
+						query.postType = slug.replace( 'archive-', '' );
+						postType = query.postType;
+					}
+				}
+			}
+
 			return {
 				posts: getEntityRecords( 'postType', postType, query ),
 				blocks: getBlocks( clientId ),
@@ -97,6 +122,7 @@ export default function QueryLoopEdit( {
 			postType,
 			exclude,
 			sticky,
+			inherit,
 		]
 	);
 

packages/block-library/src/query-loop/index.php

@@ -42,7 +42,8 @@ function render_block_core_query_loop( $attributes, $content, $block ) {
 			$query['post__not_in'] = array_merge( $query['post__not_in'], $block->context['query']['exclude'] );
 		}
 		if ( isset( $block->context['query']['perPage'] ) ) {
-			$query['offset'] = ( $block->context['query']['perPage'] * ( $page - 1 ) ) + $block->context['query']['offset'];
+			$query['offset']         = ( $block->context['query']['perPage'] * ( $page - 1 ) ) + $block->context['query']['offset'];
+			$query['posts_per_page'] = $block->context['query']['perPage'];
 		}
 		if ( isset( $block->context['query']['categoryIds'] ) ) {
 			$query['category__in'] = $block->context['query']['categoryIds'];
@@ -56,9 +57,6 @@ function render_block_core_query_loop( $attributes, $content, $block ) {
 		if ( isset( $block->context['query']['orderBy'] ) ) {
 			$query['orderby'] = $block->context['query']['orderBy'];
 		}
-		if ( isset( $block->context['query']['perPage'] ) ) {
-			$query['posts_per_page'] = $block->context['query']['perPage'];
-		}
 		if ( isset( $block->context['query']['author'] ) ) {
 			$query['author'] = $block->context['query']['author'];
 		}
@@ -67,6 +65,15 @@ function render_block_core_query_loop( $attributes, $content, $block ) {
 		}
 	}
 
+	// 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 ) ) {
+			$query = wp_parse_args( $wp_query->query_vars, $query );
+		}
+	}
+
 	$posts = get_posts( $query );
 
 	$classnames = '';
@@ -89,7 +96,7 @@ function render_block_core_query_loop( $attributes, $content, $block ) {
 				)
 			)
 		)->render( array( 'dynamic' => false ) );
-		$content .= "<li>{$block_content}</li>";
+		$content      .= "<li>{$block_content}</li>";
 	}
 	return sprintf(
 		'<ul %1$s>%2$s</ul>',

packages/block-library/src/query/block.json

@@ -20,7 +20,8 @@
 				"author": "",
 				"search": "",
 				"exclude": [],
-				"sticky": ""
+				"sticky": "",
+				"inherit": true
 			}
 		},
 		"layout": {

packages/block-library/src/query/edit/query-inspector-controls.js

@@ -14,6 +14,7 @@ import {
 	FormTokenField,
 	SelectControl,
 	RangeControl,
+	ToggleControl,
 	Notice,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
@@ -44,6 +45,7 @@ export default function QueryInspectorControls( {
 		author: selectedAuthorId,
 		postType,
 		sticky,
+		inherit,
 	} = query;
 	const [ showCategories, setShowCategories ] = useState( true );
 	const [ showTags, setShowTags ] = useState( true );
@@ -136,19 +138,30 @@ export default function QueryInspectorControls( {
 		}, 250 ),
 		[ querySearch, query.search ]
 	);
+
 	useEffect( () => {
 		onChangeDebounced();
 		return onChangeDebounced.cancel;
 	}, [ querySearch, onChangeDebounced ] );
 	return (
 		<InspectorControls>
 			<PanelBody title={ __( 'Settings' ) }>
-				<SelectControl
-					options={ postTypesSelectOptions }
-					value={ postType }
-					label={ __( 'Post Type' ) }
-					onChange={ onPostTypeChange }
+				<ToggleControl
+					label={ __( 'Inherit query from URL' ) }
+					help={ __(
+						'Disable the option to customize the query arguments. Leave enabled to inherit the global query depending on the URL.'
+					) }
+					checked={ !! inherit }
+					onChange={ ( value ) => setQuery( { inherit: !! value } ) }
 				/>
+				{ ! inherit && (
+					<SelectControl
+						options={ postTypesSelectOptions }
+						value={ postType }
+						label={ __( 'Post Type' ) }
+						onChange={ onPostTypeChange }
+					/>
+				) }
 				{ layout?.type === 'flex' && (
 					<>
 						<RangeControl
@@ -169,13 +182,17 @@ export default function QueryInspectorControls( {
 						) }
 					</>
 				) }
-				<QueryControls
-					{ ...{ order, orderBy } }
-					onOrderChange={ ( value ) => setQuery( { order: value } ) }
-					onOrderByChange={ ( value ) =>
-						setQuery( { orderBy: value } )
-					}
-				/>
+				{ ! inherit && (
+					<QueryControls
+						{ ...{ order, orderBy } }
+						onOrderChange={ ( value ) =>
+							setQuery( { order: value } )
+						}
+						onOrderByChange={ ( value ) =>
+							setQuery( { orderBy: value } )
+						}
+					/>
+				) }
 				{ showSticky && (
 					<SelectControl
 						label={ __( 'Sticky posts' ) }
@@ -185,45 +202,48 @@ export default function QueryInspectorControls( {
 					/>
 				) }
 			</PanelBody>
-			<PanelBody title={ __( 'Filters' ) }>
-				{ showCategories && categories?.terms?.length > 0 && (
-					<FormTokenField
-						label={ __( 'Categories' ) }
-						value={ ( query.categoryIds || [] ).map(
-							( categoryId ) => ( {
-								id: categoryId,
-								value: categories.mapById[ categoryId ].name,
+			{ ! inherit && (
+				<PanelBody title={ __( 'Filters' ) }>
+					{ showCategories && categories?.terms?.length > 0 && (
+						<FormTokenField
+							label={ __( 'Categories' ) }
+							value={ ( query.categoryIds || [] ).map(
+								( categoryId ) => ( {
+									id: categoryId,
+									value:
+										categories.mapById[ categoryId ].name,
+								} )
+							) }
+							suggestions={ categories.names }
+							onChange={ onCategoriesChange }
+						/>
+					) }
+					{ showTags && tags?.terms?.length > 0 && (
+						<FormTokenField
+							label={ __( 'Tags' ) }
+							value={ ( query.tagIds || [] ).map( ( tagId ) => ( {
+								id: tagId,
+								value: tags.mapById[ tagId ].name,
+							} ) ) }
+							suggestions={ tags.names }
+							onChange={ onTagsChange }
+						/>
+					) }
+					<QueryControls
+						{ ...{ selectedAuthorId, authorList } }
+						onAuthorChange={ ( value ) =>
+							setQuery( {
+								author: value !== '' ? +value : undefined,
 							} )
-						) }
-						suggestions={ categories.names }
-						onChange={ onCategoriesChange }
+						}
 					/>
-				) }
-				{ showTags && tags?.terms?.length > 0 && (
-					<FormTokenField
-						label={ __( 'Tags' ) }
-						value={ ( query.tagIds || [] ).map( ( tagId ) => ( {
-							id: tagId,
-							value: tags.mapById[ tagId ].name,
-						} ) ) }
-						suggestions={ tags.names }
-						onChange={ onTagsChange }
+					<TextControl
+						label={ __( 'Keyword' ) }
+						value={ querySearch }
+						onChange={ setQuerySearch }
 					/>
-				) }
-				<QueryControls
-					{ ...{ selectedAuthorId, authorList } }
-					onAuthorChange={ ( value ) =>
-						setQuery( {
-							author: value !== '' ? +value : undefined,
-						} )
-					}
-				/>
-				<TextControl
-					label={ __( 'Keyword' ) }
-					value={ querySearch }
-					onChange={ setQuerySearch }
-				/>
-			</PanelBody>
+				</PanelBody>
+			) }
 		</InspectorControls>
 	);
 }

packages/e2e-tests/fixtures/blocks/core__query.json

@@ -5,6 +5,7 @@
         "isValid": true,
         "attributes": {
             "query": {
+                "inherit": true,
                 "perPage": null,
                 "pages": 1,
                 "offset": 0,