From 7a31f9c9cf5cc52da5df0c81ae5a7cd0efec9a17 Mon Sep 17 00:00:00 2001
From: Nik Tsekouras <ntsekouras@outlook.com>
Date: Fri, 11 Sep 2020 17:50:02 +0300
Subject: [PATCH] Add search in Query block (#25222)

* add search in Query block

* fix React warning

* debounce search requests
---
 packages/block-library/src/query-loop/edit.js |  5 +++++
 .../block-library/src/query-loop/index.php    |  3 +++
 packages/block-library/src/query/block.json   |  3 ++-
 .../src/query/edit/query-toolbar.js           | 21 +++++++++++++++++++
 .../fixtures/blocks/core__query.json          |  3 ++-
 5 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/packages/block-library/src/query-loop/edit.js b/packages/block-library/src/query-loop/edit.js
index d6d22c5365821..3019670972b7d 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 78660188163c2..975603c171b82 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 ece5a390a5f0f..63d489ad0d552 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": "",
+				"search": ""
 			}
 		}
 	},
diff --git a/packages/block-library/src/query/edit/query-toolbar.js b/packages/block-library/src/query/edit/query-toolbar.js
index d62a4a10b2110..3436348975e24 100644
--- a/packages/block-library/src/query/edit/query-toolbar.js
+++ b/packages/block-library/src/query/edit/query-toolbar.js
@@ -1,12 +1,19 @@
+/**
+ * External dependencies
+ */
+import { debounce } from 'lodash';
+
 /**
  * WordPress dependencies
  */
 import { useSelect } from '@wordpress/data';
+import { useEffect, useState, useCallback } from '@wordpress/element';
 import {
 	Toolbar,
 	Dropdown,
 	ToolbarButton,
 	RangeControl,
+	TextControl,
 	FormTokenField,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
@@ -33,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 ) => {
@@ -113,6 +129,11 @@ export default function QueryToolbar( { query, setQuery } ) {
 								onChange={ onTagsChange }
 							/>
 						) }
+						<TextControl
+							label={ __( 'Search' ) }
+							value={ querySearch }
+							onChange={ ( value ) => setQuerySearch( value ) }
+						/>
 					</>
 				) }
 			/>
diff --git a/packages/e2e-tests/fixtures/blocks/core__query.json b/packages/e2e-tests/fixtures/blocks/core__query.json
index d488279262312..c225bc2053ea8 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": "",
+				"search": ""
 			}
 		},
 		"innerBlocks": [],