Query Loop: Use templateSlug and postType for more context

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

@@ -42,7 +42,7 @@
 			"default": false
 		}
 	},
-	"usesContext": [ "postType" ],
+	"usesContext": [ "postType", "templateSlug" ],
 	"providesContext": {
 		"queryId": "queryId",
 		"query": "query",

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

@@ -45,7 +45,7 @@ import { useToolsPanelDropdownMenuProps } from '../../../utils/hooks';
 const { BlockInfo } = unlock( blockEditorPrivateApis );
 
 export default function QueryInspectorControls( props ) {
-	const { attributes, setQuery, setDisplayLayout, isTemplate } = props;
+	const { attributes, setQuery, setDisplayLayout, isSingular } = props;
 	const { query, displayLayout } = attributes;
 	const {
 		order,
@@ -118,7 +118,7 @@ export default function QueryInspectorControls( props ) {
 	}, [ querySearch, onChangeDebounced ] );
 
 	const showInheritControl =
-		isTemplate && isControlAllowed( allowedControls, 'inherit' );
+		! isSingular && isControlAllowed( allowedControls, 'inherit' );
 	const showPostTypeControl =
 		! inherit && isControlAllowed( allowedControls, 'postType' );
 	const postTypeControlLabel = __( 'Post type' );

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

@@ -22,6 +22,7 @@ import EnhancedPaginationControl from './inspector-controls/enhanced-pagination-
 import QueryToolbar from './query-toolbar';
 import QueryInspectorControls from './inspector-controls';
 import EnhancedPaginationModal from './enhanced-pagination-modal';
+import { getQueryContextFromTemplate } from '../utils';
 
 const DEFAULTS_POSTS_PER_PAGE = 3;
 
@@ -42,24 +43,15 @@ export default function QueryContent( {
 		tagName: TagName = 'div',
 		query: { inherit } = {},
 	} = attributes;
-	const { postType } = context;
+	const { templateSlug, postType } = context;
+	const { isSingular } = getQueryContextFromTemplate( templateSlug );
 	const { __unstableMarkNextChangeAsNotPersistent } =
 		useDispatch( blockEditorStore );
 	const instanceId = useInstanceId( QueryContent );
 	const blockProps = useBlockProps();
 	const innerBlocksProps = useInnerBlocksProps( blockProps, {
 		template: TEMPLATE,
 	} );
-	const isTemplate = useSelect(
-		( select ) => {
-			const currentTemplate =
-				select( coreStore ).__experimentalGetTemplateForLink()?.type;
-			const isInTemplate = 'wp_template' === currentTemplate;
-			const isInSingularContent = postType !== undefined;
-			return isInTemplate && ! isInSingularContent;
-		},
-		[ postType ]
-	);
 	const { postsPerPage } = useSelect( ( select ) => {
 		const { getSettings } = select( blockEditorStore );
 		const { getEntityRecord, getEntityRecordEdits, canUser } =
@@ -106,21 +98,29 @@ export default function QueryContent( {
 		} else if ( ! query.perPage && postsPerPage ) {
 			newQuery.perPage = postsPerPage;
 		}
-		// We need to reset the `inherit` value if not in a template, as queries
-		// are not inherited when outside a template (e.g. when in singular content).
-		if ( ! isTemplate && query.inherit ) {
+		// We need to reset the `inherit` value if in a singular template, as queries
+		// are not inherited when in singular content (e.g. post, page, 404, blank).
+		if ( isSingular && query.inherit ) {
 			newQuery.inherit = false;
 		}
+		// We need to update the query in the Editor if a specific post type is set.
+		// Unless the post type is `page`, as it usually doesn't make sense to loop
+		// through pages.
+		if ( postType && postType !== 'page' && query.postType !== postType ) {
+			newQuery.postType = postType;
+		}
 		if ( !! Object.keys( newQuery ).length ) {
 			__unstableMarkNextChangeAsNotPersistent();
 			updateQuery( newQuery );
 		}
 	}, [
 		query.perPage,
+		query.inherit,
+		query.postType,
 		postsPerPage,
 		inherit,
-		isTemplate,
-		query.inherit,
+		isSingular,
+		postType,
 		__unstableMarkNextChangeAsNotPersistent,
 		updateQuery,
 	] );
@@ -167,7 +167,7 @@ export default function QueryContent( {
 					setDisplayLayout={ updateDisplayLayout }
 					setAttributes={ setAttributes }
 					clientId={ clientId }
-					isTemplate={ isTemplate }
+					isSingular={ isSingular }
 				/>
 			</InspectorControls>
 			<BlockControls>

packages/block-library/src/query/test/utils.js

@@ -2,7 +2,11 @@
  * Internal dependencies
  */
 import { terms } from './fixtures';
-import { getEntitiesInfo, getValueFromObjectPath } from '../utils';
+import {
+	getEntitiesInfo,
+	getValueFromObjectPath,
+	getQueryContextFromTemplate,
+} from '../utils';
 
 describe( 'Query block utils', () => {
 	describe( 'getEntitiesInfo', () => {
@@ -61,4 +65,55 @@ describe( 'Query block utils', () => {
 			expect( result ).toBe( 'test' );
 		} );
 	} );
+
+	describe( 'getQueryContextFromTemplate', () => {
+		it( 'should return the correct query context based on template slug', () => {
+			expect( getQueryContextFromTemplate( '404' ) ).toStrictEqual( {
+				isSingular: true,
+				templateType: '404',
+			} );
+			expect( getQueryContextFromTemplate( 'blank' ) ).toStrictEqual( {
+				isSingular: true,
+				templateType: 'blank',
+			} );
+			expect( getQueryContextFromTemplate( 'single' ) ).toStrictEqual( {
+				isSingular: true,
+				templateType: 'single',
+			} );
+			expect(
+				getQueryContextFromTemplate( 'single-film' )
+			).toStrictEqual( {
+				isSingular: true,
+				templateType: 'single',
+			} );
+			expect( getQueryContextFromTemplate( 'page' ) ).toStrictEqual( {
+				isSingular: true,
+				templateType: 'page',
+			} );
+			expect( getQueryContextFromTemplate( 'wp' ) ).toStrictEqual( {
+				isSingular: true,
+				templateType: 'custom',
+			} );
+			expect( getQueryContextFromTemplate( 'category' ) ).toStrictEqual( {
+				isSingular: false,
+				templateType: 'category',
+			} );
+			expect(
+				getQueryContextFromTemplate( 'category-dog' )
+			).toStrictEqual( {
+				isSingular: false,
+				templateType: 'category',
+			} );
+			expect( getQueryContextFromTemplate( 'archive' ) ).toStrictEqual( {
+				isSingular: false,
+				templateType: 'archive',
+			} );
+			expect(
+				getQueryContextFromTemplate( 'archive-film' )
+			).toStrictEqual( {
+				isSingular: false,
+				templateType: 'archive',
+			} );
+		} );
+	} );
 } );

packages/block-library/src/query/utils.js

@@ -435,3 +435,28 @@ export const useUnsupportedBlocks = ( clientId ) => {
 		[ clientId ]
 	);
 };
+
+/**
+ * Helper function that returns the query context from the editor based on the
+ * available template slug.
+ *
+ * @param {string} templateSlug Current template slug based on context.
+ * @return {Object} An object with isSingular and templateType properties.
+ */
+export function getQueryContextFromTemplate( templateSlug = '' ) {
+	let isSingular = false;
+	let templateType = templateSlug === 'wp' ? 'custom' : templateSlug;
+	const singularTemplates = [ '404', 'blank', 'single', 'page', 'custom' ];
+	const templateTypeFromSlug = templateSlug.includes( '-' )
+		? templateSlug.split( '-', 1 )[ 0 ]
+		: templateSlug;
+	const queryFromTemplateSlug = templateSlug.includes( '-' )
+		? templateSlug.split( '-' ).slice( 1 ).join( '-' )
+		: '';
+	if ( queryFromTemplateSlug ) {
+		templateType = templateTypeFromSlug;
+	}
+	isSingular = singularTemplates.includes( templateType );
+
+	return { isSingular, templateType };
+}