feat: add storage listener for language change

Author: mchappell

apps/browser-extension-wallet/src/components/MainMenu/DropdownMenuOverlay/components/LanguageChoice.tsx

@@ -3,6 +3,7 @@ import { useTranslation } from 'react-i18next';
 import cn from 'classnames';
 import styles from '../DropdownMenuOverlay.module.scss';
 import { useBackgroundServiceAPIContext } from '@providers';
+import { storage as webStorage } from 'webextension-polyfill';
 
 type LanguageChoiceProps = {
   onClick: () => void;
@@ -16,9 +17,10 @@ export const LanguageChoice = ({ onClick }: LanguageChoiceProps): React.ReactEle
   useEffect(() => {
     const getLanguage = async () => {
       const { languageChoice } = await getBackgroundStorage();
-      setLanguage(languageChoice);
+      if (languageChoice) setLanguage(languageChoice);
     };
     getLanguage();
+    webStorage.onChanged.addListener(getLanguage);
   }, [getBackgroundStorage]);
 
   return (

apps/browser-extension-wallet/src/components/MainMenu/DropdownMenuOverlay/components/LanguageInfo.tsx

@@ -5,6 +5,7 @@ import styles from './NetworkInfo.module.scss';
 import { useBackgroundServiceAPIContext } from '@providers';
 import { Radio, RadioChangeEvent } from 'antd';
 import { usePostHogClientContext } from '@providers/PostHogClientProvider';
+import { storage as webStorage } from 'webextension-polyfill';
 
 type LanguageChoiceProps = {
   onBack: () => void;
@@ -24,6 +25,7 @@ export const LanguageInfo = ({ onBack }: LanguageChoiceProps): React.ReactElemen
       const { languageChoice } = await getBackgroundStorage();
       if (languageChoice) setLanguage(languageChoice);
     };
+    webStorage.onChanged.addListener(getLanguage);
     getLanguage();
   }, [getBackgroundStorage]);