feat(admin-ui): remember languange and theme config after user logout

GluuFederation · Aug 22, 2022 · 3580382 · 3580382
1 parent cee28ef
commit 3580382
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/admin-ui/app/redux/reducers/LogoutReducer.js b/admin-ui/app/redux/reducers/LogoutReducer.js
@@ -7,7 +7,11 @@ const INIT_STATE = {}
 
 export default function logoutReducer(state = INIT_STATE, action) {
   if (action.type === USER_LOGGED_OUT) {
+    const initTheme = localStorage.getItem('initTheme')
+    const initLang = localStorage.getItem('initLang')
     localStorage.clear()
+    localStorage.setItem('initTheme', initTheme)
+    localStorage.setItem('initLang', initLang)
   }
   return state
 }

diff --git a/admin-ui/app/routes/Apps/Gluu/LanguageMenu.js b/admin-ui/app/routes/Apps/Gluu/LanguageMenu.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   DropdownToggle,
@@ -9,13 +9,23 @@ import {
 
 const LanguageMenu = () => {
   const [isOpen, setOpen] = useState(false)
+  const initLang = localStorage.getItem('initLang')
   const [lang, setLang] = useState('en')
   const { t, i18n } = useTranslation()
   const toggle = () => setOpen(!isOpen)
+
   function changeLanguage(code) {
     i18n.changeLanguage(code)
     setLang(code)
+    localStorage.setItem('initLang', code)
   }
+
+  useEffect(() => {
+    i18n.changeLanguage(initLang)
+    const currentLang = initLang ? initLang : 'en'
+    setLang(currentLang)
+  }, [initLang])
+
   return (
     <ButtonDropdown isOpen={isOpen} toggle={toggle}>
       <DropdownToggle caret color="transparent" data-testid="ACTIVE_LANG">