From a639ba3a3861695b4d1ccd0bb0f344db10eb5dd9 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Thu, 10 Sep 2020 16:38:57 +0300 Subject: [PATCH 1/3] add search in Query block --- packages/block-library/src/query-loop/edit.js | 5 +++++ packages/block-library/src/query-loop/index.php | 3 +++ packages/block-library/src/query/block.json | 3 ++- packages/block-library/src/query/edit/query-toolbar.js | 8 ++++++++ packages/e2e-tests/fixtures/blocks/core__query.json | 3 ++- 5 files changed, 20 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/query-loop/edit.js b/packages/block-library/src/query-loop/edit.js index d6d22c53658214..3019670972b7da 100644 --- a/packages/block-library/src/query-loop/edit.js +++ b/packages/block-library/src/query-loop/edit.js @@ -27,6 +27,7 @@ export default function QueryLoopEdit( { order, orderBy, author, + search, } = {}, queryContext, }, @@ -49,6 +50,9 @@ export default function QueryLoopEdit( { if ( author ) { query.author = author; } + if ( search ) { + query.search = search; + } return { posts: select( 'core' ).getEntityRecords( 'postType', @@ -68,6 +72,7 @@ export default function QueryLoopEdit( { orderBy, clientId, author, + search, ] ); diff --git a/packages/block-library/src/query-loop/index.php b/packages/block-library/src/query-loop/index.php index 78660188163c28..975603c171b825 100644 --- a/packages/block-library/src/query-loop/index.php +++ b/packages/block-library/src/query-loop/index.php @@ -47,6 +47,9 @@ function render_block_core_query_loop( $attributes, $content, $block ) { if ( isset( $block->context['query']['author'] ) ) { $query['author'] = $block->context['query']['author']; } + if ( isset( $block->context['query']['search'] ) ) { + $query['s'] = $block->context['query']['search']; + } } $posts = get_posts( $query ); diff --git a/packages/block-library/src/query/block.json b/packages/block-library/src/query/block.json index ece5a390a5f0fd..ce9def4b028e4c 100644 --- a/packages/block-library/src/query/block.json +++ b/packages/block-library/src/query/block.json @@ -15,7 +15,8 @@ "tagIds": [], "order": "desc", "orderBy": "date", - "author": null + "author": null, + "search": "" } } }, diff --git a/packages/block-library/src/query/edit/query-toolbar.js b/packages/block-library/src/query/edit/query-toolbar.js index d62a4a10b21106..0b3841436a6c5e 100644 --- a/packages/block-library/src/query/edit/query-toolbar.js +++ b/packages/block-library/src/query/edit/query-toolbar.js @@ -7,6 +7,7 @@ import { Dropdown, ToolbarButton, RangeControl, + TextControl, FormTokenField, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; @@ -113,6 +114,13 @@ export default function QueryToolbar( { query, setQuery } ) { onChange={ onTagsChange } /> ) } + + setQuery( { search: value } ) + } + /> ) } /> diff --git a/packages/e2e-tests/fixtures/blocks/core__query.json b/packages/e2e-tests/fixtures/blocks/core__query.json index d4882792623121..e65ded4c10e43f 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query.json +++ b/packages/e2e-tests/fixtures/blocks/core__query.json @@ -12,7 +12,8 @@ "tagIds": [], "order": "desc", "orderBy": "date", - "author": null + "author": null, + "search": "" } }, "innerBlocks": [], From 4a9d9cba6c93b07f70feda9c8f95e98172fe1d62 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Thu, 10 Sep 2020 17:00:59 +0300 Subject: [PATCH 2/3] fix React warning --- packages/block-library/src/query/block.json | 2 +- packages/e2e-tests/fixtures/blocks/core__query.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/query/block.json b/packages/block-library/src/query/block.json index ce9def4b028e4c..63d489ad0d5525 100644 --- a/packages/block-library/src/query/block.json +++ b/packages/block-library/src/query/block.json @@ -15,7 +15,7 @@ "tagIds": [], "order": "desc", "orderBy": "date", - "author": null, + "author": "", "search": "" } } diff --git a/packages/e2e-tests/fixtures/blocks/core__query.json b/packages/e2e-tests/fixtures/blocks/core__query.json index e65ded4c10e43f..c225bc2053ea8a 100644 --- a/packages/e2e-tests/fixtures/blocks/core__query.json +++ b/packages/e2e-tests/fixtures/blocks/core__query.json @@ -12,7 +12,7 @@ "tagIds": [], "order": "desc", "orderBy": "date", - "author": null, + "author": "", "search": "" } }, From bbf6435d62787148f0245f99182335bd567c9473 Mon Sep 17 00:00:00 2001 From: ntsekouras Date: Thu, 10 Sep 2020 18:23:31 +0300 Subject: [PATCH 3/3] debounce search requests --- .../src/query/edit/query-toolbar.js | 21 +++++++++++++++---- 1 file changed, 17 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/query/edit/query-toolbar.js b/packages/block-library/src/query/edit/query-toolbar.js index 0b3841436a6c5e..3436348975e240 100644 --- a/packages/block-library/src/query/edit/query-toolbar.js +++ b/packages/block-library/src/query/edit/query-toolbar.js @@ -1,7 +1,13 @@ +/** + * External dependencies + */ +import { debounce } from 'lodash'; + /** * WordPress dependencies */ import { useSelect } from '@wordpress/data'; +import { useEffect, useState, useCallback } from '@wordpress/element'; import { Toolbar, Dropdown, @@ -34,6 +40,15 @@ export default function QueryToolbar( { query, setQuery } ) { tags: getTermsInfo( _tags ), }; }, [] ); + const [ querySearch, setQuerySearch ] = useState( query.search ); + const onChangeDebounced = useCallback( + debounce( () => setQuery( { search: querySearch } ), 250 ), + [ querySearch ] + ); + useEffect( () => { + onChangeDebounced(); + return onChangeDebounced.cancel; + }, [ querySearch, onChangeDebounced ] ); // Handles categories and tags changes. const onTermsChange = ( terms, queryProperty ) => ( newTermValues ) => { @@ -116,10 +131,8 @@ export default function QueryToolbar( { query, setQuery } ) { ) } - setQuery( { search: value } ) - } + value={ querySearch } + onChange={ ( value ) => setQuerySearch( value ) } /> ) }