update eslint, use babel-eslint, eslint-plugin-react, fixes

.eslintrc

@@ -1,8 +1,19 @@
 {
+  "parser": "babel-eslint",
+
+  "ecmaFeatures": {
+    "jsx": true
+  },
+
   "env": {
+    "es6": true,
     "jasmine": true,
   },
 
+  "plugins": [
+    "react"
+  ],
+
   // Map from global var to bool specifying if it can be redefined
   "globals": {
     "__DEV__": true,
@@ -32,14 +43,17 @@
     "setTimeout": false,
     "window": false,
     "XMLHttpRequest": false,
-    "pit": false
+    "pit": false,
+
+    // flow gloabls
+    "ReactElement": true
   },
 
   "rules": {
+    "comma-dangle": 0,               // disallow trailing commas in object literals
     "no-cond-assign": 1,             // disallow assignment in conditional expressions
     "no-console": 0,                 // disallow use of console (off by default in the node environment)
     "no-constant-condition": 0,      // disallow use of constant expressions in conditions
-    "no-comma-dangle": 0,            // disallow trailing commas in object literals
     "no-control-regex": 1,           // disallow control characters in regular expressions
     "no-debugger": 1,                // disallow use of debugger
     "no-dupe-keys": 1,               // disallow duplicate keys when creating object literals
@@ -168,7 +182,7 @@
     "no-underscore-dangle": 0,       // disallow dangling underscores in identifiers
     "no-wrap-func": 1,               // disallow wrapping of non-IIFE statements in parens
     "no-mixed-spaces-and-tabs": 1,   // disallow mixed spaces and tabs for indentation
-    "quotes": [1, "single", "avoid-escape"], // specify whether double or single quotes should be used
+    "quotes": [1, "single"],         // specify whether double or single quotes should be used
     "quote-props": 0,                // require quotes around object literal property names (off by default)
     "semi": 1,                       // require or disallow use of semicolons instead of ASI
     "sort-vars": 0,                  // sort variables within the same declaration block (off by default)
@@ -177,7 +191,7 @@
     "space-in-parens": 0,            // require or disallow spaces inside parentheses (off by default)
     "space-infix-ops": 1,            // require spaces around operators
     "space-return-throw-case": 1,    // require a space after return, throw, and case
-    "space-unary-word-ops": 1,       // require a space around word operators such as typeof (off by default)
+    "space-unary-ops": [1, { "words": true, "nonwords": false }], // require or disallow spaces before/after unary operators (words on by default, nonwords off by default)
     "max-nested-callbacks": 0,       // specify the maximum depth callbacks can be nested (off by default)
     "one-var": 0,                    // allow just one var statement per function (off by default)
     "wrap-regex": 0,                 // require regex literals to be wrapped in parentheses (off by default)
@@ -190,6 +204,22 @@
     "max-params": 0,                 // limits the number of parameters that can be used in the function declaration. (off by default)
     "max-statements": 0,             // specify the maximum number of statement allowed in a function (off by default)
     "no-bitwise": 1,                 // disallow use of bitwise operators (off by default)
-    "no-plusplus": 0                 // disallow use of unary operators, ++ and -- (off by default)
+    "no-plusplus": 0,                // disallow use of unary operators, ++ and -- (off by default)
+
+    "react/display-name": 0,
+    "react/jsx-boolean-value": 0,
+    "react/jsx-quotes": [1, "double", "avoid-escape"],
+    "react/jsx-no-undef": 1,
+    "react/jsx-sort-props": 0,
+    "react/jsx-uses-react": 0,
+    "react/jsx-uses-vars": 1,
+    "react/no-did-mount-set-state": [1, "allow-in-func"],
+    "react/no-did-update-set-state": [1, "allow-in-func"],
+    "react/no-multi-comp": 0,
+    "react/no-unknown-property": 0,
+    "react/prop-types": 0,
+    "react/react-in-jsx-scope": 0,
+    "react/self-closing-comp": 1,
+    "react/wrap-multilines": 0
   }
 }

Examples/Movies/SearchScreen.js

