3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-06-11 07:12:29 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor(v2): add more translatable strings (#4219)

Browse source 
* refactor(v2): add more translatable strings

* Apply suggestions from code review

Co-authored-by: Sébastien Lorber <slorber@users.noreply.github.com>

* Fixes

* Updates

* Localize direct link to heading

* typo + add french translations

Co-authored-by: Sébastien Lorber <slorber@users.noreply.github.com>
Co-authored-by: slorber <lorber.sebastien@gmail.com>
This commit is contained in:
Alexey Pyltsyn 2021-02-18 13:29:51 +03:00 • committed by GitHub
parent 75228c4b8d
commit 08fa318599
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 267 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

20
packages/docusaurus-plugin-pwa/src/theme/PwaReloadPopup/index.js
View file

@ -7,6 +7,7 @@
import React, {useState} from 'react';
import clsx from 'clsx';
import Translate, {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
@ -16,7 +17,13 @@ export default function PwaReloadPopup({onReload}) {
return (
isVisible && (
<div className={clsx('alert', 'alert--secondary', styles.popup)}>
<p>New version available</p>
<p>
<Translate
id="theme.PwaReloadPopup.info"
description="The text for PWA reload popup">
New version available
</Translate>
</p>
<div className={styles.buttonContainer}>
<button
className="button button--link"
@ -25,11 +32,20 @@ export default function PwaReloadPopup({onReload}) {
setIsVisible(false);
onReload();
}}>
<Translate
id="theme.PwaReloadPopup.refreshButtonText"
description="The text for PWA reload button">
Refresh
</Translate>
</button>
<button
aria-label="Close"
aria-label={translate({
id: 'theme.PwaReloadPopup.closeButtonAriaLabel',
message: 'Close',
description:
'The ARIA label for close button of PWA reload popup',
})}
className="close"
type="button"
onClick={() => setIsVisible(false)}>

42
packages/docusaurus-theme-classic/codeTranslations/base.json Normal file
View file

@ -0,0 +1,42 @@
{
"theme.NotFound.title": "Page Not Found",
"theme.NotFound.p1": "We could not find what you were looking for.",
"theme.NotFound.p2": "Please contact the owner of the site that linked you to the original URL and let them know their link is broken.",
"theme.AnnouncementBar.closeButtonAriaLabel": "Close",
"theme.blog.paginator.navAriaLabel": "Blog list page navigation",
"theme.blog.paginator.newerEntries": "Newer Entries",
"theme.blog.paginator.olderEntries": "Older Entries",
"theme.blog.post.paginator.navAriaLabel": "Blog post page navigation",
"theme.blog.post.paginator.newerPost": "Newer Post",
"theme.blog.post.paginator.olderPost": "Older Post",
"theme.blog.post.readMore": "Read More",
"theme.blog.tags": "Tags:",
"theme.CodeBlock.copyButtonAriaLabel": "Copy code to clipboard",
"theme.CodeBlock.copied": "Copied",
"theme.CodeBlock.copy": "Copy",
"theme.docs.paginator.navAriaLabel": "Docs pages navigation",
"theme.docs.paginator.previous": "Previous",
"theme.docs.paginator.next": "Next",
"theme.docs.sidebar.expandButtonTitle": "Expand sidebar",
"theme.docs.sidebar.expandButtonAriaLabel": "Expand sidebar",
"theme.docs.sidebar.responsiveCloseButtonLabel": "Close menu",
"theme.docs.sidebar.responsiveOpenButtonLabel": "Open menu",
"theme.docs.sidebar.collapseButtonTitle": "Collapse sidebar",
"theme.docs.sidebar.collapseButtonAriaLabel": "Collapse sidebar",
"theme.common.editThisPage": "Edit this page",
"theme.common.headingLinkTitle": "Direct link to heading",
"theme.common.skipToMainContent": "Skip to main content",
"theme.SearchPage.existingResultsTitle": "Search results for",
"theme.SearchPage.emptyResultsTitle": "Search the documentation",
"theme.SearchPage.inputPlaceholder": "Type your search here",
"theme.SearchPage.inputLabel": "Search",
"theme.SearchPage.algoliaLabel": "Search by Algolia",
"theme.SearchPage.noResultsText": "No results were found",
"theme.SearchPage.fetchingNewResults": "Fetching new results...",
"theme.SearchBar.label": "Search",
"theme.PwaReloadPopup.info": "New version available",
"theme.PwaReloadPopup.refreshButtonText": "Refresh",
"theme.PwaReloadPopup.closeButtonAriaLabel": "Close",
"theme.Playground.liveEditor": "Live Editor",
"theme.Playground.result": "Result"
}

42
packages/docusaurus-theme-classic/codeTranslations/fr.json
View file

@ -2,17 +2,41 @@
"theme.NotFound.title": "Page introuvable",
"theme.NotFound.p1": "Nous n'avons pas trouvé ce que vous recherchez.",
"theme.NotFound.p2": "Veuillez contacter le propriétaire du site qui vous a lié à l'URL d'origine et leur faire savoir que leur lien est cassé.",
"theme.BlogListPaginator.newerEntries": "Nouvelles entrées",
"theme.BlogListPaginator.olderEntries": "Anciennes entrées",
"theme.BlogPostItem.readMore": "Lire plus",
"theme.BlogPostPaginator.newerPost": "Article plus récent",
"theme.BlogPostPaginator.olderPost": "Article plus ancien",
"theme.AnnouncementBar.closeButtonAriaLabel": "Fermer",
"theme.blog.paginator.navAriaLabel": "Pagination de la liste des posts du blog",
"theme.blog.paginator.newerEntries": "Nouvelles entrées",
"theme.blog.paginator.olderEntries": "Anciennes entrées",
"theme.blog.post.paginator.navAriaLabel": "Pagination des blog posts",
"theme.blog.post.paginator.newerPost": "Article plus récent",
"theme.blog.post.paginator.olderPost": "Article plus ancien",
"theme.blog.post.readMore": "Lire plus",
"theme.blog.tags": "Tags:",
"theme.CodeBlock.copyButtonAriaLabel": "Copier le code",
"theme.CodeBlock.copied": "Copié",
"theme.CodeBlock.copy": "Copier",
"theme.DocPaginator.previous": "Précédent",
"theme.DocPaginator.next": "Suivant",
"theme.EditThisPage.editThisPage": "Éditer cette page",
"theme.SkipToContent.skipToMainContent": "Aller au contenu principal",
"theme.docs.paginator.navAriaLabel": "Pagination des documents",
"theme.docs.paginator.previous": "Précédent",
"theme.docs.paginator.next": "Suivant",
"theme.docs.sidebar.expandButtonTitle": "Déplier le menu latéral",
"theme.docs.sidebar.expandButtonAriaLabel": "Déplier le menu latéral",
"theme.docs.sidebar.responsiveCloseButtonLabel": "Fermer le menu latéral",
"theme.docs.sidebar.responsiveOpenButtonLabel": "Ouvrir le menu latéral",
"theme.docs.sidebar.collapseButtonTitle": "Réduire le menu latéral",
"theme.docs.sidebar.collapseButtonAriaLabel": "Réduire le menu latéral",
"theme.common.editThisPage": "Éditer cette page",
"theme.common.headingLinkTitle": "Lien direct vers le titre",
"theme.common.skipToMainContent": "Aller au contenu principal",
"theme.SearchPage.existingResultsTitle": "Rechercher des résultats pour",
"theme.SearchPage.emptyResultsTitle": "Rechercher dans la documentation",
"theme.SearchPage.inputPlaceholder": "Tapez vôtre recherche ici",
"theme.SearchPage.inputLabel": "Chercher",
"theme.SearchPage.algoliaLabel": "Recharche Algolia",
"theme.SearchPage.noResultsText": "Aucun résultat trouvé",
"theme.SearchPage.fetchingNewResults": "Chargement de nouveaux résultats...",
"theme.SearchBar.label": "Chercher",
"theme.PwaReloadPopup.info": "Nouvelle version disponible",
"theme.PwaReloadPopup.refreshButtonText": "Rafraichir",
"theme.PwaReloadPopup.closeButtonAriaLabel": "Fermer",
"theme.Playground.liveEditor": "Éditeur en direct",
"theme.Playground.result": "Résultat"
}

7
packages/docusaurus-theme-classic/src/theme/AnnouncementBar/index.tsx
View file

@ -9,6 +9,7 @@ import React from 'react';
import clsx from 'clsx';
import {useThemeConfig} from '@docusaurus/theme-common';
import useUserPreferencesContext from '@theme/hooks/useUserPreferencesContext';
import {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
@ -46,7 +47,11 @@ function AnnouncementBar(): JSX.Element | null {
type="button"
className={styles.announcementBarClose}
onClick={closeAnnouncementBar}
aria-label="Close">
aria-label={translate({
id: 'theme.AnnouncementBar.closeButtonAriaLabel',
message: 'Close',
description: 'The ARIA label for close button of announcement bar',
})}>
<span aria-hidden="true">×</span>
</button>
) : null}

14
packages/docusaurus-theme-classic/src/theme/BlogListPaginator/index.tsx
View file

@ -7,7 +7,7 @@
import React from 'react';
import Link from '@docusaurus/Link';
import Translate from '@docusaurus/Translate';
import Translate, {translate} from '@docusaurus/Translate';
import type {Metadata} from '@theme/BlogListPage';
function BlogListPaginator(props: {readonly metadata: Metadata}): JSX.Element {
@ -15,14 +15,20 @@ function BlogListPaginator(props: {readonly metadata: Metadata}): JSX.Element {
const {previousPage, nextPage} = metadata;
return (
<nav className="pagination-nav" aria-label="Blog list page navigation">
<nav
className="pagination-nav"
aria-label={translate({
id: 'theme.blog.paginator.navAriaLabel',
message: 'Blog list page navigation',
description: 'The ARIA label for the blog pagination',
})}>
<div className="pagination-nav__item">
{previousPage && (
<Link className="pagination-nav__link" to={previousPage}>
<div className="pagination-nav__label">
&laquo;{' '}
<Translate
id="theme.BlogListPaginator.newerEntries"
id="theme.blog.paginator.newerEntries"
description="The label used to navigate to the newer blog posts page (previous page)">
Newer Entries
</Translate>
@ -35,7 +41,7 @@ function BlogListPaginator(props: {readonly metadata: Metadata}): JSX.Element {
<Link className="pagination-nav__link" to={nextPage}>
<div className="pagination-nav__label">
<Translate
id="theme.BlogListPaginator.olderEntries"
id="theme.blog.paginator.olderEntries"
description="The label used to navigate to the older blog posts page (next page)">
Older Entries
</Translate>{' '}

12
packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.tsx
View file

@ -117,7 +117,13 @@ function BlogPostItem(props: Props): JSX.Element {
<footer className="row margin-vert--lg">
{tags.length > 0 && (
<div className="col">
<strong>Tags:</strong>
<strong>
<Translate
id="theme.blog.tags"
description="The label used during output tags list">
Tags:
</Translate>
</strong>
{tags.map(({label, permalink: tagPermalink}) => (
<Link
key={tagPermalink}
@ -135,8 +141,8 @@ function BlogPostItem(props: Props): JSX.Element {
aria-label={`Read more about ${title}`}>
<strong>
<Translate
id="theme.BlogPostItem.readMore"
description="The label used in blog post item excerps to link to full blog posts">
id="theme.blog.post.readMore"
description="The label used in blog post item excerpts to link to full blog posts">
Read More
</Translate>
</strong>

14
packages/docusaurus-theme-classic/src/theme/BlogPostPaginator/index.tsx
View file

@ -6,7 +6,7 @@
*/
import React from 'react';
import Translate from '@docusaurus/Translate';
import Translate, {translate} from '@docusaurus/Translate';
import Link from '@docusaurus/Link';
import type {Props} from '@theme/BlogPostPaginator';
@ -14,13 +14,19 @@ function BlogPostPaginator(props: Props): JSX.Element {
const {nextItem, prevItem} = props;
return (
<nav className="pagination-nav" aria-label="Blog post page navigation">
<nav
className="pagination-nav"
aria-label={translate({
id: 'theme.blog.post.paginator.navAriaLabel',
message: 'Blog post page navigation',
description: 'The ARIA label for the blog posts pagination',
})}>
<div className="pagination-nav__item">
{prevItem && (
<Link className="pagination-nav__link" to={prevItem.permalink}>
<div className="pagination-nav__sublabel">
<Translate
id="theme.BlogPostPaginator.newerPost"
id="theme.blog.post.paginator.newerPost"
description="The blog post button label to navigate to the newer/previous post">
Newer Post
</Translate>
@ -36,7 +42,7 @@ function BlogPostPaginator(props: Props): JSX.Element {
<Link className="pagination-nav__link" to={nextItem.permalink}>
<div className="pagination-nav__sublabel">
<Translate
id="theme.BlogPostPaginator.olderPost"
id="theme.blog.post.paginator.olderPost"
description="The blog post button label to navigate to the older/next post">
Older Post
</Translate>

8
packages/docusaurus-theme-classic/src/theme/CodeBlock/index.tsx
View file

@ -12,7 +12,7 @@ import copy from 'copy-text-to-clipboard';
import rangeParser from 'parse-numeric-range';
import usePrismTheme from '@theme/hooks/usePrismTheme';
import type {Props} from '@theme/CodeBlock';
import Translate from '@docusaurus/Translate';
import Translate, {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
import {useThemeConfig} from '@docusaurus/theme-common';
@ -240,7 +240,11 @@ export default function CodeBlock({
<button
ref={button}
type="button"
aria-label="Copy code to clipboard"
aria-label={translate({
id: 'theme.CodeBlock.copyButtonAriaLabel',
message: 'Copy code to clipboard',
description: 'The ARIA label for copy code blocks button',
})}
className={clsx(styles.copyButton)}
onClick={handleCopyCode}>
{showCopied ? (

1
packages/docusaurus-theme-classic/src/theme/DocItem/index.tsx
View file

@ -112,6 +112,7 @@ function DocItem(props: Props): JSX.Element {
<div className="col text--right">
<em>
<small>
{/* TODO: wait for using interpolation in translation function */}
Last updated{' '}
{lastUpdatedAt && (
<>

20
packages/docusaurus-theme-classic/src/theme/DocPage/index.tsx
View file

@ -19,6 +19,7 @@ import type {DocumentRoute} from '@theme/DocItem';
import type {Props} from '@theme/DocPage';
import IconArrow from '@theme/IconArrow';
import {matchPath} from '@docusaurus/router';
import {translate} from '@docusaurus/Translate';
import clsx from 'clsx';
import styles from './styles.module.css';
@ -93,16 +94,23 @@ function DocPageContent({
{hiddenSidebar && (
<div
className={styles.collapsedDocSidebar}
title="Expand sidebar"
aria-label="Expand sidebar"
title={translate({
id: 'theme.docs.sidebar.expandButtonTitle',
message: 'Expand sidebar',
description:
'The ARIA label and title attribute for expand button of doc sidebar',
})}
aria-label={translate({
id: 'theme.docs.sidebar.expandButtonAriaLabel',
message: 'Expand sidebar',
description:
'The ARIA label and title attribute for expand button of doc sidebar',
})}
tabIndex={0}
role="button"
onKeyDown={toggleSidebar}
onClick={toggleSidebar}>
<IconArrow
aria-label="Expand sidebar"
className={styles.expandSidebarButtonIcon}
/>
<IconArrow className={styles.expandSidebarButtonIcon} />
</div>
)}
</div>

14
packages/docusaurus-theme-classic/src/theme/DocPaginator/index.tsx
View file

@ -7,14 +7,20 @@
import React from 'react';
import Link from '@docusaurus/Link';
import Translate from '@docusaurus/Translate';
import Translate, {translate} from '@docusaurus/Translate';
import type {Props} from '@theme/DocPaginator';
function DocPaginator(props: Props): JSX.Element {
const {metadata} = props;
return (
<nav className="pagination-nav" aria-label="Blog list page navigation">
<nav
className="pagination-nav"
aria-label={translate({
id: 'theme.docs.paginator.navAriaLabel',
message: 'Docs pages navigation',
description: 'The ARIA label for the docs pagination',
})}>
<div className="pagination-nav__item">
{metadata.previous && (
<Link
@ -22,7 +28,7 @@ function DocPaginator(props: Props): JSX.Element {
to={metadata.previous.permalink}>
<div className="pagination-nav__sublabel">
<Translate
id="theme.DocPaginator.previous"
id="theme.docs.paginator.previous"
description="The label used to navigate to the previous doc">
Previous
</Translate>
@ -38,7 +44,7 @@ function DocPaginator(props: Props): JSX.Element {
<Link className="pagination-nav__link" to={metadata.next.permalink}>
<div className="pagination-nav__sublabel">
<Translate
id="theme.DocPaginator.next"
id="theme.docs.paginator.next"
description="The label used to navigate to the next doc">
Next
</Translate>

36
packages/docusaurus-theme-classic/src/theme/DocSidebar/index.tsx
View file

@ -18,6 +18,7 @@ import type {Props} from '@theme/DocSidebar';
import Logo from '@theme/Logo';
import IconArrow from '@theme/IconArrow';
import IconMenu from '@theme/IconMenu';
import {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
@ -229,7 +230,21 @@ function DocSidebar({
},
)}>
<button
aria-label={showResponsiveSidebar ? 'Close Menu' : 'Open Menu'}
aria-label={
showResponsiveSidebar
? translate({
id: 'theme.docs.sidebar.responsiveCloseButtonLabel',
message: 'Close menu',
description:
'The ARIA label for close button of mobile doc sidebar',
})
: translate({
id: 'theme.docs.sidebar.responsiveOpenButtonLabel',
message: 'Open menu',
description:
'The ARIA label for open button of mobile doc sidebar',
})
}
aria-haspopup="true"
className="button button--secondary button--sm menu__button"
type="button"
@ -270,17 +285,24 @@ function DocSidebar({
{hideableSidebar && (
<button
type="button"
title="Collapse sidebar"
aria-label="Collapse sidebar"
title={translate({
id: 'theme.docs.sidebar.collapseButtonTitle',
message: 'Collapse sidebar',
description:
'The title attribute for collapse button of doc sidebar',
})}
aria-label={translate({
id: 'theme.docs.sidebar.collapseButtonAriaLabel',
message: 'Collapse sidebar',
description:
'The title attribute for collapse button of doc sidebar',
})}
className={clsx(
'button button--secondary button--outline',
styles.collapseSidebarButton,
)}
onClick={onCollapse}>
<IconArrow
className={styles.collapseSidebarButtonIcon}
aria-label="Collapse sidebar"
/>
<IconArrow className={styles.collapseSidebarButtonIcon} />
</button>
)}
</div>

1
packages/docusaurus-theme-classic/src/theme/DocVersionSuggestions/index.tsx
View file

@ -46,6 +46,7 @@ function DocVersionSuggestions(): JSX.Element {
<div className="alert alert--warning margin-bottom--md" role="alert">
{
// TODO need refactoring
// TODO need translate after interpolation appears
activeVersion.name === 'current' ? (
<div>
This is unreleased documentation for {siteTitle}{' '}

2
packages/docusaurus-theme-classic/src/theme/EditThisPage/index.tsx
View file

@ -16,7 +16,7 @@ export default function EditThisPage({editUrl}: Props): JSX.Element {
<a href={editUrl} target="_blank" rel="noreferrer noopener">
<IconEdit />
<Translate
id="theme.EditThisPage.editThisPage"
id="theme.common.editThisPage"
description="The link label to edit the current page">
Edit this page
</Translate>

10
packages/docusaurus-theme-classic/src/theme/Heading/index.tsx
View file

@ -10,6 +10,7 @@
import React from 'react';
import clsx from 'clsx';
import type {HeadingType, Props} from '@theme/Heading';
import {translate} from '@docusaurus/Translate';
import {useThemeConfig} from '@docusaurus/theme-common';
import './styles.css';
@ -36,7 +37,14 @@ const Heading = (Tag: HeadingType): ((props: Props) => JSX.Element) =>
id={id}
/>
{props.children}
<a className="hash-link" href={`#${id}`} title="Direct link to heading">
<a
className="hash-link"
href={`#${id}`}
title={translate({
id: 'theme.common.headingLinkTitle',
message: 'Direct link to heading',
description: 'Title for link to heading',
})}>
#
</a>
</Tag>

2
packages/docusaurus-theme-classic/src/theme/SkipToContent/index.tsx
View file

@ -42,7 +42,7 @@ function SkipToContent(): JSX.Element {
<div ref={containerRef}>
<a href="#main" className={styles.skipToContent} onClick={handleSkip}>
<Translate
id="theme.SkipToContent.skipToMainContent"
id="theme.common.skipToMainContent"
description="The skip to content label used for accessibility, allowing to rapidly navigate to main content with keyboard tab/enter navigation">
Skip to main content
</Translate>

2
packages/docusaurus-theme-search-algolia/package.json
View file

@ -13,7 +13,7 @@
},
"license": "MIT",
"dependencies": {
"@docsearch/react": "^3.0.0-alpha.32",
"@docsearch/react": "^3.0.0-alpha.33",
"@docusaurus/core": "2.0.0-alpha.70",
"@docusaurus/theme-common": "2.0.0-alpha.70",
"@docusaurus/utils": "2.0.0-alpha.70",

11
packages/docusaurus-theme-search-algolia/src/theme/SearchBar/index.js
View file

@ -15,6 +15,7 @@ import Head from '@docusaurus/Head';
import useSearchQuery from '@theme/hooks/useSearchQuery';
import {DocSearchButton, useDocSearchKeyboardEvents} from '@docsearch/react';
import useAlgoliaContextualFacetFilters from '@theme/hooks/useAlgoliaContextualFacetFilters';
import {translate} from '@docusaurus/Translate';
let DocSearchModal = null;
@ -144,6 +145,12 @@ function DocSearch({contextualSearch, ...props}) {
searchButtonRef,
});
const translatedSearchLabel = translate({
id: 'theme.SearchBar.label',
message: 'Search',
description: 'The ARIA label and placeholder for search button',
});
return (
<>
<Head>
@ -163,6 +170,10 @@ function DocSearch({contextualSearch, ...props}) {
onMouseOver={importDocSearchModalIfNeeded}
onClick={onOpen}
ref={searchButtonRef}
translations={{
buttonText: translatedSearchLabel,
buttonAriaLabel: translatedSearchLabel,
}}
/>
{isOpen &&

59
packages/docusaurus-theme-search-algolia/src/theme/SearchPage/index.js
View file

@ -21,6 +21,7 @@ import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import {useAllDocsData} from '@theme/hooks/useDocs';
import useSearchQuery from '@theme/hooks/useSearchQuery';
import Layout from '@theme/Layout';
import Translate, {translate} from '@docusaurus/Translate';
import styles from './styles.module.css';
@ -99,12 +100,11 @@ const SearchVersionSelectList = ({docsSearchVersionsHelpers}) => {
);
};
function Search() {
function SearchPage() {
const {
siteConfig: {
themeConfig: {algolia: {appId = 'BH4D9OD16A', apiKey, indexName} = {}},
} = {},
siteConfig: {themeConfig: {algolia: {appId, apiKey, indexName} = {}}} = {},
} = useDocusaurusContext();
const docsSearchVersionsHelpers = useDocsSearchVersionsHelpers();
const {searchValue, updateSearchPath} = useSearchQuery();
const [searchQuery, setSearchQuery] = useState(searchValue);
@ -236,8 +236,16 @@ function Search() {
const getTitle = () =>
searchQuery
? `Search results for "${searchQuery}"`
: 'Search the documentation';
? `${translate({
id: 'theme.SearchPage.existingResultsTitle',
message: 'Search results for',
description: 'The search page title for non-empty query',
})} "${searchQuery}"`
: translate({
id: 'theme.SearchPage.emptyResultsTitle',
message: 'Search the documentation',
description: 'The search page title for empty query',
});
const makeSearch = (page = 0) => {
algoliaHelper.addDisjunctiveFacetRefinement('docusaurus_tag', 'default');
@ -318,8 +326,16 @@ function Search() {
type="search"
name="q"
className={styles.searchQueryInput}
placeholder="Type your search here"
aria-label="Search"
placeholder={translate({
id: 'theme.SearchPage.inputPlaceholder',
message: 'Type your search here',
description: 'The placeholder for search page input',
})}
aria-label={translate({
id: 'theme.SearchPage.inputLabel',
message: 'Search',
description: 'The ARIA label for search page input',
})}
onChange={(e) => setSearchQuery(e.target.value)}
value={searchQuery}
autoComplete="off"
@ -349,12 +365,15 @@ function Search() {
target="_blank"
rel="noopener noreferrer"
href="https://www.algolia.com/"
aria-label="Search">
aria-label={translate({
id: 'theme.SearchPage.algoliaLabel',
message: 'Search by Algolia',
description: 'The ARIA label for Algolia mention',
})}>
<svg
viewBox="0 0 168 24"
className={styles.algoliaLogo}
xmlns="http://www.w3.org/2000/svg"
aria-label="Search by Algolia">
xmlns="http://www.w3.org/2000/svg">
<g fill="none">
<path
className={styles.algoliaLogoPathFill}
@ -420,7 +439,13 @@ function Search() {
) : (
[
searchQuery && !searchResultState.loading && (
<p key="no-results">No results were found</p>
<p key="no-results">
<Translate
id="theme.SearchPage.noResultsText"
description="The paragraph for empty search result">
No results were found
</Translate>
</p>
),
!!searchResultState.loading && (
<div key="spinner" className={styles.loadingSpinner} />
@ -430,7 +455,13 @@ function Search() {
{searchResultState.hasMore && (
<div className={styles.loader} ref={setLoaderRef}>
<span>Fetching new results...</span>
<span>
<Translate
id="theme.SearchPage.fetchingNewResults"
description="The paragraph for fetching new search results">
Fetching new results...
</Translate>
</span>
</div>
)}
</div>
@ -438,4 +469,4 @@ function Search() {
);
}
export default Search;
export default SearchPage;

18
yarn.lock
View file

@ -1248,19 +1248,19 @@
enabled "2.0.x"
kuler "^2.0.0"
"@docsearch/css@3.0.0-alpha.32":
version "3.0.0-alpha.32"
resolved "https://registry.yarnpkg.com/@docsearch/css/-/css-3.0.0-alpha.32.tgz#3d89c8db4035531d201f74ef2115f72094a24036"
integrity sha512-wafLX/jT1NPAwifPhzMJX394PjKdqf5TA4cz/JgvBYR1/+MiErLk/pyCmocXkawWGR17/6u2qw3wYvXu/Qe/DQ==
"@docsearch/css@3.0.0-alpha.33":
version "3.0.0-alpha.33"
resolved "https://registry.yarnpkg.com/@docsearch/css/-/css-3.0.0-alpha.33.tgz#36c8d61ec001d678b501adf49117413dd9c41fa3"
integrity sha512-7k/d960WaCRPxZqKwasSH2+pmKW+IeQ14zvS8t7T59OeW24G4N9xuLnpBf1XZ6IyS2AS3KPwRomwRX78qpETVg==
"@docsearch/react@^3.0.0-alpha.32":
version "3.0.0-alpha.32"
resolved "https://registry.yarnpkg.com/@docsearch/react/-/react-3.0.0-alpha.32.tgz#ae3fa82e9c88683d9415bc439c4af7e2c0cfa5b7"
integrity sha512-2jqzPJu4y0mWiwwm+Kfgf/97Q8XaGxj1+jJfGJpJLkJyD8S2tK4OikyIRWI9gI9k3m48HxFm0+P8uAYYtIyjqA==
"@docsearch/react@^3.0.0-alpha.33":
version "3.0.0-alpha.33"
resolved "https://registry.yarnpkg.com/@docsearch/react/-/react-3.0.0-alpha.33.tgz#2f8b5d90990b54b59db1a90e405d8008178e972a"
integrity sha512-XOhaUsxiq62umpGMfgzey45H6Id7qOa2DyJJOIpZHEeo5uFVkxc7Qamng+ETdUIn9ql8tWRPzjTh5OAtjJAgxw==
dependencies:
"@algolia/autocomplete-core" "^1.0.0-alpha.35"
"@algolia/autocomplete-preset-algolia" "^1.0.0-alpha.35"
"@docsearch/css" "3.0.0-alpha.32"
"@docsearch/css" "3.0.0-alpha.33"
algoliasearch "^4.0.0"
"@docusaurus/react-loadable@5.5.0":