Merge branch 'new_rule-jsx-no-leaked-zero' of https://github.com/Belco90/eslint-plugin-react into new_rule-jsx-no-leaked-zero

Author: Belco90

CHANGELOG.md

@@ -9,6 +9,7 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
 * [`destructuring-assignment`]: add option `destructureInSignature` ([#3235][] @golopot)
 * [`no-unknown-property`]: Allow crossOrigin on image tag (SVG) ([#3251][] @zpao)
 * [`jsx-tag-spacing`]: Add `multiline-always` option ([#3260][] @Nokel81)
+* [`function-component-definition`]: replace `var` by `const` in certain situations ([#3248][] @JohnBerd @SimeonC)
 
 ### Fixed
 * [`hook-use-state`]: Allow UPPERCASE setState setter prefixes ([#3244][] @duncanbeevers)
@@ -24,7 +25,9 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
 * [Refactor] improve performance for detecting class components ([#3267][] @golopot)
 * [Refactor] [`no-deprecated`]: improve performance ([#3271][] @golopot)
 * [Refactor] [`no-did-mount-set-state`], [`no-did-update-set-state`], [`no-will-update-set-state`]: improve performance ([#3272][] @golopot)
+* [Refactor] improve performance by avoiding unnecessary `Components.detect` ([#3273][] @golopot)
 
+[#3273]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3273
 [#3272]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3272
 [#3271]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3271
 [#3267]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3267
@@ -36,6 +39,7 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
 [#3258]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3258
 [#3254]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3254
 [#3251]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3251
+[#3248]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3248
 [#3244]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3244
 [#3235]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3235
 [#3230]: https://github.com/jsx-eslint/eslint-plugin-react/issues/3230

docs/rules/function-component-definition.md

@@ -12,12 +12,12 @@ Examples of **incorrect** code for this rule:
 
 ```jsx
 // function expression for named component
-var Component = function (props) {
+const Component = function (props) {
   return <div>{props.content}</div>;
 };
 
 // arrow function for named component
-var Component = (props) => {
+const Component = (props) => {
   return <div>{props.content}</div>;
 };
 
@@ -49,11 +49,11 @@ Examples of **incorrect** code for this rule:
 ```jsx
 // only function declarations for named components
 // [2, { "namedComponents": "function-declaration" }]
-var Component = function (props) {
+const Component = function (props) {
   return <div />;
 };
 
-var Component = (props) => {
+const Component = (props) => {
   return <div />;
 };
 
@@ -63,7 +63,7 @@ function Component (props) {
   return <div />;
 };
 
-var Component = (props) => {
+const Component = (props) => {
   return <div />;
 };
 
@@ -73,7 +73,7 @@ function Component (props) {
   return <div />;
 };
 
-var Component = function (props) {
+const Component = function (props) {
   return <div />;
 };
 
@@ -107,13 +107,13 @@ function Component (props) {
 
 // only function expressions for named components
 // [2, { "namedComponents": "function-expression" }]
-var Component = function (props) {
+const Component = function (props) {
   return <div />;
 };
 
 // only arrow functions for named components
 // [2, { "namedComponents": "arrow-function" }]
-var Component = (props) => {
+const Component = (props) => {
   return <div />;
 };
 
@@ -170,11 +170,11 @@ The following patterns can **not** be autofixed in TypeScript:
 ```tsx
 // function expressions and arrow functions that have type annotations cannot be autofixed to function declarations
 // [2, { "namedComponents": "function-declaration" }]
-var Component: React.FC<Props> = function (props) {
+const Component: React.FC<Props> = function (props) {
   return <div />;
 };
 
-var Component: React.FC<Props> = (props) => {
+const Component: React.FC<Props> = (props) => {
   return <div />;
 };
 
@@ -184,7 +184,7 @@ function Component<T>(props: Props<T>) {
   return <div />;
 };
 
-var Component = function <T>(props: Props<T>) {
+const Component = function <T>(props: Props<T>) {
   return <div />;
 };
 
@@ -203,13 +203,13 @@ The following patterns can be autofixed in TypeScript:
 ```tsx
 // autofix to function expression with type annotation
 // [2, { "namedComponents": "function-expression" }]
-var Component: React.FC<Props> = (props) => {
+const Component: React.FC<Props> = (props) => {
   return <div />;
 };
 
 // autofix to arrow function with type annotation
 // [2, { "namedComponents": "function-expression" }]
-var Component: React.FC<Props> = function (props) {
+const Component: React.FC<Props> = function (props) {
   return <div />;
 };
 
@@ -219,7 +219,7 @@ function Component<T extends {}>(props: Props<T>) {
   return <div />;
 }
 
-var Component = function <T extends {}>(props: Props<T>) {
+const Component = function <T extends {}>(props: Props<T>) {
   return <div />;
 };
 
@@ -229,7 +229,7 @@ function Component<T1, T2>(props: Props<T1, T2>) {
   return <div />;
 }
 
-var Component = function <T1, T2>(props: Props<T2>) {
+const Component = function <T1, T2>(props: Props<T2>) {
   return <div />;
 };
 

lib/rules/display-name.js

@@ -9,6 +9,7 @@ const values = require('object.values');
 
 const Components = require('../util/Components');
 const astUtil = require('../util/ast');
+const componentUtil = require('../util/componentUtil');
 const docsUrl = require('../util/docsUrl');
 const propsUtil = require('../util/props');
 const report = require('../util/report');
@@ -106,7 +107,7 @@ module.exports = {
         astUtil.isFunctionLikeExpression(node)
         && node.parent
         && (node.parent.type === 'VariableDeclarator' || node.parent.type === 'Property' || node.parent.method === true)
-        && (!node.parent.parent || !utils.isES5Component(node.parent.parent))
+        && (!node.parent.parent || !componentUtil.isES5Component(node.parent.parent, context))
       );
 
       if (
@@ -192,7 +193,7 @@ module.exports = {
       },
 
       ObjectExpression(node) {
-        if (!utils.isES5Component(node)) {
+        if (!componentUtil.isES5Component(node, context)) {
           return;
         }
         if (ignoreTranspilerName || !hasTranspilerName(node)) {