From 389e863b4d5e69c856d1e647d4d4c1807bd94c5d Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva@users.noreply.github.com>
Date: Thu, 7 Oct 2021 22:48:26 +0200
Subject: [PATCH] fix(theme-default/algolia): avoid creating multiple algolia
 searches (#292)

---
 src/client/theme-default/Layout.vue           |  3 +-
 .../components/AlgoliaSearchBox.vue           | 30 ++++++++++++++-----
 2 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/client/theme-default/Layout.vue b/src/client/theme-default/Layout.vue
index d7da603e..ba9569be 100644
--- a/src/client/theme-default/Layout.vue
+++ b/src/client/theme-default/Layout.vue
@@ -88,8 +88,7 @@ const pageClasses = computed(() => {
           <AlgoliaSearchBox
             v-if="theme.algolia"
             :options="theme.algolia"
-            :multilang="isMultiLang"
-            :key="site.lang"
+            :multilang="!!theme.locales"
           />
         </slot>
       </template>
diff --git a/src/client/theme-default/components/AlgoliaSearchBox.vue b/src/client/theme-default/components/AlgoliaSearchBox.vue
index 89023a2e..2b6bb126 100644
--- a/src/client/theme-default/components/AlgoliaSearchBox.vue
+++ b/src/client/theme-default/components/AlgoliaSearchBox.vue
@@ -52,11 +52,29 @@ function update(options: any) {
 
 const { lang } = useData()
 
-function initialize(userOptions: any) {
-  // if the user has multiple locales, the search results should be filtered
-  // based on the language
-  const facetFilters = props.multilang ? ['language:' + lang.value] : []
+// if the user has multiple locales, the search results should be filtered
+// based on the language
+const facetFilters: string[] = props.multilang
+  ? ['language:' + lang.value]
+  : []
+
+if (props.options.searchParameters?.facetFilters) {
+  facetFilters.push(...props.options.searchParameters.facetFilters)
+}
 
+watch(
+  lang,
+  (newLang, oldLang) => {
+    const index = facetFilters.findIndex(
+      (filter) => filter === 'language:' + oldLang
+    )
+    if (index > -1) {
+      facetFilters.splice(index, 1, 'language:' + newLang)
+    }
+  }
+)
+
+function initialize(userOptions: any) {
   docsearch(
     Object.assign({}, userOptions, {
       container: '#docsearch',
@@ -64,9 +82,7 @@ function initialize(userOptions: any) {
       searchParameters: Object.assign({}, userOptions.searchParameters, {
         // pass a custom lang facetFilter to allow multiple language search
         // https://github.com/algolia/docsearch-configs/pull/3942
-        facetFilters: facetFilters.concat(
-          userOptions.searchParameters?.facetFilters || []
-        )
+        facetFilters
       }),
 
       navigator: {