chore: adds eslint rules

Author: Michael Dougall

.eslintrc

@@ -1,4 +1,23 @@
 {
   "parser": "typescript-eslint-parser",
-  "plugins": ["eslint-plugin-typescript"]
+  "plugins": ["typescript"],
+  "extends": ["airbnb", "prettier", "prettier/react"],
+  "env": {
+    "browser": true,
+    "jest": true
+  },
+  "rules": {
+    "typescript/class-name-casing": "error",
+    "typescript/no-unused-vars": "error",
+    "react/jsx-filename-extension": ["error", { "extensions": [".tsx"] }],
+    "import/no-unresolved": "off",
+    "no-undef": "off",
+    "arrow-body-style": "off",
+    "no-restricted-globals": "off",
+    "no-multi-str": "off",
+    "import/no-extraneous-dependencies": [
+      "error",
+      { "devDependencies": ["**/*test.tsx", "**/*stories.tsx"] }
+    ]
+  }
 }

.vscode/settings.json

@@ -5,5 +5,6 @@
     "**/bower_components": true,
     "**/docs/**": true
   },
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "eslint.enable": true
 }

package.json

@@ -7,7 +7,7 @@
   "scripts": {
     "tdd": "jest --watch",
     "build": "lerna run build",
-    "lint": "eslint .",
+    "lint": "eslint --ext .tsx .",
     "test": "jest",
     "pre-cut-version": "yarn test",
     "postinstall": "yarn build && lerna link",
@@ -35,10 +35,16 @@
     "@types/storybook__react": "^3.0.9",
     "babel-core": "^6.26.3",
     "css-loader": "^1.0.0",
+    "enzyme": "^3.6.0",
     "enzyme-adapter-react-16": "^1.5.0",
     "enzyme-matchers": "^6.0.4",
     "enzyme-to-json": "^3.3.3",
     "eslint": "^5.6.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-config-prettier": "^3.1.0",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-jsx-a11y": "^6.1.1",
+    "eslint-plugin-react": "^7.11.1",
     "eslint-plugin-typescript": "^0.12.0",
     "jest": "^23.5.0",
     "jest-enzyme": "^6.0.4",

packages/yubaba/src/Baba/index.tsx

@@ -1,5 +1,8 @@
 import * as React from 'react';
-import { unstable_renderSubtreeIntoContainer, unmountComponentAtNode } from 'react-dom';
+import {
+  unstable_renderSubtreeIntoContainer as renderSubtreeIntoContainer,
+  unmountComponentAtNode,
+} from 'react-dom';
 import Collector, {
   SupplyDataHandler,
   SupplyRenderChildrenHandler,
@@ -12,7 +15,7 @@ import Collector, {
   TargetProps,
 } from '../Collector';
 import { getElementSizeLocation } from '../lib/dom';
-import { defer } from '../lib/defer';
+import defer from '../lib/defer';
 import * as childrenStore from '../lib/childrenStore';
 import { InjectedProps, withBabaManagerContext } from '../BabaManager';
 
@@ -271,7 +274,7 @@ If it's an image, try and have the image loaded before mounting, or set a static
             // This ensures that if there was an update to the jsx that is animating,
             // it changes next frame. Resulting in the transition _actually_ happening.
             requestAnimationFrame(() =>
-              unstable_renderSubtreeIntoContainer(
+              renderSubtreeIntoContainer(
                 this,
                 jsx as React.ReactElement<{}>,
                 elementToMountChildren

packages/yubaba/src/Baba/test.tsx

@@ -4,7 +4,7 @@ import 'jest-enzyme';
 import { Baba } from '../Baba';
 import Target from '../Target';
 import { getElementSizeLocation } from '../lib/dom';
-import { defer } from '../lib/defer';
+import defer from '../lib/defer';
 import * as utils from '../__tests__/utils';
 
 jest.mock('../lib/dom');

packages/yubaba/src/BabaManager/test.tsx

@@ -3,7 +3,7 @@ import { mount } from 'enzyme';
 import Baba from '../Baba';
 import BabaManager from '../BabaManager';
 import * as utils from '../__tests__/utils';
-import { defer } from '../lib/defer';
+import defer from '../lib/defer';
 
 describe('<BabaManager />', () => {
   it('should show manager content when waiting for animation', () => {

packages/yubaba/src/lib/defer.tsx

@@ -1,4 +1,4 @@
-export const defer = <TValue extends void>() => {
+const defer = <TValue extends void>() => {
   let resolve: (value?: TValue | PromiseLike<TValue> | undefined) => void = () => {};
   let reject: (value?: TValue | PromiseLike<TValue> | undefined) => void = () => {};
 
@@ -13,3 +13,5 @@ export const defer = <TValue extends void>() => {
     promise,
   };
 };
+
+export default defer;