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

feat(v2): add search page 🔎 #2756

Merged
merged 1 commit into from
May 17, 2020
Merged

feat(v2): add search page 🔎 #2756

merged 1 commit into from
May 17, 2020

Conversation

lex111
Copy link
Contributor

@lex111 lex111 commented May 16, 2020

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):

image

In navbar by pressing the Enter key:

screencast-nimbus-capture-2020 05 16-21_03_43 (2)

With OpenSearch in Chrome:

screencast-nimbus-capture-2020 05 16-21_02_49 (1)

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 lex111 added the pr: new feature This PR adds a new API or behavior. label May 16, 2020
@lex111 lex111 requested a review from yangshun as a code owner May 16, 2020 18:38
@facebook-github-bot facebook-github-bot added the CLA Signed Signed Facebook CLA label May 16, 2020
@lex111
Copy link
Contributor Author

lex111 commented May 16, 2020

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

@docusaurus-bot
Copy link
Contributor

Deploy preview for docusaurus-2 ready!

Built with commit e699937

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

Copy link
Contributor

@yangshun yangshun left a comment

Choose a reason for hiding this comment

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

This is amazing work!

@yangshun yangshun merged commit 3ad4550 into master May 17, 2020
@yangshun yangshun deleted the lex111/search-page branch May 17, 2020 07:55
@yangshun
Copy link
Contributor

Do we want to document the useVersioning hook?

@lex111
Copy link
Contributor Author

lex111 commented May 17, 2020

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
Copy link

s-pace commented May 18, 2020

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
Copy link
Contributor Author

lex111 commented May 18, 2020

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!

@lex111 lex111 added this to the v2.0.0-alpha.55 milestone May 19, 2020
@amimas
Copy link

amimas commented May 19, 2020

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
Copy link

mtooke commented Jun 16, 2020

@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
Copy link
Contributor

aeneasr commented Feb 14, 2022

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
Copy link
Collaborator

slorber commented Feb 16, 2022

@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

image


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
Copy link
Contributor Author

lex111 commented Feb 16, 2022

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed Signed Facebook CLA pr: new feature This PR adds a new API or behavior.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

9 participants