fix: use algolia search lang (#459)

vuejs · Jan 6, 2022 · 444562c · 444562c
1 parent a8f147f
commit 444562c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 41 deletions.
diff --git a/docs/config/algolia-search.md b/docs/config/algolia-search.md
@@ -47,41 +47,4 @@ module.exports = {
 }
 ```
 
-VitePress will automatically add a `language` _facetFilter_ to the `searchParameters.facetFilter` array with the correct language value. **Make sure to properly configure your DocSearch config as well** by adding `language` as a _custom attribute for faceting_ and by setting it based on the `lang` attribute of the `<html>` element. Here is a short example of DocSearch config:
-
-```json
-{
-  "index_name": "<the name of your library>",
-  "start_urls": [
-    {
-      "url": "<your deployed url>"
-    }
-  ],
-  "stop_urls": ["(?:(?<!\\.html)(?<!/))$"],
-  "selectors": {
-    "lvl0": {
-      "selector": ".sidebar > .sidebar-links > .sidebar-link .sidebar-link-item.active",
-      "global": true,
-      "default_value": "Documentation"
-    },
-    "lvl1": ".content h1",
-    "lvl2": ".content h2",
-    "lvl3": ".content h3",
-    "lvl4": ".content h4",
-    "lvl5": ".content h5",
-    "lvl6": ".content p, .content li",
-    "text": ".content [class^=language-]",
-    "language": {
-      "selector": "/html/@lang",
-      "type": "xpath",
-      "global": true,
-      "default_value": "en-US"
-    }
-  },
-  "custom_settings": {
-    "attributesForFaceting": ["language"]
-  }
-}
-```
-
-You can take a look at the [DocSearch config used by Vue Router](https://github.com/algolia/docsearch-configs/blob/master/configs/next_router_vuejs.json) for a complete example.
+VitePress will automatically add a `lang` _facetFilter_ to the `searchParameters.facetFilter` array with the correct language value. Algolia automatically adds the correct facet filter based on the `lang` attribute on the `<html>` tag. This will match search results with the currently viewed language of the page.
diff --git a/src/client/theme-default/components/AlgoliaSearchBox.vue b/src/client/theme-default/components/AlgoliaSearchBox.vue
@@ -55,7 +55,7 @@ const { lang } = useData()
 // if the user has multiple locales, the search results should be filtered
 // based on the language
 const facetFilters: string[] = props.multilang
-  ? ['language:' + lang.value]
+  ? ['lang:' + lang.value]
   : []
 
 if (props.options.searchParameters?.facetFilters) {
@@ -66,10 +66,10 @@ watch(
   lang,
   (newLang, oldLang) => {
     const index = facetFilters.findIndex(
-      (filter) => filter === 'language:' + oldLang
+      (filter) => filter === 'lang:' + oldLang
     )
     if (index > -1) {
-      facetFilters.splice(index, 1, 'language:' + newLang)
+      facetFilters.splice(index, 1, 'lang:' + newLang)
     }
   }
 )