Merge pull request #2030 from botpress/ya-cms-lang

fix(cms): remembering last language on refresh
botpress · Jun 29, 2019 · 7012e16 · 7012e16
2 parents 0790eaa + 4dbbfd6
commit 7012e16
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 4 deletions.
diff --git a/src/bp/ui-studio/src/web/components/Layout/StatusBar/LangSwitcher.jsx b/src/bp/ui-studio/src/web/components/Layout/StatusBar/LangSwitcher.jsx
@@ -8,6 +8,7 @@ import { keyMap } from '~/keyboardShortcuts'
 import style from './StatusBar.styl'
 import Flag from 'react-world-flags'
 
+const STORAGE_KEY = `bp::${window.BOT_ID}::cmsLanguage`
 const langFlagsMap = {
   fr: 'fr',
   en: 'gb',
@@ -22,11 +23,30 @@ const langFlagsMap = {
 class LangSwitcher extends React.Component {
   elems = {}
 
-  componentDidUpdate() {
+  componentDidMount() {
+    this.restoreLastLanguage()
+  }
+
+  componentDidUpdate(prevProps) {
     let idx = this.props.languages.findIndex(l => l == this.props.contentLang)
     if (idx != -1 && !_.isEmpty(this.elems)) {
       this.elems[idx].focus()
     }
+
+    if (prevProps.languages !== this.props.languages) {
+      this.restoreLastLanguage()
+    }
+  }
+
+  restoreLastLanguage() {
+    const lastLang = localStorage.getItem(STORAGE_KEY)
+    if (!this.props.languages || !this.props.languages.length || !lastLang) {
+      return
+    }
+
+    if (this.props.languages.includes(lastLang)) {
+      this.props.changeContentLanguage(lastLang)
+    }
   }
 
   componentWillUnmount() {
@@ -39,9 +59,11 @@ class LangSwitcher extends React.Component {
     }
   }
 
-  switchLang = l => {
-    this.props.changeContentLanguage(l)
+  switchLang = lang => {
+    this.props.changeContentLanguage(lang)
     this.props.toggleLangSwitcher()
+
+    localStorage.setItem(STORAGE_KEY, lang)
   }
 
   //react-bootstrap warning otherwise

diff --git a/src/bp/ui-studio/src/web/components/Layout/index.tsx b/src/bp/ui-studio/src/web/components/Layout/index.tsx
@@ -85,7 +85,7 @@ class Layout extends React.Component<ILayoutProps> {
   }
 
   toggleLangSwitcher = e => {
-    e.preventDefault()
+    e && e.preventDefault()
     if (!isInputFocused()) {
       const langSwitcherOpen = !this.state.langSwitcherOpen
       this.setState({ langSwitcherOpen }, () => {