new babel and updated localeswitch

Author: seeden

gulpfile.js

@@ -1,40 +1,44 @@
 import gulp from 'gulp';
-import mocha from 'gulp-mocha';
 import babel from 'gulp-babel';
-import istanbul from 'gulp-istanbul';
-import coveralls from 'gulp-coveralls';
+import jsxCoverage from 'gulp-jsx-coverage';
 import path from 'path';
-import { Instrumenter } from 'isparta';
 
-const babelConfig = {
-  stage: 0,
-};
+gulp.task('test', jsxCoverage.createTask({
+  src: ['./tests/**/*{.js,.jsx}'],  // will pass to gulp.src as mocha tests
+  istanbul: {                                      // will pass to istanbul or isparta
+    preserveComments: true,                      // required for istanbul 0.4.0+
+    coverageVariable: '__MY_TEST_COVERAGE__',
+    exclude: /node_modules|test[0-9]/            // do not instrument these files
+  },
 
-gulp.task('pre-test', () => {
-  return gulp.src(['dist/**/*{.js,.jsx}'])
-    .pipe(istanbul({
-      dir: './coverage',
-      instrumenter: Instrumenter,
-      includeUntested: true,
-    }))
-    .pipe(istanbul.hookRequire());
-});
+  threshold: 80,                                   // fail the task when coverage lower than this
+                                                   // default is no threshold
+  thresholdType: 'lines',                      // one of 'lines', 'statements', 'functions', 'banches'
+                                                   // default is 'lines'
+  transpile: {                                     // this is default whitelist/blacklist for transpilers
+    babel: {
+      include: /\.jsx?$/,
+      exclude: /node_modules/,
+      omitExt: false                           // if you wanna omit file ext when require(), put an array
+    },                                           // of file exts here. Ex: ['.jsx', '.es6'] (NOT RECOMMENDED)                                         // of file exts here. Ex: ['.cjsx'] (NOT RECOMMENDED)
+  },
+  coverage: {
+    reporters: ['text-summary', 'json', 'lcov'], // list of istanbul reporters
+    directory: 'coverage'                        // will pass to istanbul reporters
+  },
+  mocha: {                                         // will pass to mocha
+    reporter: 'spec'
+  },
+}));
 
-gulp.task('test', ['pre-test'], () => {
-  return gulp.src('./tests/**/*.js')
-    .pipe(babel(babelConfig))
-    .pipe(mocha({
-      timeout: 20000,
-      reporter: 'spec',
-    }))
-    .pipe(istanbul.writeReports())
-    .pipe(istanbul.enforceThresholds({
-      thresholds: {
-        global: 50,
-      },
-    }));
+gulp.task('build', () => {
+  return gulp.src('./src/**/*.{js,jsx}')
+    .pipe(babel())
+    .pipe(gulp.dest('./dist'));
 });
 
+/*
+
 gulp.task('coveralls', ['test'], () => {
   if (!process.env.CI) {
     return void 0;
@@ -43,13 +47,12 @@ gulp.task('coveralls', ['test'], () => {
   return gulp.src(path.join(__dirname, 'coverage/lcov.info'))
     .pipe(coveralls());
 });
-
-gulp.task('build', () => {
-  return gulp.src('./src/**/*.{js,jsx}')
-    .pipe(babel(babelConfig))
-    .pipe(gulp.dest('./dist'));
-});
+*/
 
 gulp.doneCallback = (err) => {
   process.exit(err ? 1 : 0);
 };
