74 | ```
75 | #### Result ( html ):
76 | ```html
77 | Перевод вашего первого ключа из словаря для текущего языка
78 | Пришла 1 кошечка
79 | Пришли 2 кошечки
80 | Пришло 5 кошечек
81 | ```
82 |
83 | ### What am I using:
84 | pluralizer: ( [github](https://github.com/derzunov/pluralizer) or [npm](https://www.npmjs.com/package/pluralizr) ) for plural forms changing
85 |
86 | translator: ( [github](https://github.com/derzunov/translator) or [npm](https://www.npmjs.com/package/translatr) ) for translation ([translator demo](https://derzunov.github.io/translator/))
87 |
88 | ## Install:
89 | Terminal:
90 | ```
91 | npm i redux-react-i18n
92 | ```
93 |
94 | ## What's in the box
95 |
96 | ### Components:
97 | - Loc ( Container Component )
98 | - LocPresentational ( Presentational Component )
99 |
100 | ### Actions
101 | - setCurrentLanguage( languageCode )
102 | - setLanguages( languageCode )
103 | - addDictionary( languageCode, dictionary )
104 | - setDictionaries( dictionaries )
105 |
106 | ### Reducer
107 | - i18n
108 |
109 |
110 | ## Full code demo ( complete solution for Redux ):
111 | ```jsx
112 | import { i18nReducer, i18nActions, Loc } from 'redux-react-i18n'
113 |
114 | ...
115 | // "reducers" contains your reducers
116 | reducers.i18n = i18nReducer
117 | ...
118 |
119 | const store = createStore( combineReducers( reducers ) )
120 |
121 | ...
122 | // Set dictionaries (simpliest example) -----------------------------------------------------------------------------------------------
123 |
124 | // This dictionaries can be supported by Localization team without need to know somth about interface or project,
125 | // and you just can fetch it to your project
126 | const dictionaries = {
127 | 'ru-RU': {
128 | 'key_1': 'Первый дефолтный ключ',
129 | 'key_2': [ '$Count', ' ', ['штучка','штучки','штучек']], // 1 штучка, 3 штучки, пять штучек
130 | 'key_3': {
131 | 'nested_1': 'Первый вложенный ключ',
132 | 'nested_2': 'Второй вложенный ключ',
133 | },
134 | /* ... */
135 | /* Other keys */
136 | },
137 | 'en-US': {
138 | 'key_1': 'First default key',
139 | 'key_2': [ '$Count', ' ', ['thing','things']], // 1 thing, 2 things, 153 things
140 | 'key_3': {
141 | 'nested_1': 'First nested key',
142 | 'nested_2': 'Second nested key',
143 | },
144 | }
145 | /* ... */
146 | /* Other dictionaries */
147 | }
148 | store.dispatch( i18nActions.setDictionaries( dictionaries ) )
149 | // / Set dictionaries (simpliest example) ---------------------------------------------------------------------------------------------
150 |
151 | // Set languages (simpliest example) --------------------------------------------------------------------------------------------------
152 | const languages = [
153 | {
154 | code: 'ru-RU',
155 | name: 'Русский'
156 | },
157 | {
158 | code: 'en-US',
159 | name: 'English (USA)'
160 | }
161 | /* ... */
162 | /* Other languages */
163 | ]
164 |
165 | store.dispatch( i18nActions.setLanguages( languages ) )
166 | // / Set languages (simpliest example) ------------------------------------------------------------------------------------------------
167 |
168 | // Set current language code (you can map this action to select component or somth like this)
169 | store.dispatch( i18nActions.setCurrentLanguage( 'ru-RU' ) )
170 | ```
171 |
172 | #### And now you can use "Loc" container component
173 |
174 | ```jsx
175 | import { Loc } from 'redux-react-i18n'
176 | ...
177 |
178 |
179 |
181 |
182 |
183 | // => 7 штучек
184 |
185 |
186 |
187 |
189 |
190 |
192 | ```
193 |
194 | ## If you don't want to use a complete solution:
195 |
196 | #### Just use a dumb component and you can design store/actions/reducers by yourself like you want
197 |
198 | ```jsx
199 | // Just import presentational component LocPresentational
200 | import { LocPresentational } from 'redux-react-i18n'
201 | ...
202 | ...
203 | ...
204 | // Then map data to props => currentLanguage, dictionary (See more in src/Loc.js):
205 | const mapStateToProps = ( { /*getting data from the state*/ }, ownProps ) => ({
206 | currentLanguage: yourCurrentLanguageFromState,
207 | dictionary: yourDictionaryFromState
208 | });
209 | Loc = connect( mapStateToProps )( LocPresentational )
210 | ...
211 | ...
212 | ...
213 |
214 |
216 |
217 |
218 |
219 |
220 | ```
221 | See more in src/\*.js
222 |
223 |
224 | ## Using with React Native
225 |
226 | [redux-react-native-i18n](https://github.com/derzunov/redux-react-native-i18n)
227 |
228 | ## The "Span Problem"
229 |
230 | If the span tag is a big problem (in "option" tag for example), you can use **translate** from 'translatr' like this
231 |
232 | ```
233 | import translate from 'translatr'
234 | ...
235 | ...
236 | ...
237 |
238 |
239 | { translate( dictionary, currentLanguage, key, number ) }
240 |
241 |
242 | ...
243 | ```
244 |
245 | and just a simple example of **mapStateToProps** as a bonus:
246 |
247 | ```
248 | const mapStateToProps = ( {i18n: { currentLanguage, dictionaries }}, ownProps ) => ({
249 | currentLanguage: currentLanguage,
250 | dictionary: dictionaries[ currentLanguage ]
251 | });
252 | ```
253 |
254 | #### Why?
255 |
256 | With ```
260 | Translated Text
261 |
262 | ```
263 |
264 |
265 | With ```translate``` you'll get:
266 | ```
267 |
268 | Translated Text
269 |
270 | ```
271 | ... but you'll have to write extra code
272 |
273 | PS You already have [translatr](https://github.com/derzunov/translator) as a dependency of redux-react-i18n in your node_modules
274 |
--------------------------------------------------------------------------------
/example/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | "@babel/preset-env",
4 | "@babel/preset-react"
5 | ]
6 | }
7 |
--------------------------------------------------------------------------------
/example/.gitignore:
--------------------------------------------------------------------------------
1 | ################################################
2 | # Local Configuration
3 | ################################################
4 |
5 | config/local.*
6 |
7 | ################################################
8 | # Dependencies
9 | ################################################
10 |
11 | node_modules
12 | bower_components
13 |
14 | ################################################
15 | # Sails.js / Waterline / Grunt
16 | ################################################
17 |
18 | .tmp
19 | dump.rdb
20 |
21 | ################################################
22 | # Node.js / NPM
23 | ################################################
24 |
25 | lib-cov
26 | *.seed
27 | *.log
28 | *.out
29 | *.pid
30 | npm-debug.log
31 |
32 | ################################################
33 | # Miscellaneous
34 | ################################################
35 |
36 | *~
37 | *#
38 | .DS_STORE
39 | .netbeans
40 | nbproject
41 | .idea
42 | .node_history
43 | .npmrc
44 |
--------------------------------------------------------------------------------
/example/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2016 Dmitriy Erzunov
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/example/README.md:
--------------------------------------------------------------------------------
1 | # redux-react-i18n example
2 | An i18n solution with plural forms support for Redux/React
3 |
4 | React/Redux/Babel/Gulp/Webpack2 Example App
5 |
--------------------------------------------------------------------------------
/example/config/default.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | buildPath: "/public/build/",
3 | publicPath: "/build/",
4 | wdsContentBasePath: "/public/",
5 | webpackDevServerPort: 1703
6 | };
7 |
--------------------------------------------------------------------------------
/example/gulpfile.js:
--------------------------------------------------------------------------------
1 | var combiner = require( 'stream-combiner2' ),
2 | config = require( 'config' ),
3 | load = require( 'gulp-load-plugins' )(),
4 | gulp = require( 'gulp' ),
5 | open = require( 'open' ),
6 | del = require( 'del' ),
7 | path = require( 'path' ),
8 | webpack = require( 'webpack' ),
9 | webpackStream = require( 'webpack-stream' ),
10 | WebpackDevServer = require( 'webpack-dev-server' ),
11 | devConfig = Object.create( require( './webpack.config.js' ).getConfig( 'development' ) ),
12 | prodConfig = Object.create( require( './webpack.config.js' ).getConfig() ),
13 | relPath = ( myPath ) => { return path.join( __dirname, myPath ) };
14 |
15 | gulp.task( 'browser', function() {
16 | return open( 'http://localhost:' + config.webpackDevServerPort);
17 | });
18 |
19 | gulp.task( 'webpack-dev-server', function() {
20 |
21 | new WebpackDevServer( webpack( devConfig ), {
22 | contentBase: relPath( config.wdsContentBasePath ),
23 | publicPath: config.publicPath,
24 | stats: {
25 | colors: true,
26 | assets: false,
27 | chunkModules: false,
28 | hash: false,
29 | timings: false,
30 | version: false
31 | },
32 | watchOptions: {
33 | aggregateTimeout: 100
34 | }
35 |
36 | }).listen( config.webpackDevServerPort, 'localhost' );
37 | });
38 |
39 | gulp.task( 'prod:clean', function() {
40 | del([
41 | relPath( config.buildPath, '**/*' )
42 | ]);
43 | }
44 | );
45 |
46 | gulp.task( 'prod:webpack', function() {
47 | var combined = combiner.obj([
48 | gulp.src( './src/app.js' ),
49 | webpackStream( prodConfig, webpack ),
50 | gulp.dest( relPath ( config.buildPath ) )
51 | ]);
52 |
53 | combined.on( 'error', console.error.bind( console ) );
54 |
55 | return combined;
56 | });
57 |
58 | gulp.task( 'default', load.sequence( 'webpack-dev-server', 'browser' ) );
59 | gulp.task( 'prod', load.sequence( 'prod:clean', 'prod:webpack' ) );
60 |
--------------------------------------------------------------------------------
/example/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "redux-react-i18n-example",
3 | "version": "0.0.1",
4 | "description": "exemple for redux-react-i18n",
5 | "scripts": {},
6 | "author": "derzunov ",
7 | "license": "MIT",
8 | "dependencies": {
9 | "@babel/core": "^7.0.0",
10 | "@babel/preset-env": "^7.0.0",
11 | "@babel/preset-react": "^7.0.0",
12 | "babel-loader": "^8.0.0",
13 | "body-parser": "^1.18.2",
14 | "config": "^1.30.0",
15 | "del": "^3.0.0",
16 | "express": "^4.17.3",
17 | "gulp": "^3.9.1",
18 | "gulp-load-plugins": "^1.5.0",
19 | "gulp-sequence": "^1.0.0",
20 | "open": "0.0.5",
21 | "path": "^0.12.7",
22 | "react": "^16.3.1",
23 | "react-dom": "^16.3.1",
24 | "react-redux": "^5.0.7",
25 | "redux": "^3.7.2",
26 | "redux-form": "^7.3.0",
27 | "redux-react-i18n": "2.0.1",
28 | "redux-thunk": "^2.2.0",
29 | "run-sequence": "^2.2.1",
30 | "stream-combiner2": "^1.1.1",
31 | "webpack": "^2.2.1",
32 | "webpack-dev-server": "^2.4.1",
33 | "webpack-stream": "^3.2.0"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/example/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/derzunov/redux-react-i18n/c91d8cfdad2736fdaebdb27c44c0e48d6ccbaa68/example/public/favicon.ico
--------------------------------------------------------------------------------
/example/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Redux/React i18n
6 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/example/src/app.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 | import { createStore, combineReducers } from 'redux';
4 | import { Provider } from 'react-redux';
5 | import { i18nReducer, i18nActions } from 'redux-react-i18n';
6 |
7 | let reducers = {};
8 | import { reducer as formReducer } from 'redux-form'
9 | reducers.form = formReducer;
10 | reducers.i18n = i18nReducer;
11 |
12 | import App from './components/App';
13 |
14 | const store = createStore( combineReducers( reducers ) );
15 |
16 | store.dispatch( i18nActions.setLanguages(
17 | [
18 | {
19 | code: 'ru-RU',
20 | name: 'Русский'
21 | },
22 | {
23 | code: 'en-US',
24 | name: 'English (USA)'
25 | },
26 | {
27 | code: 'pl',
28 | name: 'Polish'
29 | },
30 | {
31 | code: 'fr',
32 | name: 'French'
33 | },
34 | {
35 | code: 'be',
36 | name: 'Белорусский'
37 | }
38 | ]
39 | ) );
40 |
41 | store.dispatch( i18nActions.setDictionaries(
42 | {
43 | 'ru-RU':
44 | {
45 | 'key_1': 'Первый дефолтный ключ из установленного нами словаря',
46 | 'key_2': [ [ "Остался", "Осталось", "Осталось" ], " ", "$count", " ", [ "час", "часа", "часов" ] ],
47 | 'key_3': 'Просто число после двоеточия: $Count',
48 | 'key_4': {
49 | nested_1: 'Москва',
50 | nested_2: 'Санкт-Петербург'
51 | }
52 | },
53 | 'en-US':
54 | {
55 | 'key_1': 'First default key from our dictionary',
56 | 'key_2': ["$count", " ", [ "hour", "hours"] ],
57 | 'key_3': 'Number: $Count',
58 | 'key_4': {
59 | nested_1: 'Moscow',
60 | nested_2: 'St. Petersburg'
61 | }
62 | },
63 | 'pl':
64 | {
65 | 'key_1': 'Prosze, dwa bilety drugiej klasy do Warszawy.',
66 | 'key_2': [[ "Pozostała", "Pozostały", "Pozostało" ], " ", "$count", " ", [ "godzina", "godziny", "godzin" ] ],
67 | 'key_3': 'Numer: $Count',
68 | 'key_4': {
69 | nested_1: 'Moskwa',
70 | nested_2: 'Petersburg'
71 | }
72 | },
73 | 'fr':
74 | {
75 | 'key_1': 'Ayant risqué une fois-on peut rester heureux toute la vie',
76 | 'key_2': ["$count", " ", [ "heure", "heures"], " ", [ "restante", "restantes"] ],
77 | 'key_3': 'Nombre: $Count',
78 | 'key_4': {
79 | nested_1: 'Moscou',
80 | nested_2: 'St. Pétersbourg'
81 | }
82 | },
83 | 'be':
84 | {
85 | 'key_1': 'Адзін квіток да Мінска, калі ласка',
86 | 'key_2': [ [ "Засталася", "Засталося", "Засталося" ], " ", "$count", " ", [ "гадзіна", "гадзіны", "гадзін" ] ],
87 | 'key_3': 'Засталося: $Count',
88 | 'key_4': {
89 | nested_1: 'Масква',
90 | nested_2: 'Санкт-Пецярбург'
91 | }
92 | }
93 | }
94 | ) );
95 |
96 | store.dispatch( i18nActions.setCurrentLanguage( 'ru-RU' ) );
97 |
98 | function render () {
99 | ReactDOM.render(
100 |
101 |
103 | ,
104 | document.getElementById('root'));
105 | }
106 |
107 | render();
108 |
--------------------------------------------------------------------------------
/example/src/components/App.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { connect } from 'react-redux'
3 | import Form from './Form'
4 | import Texts from './Texts'
5 | import LanguageSwitcher from './LanguageSwitcher'
6 |
7 | const mapStateToProps = ( state, ownProps ) => {
8 | return {}
9 | };
10 |
11 | let initialValues = {
12 | initialValues: {
13 | count: 3
14 | }
15 | }
16 |
17 | const App = ( { children } ) => {
18 | return
19 |
20 |
21 |
i18n for your React/Redux project!
22 |
23 |
30 |
31 |
32 |
5 |
6 | onChange(value + 1)}>+1
7 | onChange(value - 1)}>-1
8 |
9 |
16 | switchLanguage( 'en-US' ) }>English
17 | switchLanguage( 'ru-RU' ) }>Русский
18 | switchLanguage( 'pl' ) }>Polish
19 | switchLanguage( 'fr' ) }>French
20 | switchLanguage( 'be' ) }>Белорусский
21 |
)
22 | }
23 |
24 | export default connect( mapStateToProps, mapDispatchToProps )( LanguageSwitcher )
25 |
--------------------------------------------------------------------------------
/example/src/components/Texts.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { connect } from 'react-redux'
3 | import { Loc } from 'redux-react-i18n'
4 |
5 | const mapStateToProps = ( { form: { countForm: { values: { count } } } } ) => ( {
6 | count
7 | } )
8 |
9 | const Texts = ( { count } ) => {
10 | return
11 |
12 |
14 |
15 |
17 |
18 |
20 |
21 |
22 |
24 |
25 |
27 |
Redux/React i18n
6 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "redux-react-i18n",
3 | "version": "2.0.1",
4 | "description": "i18n solution for react/redux",
5 | "main": "lib/index.js",
6 | "scripts": {
7 | "test": "jest",
8 | "compile": "babel src -d lib",
9 | "prepublish": "npm run compile",
10 | "build": "npm run compile"
11 | },
12 | "devDependencies": {
13 | "@babel/cli": "^7.0.0",
14 | "@babel/core": "^7.0.0",
15 | "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
16 | "@babel/plugin-transform-runtime": "^7.0.0",
17 | "@babel/polyfill": "^7.2.5",
18 | "@babel/preset-env": "^7.0.0",
19 | "@babel/preset-react": "^7.0.0",
20 | "@babel/runtime": "^7.3.1",
21 | "babel-core": "^7.0.0-bridge.0",
22 | "babel-jest": "^23.4.2",
23 | "enzyme": "^3.3.0",
24 | "enzyme-adapter-react-16": "^1.1.1",
25 | "jest": "^22.4.3",
26 | "react": ">=16.0.0",
27 | "react-dom": ">=16.0.0"
28 | },
29 | "repository": {
30 | "type": "git",
31 | "url": "git+https://github.com/derzunov/redux-react-i18n.git"
32 | },
33 | "keywords": [
34 | "redux",
35 | "i18n",
36 | "localization",
37 | "internationalization",
38 | "react",
39 | "l10n"
40 | ],
41 | "author": "derzunov ",
42 | "license": "MIT",
43 | "bugs": {
44 | "url": "https://github.com/derzunov/redux-react-i18n/issues"
45 | },
46 | "homepage": "https://github.com/derzunov/redux-react-i18n#readme",
47 | "peerDependencies": {
48 | "react": ">=16.0.0",
49 | "react-dom": ">=16.0.0",
50 | "react-redux": ">=5.0.0",
51 | "redux": ">=3.0.0"
52 | },
53 | "dependencies": {
54 | "translatr": ">=2.1.0"
55 | },
56 | "jest": {
57 | "rootDir": "./tests",
58 | "setupTestFrameworkScriptFile": "/setupTests.js",
59 | "testURL": "http://localhost/"
60 | }
61 | }
62 |
--------------------------------------------------------------------------------
/src/Loc.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { connect } from 'react-redux'
3 |
4 | // Import presentational component
5 | import Loc from './LocPresentational'
6 |
7 | // The component expects that reducer will be named as i18n
8 | const mapStateToProps = ( { i18n: { currentLanguage, dictionaries } }, ownProps ) => ({
9 | currentLanguage,
10 | dictionary: dictionaries[ currentLanguage ]
11 | })
12 |
13 | export default connect( mapStateToProps )( Loc )
14 |
--------------------------------------------------------------------------------
/src/LocPresentational.js:
--------------------------------------------------------------------------------
1 | import translate from 'translatr'
2 | import React from 'react'
3 |
4 | const Loc = ( { currentLanguage, locKey, number, dictionary, dispatch, ...rest } ) => {
5 | return
6 | { translate( dictionary, currentLanguage, locKey, number ) }
7 |
8 | }
9 |
10 | export default Loc
11 |
--------------------------------------------------------------------------------
/src/action-types.js:
--------------------------------------------------------------------------------
1 | export const SET_CURRENT_LANGUAGE = 'SET_CURRENT_LANGUAGE'
2 | export const SET_LANGUAGES = 'SET_LANGUAGES'
3 | export const SET_DICTIONARIES = 'SET_DICTIONARIES'
4 | export const ADD_DICTIONARY = 'ADD_DICTIONARY'
--------------------------------------------------------------------------------
/src/actions.js:
--------------------------------------------------------------------------------
1 | import {
2 | SET_CURRENT_LANGUAGE,
3 | SET_LANGUAGES,
4 | SET_DICTIONARIES,
5 | ADD_DICTIONARY
6 | } from './action-types'
7 |
8 | export const setCurrentLanguage = ( languageCode ) => ( { type: SET_CURRENT_LANGUAGE, data: languageCode } )
9 | export const setLanguages = ( languageCode ) => ( { type: SET_LANGUAGES, data: languageCode } )
10 | export const addDictionary = ( languageCode, dictionary ) => ( { type: ADD_DICTIONARY, data: { languageCode, dictionary } } )
11 | export const setDictionaries = ( dictionaries ) => ( { type: SET_DICTIONARIES, data: dictionaries } )
12 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import * as i18nActions from './actions'
2 | export { i18nActions }
3 | export { default as i18nReducer } from './reducer'
4 |
5 | // You can use the complete scheme of store/reducers/actions proposed by author
6 | export { default as Loc } from './Loc'
7 |
8 | // Or you can just take a presentational container and map state to props by yourself
9 | export { default as LocPresentational } from './LocPresentational'
--------------------------------------------------------------------------------
/src/initialState.js:
--------------------------------------------------------------------------------
1 | const initialState = {
2 | currentLanguage: 'ru-RU',
3 | languages: [
4 | {
5 | code: 'ru-RU',
6 | name: 'Русский'
7 | },
8 | {
9 | code: 'en-US',
10 | name: 'English (USA)'
11 | }
12 | ],
13 | dictionaries: {
14 | 'ru-RU': {
15 | 'key_1': 'Первый дефолтный ключ',
16 | 'key_2': [ '$Count', ' ', [ 'штучка', 'штучки', 'штучек' ] ], // 1 штучка, 3 штучки, пять штучек
17 | },
18 | 'en-US': {
19 | 'key_1': 'First default key',
20 | 'key_2': [ '$Count', ' ', [ 'thing', 'things' ] ], // 1 thing, 2 things, 153 things
21 | }
22 | }
23 | }
24 |
25 | export default initialState
26 |
--------------------------------------------------------------------------------
/src/reducer.js:
--------------------------------------------------------------------------------
1 | import {
2 | SET_CURRENT_LANGUAGE,
3 | SET_LANGUAGES,
4 | SET_DICTIONARIES,
5 | ADD_DICTIONARY
6 | } from './action-types'
7 |
8 | import initialState from './initialState'
9 |
10 | const i18n = ( state, action ) => {
11 |
12 | switch ( action.type ) {
13 |
14 | case SET_CURRENT_LANGUAGE: {
15 |
16 | let newState = Object.assign( {}, state )
17 | newState.currentLanguage = action.data
18 | return newState
19 | }
20 |
21 | case SET_LANGUAGES: {
22 |
23 | let newState = Object.assign( {}, state )
24 | newState.languages = action.data
25 | return newState
26 | }
27 |
28 | case SET_DICTIONARIES: {
29 |
30 | let newState = Object.assign( {}, state )
31 | newState.dictionaries = action.data
32 | return newState
33 | }
34 |
35 | case ADD_DICTIONARY: {
36 |
37 | if ( action.data && action.data.languageCode && action.data.dictionary ) {
38 |
39 | let newState = Object.assign( {}, state )
40 | newState.dictionaries[ action.data.languageCode ] = action.data.dictionary
41 | return newState
42 |
43 | } else {
44 | return state
45 | }
46 | }
47 |
48 | default:
49 | return state || initialState
50 | }
51 | }
52 |
53 | export default i18n
54 |
--------------------------------------------------------------------------------
/tests/LocPresentational.test.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { shallow } from 'enzyme'
3 | import LocPresentational from '../src/LocPresentational'
4 |
5 | describe('