Fix stale translations on locale change

fluent-vue · Demivan · Sep 6, 2023 · Sep 6, 2023 · Sep 6, 2023 · Sep 6, 2023
commit c8b7ddecb42982a8f68f6e58adf7feccbf7f976d
diff --git a/src/composition.ts b/src/composition.ts
@@ -12,5 +12,5 @@ export function useFluent(): TranslationContext {
   const rootContext = inject(RootContextSymbol)
   assert(rootContext != null, 'useFluent called without installing plugin')
 
-  return getContext(rootContext, instance.proxy)
+  return getContext(rootContext, instance.proxy, true)
 }
diff --git a/src/getContext.ts b/src/getContext.ts
@@ -13,6 +13,7 @@ function * flatMap<T, TR>(iterable: Iterable<T>, mapper: (element: T) => TR[]):
 export function getContext(
   rootContext: TranslationContext,
   instance: VueComponent | null | undefined,
+  fromSetup = false,
 ): TranslationContext {
   if (instance == null)
     return rootContext
@@ -50,7 +51,10 @@ export function getContext(
 
   const context = new TranslationContext(overriddenBundles, rootContext.options)
 
-  options._fluent = context
+  // If we are in script setup, we cannot cache the context
+  // because after component is unmounted, computed will not be updated
+  if (!fromSetup)
+    options._fluent = context
 
   return context
 }
diff --git a/src/types/vue.d.ts b/src/types/vue.d.ts
@@ -1,14 +1,17 @@
 import type Vue from 'vue-2'
 import type { FluentResource } from '@fluent/bundle'
-import type { FluentVue } from '../index'
+import type { TranslationContext } from '../TranslationContext'
 
 declare module 'vue-2/types/options' {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   interface ComponentOptions<V extends Vue> {
     fluent?: Record<string, FluentResource>
 
     /** @private */
-    _fluent?: FluentVue
+    _fluent?: TranslationContext
+
+    /** @private */
+    _fluentSetup?: TranslationContext
   }
 }