From 7c558a0b24b9ca623b612924cac81efb1cdafc2d Mon Sep 17 00:00:00 2001 From: Vit Stanislav Date: Mon, 25 Sep 2017 13:56:19 +0200 Subject: [PATCH 1/4] Setup browser language detector --- package.json | 1 + src/i18n.js | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 64736203a..39837a019 100644 --- a/package.json +++ b/package.json @@ -33,6 +33,7 @@ "copy-to-clipboard": "=3.0.6", "flexboxgrid": "=6.3.1", "i18next": "^9.0.0", + "i18next-browser-languagedetector": "=2.0.0", "i18next-localstorage-cache": "^1.1.1", "i18next-xhr-backend": "^1.4.2", "lisk-js": "=0.4.5", diff --git a/src/i18n.js b/src/i18n.js index d45f2f59b..2e4c94bd2 100755 --- a/src/i18n.js +++ b/src/i18n.js @@ -1,13 +1,14 @@ import i18n from 'i18next'; import XHR from 'i18next-xhr-backend'; +import LngDetector from 'i18next-browser-languagedetector'; // import Cache from 'i18next-localstorage-cache'; i18n + .use(LngDetector) .use(XHR) // .use(Cache) .init({ fallbackLng: 'en', - lng: 'en', react: { // wait: true, // globally set to wait for loaded translations in translate hoc // exposeNamespace: true // exposes namespace on data-i18next-options to be used in eg. From aee3db90d39403f722df7f971f7baac117a97ae1 Mon Sep 17 00:00:00 2001 From: Vit Stanislav Date: Wed, 27 Sep 2017 14:13:23 +0200 Subject: [PATCH 2/4] Fix forging stats unit tests --- src/components/forging/forgingStats.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/forging/forgingStats.js b/src/components/forging/forgingStats.js index ead417167..92867d455 100644 --- a/src/components/forging/forgingStats.js +++ b/src/components/forging/forgingStats.js @@ -31,7 +31,7 @@ class ForgingStats extends React.Component { statCardObjects[0].label = this.props.t('Last 24 hours'); [1, 2, 3].forEach((i) => { statCardObjects[i].label = this.props.t( - 'Last x days', { count: statCardObjects[i].days }); + 'Last {{count}} days', { count: statCardObjects[i].days }); }); return ( From 109f9148f9dcdbf73ae6eacb57e4faeed4a1add8 Mon Sep 17 00:00:00 2001 From: Vit Stanislav Date: Thu, 28 Sep 2017 15:37:14 +0200 Subject: [PATCH 3/4] Add languageDropdown to login page --- src/components/languageDropdown/index.js | 37 ++++++++++++++++ src/components/languageDropdown/index.test.js | 43 +++++++++++++++++++ src/components/login/login.js | 6 ++- src/components/login/login.test.js | 4 +- src/components/settings/index.js | 36 ++-------------- src/components/settings/index.test.js | 15 +------ 6 files changed, 93 insertions(+), 48 deletions(-) create mode 100644 src/components/languageDropdown/index.js create mode 100644 src/components/languageDropdown/index.test.js 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 0b54a5b18..69ca48125 100644 --- a/src/components/login/login.js +++ b/src/components/login/login.js @@ -7,6 +7,7 @@ import networksRaw from './networks'; import PassphraseInput from '../passphraseInput'; import styles from './login.css'; import env from '../../constants/env'; +import LanguageDropdown from '../languageDropdown'; import RelativeLink from '../relativeLink'; /** @@ -158,9 +159,10 @@ class Login extends React.Component { render() { return (
-
-
+
+
+ { @@ -42,10 +43,11 @@ describe('Login', () => { }, }; const options = { - context: { store, history }, + context: { store, history, i18n }, childContextTypes: { store: PropTypes.object.isRequired, history: PropTypes.object.isRequired, + i18n: PropTypes.object.isRequired, }, lifecycleExperimental: true, }; diff --git a/src/components/settings/index.js b/src/components/settings/index.js index 9ac1e603a..45429e18c 100644 --- a/src/components/settings/index.js +++ b/src/components/settings/index.js @@ -1,38 +1,10 @@ -import { Dropdown } from 'react-toolbox'; -import { translate } from 'react-i18next'; import React from 'react'; +import LanguageDropdown from '../languageDropdown'; -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 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); }); }); From f7cae23d746878058ef696af17fd8f2aabdf17ce Mon Sep 17 00:00:00 2001 From: Vit Stanislav Date: Fri, 29 Sep 2017 17:42:45 +0200 Subject: [PATCH 4/4] Remove i18next-browser-languagedetector ... because language detection will be handled in Electron wrapper --- package.json | 1 - src/i18n.js | 2 -- 2 files changed, 3 deletions(-) diff --git a/package.json b/package.json index b3175788f..73f84cc7b 100644 --- a/package.json +++ b/package.json @@ -35,7 +35,6 @@ "flexboxgrid": "=6.3.1", "history": "^4.7.2", "i18next": "^9.0.0", - "i18next-browser-languagedetector": "=2.0.0", "i18next-localstorage-cache": "^1.1.1", "i18next-xhr-backend": "^1.4.2", "lisk-js": "0.5.0", diff --git a/src/i18n.js b/src/i18n.js index 14e4ef8c3..4e130c7c8 100755 --- a/src/i18n.js +++ b/src/i18n.js @@ -1,5 +1,4 @@ import i18n from 'i18next'; -import LngDetector from 'i18next-browser-languagedetector'; import languages from './constants/languages'; const resources = Object.keys(languages).reduce((accumulator, key) => { @@ -10,7 +9,6 @@ const resources = Object.keys(languages).reduce((accumulator, key) => { }, {}); i18n - .use(LngDetector) .init({ fallbackLng: 'en', resources,