Fix linting and dependences

package.json

@@ -1,6 +1,7 @@
 {
   "private": true,
   "devDependencies": {
+    "babel-eslint": "^10.0.0",
     "lerna": "3.4.2"
   },
   "scripts": {

packages/redux-devtools-trace-monitor/.eslintrc

@@ -1,5 +1,5 @@
 {
-  "extends": "eslint-config-airbnb",
+  "extends": "plugin:flowtype/recommended",
   "globals": {
     "chrome": true
   },
@@ -8,6 +8,13 @@
     "browser": true,
     "node": true
   },
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "sourceType": "module",
+    "ecmaFeatures": {
+        "jsx": true
+    }
+  },
   "parser": "babel-eslint",
   "rules": {
     "react/jsx-uses-react": 2,
@@ -15,22 +22,13 @@
     "react/react-in-jsx-scope": 2,
     "react/sort-comp": 0,
     "react/jsx-quotes": 0,
-    "block-scoped-var": 0,
-    "padded-blocks": 0,
-    "quotes": [ 1, "single" ],
-    "comma-style": [ 2, "last" ],
     "eol-last": 0,
     "no-unused-vars": 0,
     "no-console": 0,
-    "func-names": 0,
+    "comma-dangle": 0
-    "prefer-const": 0,
-    "comma-dangle": 0,
-    "id-length": 0,
-    "no-use-before-define": 0,
-    "indent": [2, 2, {"SwitchCase": 1}],
-    "new-cap": [2, { "capIsNewExceptions": ["Test"] }]
   },
   "plugins": [
-    "react"
+    "react",
+    "flowtype"
   ]
 }

packages/redux-devtools-trace-monitor/index.js

@@ -1,57 +0,0 @@
-import React, { Component, PropTypes } from 'react';
-import InspectorMonitor from 'remotedev-inspector-monitor';
-import StackTraceTab from './StackTraceTab';
-import { DATA_TYPE_KEY } from '../../../constants/dataTypes';
-import SubTabs from './SubTabs';
-import TestTab from './TestTab';
-
-const DEFAULT_TABS = [{
-  name: 'Action',
-  component: SubTabs
-}, {
-  name: 'State',
-  component: SubTabs
-}, {
-  name: 'Diff',
-  component: SubTabs
-}];
-
-const NON_INIT_TABS = [
-  { name: 'Trace', component: StackTraceTab }
-];
-
-class InspectorWrapper extends Component {
-  static update = InspectorMonitor.update;
-
-  render() {
-    const { lib, ...rest } = this.props;
-    console.log(rest);
-    let tabs;
-    if (lib === 'redux') {
-      tabs = () => [
-        ...DEFAULT_TABS,
-        ...(!rest.monitorState || rest.monitorState.selectedActionId === null ? NON_INIT_TABS : []),
-        { name: 'Test', component: TestTab }
-      ];
-    } else {
-      tabs = () => DEFAULT_TABS;
-    }
-
-    return (
-      <InspectorMonitor
-        dataTypeKey={DATA_TYPE_KEY}
-        shouldPersistState={false}
-        invertTheme={false}
-        theme="nicinabox"
-        tabs={tabs}
-        {...rest}
-      />
-    );
-  }
-}
-
-InspectorWrapper.propTypes = {
-  lib: PropTypes.string
-};
-
-export default InspectorWrapper;

packages/redux-devtools-trace-monitor/package.json