+
+
+
+

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-translate-maker",
-  "version": "0.0.32",
+  "version": "0.1.0",
   "description": "Universal internationalization (i18n) open source library for React",
   "main": "dist/index.js",
   "keywords": [
@@ -32,7 +32,6 @@
     "prepublish": "npm run build",
     "test": "babel-node ./node_modules/gulp/bin/gulp.js test",
     "build": "babel-node ./node_modules/gulp/bin/gulp.js build",
-    "coveralls": "babel-node ./node_modules/gulp/bin/gulp.js coveralls",
     "eslint": "node ./node_modules/eslint/bin/eslint.js --ext .js,.jsx ."
   },
   "repository": {
@@ -49,23 +48,29 @@
     "translate-maker": "^0.2.42"
   },
   "devDependencies": {
-    "babel": "^5.8.34",
+    "babel-cli": "^6.4.0",
+    "babel-core": "^6.4.0",
     "babel-eslint": "^4.1.5",
-    "eslint": "^1.10.1",
+    "babel-plugin-transform-decorators": "^6.4.0",
+    "babel-plugin-transform-class-properties": "^6.4.0",
+    "babel-preset-es2015": "^6.3.13",
+    "babel-preset-react": "^6.3.13",
+    "babel-preset-stage-0": "^6.3.13",
+    "babel-preset-stage-1": "^6.3.13",
+    "eslint": "^1.10.3",
     "eslint-config-airbnb": "^0.1.1",
-    "eslint-loader": "^1.1.1",
-    "eslint-plugin-react": "^3.10.0",
+    "eslint-loader": "^1.2.0",
+    "eslint-plugin-react": "^3.15.0",
     "gulp": "^3.9.0",
-    "gulp-mocha": "^2.2.0",
-    "gulp-babel": "^5.2.1",
+    "gulp-babel": "^6.1.1",
+    "gulp-jsx-coverage": "^0.3.7",
     "gulp-util": "^3.0.7",
-    "should": "^7.1.1",
-    "react": "^0.14.5",
-    "react-dom": "^0.14.5",
-    "gulp-istanbul": "^0.10.2",
-    "gulp-coveralls": "^0.1.4",
-    "coveralls": "^2.11.4",
-    "isparta": "^3.5.3"
+    "react": "^0.14.6",
+    "react-addons-test-utils": "^0.14.6",
+    "react-dom": "^0.14.6",
+    "should": "^8.1.1",
+    "mocha": "^2.3.4",
+    "jsdom": "^3.1.2"
   },
   "peerDependencies": {
     "react": "0.14.x"

src/LocaleProvider.jsx

@@ -16,6 +16,11 @@ export default class LocaleProvider extends Component {
     variables: PropTypes.bool,
     combinations: PropTypes.bool,
     filters: PropTypes.object,
+    controlled: PropTypes.bool,
+  };
+
+  static defaultProps = {
+    controlled: true,
   };
 
   static childContextTypes = {
@@ -26,18 +31,40 @@ export default class LocaleProvider extends Component {
   constructor(props, context) {
     super(props, context);
 
+    const translate = new Translate(props);
+
     this.state = {
-      translate: new Translate(props),
+      translate,
+      locale: translate.getLocale(),
     };
   }
 
+  componentDidMount() {
+    const { translate } = this.state;
+
+    translate.on('locale', this._localeChanged);
+  }
+
+  componentWillUnmount() {
+    const { translate } = this.state;
+
+    translate.removeListener('locale', this._localeChanged);
+  }
+
+  _localeChanged = (locale) => {
+    this.setState({ locale });
+  };
+
   componentWillReceiveProps(newProps) {
-    this.state.translate.setLocale(newProps.locale);
+    if (newProps.locale && newProps.controlled) {
+      this.state.translate.setLocale(newProps.locale);
+      // TODO add other props
+    }
   }
 
   t = (path, attrs, defaultValue) => {
     return this.get(path, attrs, defaultValue);
-  }
+  };
 
   get(path, attrs, defaultValue) {
     const { translate } = this.state;
@@ -54,6 +81,10 @@ export default class LocaleProvider extends Component {
   }
 
   setLocale(locale, callback) {
+    if (this.props.controlled) {
+      return callback(new Error('LocaleProvider is set as controlled component. If you want to use setLocale please set controlled = false'));
+    }
+
     return this.state.translate.setLocale(locale, callback);
   }
 

src/LocaleSwitch.jsx

@@ -6,7 +6,7 @@ export default class LocaleSwitch extends Component {
     ...LocaleProvider.childContextTypes,
   };
 
-  static defaultValue = {
+  static defaultProps = {
     setLocale: true,
   };
 
@@ -17,31 +17,33 @@ export default class LocaleSwitch extends Component {
     name: PropTypes.string,
     className: PropTypes.string,
     onChange: PropTypes.func,
+    onError: PropTypes.func,
   };
 
   handleChange(evn) {
     evn.stopPropagation();
 
-    const nodes = evn.target.options || [];
+    const { locales, onChange, onError, setLocale } = this.props;
+    const translate = this.context.translate;
 
-    for (let index = 0; index < nodes.length; index++) {
-      const node = nodes[index];
-      if (!node.selected) {
-        continue;
-      }
+    const value = evn.target.value;
 
-      const value = node.value;
-      if (!value) {
+    for (let index = 0; index < locales.length; index++) {
+      const { locale, label } = locales[index];
+      if (locale !== value) {
         continue;
       }
 
-      if (this.props.onChange) {
-        this.props.onChange(value);
+      if (setLocale && !translate.props.controlled) {
+        translate.setLocale(locale, (err) => {
+          if (err && onError) {
+            onError(err);
+          }
+        });
       }
 
-      if (this.props.setLocale) {
-        const translate = this.context.translate;
-        translate.setLocale(value);
+      if (onChange) {
+        onChange(locale);
       }
 
       return;