fix ts file error for eslint (ant-design#4336)

* fix ts file error for eslint

* add format-imports script

* sort all code

* remove lint:ts

* remove tslint

* remove lint:ts

* up layout

* remove a empty test

* rm tslint config

* use umi config

* prettier all code

* use @umijs/fabric

* [CodeFactor] Apply fixes to commit 69d4f9a

[ci skip] [skip ci]

.eslintrc.js

@@ -1,42 +1,12 @@
+const fabric = require('@umijs/fabric');
+
 module.exports = {
-  parser: 'babel-eslint',
-  extends: ['airbnb', 'prettier', 'plugin:compat/recommended'],
-  env: {
-    browser: true,
-    node: true,
-    es6: true,
-    mocha: true,
-    jest: true,
-    jasmine: true,
+  ...fabric.default,
+  rules: {
+    ...fabric.default.rules,
   },
   globals: {
-    page: true,
     ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: true,
-  },
-  rules: {
-    'react/jsx-filename-extension': [1, { extensions: ['.js'] }],
-    'react/jsx-wrap-multilines': 0,
-    'react/prop-types': 0,
-    'react/forbid-prop-types': 0,
-    'react/jsx-one-expression-per-line': 0,
-    'import/no-unresolved': [2, { ignore: ['^@/', '^umi/'] }],
-    'import/no-extraneous-dependencies': [
-      2,
-      {
-        optionalDependencies: true,
-        devDependencies: ['**/tests/**.js', '/mock/**/**.js', '**/**.test.js'],
-      },
-    ],
-    'import/no-cycle': 0,
-    'jsx-a11y/no-noninteractive-element-interactions': 0,
-    'jsx-a11y/click-events-have-key-events': 0,
-    'jsx-a11y/no-static-element-interactions': 0,
-    'jsx-a11y/anchor-is-valid': 0,
-    'linebreak-style': 0,
-  },
-  settings: {
-    // support import modules from TypeScript files in JavaScript files
-    'import/resolver': { node: { extensions: ['.js', '.ts', '.tsx'] } },
-    polyfills: ['fetch', 'promises', 'url', 'object-assign'],
+    page: true,
   },
 };

.gitignore

@@ -34,4 +34,5 @@ functions/*
 
 # screenshot
 screenshot
-.firebase
+.firebase
+.eslintcache

.prettierignore

@@ -13,4 +13,7 @@ docker
 Dockerfile*
 .gitignore
 .prettierignore
-LICENSE
+LICENSE
+.eslintcache
+*.lock
+yarn-error.log

.prettierrc.js

@@ -0,0 +1,5 @@
+const fabric = require('@umijs/fabric');
+
+module.exports = {
+  ...fabric.prettier,
+};

.stylelintrc.js

@@ -0,0 +1,5 @@
+const fabric = require('@umijs/fabric');
+
+module.exports = {
+  ...fabric.stylelint,
+};

config/config.ts

@@ -1,9 +1,11 @@
+import { IConfig, IPlugin } from 'umi-types';
+
+import defaultSettings from './defaultSettings';
 // https://umijs.org/config/
 import os from 'os';
 import slash from 'slash2';
-import { IPlugin, IConfig } from 'umi-types';
-import defaultSettings from './defaultSettings';
 import webpackPlugin from './plugin.config';
+
 const { pwa, primaryColor } = defaultSettings;
 
 // preview.pro.ant.design only do not use in your production ;

config/plugin.config.ts

@@ -1,10 +1,9 @@
 // Change theme plugin
-
-// import MergeLessPlugin from 'antd-pro-merge-less';
-// import AntDesignThemePlugin from 'antd-theme-webpack-plugin';
+// eslint-disable-next-line eslint-comments/abdeils - enable - pair;
+/* eslint-disable import/no-extraneous-dependencies */
 import ThemeColorReplacer from 'webpack-theme-color-replacer';
-import path from 'path';
 import generate from '@ant-design/colors/lib/generate';
+import path from 'path';
 
 function getModulePackageName(module: { context: string }) {
   if (!module.context) return null;
@@ -107,7 +106,7 @@ const getAntdSerials = (color: string) => {
   const lightNum = 9;
   const devide10 = 10;
   // 淡化（即less的tint）
-  const lightens = new Array(lightNum).fill().map((t, i) => {
+  const lightens = new Array(lightNum).fill(undefined).map((_, i: number) => {
     return ThemeColorReplacer.varyColor.lighten(color, i / devide10);
   });
   const colorPalettes = generate(color);

package.json

@@ -14,25 +14,23 @@
     "docker:push": "npm run docker-hub:build && npm run docker:tag && docker push antdesign/ant-design-pro",
     "docker:tag": "docker tag ant-design-pro antdesign/ant-design-pro",
     "fetch:blocks": "node ./scripts/fetch-blocks.js",
+    "format-imports": "import-sort --write '**/*.{js,jsx,ts,tsx}'",
     "functions:build": "netlify-lambda build ./lambda",
     "functions:run": "cross-env NODE_ENV=dev netlify-lambda serve ./lambda",
-    "lint": "npm run lint:js && npm run lint:ts && npm run lint:style && npm run lint:prettier",
+    "lint": "npm run lint:js && npm run lint:style && npm run lint:prettier",
     "lint-staged": "lint-staged",
-    "lint-staged:js": "eslint --ext .js",
-    "lint-staged:ts": "tslint",
-    "lint:fix": "eslint --fix --ext .js src tests && npm run lint:style && npm run tslint:fix",
-    "lint:js": "eslint --ext .js src tests",
+    "lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx ",
+    "lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src && npm run lint:style",
+    "lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
     "lint:prettier": "check-prettier lint",
     "lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
-    "lint:ts": "tslint -p . -c tslint.yml",
-    "prettier": "prettier -c --write '**/*'",
+    "prettier": "prettier -c --write **/*",
     "site": "npm run fetch:blocks && npm run functions:build && umi build",
     "start": "umi dev",
     "start:no-mock": "cross-env MOCK=none umi dev",
     "test": "umi test",
     "test:all": "node ./tests/run-tests.js",
-    "test:component": "umi test ./src/components",
-    "tslint:fix": "tslint --fix \"src/**/*.ts*\""
+    "test:component": "umi test ./src/components"
   },
   "husky": {
     "hooks": {
@@ -41,20 +39,20 @@
   },
   "lint-staged": {
     "**/*.less": "stylelint --syntax less",
-    "**/*.{js,jsx}": "npm run lint-staged:js",
     "**/*.{js,jsx,tsx,ts,less,md,json}": [
       "prettier --write",
       "git add"
     ],
-    "**/*.{ts,tsx}": "npm run lint-staged:ts"
+    "**/*.{js,jsx}": "npm run lint-staged:js",
+    "**/*.{js,ts,tsx}": "npm run lint-staged:js"
   },
   "browserslist": [
     "> 1%",
     "last 2 versions",
     "not ie <= 10"
   ],
   "dependencies": {
-    "@ant-design/pro-layout": "^4.4.2",
+    "@ant-design/pro-layout": "^4.5.0",
     "@antv/data-set": "^0.10.2",
     "antd": "^3.19.1",
     "classnames": "^2.2.6",
@@ -75,13 +73,15 @@
     "react-dom": "^16.8.6",
     "react-media": "^1.9.2",
     "react-media-hook2": "^1.0.5",
+    "redux": "^4.0.1",
     "umi": "^2.7.2",
     "umi-plugin-ga": "^1.1.3",
     "umi-plugin-pro-block": "^1.3.2",
     "umi-plugin-react": "^1.8.2",
     "umi-request": "^1.0.7"
   },
   "devDependencies": {
+    "@ant-design/colors": "^3.1.0",
     "@types/classnames": "^2.2.7",
     "@types/history": "^4.7.2",
     "@types/jest": "^24.0.13",
@@ -90,47 +90,30 @@
     "@types/react": "^16.8.19",
     "@types/react-document-title": "^2.0.3",
     "@types/react-dom": "^16.8.4",
-    "antd-pro-merge-less": "^1.0.0",
-    "@ant-design/colors": "^3.1.0",
+    "@umijs/fabric": "^1.0.4",
     "babel-eslint": "^10.0.1",
     "chalk": "^2.4.2",
     "check-prettier": "^1.0.3",
     "cross-env": "^5.2.0",
     "cross-port-killer": "^1.1.1",
     "enzyme": "^3.9.0",
     "eslint": "^5.16.0",
-    "eslint-config-airbnb": "^17.1.0",
-    "eslint-config-prettier": "^4.3.0",
-    "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-compat": "^3.1.1",
-    "eslint-plugin-import": "^2.17.3",
-    "eslint-plugin-jsx-a11y": "^6.2.1",
-    "eslint-plugin-markdown": "^1.0.0",
-    "eslint-plugin-react": "^7.13.0",
     "express": "^4.17.1",
     "gh-pages": "^2.0.1",
     "husky": "^2.3.0",
+    "import-sort-cli": "^6.0.0",
+    "import-sort-parser-babylon": "^6.0.0",
+    "import-sort-parser-typescript": "^6.0.0",
+    "import-sort-style-module": "^6.0.0",
     "jest-puppeteer": "^4.2.0",
     "jsdom-global": "^3.0.2",
-    "less": "^3.9.0",
     "lint-staged": "^8.1.7",
     "mockjs": "^1.0.1-beta3",
     "netlify-lambda": "^1.4.13",
     "node-fetch": "^2.6.0",
     "prettier": "^1.17.1",
     "serverless-http": "^2.0.2",
     "slash2": "^2.0.0",
-    "stylelint": "^10.0.1",
-    "stylelint-config-css-modules": "^1.4.0",
-    "stylelint-config-prettier": "^5.2.0",
-    "stylelint-config-rational-order": "^0.1.2",
-    "stylelint-config-standard": "^18.3.0",
-    "stylelint-declaration-block-no-ignored-properties": "^2.1.0",
-    "stylelint-order": "^3.0.0",
-    "tslint": "^5.17.0",
-    "tslint-config-prettier": "^1.18.0",
-    "tslint-eslint-rules": "^5.4.0",
-    "tslint-react": "^4.0.0",
     "webpack-theme-color-replacer": "^1.1.5"
   },
   "optionalDependencies": {
@@ -174,4 +157,4 @@
       "create-umi"
     ]
   }
-}
+}

src/components/Authorized/Authorized.tsx

@@ -1,28 +1,27 @@
-import CheckPermissions from './CheckPermissions';
-import { IAuthorityType } from './CheckPermissions';
-import Secured from './Secured';
-import check from './CheckPermissions';
-import AuthorizedRoute from './AuthorizedRoute';
 import React from 'react';
+import check, { IAuthorityType } from './CheckPermissions';
+
+import AuthorizedRoute from './AuthorizedRoute';
+import Secured from './Secured';
 
-interface IAuthorizedProps {
+interface AuthorizedProps {
   authority: IAuthorityType;
   noMatch?: React.ReactNode;
 }
 
-type IAuthorizedType = React.FunctionComponent<IAuthorizedProps> & {
+type IAuthorizedType = React.FunctionComponent<AuthorizedProps> & {
   Secured: typeof Secured;
   check: typeof check;
   AuthorizedRoute: typeof AuthorizedRoute;
 };
 
-const Authorized: React.FunctionComponent<IAuthorizedProps> = ({
+const Authorized: React.FunctionComponent<AuthorizedProps> = ({
   children,
   authority,
   noMatch = null,
 }) => {
   const childrenRender: React.ReactNode = typeof children === 'undefined' ? null : children;
-  const dom = CheckPermissions(authority, childrenRender, noMatch);
+  const dom = check(authority, childrenRender, noMatch);
   return <>{dom}</>;
 };
 

src/components/Authorized/AuthorizedRoute.tsx

@@ -1,17 +1,18 @@
+import { Redirect, Route } from 'umi';
+
 import React from 'react';
-import { Route, Redirect } from 'umi';
 import Authorized from './Authorized';
 import { IAuthorityType } from './CheckPermissions';
 
-interface IAuthorizedRoutePops {
+interface AuthorizedRoutePops {
   currentAuthority: string;
   component: React.ComponentClass<any, any>;
   render: (props: any) => React.ReactNode;
   redirectPath: string;
   authority: IAuthorityType;
 }
 
-const AuthorizedRoute: React.SFC<IAuthorizedRoutePops> = ({
+const AuthorizedRoute: React.SFC<AuthorizedRoutePops> = ({
   component: Component,
   render,
   authority,

src/components/Authorized/CheckPermissions.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
+import { CURRENT } from './renderAuthorize';
 // eslint-disable-next-line import/no-cycle
 import PromiseRender from './PromiseRender';
-import { CURRENT } from './renderAuthorize';
 
 export type IAuthorityType =
   | undefined
   | string
   | string[]
-  | Promise<any>
+  | Promise<boolean>
   | ((currentAuthority: string | string[]) => IAuthorityType);
 
 /**