diff --git a/src/components/languageDropdown/index.js b/src/components/languageDropdown/index.js new file mode 100644 index 000000000..dbbd2350f --- /dev/null +++ b/src/components/languageDropdown/index.js @@ -0,0 +1,37 @@ +import { Dropdown } from 'react-toolbox'; +import { translate } from 'react-i18next'; +import React from 'react'; + +import i18n from '../../i18n'; +import languages from '../../constants/languages'; + +const languagesSource = Object.keys(languages).map(key => ({ + value: key, + label: languages[key].name, + flag: languages[key].flag, +})); + +const handleChange = (value) => { + i18n.changeLanguage(value); +}; + +const customItem = item => ( +
+ {item.label} +
+); + +const LanguageDropdown = ({ t }) => ( + +); + +export default translate()(LanguageDropdown); + diff --git a/src/components/languageDropdown/index.test.js b/src/components/languageDropdown/index.test.js new file mode 100644 index 000000000..394c19960 --- /dev/null +++ b/src/components/languageDropdown/index.test.js @@ -0,0 +1,43 @@ +import PropTypes from 'prop-types'; +import React from 'react'; + +import { expect } from 'chai'; +import { mount } from 'enzyme'; +import sinon from 'sinon'; + +import LanguageDropdown from './index'; +import i18n from '../../i18n'; + +// import * as accountApi from '../../utils/api/account'; + + +describe('LanguageDropdown', () => { + let wrapper; + let props; + + beforeEach(() => { + props = { + }; + wrapper = mount(, { + context: { i18n }, + childContextTypes: { + i18n: PropTypes.object.isRequired, + }, + }); + }); + + it('renders a Dropdown component', () => { + expect(wrapper.find('Dropdown')).to.have.length(1); + }); + + it('calls i18n.changeLanguage on chaning the value in the dropdown', () => { + const i18nSpy = sinon.spy(i18n, 'changeLanguage'); + + wrapper.find('Dropdown').simulate('click'); + wrapper.find('Dropdown ul li').at(0).simulate('click'); + expect(i18nSpy).to.have.been.calledWith('en'); + + i18nSpy.restore(); + }); +}); + diff --git a/src/components/login/login.js b/src/components/login/login.js index 7f5ebcb31..93a148f55 100644 --- a/src/components/login/login.js +++ b/src/components/login/login.js @@ -7,6 +7,7 @@ import getNetworks from './networks'; import PassphraseInput from '../passphraseInput'; import styles from './login.css'; import env from '../../constants/env'; +import LanguageDropdown from '../languageDropdown'; import RelativeLink from '../relativeLink'; /** @@ -163,9 +164,10 @@ class Login extends React.Component { render() { return (
-
-
+
+
+ ({ - value: key, - label: languages[key].name, - flag: languages[key].flag, -})); - -const handleChange = (value) => { - i18n.changeLanguage(value); -}; - -const customItem = item => ( -
- {item.label} -
-); - -const Settings = ({ t }) => ( +const Settings = () => ( - + ); -export default translate()(Settings); +export default Settings; diff --git a/src/components/settings/index.test.js b/src/components/settings/index.test.js index 3949112e3..ea63ba447 100644 --- a/src/components/settings/index.test.js +++ b/src/components/settings/index.test.js @@ -3,7 +3,6 @@ import React from 'react'; import { expect } from 'chai'; import { mount } from 'enzyme'; -import sinon from 'sinon'; import Settings from './index'; import i18n from '../../i18n'; @@ -26,17 +25,7 @@ describe('Settings', () => { }); }); - it('renders a form and a Dropdown components', () => { - expect(wrapper.find('Dropdown')).to.have.length(1); - }); - - it('calls i18n.changeLanguage on chaning the value in the dropdown', () => { - const i18nSpy = sinon.spy(i18n, 'changeLanguage'); - - wrapper.find('Dropdown').simulate('click'); - wrapper.find('Dropdown ul li').at(0).simulate('click'); - expect(i18nSpy).to.have.been.calledWith('en'); - - i18nSpy.restore(); + it('renders a LanguageDropdown component', () => { + expect(wrapper.find('LanguageDropdown')).to.have.length(1); }); }); diff --git a/src/i18n.js b/src/i18n.js index 046f63143..4e130c7c8 100755 --- a/src/i18n.js +++ b/src/i18n.js @@ -1,6 +1,5 @@ import i18n from 'i18next'; import languages from './constants/languages'; -// import Cache from 'i18next-localstorage-cache'; const resources = Object.keys(languages).reduce((accumulator, key) => { accumulator[key] = { @@ -10,10 +9,8 @@ const resources = Object.keys(languages).reduce((accumulator, key) => { }, {}); i18n - // .use(Cache) .init({ fallbackLng: 'en', - lng: 'en', resources, react: { // wait: true, // globally set to wait for loaded translations in translate hoc