feat(v2): add search page 🔎

[lex111]

Motivation

I am pleased to present the fully fledged search page - awesomeness killer-feature!

As far as I know, none of the major static site generators that use Algolia have a "real" search page. But why? It is so convenient especially for docs websites, so I tried to solve that shortfall.

So now users will be able to see all the search results for a specific query, and not just those five result items that were shown in navbar.

In addition, the search page supports selecting of a specific version to search, which may be useful to someone.

Last but not least, it is OpenSearch support (aka Tab To Search)..yeah we can search by own documentation just by pressing the Tab button in your brower after that!

See all use cases in the screenshots below.

Have you read the Contributing Guidelines on pull requests?

Yes

Test Plan

LIVE DEMO: https://hardcore-saha-310ffe.netlify.app/search

For OpenSearch to work, you need to specify the working site url in the config file, so it was necessary to create a separate built on Netify available by that link.
So https://deploy-preview-2756--docusaurus-2.netlify.app/ not support OpenSearch

---

General view (light mode):

In navbar by pressing the Enter key:

With OpenSearch in Chrome:

Related PRs

(If this PR adds or changes functionality, please take some time to update the docs at https://github.com/facebook/docusaurus, and link to your PR here.)

[lex111]

@s-pace I am interested to know your opinion about this feature.

[docusaurus-bot]

Deploy preview for docusaurus-2 ready!

Built with commit e699937

https://deploy-preview-2756--docusaurus-2.netlify.app

[yangshun]

This is amazing work!

[yangshun]

Do we want to document the useVersioning hook?

[lex111]

This is actually a kind of MVP so I would not recommend using it outside of core. Also versioning hook should provide the ability to determine the current page version (from location object).

Moreover, it seems to me that this hook should be defined in docusaurus namespace, rather in theme one (i.e. @docusaurus/useVersioning). But how to do this from a plugin, I have not yet come up with a way for this.

[s-pace]

We are about to release a new version of DocSearch (v3). The search will be done through a modal. It will be quite similar to a search page.

Let us know if you need anything

[lex111]

It looks promising, although this is not a full replacement for the search page, but very good compared to the current version. Definitely we want to improve our docsearch!

[amimas]

Just wanted to drop by and say this is one of the many cool features of Docusaurus V2. Can't wait to try this out.

[mtooke]

@lex111 Is there anyway to override this?

I've built my own static search page and overridden the search bar to pass results to it. I wanted a faceted search experience using Algolia. Everything was working perfectly on alpha 40, but now when I update to anything later I get what I think is this built-in page?

[aeneasr]

Is there some way to disable this page, or move it under a different URL? I could not find it in the code / config reference.

[slorber]

@aeneasr no way to disable/change path with config, but we could easily add this, please open a dedicated issue.

Note that we link to this global search page from the DocSearch modal, so we may need to figure a way to remove that link too

---

A workaround: extend the search theme and provide your own contentLoaded lifecycle to do nothing instead of the default behavior:

    async contentLoaded({actions: {addRoute}}) {
-      addRoute({
-        path: normalizeUrl([baseUrl, 'search']),
-        component: '@theme/SearchPage',
-        exact: true,
-      });
    },

See also #4138 (comment)

Not the most convenient though

[lex111]

This is really necessary, so I opened a PR to implement this missing part #6692