chore: remove tslint and use typescript-eslint (#159)

* chore: remove tslint and use typescript-eslint

feat: remove tslint and eslint to lint typescript

chore: better eslint setting

* chore: integrate prettier into eslint

* chore: downgrade lint-staged version

* fix: child.type.isNextCol error

* chore: better eslint config

Author: stkevintan

.eslintrc

@@ -1,33 +1,16 @@
 {
-  "parser": "babel-eslint",
-  "extends": ["standard", "standard-react"],
   "env": {
-    "browser": true,
-    "node": true,
-    "es6": true,
-    "jest": true,
-    "commonjs": true
+    "node": true
+  },
+  "globals": {
+    "sleep": true,
+    "prettyFormat": true
   },
-  "plugins": ["react", "react-hooks"],
   "parserOptions": {
-    "ecmaVersion": 6,
+    "ecmaVersion": 10,
     "sourceType": "module",
     "ecmaFeatures": {
       "jsx": true
     }
-  },
-  "globals": {
-    "sleep": true,
-    "prettyFormat": true
-  },
-  "rules": {
-    // don't force es6 functions to include space before paren
-    "space-before-function-paren": 0,
-    "react/prop-types": 0,
-    // allow specifying true explicitly for boolean props
-    "react/jsx-boolean-value": 0,
-    "react-hooks/rules-of-hooks": "error",
-    "react/no-did-update-set-state": 0,
-    "jsx-quotes":"off"
   }
-}
+}

.prettierrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+  semi: false,
+  tabWidth: 2,
+  singleQuote: true,
+}

.travis.yml

@@ -14,5 +14,4 @@ before_script:
 
 script:
   - npm run lint
-  - npm run tslint:once
   - npm run test

package.json

@@ -25,9 +25,7 @@
     "version:major": "npm run prevesion && lerna version major --force-publish=* --no-git-tag-version -m \"chore(versions): publish packages %s\"",
     "release:force": "lerna publish from-package --yes",
     "release": "lerna publish",
-    "lint": "eslint \"packages/!(docs)/**/*.js\" \"scripts/**/*.js\"",
-    "tslint": "npm run tslint:once && onchange 'packages/**/*.ts' -- npm run tslint:once",
-    "tslint:once": "tslint --fix --project ./ ",
+    "lint": "eslint --ext .ts,.tsx,.js \"packages/!(docs)/**/src/**/*.@(ts|tsx)\" \"scripts/**/*.js\" --fix",
     "postinstall": "opencollective-postinstall"
   },
   "devDependencies": {
@@ -44,6 +42,9 @@
     "@babel/preset-react": "^7.0.0",
     "@babel/register": "^7.0.0",
     "@babel/runtime-corejs3": "^7.2.0",
+    "@testing-library/react": "^8.0.0",
+    "@typescript-eslint/eslint-plugin": "^1.11.0",
+    "@typescript-eslint/parser": "^1.11.0",
     "all-contributors-cli": "^6.1.2",
     "antd": "^3.17.0",
     "babel-eslint": "^10.0.1",
@@ -57,14 +58,13 @@
     "cz-conventional-changelog": "^2.1.0",
     "doc-scripts": "^1.7.24",
     "eslint": "^5.16.0",
-    "eslint-config-standard": "^12.0.0",
-    "eslint-config-standard-react": "^7.0.2",
+    "eslint-config-prettier": "^6.0.0",
     "eslint-plugin-import": "^2.13.0",
     "eslint-plugin-node": "^7.0.1",
+    "eslint-plugin-prettier": "^3.1.0",
     "eslint-plugin-promise": "^4.0.0",
-    "eslint-plugin-react": "^7.13.0",
-    "eslint-plugin-react-hooks": "^1.0.2",
-    "eslint-plugin-standard": "^4.0.0",
+    "eslint-plugin-react": "^7.14.2",
+    "eslint-plugin-react-hooks": "^1.6.1",
     "execa": "^1.0.0",
     "findup": "^0.1.5",
     "fs-extra": "^7.0.1",
@@ -79,38 +79,46 @@
     "jest-watch-lerna-packages": "^1.1.0",
     "json5": "^2.1.0",
     "lerna": "^3.10.1",
+    "lint-staged": "^8.2.1",
     "majo": "^0.7.1",
     "onchange": "^5.2.0",
-    "prettier-eslint-cli": "^4.7.1",
+    "prettier": "^1.18.2",
     "pretty-format": "^24.0.0",
     "react": "^16.8.3",
     "react-dom": "^16.8.3",
-    "@testing-library/react": "^8.0.0",
     "remark-parse": "^6.0.3",
     "remark-stringify": "^6.0.4",
     "semver-regex": "^2.0.0",
     "staged-git-files": "^1.1.2",
     "ts-jest": "^24.0.2",
     "tsconfig-paths-webpack-plugin": "^3.2.0",
-    "tslint": "^5.16.0",
-    "tslint-config-prettier": "^1.18.0",
     "typescript": "^3.4.5",
     "unified": "^7.1.0",
     "user-event": "^1.4.4",
     "webpack": "^4.27.1"
   },
   "config": {
     "ghooks": {
-      "pre-commit": "prettier-eslint \"./(packages|scripts)/**.js\" --write && npm run lint",
+      "pre-commit": "lint-staged",
       "commit-msg": "node ./scripts/validate-commit-msg.js"
     },
     "commitizen": {
       "path": "./node_modules/cz-conventional-changelog"
     }
   },
