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.

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

Instant Search: Update prototype with downstream changes #13761

Merged
merged 50 commits into from
Oct 23, 2019

Conversation

jsnmoon
Copy link
Member

@jsnmoon jsnmoon commented Oct 15, 2019

Changes proposed in this Pull Request:

Please note that all changes in this PR relate to Jetpack Instant Search. Specifically, this PR:

  • Adds result filtering and sorting
  • Adds pagination with support for infinite scrolling
  • Enables searching from any site page with a sidebar widget area
  • Polishes search result styling
  • Fixes theme incompatibilities
  • Adds caching to API requests
  • Adds TrainTracks analytics
This PR is the culmination of many downstream PRs. Click here to reveal downstream PR ID's. #13371 #13393, #13430, #13505, #13377, #13545, #13605, #13614, #13602, #13684, #13714, #13721, #13750, #13748, #13713, #13742, and #13730

Is this a new feature or does it add/remove features to an existing part of Jetpack?

Yes, this is part of the Jetpack Instant Search project: p3QzjZ-V3-p2. After landing this in master, we plan on presenting this work to our partners.

Testing instructions:

  • Add define( "JETPACK_SEARCH_PROTOTYPE", true ); to your wp-config.php.
    If using Jetpack's Docker development environment, you can create a file at /docker/mu-plugins/instant-search.php and add the define there.

  • Ensure that your site has the Jetpack Pro plan and Jetpack Search enabled.
    You can enable Jetpack Search in the Performance tab within the Jetpack menu (/wp-admin/admin.php?page=jetpack#/performance).

  • Select a theme of your choosing and add a Jetpack Search widget to the site via the customizer, preferably with some filters enabled. If you're using a theme with a sidebar widget area, please add the Jetpack Search widget there.

Screen Shot 2019-10-15 at 4 14 41 PM
  • If using a theme with a sidebar widget, you can navigate to / to start the search experience. Otherwise, navigate to your search page (e.g. /?s=hello).

  • Try interacting with the search interface via the input field or the filter checkboxes.

Screen Shot 2019-10-15 at 4 15 41 PM
  • Ensure that the interface works as expected. If you have any questions, please let us know!

Proposed changelog entry for your changes:

Launches a prototype Instant Search and Filtering intended to eventually replace the current Jetpack Search.

gibrown and others added 22 commits August 30, 2019 08:51
…ion (#13365)

Refactor search results and improve their display. Add display of when we make spelling corrections.
Adds filtering results to the widget sidebar. Filters are not yet interactive.
…13393)

bugs fixed:
- Long titles and text will no longer overlap the date in the results.
- Count of total results will never get overlapped by very long search strings
- Adds icons for different content types to give more context to the user: products, video, images, audio, code, etc (eventually we could let users click to filter on these too)
- Does not show path when we have tags/categories - was taking up too much space
* Use underscores instead of camel case
* Add support for filtering by tags and categories
Extract the sort settings from the URL and then use that to determine how results should be sorted when doing the api request.

Prerequisite for adding support for the sorting selection dropdown.
* Implement support for date filters
* Add support for modified and GMT filter options
* Remove duplicate post tag filter logic
* Remove querying for 'modified' field
* Add internal dependencies docblock
* Add support for custom taxonomy filtering
* Refactor handling of query strings (coupled to API logic)
* Add sort widget

* Display list of sort options

* Pre-select current sort from query string

* Update sort options

* Reflect sort selection in query string

* Sorting works! Renamed getSearchSort to getSortQuery for consistency

* Tidying

* Add translation context

Co-Authored-By: Greg Ichneumon Brown <greg@automattic.com>

* Add jetpack context to all translations

* Address review feedback
Fixes many of the problems in #13391 particularly:

- inserting results into the theme works in all those themes
- the search form for all those themes works as search as you type as does the default core WP search widget
- Adds some CSS for our search box and cleans it up
- Adjust opacity when results are loading to give the user some feedback
- Starts the search query after only 200ms rather than 500ms. Feels a lot snappier
- Did some slight code cleanup and renamed the "widget" to "app" so it isn't confused with the WP widgets.
* Initial working version of infinite scroll
* Add scroll check for infinite scrolling experience
* Fix discrepancies from rebase
* Pass response along as a property
* Enable aggregations for non-paged requests
* Preserve aggregations for paged response
* Fix pagination bug
Simple 5 min caching layer to all api requests.
* Reduce icons in results.
* Clean up filter styling.
* Min height on results area so the window shouldn't bounce.
* Fix zerif-lite theme
* Slightly reduce spacing between checkbox and label in filters
Insert search and filter results onto the front end of any theme. Filters are always displayed. Woohoo!
This change adds TrainTracks analytics to Jetpack Instant Search.
These changes are unrelated to Jetpack Instant Search.
@jsnmoon jsnmoon added [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it [Feature] Search For all things related to Search Instant Search labels Oct 15, 2019
@gibrown
Copy link
Member

gibrown commented Oct 22, 2019

@gibrown gibrown requested a review from jeherve October 22, 2019 23:36
gibrown
gibrown previously approved these changes Oct 22, 2019
Copy link
Member

@gibrown gibrown left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We've moved all of the corner cases into their own issues, so going to approve this for merging into master.

jeherve
jeherve previously approved these changes Oct 23, 2019
Copy link
Member

@jeherve jeherve left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good to me. I think we should be good to merge this into master for now.

I would recommend creating a new release branch based off master once this is merged, and rebasing / editing all your currently open PRs against that new branch:
#13774, #13796, #13350, #13349 (although this last one may now be closed in favor of #13774 maybe?)


I broke out a number of issues into separate bugs (and one enhancement request).

Thanks a lot for doing that! I think it makes the feedback on this whole big PR a bit more manageable.

I had left one bit of feedback that I can't find among the open issues:

If I hit my browser's return key after launching a search, the search query remains, but with one less character in the term I typed. I think the whole search query should disappear, don't you think?

It's possible you already addressed that comment of mine though, but I can't find it in here.


Something seems off with the way tags are displayed now:
https://jeremy.hu/?post_tag=genericons

This should be fixed.

I'm still seeing this for some posts though.

https://jeremy.hu/?s=bonobo

image


The non-jetpack searchform built in Twenty Twenty seems to break when Instant Search is on. I get redirected to the homepage without any query string when I hit enter:

http://cl.ly/46f79ab7541a

Could it be that this was introduced in the last few changes to get the URL to behave when launching a search from a posts page?

@jeherve jeherve added [Status] Ready to Merge Go ahead, you can push that green button! and removed [Status] Needs Review To request a review from Crew. Label will be renamed soon. labels Oct 23, 2019
@gibrown
Copy link
Member

gibrown commented Oct 23, 2019

Awesome, I'll do a bit more testing later today and then open up some more bugs on these as needed. Thanks! 🎉

@jsnmoon jsnmoon dismissed stale reviews from jeherve and gibrown via 435d373 October 23, 2019 19:31
@jsnmoon
Copy link
Member Author

jsnmoon commented Oct 23, 2019

Something seems off with the way tags are displayed now:
jeremy.hu/?post_tag=genericons

This should be fixed.

I'm still seeing this for some posts though.

It looks like we were omitting the additional styling applied to Gridicon icons; it should be fixed now.

Copy link
Member

@gibrown gibrown left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All good

@jsnmoon jsnmoon merged commit 90605a8 into master Oct 23, 2019
@matticbot matticbot added [Status] Needs Changelog and removed [Status] Ready to Merge Go ahead, you can push that green button! labels Oct 23, 2019
@jeherve jeherve added the [Status] Needs Testing We need to add this change to the testing call for this month's release label Oct 24, 2019
@jeherve jeherve added [Status] Has Changelog and removed [Status] Needs Changelog [Status] Needs Testing We need to add this change to the testing call for this month's release labels Oct 28, 2019
jeherve added a commit that referenced this pull request Oct 28, 2019
jeherve added a commit that referenced this pull request Oct 29, 2019
* 7.9: Changelog

* Update version number

* Update stable tag and tested up to

* Changelog: add #13530

* changelog: add #13578

* Changelog: add #13598

* Changelog: add entry for numerous block preview changes

* Changelog: add #13599

* changelog: add #13541

* Changelog: add #13542

* Changelog: add #13331

* Changelog: add #13558

* Changelog: add #13409

* Changelog: add #13582

* Changelog: add #13600

* Changelog: add #13601

* Changelog: add #13595

* Changelog: add #12695

* Changelog: add #13009

* Changelog: add #13649

* Changelog: add #13450

* Changelog: add #13507

* Changelog: add #13658

* Changelog: add #13687

* changelog: add #13683

* Changelog: add #9323

* Changelog: add #13681

* Fix typos in readme

* Add link to WordPress Beta Tester plugin

* Changelog: add #13630

* Changelog: add #13695

* Changelog: add #13659

* Changelog: add #13716

* Changelog: add #13664

* Changelog: add #13682

* Changelog: add #13362

* Changelog: add #13563

* Add testing list for #13563

* Changelog: add #13735

* Changelog: add #13752

* Changelog: add #13624

* Changelog: add #13756

* Changelog: add #13745

* Changelog: add #13728

* Changelog: add #13779

* Changelog: add #13699

* Changelog: add #13804

* Changelog: add #13761

* Changelog: add #13637

* Changelog: add #13517

* Changelog: add #13521

* Changelog: add #13729

* Testing list: add testing instructions for #13729

* Changelog: add sync changes

* Changelog: add #13807

* Changelog: add #13654

* Changelog: add #13795

* Changelog: add #13801

* Changelog: add #13818

* Changelog: add #13725

* Changelog: add #13831

* Changelog: add #13516

* Testing list: add Twenty Twenty instructions

* Changelog: add #13799

* Changelog: add #13805

* Changelog: add #13688

* Changelog: add #13830
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Search For all things related to Search Touches WP.com Files [Type] Enhancement Changes to an existing feature — removing, adding, or changing parts of it
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants