(improvements) Language selection menu

src/ui/LangMenu/LangMenu.js

@@ -1,30 +1,33 @@
-import React from 'react'
+import React, { useCallback } from 'react'
+import { useDispatch, useSelector } from 'react-redux'
 import _map from 'lodash/map'
 import _keys from 'lodash/keys'
 
 import Select from 'ui/Select'
+import { setLang } from 'state/base/actions'
 import { LANGUAGE_NAMES } from 'locales/i18n'
-
-import { propTypes, defaultProps } from './LangMenu.props'
+import { getLocale } from 'state/base/selectors'
 
 const items = _map(_keys(LANGUAGE_NAMES), (lang) => ({ value: lang, label: LANGUAGE_NAMES[lang] }))
 
-const LangMenu = (props) => {
-  const { setLang, value } = props
+const LangMenu = () => {
+  const dispatch = useDispatch()
+  const currentValue = useSelector(getLocale)
+
+  const handleChange = useCallback((value) => {
+    dispatch(setLang(value))
+  }, [dispatch])
 
   return (
     <Select
-      className='bitfinex-select--language'
-      popoverClassName='bitfinex-select-menu--language'
-      value={value}
       items={items}
-      onChange={setLang}
       type={'Language'}
+      value={currentValue}
+      onChange={handleChange}
+      className='bitfinex-select--language'
+      popoverClassName='bitfinex-select-menu--language'
     />
   )
 }
 
-LangMenu.propTypes = propTypes
-LangMenu.defaultProps = defaultProps
-
 export default LangMenu

src/ui/LangMenu/index.js

@@ -1,3 +1 @@
-import LangMenu from './LangMenu.container'
-
-export default LangMenu
+export { default } from './LangMenu'