Query and Search blocks: support for Instant Search

[luisherranz]

What problem does this address?

Now that we have the Interactivity API in Core, it's time to start experimenting with enhanced user experiences. One of these would be the ability to refresh the content of a Query block without refreshing the page while the user is typing a search.

What is your proposed solution?

I believe the simplest way to start with the Instant Search would be to convert the search into an instant search when the Search block is inside a Query block that has the Forge Page Reload option disabled.

When the Force Page Reload option is disabled, the enhancedPagination attribute is true and is passed via block context. Therefore, the Search block can subscribe to the enhancedPagination context. If it is true, it can add the necessary directives using the HTML_Tag_Processor and enqueue de view file.

[r-chrzan]

I will prepare the initial implementation.

[luisherranz]

Another thing that we need to do, but doesn't need to be in the initial implementation is to always add the "No results" block to the page even if it's initially hidden, so all the necessary CSS/JS is properly loaded.

[ktmn]

it's time to start experimenting

When using enhancedPagination the Pagination block could have a child block called "Load more button" which you could use instead of the "Previous Page", "Page Numbers" and "Next Page" blocks. Instead of going to the next page it could pick the items from the response and append them to the <ul>.

Just throwing this in here for consideration, because when implementing search, the query would be changing and pagination would therefore also be changing and if there was different methods of pagination, they would all need to be accounted for as well, which might get complex or maybe not.

Also with search, a "Result count" block or something like that could potentially be needed.

[r-chrzan]

@ktmn Thanks for your suggestions! It will be very similar to this solution that I posted some times ago as a plugin. You can check by download my repo if you want. You may notice that the pagination behaves dynamically, disappearing if there are less than a given number of posts.

[luisherranz]

Yeah, thanks for the insight @ktmn, although I'm not too worried about those kinds of details right now. Let's see if we can get an initial version and then we'll look at the UX and see what we need to improve 🙂