Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make Query Loop settings more intuitive with a ToggleGroup and simplified help text #63739

Merged
merged 6 commits into from
Jul 26, 2024
Merged

Make Query Loop settings more intuitive with a ToggleGroup and simplified help text #63739

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
10752d4
Replace Toggle with ToggleGroup for inherit control in Query Loop
kmanijak Jul 19, 2024
3109c05
Update a test based on Inherit query from template control
kmanijak Jul 19, 2024
13dc572
Simplify ternary operator
kmanijak Jul 22, 2024
11dd2e9
Update controls description in Queryn Loop block
kmanijak Jul 26, 2024
e2a2dd2
remove const for labels used once
richtabor Jul 26, 2024
c0042b1
Add __next40pxDefaultSize
richtabor Jul 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 28 additions & 13 deletions packages/block-library/src/query/edit/inspector-controls/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import {
TextControl,
SelectControl,
RangeControl,
ToggleControl,
__experimentalToggleGroupControl as ToggleGroupControl,
__experimentalToggleGroupControlOption as ToggleGroupControlOption,
Notice,
Expand Down Expand Up @@ -103,9 +102,9 @@ export default function QueryInspectorControls( props ) {
const showInheritControl = isControlAllowed( allowedControls, 'inherit' );
const showPostTypeControl =
! inherit && isControlAllowed( allowedControls, 'postType' );
const postTypeControlLabel = __( 'Content type' );
const postTypeControlLabel = __( 'Post type' );
const postTypeControlHelp = __(
'WordPress contains different types of content you can filter by. Posts and pages are the default types, but plugins could add more.'
'Select the type of content to display: posts, pages, or custom post types.'
);
const showColumnsControl = false;
const showOrderControl =
Expand Down Expand Up @@ -146,17 +145,33 @@ export default function QueryInspectorControls( props ) {
{ showSettingsPanel && (
<PanelBody title={ __( 'Settings' ) }>
{ showInheritControl && (
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Inherit query from template' ) }
help={ __(
'Enable to use the global query context that is set with the current template, such as an archive or search. Disable to customize the settings independently.'
) }
checked={ !! inherit }
onChange={ ( value ) =>
setQuery( { inherit: !! value } )
<ToggleGroupControl
__next40pxDefaultSize
label={ __( 'Query type' ) }
isBlock
onChange={ ( value ) => {
setQuery( { inherit: !! value } );
} }
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 }
>
<ToggleGroupControlOption
value
label={ __( 'Default' ) }
/>
<ToggleGroupControlOption
value={ false }
label={ __( 'Custom' ) }
/>
</ToggleGroupControl>
) }
{ showPostTypeControl &&
( postTypesSelectOptions.length > 2 ? (
Expand Down
2 changes: 1 addition & 1 deletion test/e2e/specs/editor/various/is-typing.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ test.describe( 'isTyping', () => {
.click();

await editor.openDocumentSettingsSidebar();
await page.getByLabel( 'Inherit query from template' ).click();
await page.getByLabel( 'Custom' ).click();

// Moving the mouse shows the toolbar.
await editor.showBlockToolbar();
Expand Down
Loading