+  "lint-staged": {
+    "packages/!(docs)/**/*.@(ts|tsx)": [
+      "eslint --ext .ts,.tsx --fix",
+      "git add"
+    ],
+    "scripts/**/*.js": [
+      "eslint --fix",
+      "git add"
+    ]
+  },
   "dependencies": {
-    "opencollective-postinstall": "^2.0.2",
-    "opencollective": "^1.0.3"
+    "opencollective": "^1.0.3",
+    "opencollective-postinstall": "^2.0.2"
   },
   "collective": {
     "type": "opencollective",

packages/.eslintrc

@@ -0,0 +1,52 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "extends": [
+    "plugin:react/recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier/@typescript-eslint",
+  ],
+  "env": {
+    "browser": true,
+    "es6": true,
+    "jest": true,
+    "commonjs": true
+  },
+  "plugins": ["@typescript-eslint", "react", "react-hooks", "prettier"],
+  "parserOptions": {
+    "project": "./tsconfig.json",
+    "sourceType": "module",
+    "ecmaVersion": 6,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "settings": {
+    "react": {
+      "version": "detect",
+    }
+  },
+
+  "rules": {
+    "prettier/prettier": 2,
+
+    // don't force es6 functions to include space before paren
+    "space-before-function-paren": 0,
+    "react/prop-types": 0,
+    "react/no-find-dom-node": 0,
+    "react/display-name": 0,
+    // allow specifying true explicitly for boolean props
+    "react/jsx-boolean-value": 0,
+    "react-hooks/rules-of-hooks": 2,
+    "react/no-did-update-set-state": 0,
+    // maybe we should no-public
+    "@typescript-eslint/explicit-member-accessibility": 0,
+
+    "@typescript-eslint/interface-name-prefix": 0,
+    "@typescript-eslint/no-explicit-any": 0,
+    "@typescript-eslint/explicit-function-return-type": 0,
+    "@typescript-eslint/no-parameter-properties": 0,
+    "@typescript-eslint/array-type": 0,
+    "@typescript-eslint/no-object-literal-type-assertion": 0,
+    "no-console": ["error", { "allow": ["warn", "error", "info"] }]
+  }
+}

packages/antd/src/components/formButtonGroup.tsx

@@ -32,8 +32,8 @@ const isElementInViewport = (
     offset = 0,
     threshold = 0
   }: {
-  offset?: IOffset | number
-  threshold?: number
+    offset?: IOffset | number
+    threshold?: number
   } = {}
 ) => {
   const { top, right, bottom, left, width, height } = rect
@@ -50,10 +50,14 @@ const isElementInViewport = (
   }
 
   return (
-    intersection.t >= ((offset as IOffset).top || offset as number + elementThreshold.y) &&
-    intersection.r >= ((offset as IOffset).right || offset as number + elementThreshold.x) &&
-    intersection.b >= ((offset as IOffset).bottom || offset as number + elementThreshold.y) &&
-    intersection.l >= ((offset as IOffset).left || offset as number + elementThreshold.x)
+    intersection.t >=
+      ((offset as IOffset).top || (offset as number) + elementThreshold.y) &&
+    intersection.r >=
+      ((offset as IOffset).right || (offset as number) + elementThreshold.x) &&
+    intersection.b >=
+      ((offset as IOffset).bottom || (offset as number) + elementThreshold.y) &&
+    intersection.l >=
+      ((offset as IOffset).left || (offset as number) + elementThreshold.x)
   )
 }
 
@@ -150,6 +154,7 @@ export const FormButtonGroup = styled(
 
     private getStickyBoundaryHandler(ref) {
       return () => {
+        // eslint-disable-next-line react/no-find-dom-node
         this.formNode = this.formNode || ReactDOM.findDOMNode(ref.current)
         if (this.formNode) {
           return isElementInViewport(this.formNode.getBoundingClientRect())
@@ -159,7 +164,8 @@ export const FormButtonGroup = styled(
     }
   }
 )`
-  ${props => (props.align ? `display:flex;justify-content: ${getAlign(props.align)}` : '')}
+  ${props =>
+    props.align ? `display:flex;justify-content: ${getAlign(props.align)}` : ''}
   &.is-inline {
     display: inline-block;
     flex-grow: 3;

packages/antd/src/components/grid.tsx

@@ -14,7 +14,7 @@ export class Row extends Component<IRowProps> {
   }
 
   public render() {
-    /* eslint-disable no-unused-vars */
+    /* eslint-disable @typescript-eslint/no-unused-vars */
     const {
       prefix,
       pure,
@@ -30,7 +30,7 @@ export class Row extends Component<IRowProps> {
       children,
       ...others
     } = this.props
-    /* eslint-enable no-unused-vars */
+    /* eslint-enable @typescript-eslint/no-unused-vars */
 
     let hiddenClassObj
     if (hidden === true) {
@@ -65,8 +65,12 @@ export class Row extends Component<IRowProps> {
         ...(others.style || {})
       }
       newChildren = Children.map(children, (child: React.ReactElement) => {
-        // @ts-ignore
-        if (child && child.type && typeof child.type === 'function' && child.type.isNextCol) {
+        if (
+          child &&
+          child.type &&
+          typeof child.type === 'function' &&
+          (child.type as any).isNextCol
+        ) {
           const newChild = cloneElement(child, {
             style: {
               paddingLeft: halfGutterString,
@@ -131,7 +135,9 @@ export class Col extends Component<IColProps> {
       }
 
       ret[`${prefix}col-${point}-${pointProps.span}`] = !!pointProps.span
-      ret[`${prefix}col-${point}-offset-${pointProps.offset}`] = !!pointProps.offset
+      ret[
+        `${prefix}col-${point}-offset-${pointProps.offset}`
+      ] = !!pointProps.offset
       return ret
     }, {})