3 files changed, 12 insertions, 4 deletions
diff --git a/docs/src/components/HeadSEO.astro b/docs/src/components/HeadSEO.astro
index 434f4a010..9cc9046a6 100644
--- a/docs/src/components/HeadSEO.astro
+++ b/docs/src/components/HeadSEO.astro
@@ -1,9 +1,10 @@
 ---
 import {SITE, OPEN_GRAPH} from '../config.ts';
+import { getLanguageFromURL } from '../util.ts';
 export interface Props {
   content: any,
   site: any,
-  canonicalURL: URL | string,
+  canonicalURL: URL,
 };
 const {
         content = {},
@@ -12,10 +13,14 @@ const {
 const imageSrc = content?.image?.src ?? OPEN_GRAPH.image.src;
 const canonicalImageSrc = new URL(imageSrc, Astro.site);
 const imageAlt = content?.image?.alt ?? OPEN_GRAPH.image.alt;
+const lang = canonicalURL && getLanguageFromURL(canonicalURL.pathname);
 ---
 <!-- Page Metadata -->
 <link rel="canonical" href={canonicalURL}/>
 
+<!-- Algolia docsearch language facet -->
+<meta name="docsearch:language" content="{lang}" />
+
 <!-- OpenGraph Tags -->
 <meta property="og:title" content={content.title ?? SITE.title}/>
 <meta property="og:type" content="article"/>
diff --git a/docs/src/components/Header/Header.astro b/docs/src/components/Header/Header.astro
index 968ba69b2..901075cf4 100644
--- a/docs/src/components/Header/Header.astro
+++ b/docs/src/components/Header/Header.astro
@@ -154,6 +154,6 @@ const lang = currentPage && getLanguageFromURL(currentPage);
     </div>
     <div style="flex-grow: 1;"></div>
     {lang && <LanguageSelect lang={lang} client:idle />}
-    <div class="search-item"><Search client:idle /></div>
+    <div class="search-item"><Search lang={lang} client:idle /></div>
     </nav>
-</header>
-\ No newline at end of file
+</header>
diff --git a/docs/src/components/Header/Search.tsx b/docs/src/components/Header/Search.tsx
index 5f05f744f..a3e419b3b 100644
--- a/docs/src/components/Header/Search.tsx
+++ b/docs/src/components/Header/Search.tsx
@@ -5,10 +5,11 @@ import { DocSearchModal, useDocSearchKeyboardEvents } from '@docsearch/react';
 import '@docsearch/css//dist/style.css';
 import './Search.css';
 
-export default function Search() {
+export default function Search(props) {
   const [isOpen, setIsOpen] = useState(false);
   const searchButtonRef = useRef();
   const [initialQuery, setInitialQuery] = useState(null);
+  const {lang = 'en'} = props;
 
   const onOpen = useCallback(() => {
     setIsOpen(true);
@@ -66,6 +67,8 @@ export default function Search() {
             onClose={onClose}
             indexName="astro"
             apiKey="0f387260ad74f9cbf4353facd29c919c"
+            // Set facetFilters once Astro docs have been indexed by language
+            // searchParameters={{ facetFilters: [`lang:${lang}`] }}
             transformItems={(items) => {
               return items.map((item) => {
                 // We transform the absolute URL into a relative URL to