@@ -117,7 +117,7 @@ var SearchScreen = React.createClass({
 
     fetch(this._urlForQueryAndPage(query, 1))
       .then((response) => response.json())
-      .catch((error) => {
+      .catch(() => {
         LOADING[query] = false;
         resultsCache.dataForQuery[query] = undefined;
 

Examples/UIExplorer/ActionSheetIOSExample.js

@@ -98,7 +98,7 @@ var ShareActionSheetExample = React.createClass({
       } else {
         text = 'You didn\'t share';
       }
-      this.setState({text})
+      this.setState({text});
     });
   }
 });

Examples/UIExplorer/AdSupportIOSExample.js

@@ -63,7 +63,7 @@ var AdSupportIOSExample = React.createClass({
     });
   },
 
-  _onHasTrackingFailure: function(e) {
+  _onHasTrackingFailure: function() {
     this.setState({
       'hasAdvertiserTracking': 'Error!',
     });
@@ -75,7 +75,7 @@ var AdSupportIOSExample = React.createClass({
     });
   },
 
-  _onDeviceIDFailure: function(e) {
+  _onDeviceIDFailure: function() {
     this.setState({
       'deviceID': 'Error!',
     });

Examples/UIExplorer/AlertIOSExample.js

@@ -100,7 +100,7 @@ exports.examples = [{
 {
   title: 'Prompt',
   render(): React.Component {
-    return <PromptExample />
+    return <PromptExample />;
   }
 }];
 

Examples/UIExplorer/AsyncStorageExample.js

@@ -91,7 +91,7 @@ var BasicStorageExample = React.createClass({
   _removeStorage() {
     AsyncStorage.removeItem(STORAGE_KEY)
       .then(() => this._appendMessage('Selection removed from disk.'))
-      .catch((error) => { this._appendMessage('AsyncStorage error: ' + error.message) })
+      .catch((error) => { this._appendMessage('AsyncStorage error: ' + error.message); })
       .done();
   },
 

Examples/UIExplorer/CameraRollView.ios.js

@@ -177,7 +177,7 @@ var CameraRollView = React.createClass({
   },
 
   // rowData is an array of images
-  _renderRow: function(rowData: Array<Image>, sectionID: string, rowID: string)  {
+  _renderRow: function(rowData: Array<Image>)  {
     var images = rowData.map((image) => {
       if (image === null) {
         return null;

Examples/UIExplorer/ExampleTypes.js

@@ -14,6 +14,7 @@
  * @providesModule ExampleTypes
  * @flow
  */
+'use strict';
 
 export type Example = {
   title: string,

Examples/UIExplorer/ListViewPagingExample.js

@@ -108,11 +108,11 @@ var ListViewPagingExample = React.createClass({
     };
   },
 
-  renderRow: function(rowData: string, sectionID: string, rowID: string): ReactElement {
+  renderRow: function(rowData: string): ReactElement {
     return (<Thumb text={rowData}/>);
   },
 
-  renderSectionHeader: function(sectionData: string, sectionID: string) {
+  renderSectionHeader: function(sectionData: string) {
     return (
       <View style={styles.section}>
         <Text style={styles.text}>

Examples/UIExplorer/Navigator/BreadcrumbNavSample.js

@@ -48,7 +48,7 @@ var BreadcrumbNavSample = React.createClass({
 
   componentWillMount: function() {
     this._navBarRouteMapper = {
-      rightContentForRoute: function(route, navigator) {
+      rightContentForRoute: function() {
         return null;
       },
       titleContentForRoute: function(route, navigator) {
@@ -84,19 +84,19 @@ var BreadcrumbNavSample = React.createClass({
     return (
       <ScrollView style={styles.scene}>
         <NavButton
-          onPress={() => { navigator.push(_getRandomRoute()) }}
+          onPress={() => { navigator.push(_getRandomRoute()); }}
           text="Push"
         />
         <NavButton
-          onPress={() => { navigator.immediatelyResetRouteStack([_getRandomRoute(), _getRandomRoute()]) }}
+          onPress={() => { navigator.immediatelyResetRouteStack([_getRandomRoute(), _getRandomRoute()]); }}
           text="Reset w/ 2 scenes"
         />
         <NavButton
-          onPress={() => { navigator.popToTop() }}
+          onPress={() => { navigator.popToTop(); }}
           text="Pop to top"
         />
         <NavButton
-          onPress={() => { navigator.replace(_getRandomRoute()) }}
+          onPress={() => { navigator.replace(_getRandomRoute()); }}
           text="Replace"
         />
         <NavButton

Examples/UIExplorer/Navigator/NavigationBarSample.js

@@ -61,7 +61,7 @@ var NavigationBarRouteMapper = {
     );
   },
 
-  RightButton: function(route, navigator, index, navState) {
+  RightButton: function(route, navigator) {
     return (
       <TouchableOpacity
         onPress={() => navigator.push(newRandomRoute())}>
@@ -74,7 +74,7 @@ var NavigationBarRouteMapper = {
     );
   },
 
-  Title: function(route, navigator, index, navState) {
+  Title: function(route, navigator, index) {
     return (
       <Text style={[styles.navBarText, styles.navBarTitleText]}>
         {route.title} [{index}]

Examples/UIExplorer/Navigator/NavigatorExample.js

@@ -133,7 +133,7 @@ var TabBarExample = React.createClass({
     return (
       <Navigator
         style={styles.container}
-        initialRoute={{ message: "First Scene", }}
+        initialRoute={{ message: 'First Scene', }}
         renderScene={this.renderScene}
         configureScene={(route) => {
           if (route.sceneConfig) {

Examples/UIExplorer/PanResponderExample.js

@@ -92,17 +92,17 @@ var NavigatorIOSExample = React.createClass({
     this.circle && this.circle.setNativeProps(this._circleStyles);
   },
 
-  _handleStartShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
+  _handleStartShouldSetPanResponder: function(): boolean {
     // Should we become active when the user presses down on the circle?
     return true;
   },
 
-  _handleMoveShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
+  _handleMoveShouldSetPanResponder: function(): boolean {
     // Should we become active when the user moves a touch over the circle?
     return true;
   },
 
-  _handlePanResponderGrant: function(e: Object, gestureState: Object) {
+  _handlePanResponderGrant: function() {
     this._highlight();
   },
   _handlePanResponderMove: function(e: Object, gestureState: Object) {

Examples/UIExplorer/ResponderExample.js

@@ -92,17 +92,17 @@ var NavigatorIOSExample = React.createClass({
     this.circle && this.circle.setNativeProps(this._circleStyles);
   },
 
-  _handleStartShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
+  _handleStartShouldSetPanResponder: function(): boolean {
     // Should we become active when the user presses down on the circle?
     return true;
   },
 
-  _handleMoveShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
+  _handleMoveShouldSetPanResponder: function(): boolean {
     // Should we become active when the user moves a touch over the circle?
     return true;
   },
 
-  _handlePanResponderGrant: function(e: Object, gestureState: Object) {
+  _handlePanResponderGrant: function() {
     this._highlight();
   },
   _handlePanResponderMove: function(e: Object, gestureState: Object) {

Examples/UIExplorer/ScrollViewExample.js

@@ -56,7 +56,7 @@ exports.examples = [
 }];
 
 var Thumb = React.createClass({
-  shouldComponentUpdate: function(nextProps, nextState) {
+  shouldComponentUpdate: function() {
     return false;
   },
   render: function() {

Examples/UIExplorer/SwitchIOSExample.js

@@ -107,7 +107,7 @@ var EventSwitchExample = React.createClass({
             onValueChange={(value) => this.setState({eventSwitchIsOn: value})}
             style={{marginBottom: 10}}
             value={this.state.eventSwitchIsOn} />
-            <Text>{this.state.eventSwitchIsOn ? "On" : "Off"}</Text>
+            <Text>{this.state.eventSwitchIsOn ? 'On' : 'Off'}</Text>
         </View>
         <View>
           <SwitchIOS
@@ -118,7 +118,7 @@ var EventSwitchExample = React.createClass({
             onValueChange={(value) => this.setState({eventSwitchRegressionIsOn: value})}
             style={{marginBottom: 10}}
             value={this.state.eventSwitchRegressionIsOn} />
-          <Text>{this.state.eventSwitchRegressionIsOn ? "On" : "Off"}</Text>
+          <Text>{this.state.eventSwitchRegressionIsOn ? 'On' : 'Off'}</Text>
         </View>
       </View>
     );

Examples/UIExplorer/TextInputExample.js

@@ -275,7 +275,7 @@ exports.examples = [
   },
   {
     title: 'Event handling',
-    render: function(): ReactElement { return <TextEventsExample /> },
+    render: function(): ReactElement { return <TextEventsExample />; },
   },
   {
     title: 'Colored input text',

Examples/UIExplorer/UIExplorerApp.js

@@ -56,7 +56,7 @@ var UIExplorerApp = React.createClass({
           }
         }}
         itemWrapperStyle={styles.itemWrapper}
-        tintColor='#008888'
+        tintColor="#008888"
       />
     );
   }

Examples/UIExplorer/WebViewExample.js

@@ -127,7 +127,7 @@ var WebViewExample = React.createClass({
     });
   },
 
-  onSubmitEditing: function(event) {
+  onSubmitEditing: function() {
     this.pressGoButton();
   },
 

Examples/UIExplorer/createExamplePage.js

@@ -49,7 +49,7 @@ var createExamplePage = function(title: ?string, exampleModule: ExampleModule)
       (React: Object).renderComponent =
       (ReactNative: Object).render =
       (ReactNative: Object).renderComponent =
-        function(element, container) {
+        function(element) {
           renderedComponent = element;
         };
       var result = example.render(null);

lint/linterTransform.js

@@ -27,7 +27,7 @@ var ignoredStylisticRules = {
   'no-lonely-if': true,
   'no-new-object': true,
   'no-spaced-func': true,
-  'no-space-before-semi': true,
+  'semi-spacing': true,
   'no-ternary': true,
   'no-trailing-spaces': true,
   'no-underscore-dangle': true,
@@ -42,7 +42,7 @@ var ignoredStylisticRules = {
   'space-in-parens': true,
   'space-infix-ops': true,
   'space-return-throw-case': true,
-  'space-unary-word-ops': true,
+  'space-unary-ops': true,
   'max-nested-callbacks': true,
   'one-var': true,
   'wrap-regex': true,

package.json

@@ -68,7 +68,9 @@
     "yargs": "1.3.2"
   },
   "devDependencies": {
-    "jest-cli": "0.4.5",
-    "eslint": "0.9.2"
+    "babel-eslint": "hzoo/babel-eslint#i-108",
+    "eslint": "0.21.2",
+    "eslint-plugin-react": "^2.3.0",
+    "jest-cli": "0.4.5"
   }
 }