@@ -24,8 +24,8 @@
   },
   "devDependencies": {
     "babel-cli": "^6.10.1",
-    "babel-core": "^6.10.4",
+    "babel-core": "7.0.0-bridge.0",
-    "babel-eslint": "^6.0.5",
+    "babel-eslint": "^10.0.0",
     "babel-loader": "^6.2.4",
     "babel-plugin-add-module-exports": "^0.2.1",
     "babel-plugin-react-transform": "^2.0.0",
@@ -37,13 +37,14 @@
     "babel-preset-react-app": "^3.1.2",
     "babel-preset-stage-0": "^6.5.0",
     "babel-register": "^6.11.6",
+    "babel-runtime": "^6.23.0",
     "enzyme": "^2.6.0",
     "enzyme-to-json": "^1.3.0",
-    "eslint": "^2.13.1",
+    "eslint": "^5.0.0",
-    "eslint-config-airbnb": "^9.0.1",
+    "eslint-plugin-flowtype": "3.2.0",
-    "eslint-plugin-import": "^1.9.2",
+    "eslint-plugin-import": "2.14.0",
-    "eslint-plugin-jsx-a11y": "^1.5.3",
+    "eslint-plugin-jsx-a11y": "6.1.1",
-    "eslint-plugin-react": "^5.2.2",
+    "eslint-plugin-react": "7.11.1",
     "jest": "^17.0.3",
     "react-addons-test-utils": "^15.4.0",
     "react-dom": "^15.4.0",

packages/redux-devtools-trace-monitor/src/StackTraceTab.js

@@ -1,14 +1,14 @@
 import React, { Component, PropTypes } from 'react';
 
-import {getStackFrames} from "./react-error-overlay/utils/getStackFrames";
+import {getStackFrames} from './react-error-overlay/utils/getStackFrames';
-import StackTrace from "./react-error-overlay/containers/StackTrace";
+import StackTrace from './react-error-overlay/containers/StackTrace';
 
 export default class StackTraceTab extends Component {
   constructor(props) {
     super(props);
 
     this.state = {
-            stackFrames : []
+      stackFrames: []
     };
   }
   componentDidMount() {
@@ -25,7 +25,7 @@ export default class StackTraceTab extends Component {
   }
 
   checkForStackTrace() {
-        const {action, actions : liftedActionsById} = this.props;
+    const {action, actions: liftedActionsById} = this.props;
 
     if(!action) {
       return;
@@ -39,12 +39,12 @@ export default class StackTraceTab extends Component {
 
       getStackFrames(deserializedError)
                 .then(stackFrames => {
-                    console.log("Stack frames: ", stackFrames);
+                  console.log('Stack frames: ', stackFrames);
-                    this.setState({stackFrames, currentError : deserializedError});
+                  this.setState({stackFrames, currentError: deserializedError});
-                })
+                });
     }
     else {
-            this.setState({stackFrames : []})
+      this.setState({stackFrames: []});
     }
   }
 
@@ -60,7 +60,7 @@ export default class StackTraceTab extends Component {
                     (stackFrame.fileName === fileName && stackFrame.lineNumber === lineNumber)
                 );
         return matches;
-            })
+      });
 
             //console.log("Matching stack frame: ", matchingStackFrame);
 
@@ -77,7 +77,7 @@ export default class StackTraceTab extends Component {
                     //console.log("openResource callback args: ", callbackArgs);
                     //console.log("Testing");
           if(result.isError) {
-                        const {fileName : finalFileName, lineNumber : finalLineNumber} = matchingStackFrame;
+            const {fileName: finalFileName, lineNumber: finalLineNumber} = matchingStackFrame;
             const adjustedLineNumber = Math.max(finalLineNumber - 1, 0);
             chrome.devtools.panels.openResource(finalFileName, adjustedLineNumber, (result) => {
                             //console.log("openResource result: ", result);
@@ -94,9 +94,9 @@ export default class StackTraceTab extends Component {
     const {stackFrames} = this.state;
 
     return (
-            <div style={{backgroundColor : "white", color : "black"}}>
+            <div style={{backgroundColor: 'white', color: 'black'}}>
                 <h2>Dispatched Action Stack Trace</h2>
-                <div style={{display : "flex", flexDirection : "column"}}>
+                <div style={{display: 'flex', flexDirection: 'column'}}>
                     <StackTrace
                         stackFrames={stackFrames}
                         errorName={"N/A"}
@@ -105,6 +105,6 @@ export default class StackTraceTab extends Component {
                     />
                 </div>
             </div>
-        )
+        );
   }
 }

packages/redux-devtools-trace-monitor/src/react-error-overlay/utils/generateAnsiHTML.js

@@ -15,7 +15,7 @@ var entities = new Entities();
 // Color scheme inspired by https://chriskempson.github.io/base16/css/base16-github.css
 // var base00 = 'ffffff'; // Default Background
 //var base01 = 'f5f5f5'; // Lighter Background (Used for status bars)
-var base01 = "red";
+var base01 = 'red';
 // var base02 = 'c8c8fa'; // Selection Background
 var base03 = '6e6e6e'; // Comments, Invisibles, Line Highlighting
 // var base04 = 'e8e8e8'; // Dark Foreground (Used for status bars)

packages/redux-devtools-trace-monitor/src/react-error-overlay/utils/stack-frame.js

@@ -112,7 +112,7 @@ class StackFrame {
   toString(): string {
     const functionName = this.getFunctionName();
     const source = this.getSource();
-    return `${functionName}${source ? ` (${source})` : ``}`;
+    return `${functionName}${source ? ` (${source})` : ''}`;
   }
 }