.eslintrc.json

{
  "root": true,
  "env": {
    "browser": true,
    "es2021": true,
    "jest/globals": true,
    "node": true
  },
  "extends": [
    "airbnb-typescript",
    "airbnb/hooks",
    "plugin:@typescript-eslint/recommended",
    "plugin:@typescript-eslint/recommended-requiring-type-checking",
    "plugin:react/recommended",
    "plugin:react-hooks/recommended",
    "plugin:jest/recommended",
    "plugin:eslint-comments/recommended",
    "plugin:promise/recommended",
    "prettier",
    "prettier/@typescript-eslint",
    "prettier/prettier",
    "prettier/react"
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": 12,
    "project": ["tsconfig.json"],
    "sourceType": "module"
  },
  "plugins": [
    "@typescript-eslint",
    "jest",
    "react",
    "react-hooks",
    "jsx-a11y",
    "promise",
    "prettier"
  ],
  "rules": {
    "import/extensions": [
      "error",
      "ignorePackages",
      {
        "js": "never",
        "jsx": "never",
        "ts": "never",
        "tsx": "never",
        "json": "never",
        "scss": "always",
        "svg": "always"
      }
    ],
    "react/jsx-handler-names": [
      "error",
      {
        "checkLocalVariables": true
      }
    ],
    "react/jsx-indent": [
      "error",
      2,
      {
        "checkAttributes": true,
        "indentLogicalExpressions": true
      }
    ],
    "react/jsx-indent-props": ["error", 2],
    "react/jsx-max-props-per-line": [
      "error",
      {
        "maximum": 1,
        "when": "multiline"
      }
    ],
    //    "react/jsx-max-depth": [
    //      "warn",
    //      {
    //        "max": 3
    //      }
    //    ],
    "react/jsx-no-constructed-context-values": "error",
    "react/jsx-no-useless-fragment": "error",
    "react/jsx-one-expression-per-line": "error",
    "react/jsx-pascal-case": "error",
    "react/jsx-filename-extension": [
      "warn",
      {
        "extensions": [".jsx", ".tsx"]
      }
    ],
    "react/jsx-sort-props": [
      "warn",
      {
        "reservedFirst": true
      }
    ],
    "react/jsx-tag-spacing": [
      "error",
      {
        "closingSlash": "never",
        "beforeSelfClosing": "always",
        "afterOpening": "never",
        "beforeClosing": "allow"
      }
    ],
    "react/jsx-sort-default-props": "error",
    "react/jsx-props-no-spreading": [
      "error",
      {
        "html": "ignore",
        "explicitSpread": "ignore"
      }
    ],
    "react/jsx-props-no-multi-spaces": "error",
    "@typescript-eslint/no-explicit-any": "off",
    "promise/prefer-await-to-then": "warn",
    "promise/prefer-await-to-callbacks": "warn"
  },
  "settings": {
    "import/resolver": {
      "node": {},
      "webpack": {
        "config": "webpack.config.js"
      }
    },
    "react": {
      "pragma": "React",
      "version": "detect"
    },
    "propWrapperFunctions": ["forbidExtraProps", "exact", "Object.freeze"],
    "import/ignore": ["node_modules", "\\.(scss|css|svg|json)$"]
  }
}