To avoid possible infinite useEffect loops, we can add react-hooks/exhaustive-deps rule. Details »

The eslint peer dependency version should be updated. It is currently at 6.1.0.

npm WARN [email protected] requires a peer of eslint@^4.0.0 but none is installed. You must install peer dependencies yourself.

I'm not sure about this but I think this rule is too much.
CC: @burakguneli @bilgeyucel @mucahit

This rule enforces me to destructure when I don't need to and its annoying.
CC: @burakguneli @bilgeyucel @mucahit

 "react/sort-comp": [2, {
      order: [
        'static-methods',
        'instance-variables',
        'getters',
        'setters',
        'lifecycle',
        'everything-else',
        'rendering',
      ],
      groups: {
          "rendering": [
            "render",
            "/^render.+$/",
          ]
      }
    }]

CC: @mucahit @burakguneli @bilgeyucel

Currently, it raises an error but I can see places where calling setState inside componentDidUpdate to be okay as in comparing for the prevProps and then updating the state when necessary.
CC: @mucahit @burakguneli @bilgeyucel

What do you think about removing this rule?
cc: @burakguneli @mucahit @bilgeyucel

We need to add a rule to force wrap strings with curly braces in JSX/TSX files.

Maybe prettier does that, let's do some research.

Expected behavior

✅This should be valid

<Button text={"Click Me"}/>

<span>{"Ready"}</span>

❌This shouldn't be valid

<Button text="Click Me"/>

<span>Ready</span>

The following rules can be disabled since we use React 17.x.x+

If you are using eslint-plugin-react, the react/jsx-uses-react and react/react-in-jsx-scope rules are no longer necessary and can be turned off or removed.

For projects with React 17+, we don't need to explicitly import React from react anymore

Source: https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#eslint

  "react/jsx-uses-react": "off",
  "react/react-in-jsx-scope": "off"

"devDependencies": {
    "eslint": "^5.6.0",
    "eslint-config-hipo-base": "github:Hipo/eslint-config-hipo-base",
    "eslint-config-hipo-react": "github:Hipo/eslint-config-hipo-react",
    "eslint-plugin-react": "^7.12.4"
  }

"eslintConfig": {
    "extends": [
      "eslint-config-hipo-base",
      "eslint-config-hipo-react"
    ],
    "env": {
      "browser": true,
      "node": true
    }
  }

But I get a ton of errors related to what's in the title. Attached is a sample output.
sample.txt

The following rule should be updated to allow JSX inside tsx files:

    "react/jsx-filename-extension": [1, {
      "extensions": [".jsx", ".tsx"]
    }]