From 444562c3a763bab7a9c0ebfca5eec635e142a61f Mon Sep 17 00:00:00 2001 From: Eduardo San Martin Morote Date: Thu, 6 Jan 2022 04:43:37 +0100 Subject: [PATCH] fix: use algolia search lang (#459) --- docs/config/algolia-search.md | 39 +------------------ .../components/AlgoliaSearchBox.vue | 6 +-- 2 files changed, 4 insertions(+), 41 deletions(-) diff --git a/docs/config/algolia-search.md b/docs/config/algolia-search.md index 9f5208f6..3ee35eb1 100644 --- 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 `` element. Here is a short example of DocSearch config: - -```json -{ - "index_name": "", - "start_urls": [ - { - "url": "" - } - ], - "stop_urls": ["(?:(? .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 `` 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 index a354c8f6..928fd4b1 100644 --- 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) } } )