Reconfigure ESLint

Author: armandabric

.eslintrc.js

@@ -1,14 +1,10 @@
 module.exports = {
-  extends: ['airbnb-typescript', 'prettier'],
+  extends: ['airbnb', 'airbnb-typescript', 'prettier'],
 
   parserOptions: {
     project: './tsconfig.eslint.json',
   },
 
-  // ecmaFeatures: {
-  //   jsx: true,
-  // },
-
   env: {
     es6: true,
   },
@@ -19,12 +15,12 @@ module.exports = {
     },
   },
 
-  // rules: {
-  //   'max-params': ['error', 10],
-  //   'no-warning-comments': 'error',
-
-  //   'import/no-commonjs': 'off',
-  // },
+  rules: {
+    'import/no-cycle': 'off', // TODO: We have to fix our cycle issue before being able to activate it again
+    'no-underscore-dangle': 'off',
+    'prefer-destructuring': 'off',
+    'react/jsx-fragments': 'off',
+  },
 
   overrides: [
     {

package.json

@@ -43,26 +43,27 @@
     "@types/jest": "^27.0.2",
     "@types/react": "^17.0.26",
     "@types/react-is": "^17.0.2",
+    "@typescript-eslint/eslint-plugin": "^4.29.3",
+    "@typescript-eslint/parser": "^4.29.3",
     "babel-eslint": "10.1.0",
-    "babel-jest": "24.9.0",
+    "babel-jest": "27.2.4",
     "babel-register": "6.26.0",
     "conventional-changelog-cli": "2.2.2",
     "doctoc": "1.4.0",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
-    "eslint": "7.25.0",
-    "eslint-config-airbnb-typescript": "12.3.1",
-    "eslint-config-algolia": "14.0.1",
+    "eslint": "7.32.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-config-airbnb-typescript": "^14.0.0",
+    "eslint-config-algolia": "19.0.2",
     "eslint-config-prettier": "8.3.0",
-    "eslint-plugin-import": "2.22.1",
-    "eslint-plugin-jest": "22.21.0",
+    "eslint-plugin-import": "2.24.2",
+    "eslint-plugin-jest": "24.5.0",
     "eslint-plugin-jsx-a11y": "6.4.1",
-    "eslint-plugin-react": "7.23.2",
+    "eslint-plugin-react": "7.26.1",
     "eslint-plugin-react-hooks": "4.2.0",
     "esm": "3.2.25",
-    "expect": "27.5.1",
-    "flow-bin": "0.119.1",
-    "flow-copy-source": "2.0.9",
+    "expect": "27.2.4",
     "husky": "3.1.0",
     "jest": "27.5.1",
     "json": "10.0.0",
@@ -89,8 +90,6 @@
     "@base2/pretty-print-object": "1.0.2"
   },
   "jest": {
-    "setupFilesAfterEnv": [
-      "<rootDir>tests/setupTests.ts"
-    ]
+    "setupFilesAfterEnv": ["<rootDir>tests/setupTests.ts"]
   }
 }

src/AnonymousStatelessComponent.tsx

@@ -1,5 +1,6 @@
-import React from 'react'; // eslint-disable-next-line react/display-name
+import React from 'react';
 
+// eslint-disable-next-line func-names
 export default function (props: { children: React.ReactNode }) {
   const { children } = props; // eslint-disable-line react/prop-types
 

src/formatter/createPropFilter.ts

@@ -4,8 +4,8 @@ export default function createPropFilter(
 ) {
   if (Array.isArray(filter)) {
     return (key: string) => filter.indexOf(key) === -1;
-  } else {
-    // @ts-expect-error: flow to TS
-    return (key: string) => filter(props[key], key);
   }
+
+  // @ts-expect-error: flow to TS
+  return (key: string) => filter(props[key], key);
 }

src/formatter/formatComplexDataStructure.ts

@@ -1,11 +1,11 @@
 import { isValidElement } from 'react';
 import { prettyPrint } from '@base2/pretty-print-object';
 import sortObject from './sortObject';
-import parseReactElement from './../parser/parseReactElement';
+import parseReactElement from '../parser/parseReactElement';
 import formatTreeNode from './formatTreeNode';
 import formatFunction from './formatFunction';
 import spacer from './spacer';
-import type { Options } from './../options';
+import type { Options } from '../options';
 
 export default (
   value: Record<string, any> | Array<any>,

src/formatter/formatFunction.ts

@@ -1,4 +1,4 @@
-import type { Options } from './../options';
+import type { Options } from '../options';
 
 function noRefCheck() {}
 

src/formatter/formatProp.ts

@@ -1,6 +1,6 @@
 import spacer from './spacer';
 import formatPropValue from './formatPropValue';
-import type { Options } from './../options';
+import type { Options } from '../options';
 
 export default (
   name: string,

src/formatter/formatPropValue.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import formatPropValue from './formatPropValue';
-import parseReactElement from './../parser/parseReactElement';
+import parseReactElement from '../parser/parseReactElement';
 import formatTreeNode from './formatTreeNode';
 import formatComplexDataStructure from './formatComplexDataStructure';
 

src/formatter/formatPropValue.ts

@@ -3,8 +3,8 @@ import { isValidElement } from 'react';
 import formatComplexDataStructure from './formatComplexDataStructure';
 import formatFunction from './formatFunction';
 import formatTreeNode from './formatTreeNode';
-import type { Options } from './../options';
-import parseReactElement from './../parser/parseReactElement';
+import type { Options } from '../options';
+import parseReactElement from '../parser/parseReactElement';
 
 const escape = (s: string): string => s.replace(/"/g, '"');
 
@@ -49,7 +49,7 @@ const formatPropValue = (
   }
 
   if (propValue instanceof Date) {
-    if (isNaN(propValue.valueOf())) {
+    if (Number.isNaN(propValue.valueOf())) {
       return `{new Date(NaN)}`;
     }
 

src/formatter/formatReactElementNode.ts

@@ -4,8 +4,8 @@ import formatProp from './formatProp';
 import mergeSiblingPlainStringChildrenReducer from './mergeSiblingPlainStringChildrenReducer';
 import sortPropsByNames from './sortPropsByNames';
 import createPropFilter from './createPropFilter';
-import type { Options } from './../options';
-import type { ReactElementTreeNode } from './../tree';
+import type { Options } from '../options';
+import type { ReactElementTreeNode } from '../tree';
 
 const compensateMultilineStringElementIndentation = (
   element: any,