Improve language switching reactivity further by forcing a rerender o…

…f all widgets when the local is changed

package.json

@@ -1,6 +1,6 @@
 {
   "name": "victron-venus-metrics",
-  "version": "2.0.6",
+  "version": "2.0.7",
   "description": "Metric framework for Victron VenusOS",
   "license": "ISC",
   "author": "",

src/app/App.tsx

@@ -4,6 +4,7 @@ import React, { useEffect } from "react"
 import "../css/index.scss"
 import { getLocale } from "react-i18nify"
 import Loading from "./MarineApp/components/Loading"
+import { useVisibleWidgetsStore } from "./MarineApp/modules"
 
 const KVNRV = React.lazy(() => import("./KVNRV"))
 const MarineApp = React.lazy(() => import("./MarineApp"))
@@ -19,6 +20,7 @@ const App = observer((props: AppProps) => {
   const appStore = useAppStore()
   const mqtt = useMqtt()
   const locale = getLocale()
+  const visibleWidgetsStore = useVisibleWidgetsStore()
   useVebus()
 
   useEffect(() => {
@@ -48,6 +50,11 @@ const App = observer((props: AppProps) => {
     locale,
   ])
 
+  useEffect(() => {
+    visibleWidgetsStore.clearVisibleElements()
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [locale])
+
   if (whitelabel === "KVNRV") {
     return (
       <React.Suspense fallback={<Loading />}>

src/app/MarineApp/modules/MetricsWidgets/VisibleWidgets.store.ts

@@ -25,6 +25,10 @@ export class VisibleWidgets {
   get noVisibleElements() {
     return !this.visibleElements.size
   }
+
+  clearVisibleElements() {
+    this.visibleElements.clear()
+  }
 }
 
 let store: VisibleWidgets