fix(algolia): avoid creating multiple algolia searches

Workaround until a destroy method is added

More at https://github.com/algolia/docsearch-configs/pull/3967#issuecomment-827565200

src/client/theme-default/Layout.vue

@@ -7,7 +7,6 @@
             v-if="theme.algolia"
             :options="theme.algolia"
             :multilang="!!theme.locales"
-            :key="siteRouteData.lang"
           />
         </slot>
       </template>

src/client/theme-default/components/AlgoliaSearchBox.vue

@@ -57,13 +57,29 @@ function update(options: any) {
   }
 }
 
-function initialize(userOptions: any) {
-  // if the user has multiple locales, the search results should be filtered
-  // based on the language
-  const facetFilters = props.multilang
+// if the user has multiple locales, the search results should be filtered
+// based on the language
+const facetFilters: string[] = props.multilang
   ? ['language:' + siteData.value.lang]
   : []
 
+if (props.options.searchParameters?.facetFilters) {
+  facetFilters.push(...props.options.searchParameters.facetFilters)
+}
+
+watch(
+  () => siteData.value.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',
@@ -71,9 +87,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: {