[Fix]: destructuring-assignment, Components: improve component detection

Author: vedadeepta

lib/util/Components.js

@@ -651,6 +651,8 @@ function componentRule(rule, context) {
           return undefined;
         }
         if (utils.isInAllowedPositionForComponent(node) && utils.isReturningJSXOrNull(node)) {
+          if (utils.isArrowOrFunctionExpressionRenderWithParams(node)) return undefined;
+
           const isMethod = node.parent.type === 'Property' && node.parent.method;
 
           if (isMethod && !isFirstLetterCapitalized(node.parent.key.name)) {
@@ -798,6 +800,17 @@ function componentRule(rule, context) {
 
       // Return the component
       return components.add(componentNode, 1);
+    },
+
+    isArrowOrFunctionExpressionRenderWithParams(node) {
+      return (
+        node.parent
+        && node.parent.key
+        && node.parent.key.type === 'Identifier'
+        && node.parent.key.name === 'render'
+        // react render function cannot have params
+        && !!(node.params || []).length
+      );
     }
   };
 
@@ -846,6 +859,7 @@ function componentRule(rule, context) {
         components.add(node, 0);
         return;
       }
+
       const component = utils.getParentComponent();
       if (
         !component
@@ -863,6 +877,7 @@ function componentRule(rule, context) {
         components.add(node, 0);
         return;
       }
+
       node = utils.getParentComponent();
       if (!node) {
         return;
@@ -875,7 +890,9 @@ function componentRule(rule, context) {
         components.add(node, 0);
         return;
       }
+
       const component = utils.getParentComponent();
+
       if (
         !component
         || (component.parent && component.parent.type === 'JSXExpressionContainer')

tests/lib/rules/destructuring-assignment.js

@@ -196,6 +196,43 @@ ruleTester.run('destructuring-assignment', rule, {
        },
       };
      `
+  }, {
+    code: `
+      const columns = [
+        {
+          render: (val) => {
+            if (val.url) {
+              return (
+                <a href={val.url}>
+                  {val.test}
+                </a>
+              );
+            }
+            return null;
+          },
+        },
+      ];
+    `
+  }, {
+    code: `
+      const columns = [
+        {
+          render: val => <span>{val}</span>,
+        },
+        {
+          render: function(val) {
+            if (val.url) {
+              return (
+                <a href={val.url}>
+                  {val.test}
+                </a>
+              );
+            }
+            return null;
+          },
+        },
+      ];
+    `
   }],
 
   invalid: [{