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 0ae4b052b5787..3470846a14795 100644 --- a/packages/block-library/src/query/edit/inspector-controls/index.js +++ b/packages/block-library/src/query/edit/inspector-controls/index.js @@ -2,7 +2,6 @@ * WordPress dependencies */ import { - PanelBody, TextControl, SelectControl, RangeControl, @@ -187,110 +186,171 @@ export default function QueryInspectorControls( props ) { return ( <> { showSettingsPanel && ( - + { + setQuery( { + postType: 'post', + order: 'desc', + orderBy: 'date', + sticky: '', + inherit: true, + } ); + } } + dropdownMenuProps={ dropdownMenuProps } + > { showInheritControl && ( - ! inherit } label={ __( 'Query type' ) } - isBlock - onChange={ ( value ) => { - setQuery( { inherit: value === 'default' } ); - } } - help={ - inherit - ? __( - 'Display a list of posts or custom post types based on the current template.' - ) - : __( - 'Display a list of posts or custom post types based on specific criteria.' - ) - } - value={ !! inherit ? 'default' : 'custom' } + onDeselect={ () => setQuery( { inherit: true } ) } + isShownByDefault > - - - - ) } - { showPostTypeControl && - ( postTypesSelectOptions.length > 2 ? ( - - ) : ( { + setQuery( { + inherit: value === 'default', + } ); + } } + help={ + inherit + ? __( + 'Display a list of posts or custom post types based on the current template.' + ) + : __( + 'Display a list of posts or custom post types based on specific criteria.' + ) + } + value={ !! inherit ? 'default' : 'custom' } > - { postTypesSelectOptions.map( ( option ) => ( - - ) ) } + + - ) ) } + + ) } - { showColumnsControl && ( - <> - - setDisplayLayout( { - columns: value, - } ) - } - min={ 2 } - max={ Math.max( 6, displayLayout.columns ) } - /> - { displayLayout.columns > 6 && ( - postType !== 'post' } + label={ postTypeControlLabel } + onDeselect={ () => onPostTypeChange( 'post' ) } + isShownByDefault + > + { postTypesSelectOptions.length > 2 ? ( + + ) : ( + - { __( - 'This column count exceeds the recommended amount and may cause visual breakage.' + { postTypesSelectOptions.map( + ( option ) => ( + + ) ) } - + ) } - + ) } + + { showColumnsControl && ( + displayLayout?.columns !== 2 } + label={ __( 'Columns' ) } + onDeselect={ () => + setDisplayLayout( { columns: 2 } ) + } + isShownByDefault + > + <> + + setDisplayLayout( { + columns: value, + } ) + } + min={ 2 } + max={ Math.max( 6, displayLayout.columns ) } + /> + { displayLayout.columns > 6 && ( + + { __( + 'This column count exceeds the recommended amount and may cause visual breakage.' + ) } + + ) } + + + ) } + { showOrderControl && ( - + + order !== 'desc' || orderBy !== 'date' + } + label={ __( 'Order by' ) } + onDeselect={ () => + setQuery( { order: 'desc', orderBy: 'date' } ) + } + isShownByDefault + > + + ) } + { showStickyControl && ( - - setQuery( { sticky: value } ) - } - /> + !! sticky } + label={ __( 'Sticky posts' ) } + onDeselect={ () => setQuery( { sticky: '' } ) } + isShownByDefault + > + + setQuery( { sticky: value } ) + } + /> + ) } - + ) } { ! inherit && showDisplayPanel && (