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: add translations prop to search button #995

Merged
merged 2 commits into from Feb 5, 2021

Conversation

slorber
Copy link
Contributor

@slorber slorber commented Feb 3, 2021

Summary

Ability to translate DocSearch placeholder label, a low hanging fruit as it's the most visible one, but there are probably other labels to allow translating (including aria attributes).

This is a pseudo code suggestion, not sure it works yet :)

You may be happy to know about ComponentProps in TS :)

Result

image

Copy link
Contributor

@lex111 lex111 left a comment

Choose a reason for hiding this comment

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

@francoischalifour please take a look at this.

Copy link
Member

@francoischalifour francoischalifour left a comment

Choose a reason for hiding this comment

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

Thank you @slorber!

There will be other texts that we want to translate like the aria-label of the button. So I think we should rather pass a translations prop with a few keys:

type Translations = Partial<{
  buttonText: string;
  buttonAriaLabel: string;
}>

Wdyt?

(Thanks for letting us know about React.ComponentProps.)

@slorber
Copy link
Contributor Author

slorber commented Feb 4, 2021

sure, just updated

Copy link
Member

@francoischalifour francoischalifour left a comment

Choose a reason for hiding this comment

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

Thanks!

@francoischalifour francoischalifour changed the title Ability to translate search label feat: add translations prop to search button Feb 5, 2021
@francoischalifour francoischalifour merged commit 44f5c7b into algolia:next Feb 5, 2021
@francoischalifour
Copy link
Member

Released in @docsearch/react@3.0.0-alpha.33.

@slorber
Copy link
Contributor Author

slorber commented Feb 5, 2021

thanks :)

@meteorlxy
Copy link

Seems that this prop is not available in the <DocSearch> component?

@francoischalifour
Copy link
Member

@meteorlxy This prop is only available on the DocSearchButton component, exported from the package. It's not yet on the DocSearch component itself. We plan to add it in the future.

@slorber
Copy link
Contributor Author

slorber commented May 7, 2021

@francoischalifour was wondering if you could create an issue to track i18n support?

Some Docusaurus users asked about this and want to have a link to give them ;)

facebook/docusaurus#3643 (comment)

@shortcuts
Copy link
Member

Hi @slorber,

Here's some resources you can share with your users:

As DocSearch v3 rely on Autocomplete v1 (which has just been released), we are re-thinking the way we would like to ship a stable version of it.

The next steps are:

  • Implement the translations API in Autocomplete
  • Package DocSearch v3 directly with Autocomplete (which would offer more flexibility/features and in this case, the translations API)

We will start working on it in the coming months, and will make sure to let you know what's the progress on it!

@slorber
Copy link
Contributor Author

slorber commented May 7, 2021

thanks :)

@stnor
Copy link

stnor commented Sep 7, 2021

@shortcuts Any progress on this yet? Estimated arrival? Thanks.

@shortcuts
Copy link
Member

Hey @stnor, this task has been delayed for DocSearch but is done on Autocomplete.

I'll tackle it in the next two weeks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants