diff --git a/packages/block-library/src/query/edit/inspector-controls/index.js b/packages/block-library/src/query/edit/inspector-controls/index.js index 05381037bdadc..14b4864efc4fa 100644 --- a/packages/block-library/src/query/edit/inspector-controls/index.js +++ b/packages/block-library/src/query/edit/inspector-controls/index.js @@ -17,6 +17,8 @@ import { import { __ } from '@wordpress/i18n'; import { InspectorControls } from '@wordpress/block-editor'; import { useEffect, useState, useCallback } from '@wordpress/element'; +import { useSelect } from '@wordpress/data'; +import { store as coreStore } from '@wordpress/core-data'; /** * Internal dependencies @@ -27,6 +29,16 @@ import ParentControl from './parent-control'; import TaxonomyControls from './taxonomy-controls'; import { usePostTypes } from '../../utils'; +function useIsPostTypeHierarchical( postType ) { + return useSelect( + ( select ) => { + const type = select( coreStore ).getPostType( postType ); + return type?.viewable && type?.hierarchical; + }, + [ postType ] + ); +} + const stickyOptions = [ { label: __( 'Include' ), value: '' }, { label: __( 'Exclude' ), value: 'exclude' }, @@ -50,6 +62,7 @@ export default function QueryInspectorControls( { } = query; const [ showSticky, setShowSticky ] = useState( postType === 'post' ); const { postTypesTaxonomiesMap, postTypesSelectOptions } = usePostTypes(); + const isPostTypeHierarchical = useIsPostTypeHierarchical( postType ); useEffect( () => { setShowSticky( postType === 'post' ); }, [ postType ] ); @@ -74,6 +87,8 @@ export default function QueryInspectorControls( { if ( newValue !== 'post' ) { updateQuery.sticky = ''; } + // We need to reset `parents` because they are tied to each post type. + updateQuery.parents = []; setQuery( updateQuery ); }; const [ querySearch, setQuerySearch ] = useState( query.search ); @@ -158,11 +173,13 @@ export default function QueryInspectorControls( { value={ querySearch } onChange={ setQuerySearch } /> - + { isPostTypeHierarchical && ( + + ) } ) } diff --git a/packages/block-library/src/query/edit/inspector-controls/parent-control.js b/packages/block-library/src/query/edit/inspector-controls/parent-control.js index 711df9145e59e..d3247ac922864 100644 --- a/packages/block-library/src/query/edit/inspector-controls/parent-control.js +++ b/packages/block-library/src/query/edit/inspector-controls/parent-control.js @@ -13,19 +13,9 @@ import { useDebounce } from '@wordpress/compose'; */ import { getEntitiesInfo, mapToIHasNameAndId } from '../../utils'; -function useIsPostTypeHierarchical( postType ) { - return useSelect( - ( select ) => { - const type = select( coreStore ).getPostType( postType ); - return type?.viewable && type?.hierarchical; - }, - [ postType ] - ); -} - const EMPTY_ARRAY = []; const SUGGESTIONS_QUERY = { - per_page: -1, + per_page: 20, order: 'asc', orderby: 'title', _fields: 'id,title', @@ -33,7 +23,6 @@ const SUGGESTIONS_QUERY = { }; function ParentControl( { parents, postType, onChange } ) { - const isHierarchical = useIsPostTypeHierarchical( postType ); const [ search, setSearch ] = useState( '' ); const [ value, setValue ] = useState( EMPTY_ARRAY ); const [ suggestions, setSuggestions ] = useState( EMPTY_ARRAY ); @@ -113,11 +102,6 @@ function ParentControl( { parents, postType, onChange } ) { setSuggestions( entitiesInfo.names ); }, [ entitiesInfo.names?.join(), searchHasResolved ] ); - // Parent control is only needed for hierarchical post types. - if ( ! isHierarchical ) { - return null; - } - const getIdByValue = ( entitiesMappedByName, entity ) => { const id = entity?.id || entitiesMappedByName?.[ entity ]?.id; if ( id ) return id;