.eslintrc.json

{
  "env": {
    "browser": true,
    "es2021": true,
    "jest": true
  },
  "extends": [
    "react-app",
    "react-app/jest",
    "plugin:@typescript-eslint/recommended-requiring-type-checking",
    "plugin:import/recommended",
    "plugin:import/typescript",
    "prettier"
  ],
  "ignorePatterns": [
    "src/types/*.d.ts"
  ],
  "overrides": [
    {
      "files": [
        "**/*.stories.*"
      ],
      "rules": {
        "import/no-anonymous-default-export": "off"
      }
    }
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "project": [
      "./tsconfig.json"
    ]
  },
  "plugins": [
    "unused-imports",
    "simple-import-sort"
  ],
  "rules": {
    "@typescript-eslint/indent": "off",
    "@typescript-eslint/no-explicit-any": "error",
    "@typescript-eslint/no-floating-promises": "warn",
    "@typescript-eslint/no-shadow": [
      "error"
    ],
    "@typescript-eslint/no-unused-vars": "error",
    "@typescript-eslint/no-use-before-define": [
      "error"
    ],
    "eqeqeq": "error",
    "import/extensions": "off",
    "import/no-default-export": [
      "warn"
    ],
    "import/no-extraneous-dependencies": "off",
    "import/no-unresolved": "off",
    "import/prefer-default-export": "off",
    "no-console": [
      "error",
      {
        "allow": [
          "debug",
          "warn",
          "error"
        ]
      }
    ],
    "no-restricted-imports": [
      "error",
      {
        "patterns": [
          {
            "group": [
              "**/dist/**"
            ],
            "message": "Don't import types/modules from 'dist' directories!"
          },
          {
            "group": [
              "src/**"
            ],
            "message": "Don't import from 'src' directory! Use relative paths instead!"
          }
        ]
      }
    ],
    "no-shadow": "off",
    "no-unused-vars": "off",
    "no-use-before-define": "off",
    "prefer-template": "error",
    "react/forbid-component-props": [
      "warn",
      {
        "forbid": [
          {
            "message": "Avoid using inline styles for components. Use styled components instead.",
            "propName": "style"
          },
          {
            "message": "Avoid using inline styles for components. Use styled components instead.",
            "propName": "sx"
          },
          {
            "message": "Use data-testid instead.",
            "propName": "data-testId"
          }
        ]
      }
    ],
    "react/forbid-dom-props": [
      "warn",
      {
        "forbid": [
          {
            "message": "Avoid using inline styles for components. Use styled components instead.",
            "propName": "style"
          }
        ]
      }
    ],
    "react/jsx-filename-extension": [
      "error",
      {
        "extensions": [
          ".ts",
          ".tsx"
        ]
      }
    ],
    "react/jsx-key": [
      "error"
    ],
    "react/jsx-props-no-spreading": "off",
    "react/jsx-sort-props": [
      "error",
      {
        "callbacksLast": true,
        "ignoreCase": true,
        "noSortAlphabetically": false,
        "reservedFirst": true,
        "shorthandFirst": false,
        "shorthandLast": true
      }
    ],
    "react/react-in-jsx-scope": "off",
    "simple-import-sort/exports": "error",
    "simple-import-sort/imports": "error",
    "unused-imports/no-unused-imports-ts": "error",
    "no-debugger": "error",
    "testing-library/no-node-access": "warn",
    "testing-library/prefer-find-by": "off"
  }
}