cover disallowedForPatterns option with tests and implement

Author: Efimenko

lib/rules/forbid-component-props.js

@@ -177,6 +177,7 @@ module.exports = {
         allowList: typeof value === 'string' ? [] : (value.allowedFor || []),
         allowPatternList: typeof value === 'string' ? [] : value.allowedForPatterns || [],
         disallowList: typeof value === 'string' ? [] : (value.disallowedFor || []),
+        disallowPatternList: typeof value === 'string' ? [] : value.disallowedForPatterns || [],
         message: typeof value === 'string' ? null : value.message,
         isPattern: !!value.propNamePattern,
       };
@@ -201,6 +202,10 @@ module.exports = {
         return false;
       }
 
+      function checkIsTagForbiddenByAllowList() {
+        return options.allowList.indexOf(tagName) === -1;
+      }
+
       function checkIsTagForbiddenByAllowPatternList() {
         if (options.allowPatternList.length === 0) {
           return true;
@@ -211,17 +216,33 @@ module.exports = {
         );
       }
 
-      function checkIsTagForbiddenByAllowList() {
-        return options.allowList.indexOf(tagName) === -1;
+      function checkIsTagForbiddenByAllowOptions() {
+        return checkIsTagForbiddenByAllowList() && checkIsTagForbiddenByAllowPatternList();
       }
 
-      function checkIsTagForbiddenByAllowOptions() {
-        return checkIsTagForbiddenByAllowPatternList() && checkIsTagForbiddenByAllowList();
+      function checkIsTagForbiddenByDisallowList() {
+        return options.disallowList.indexOf(tagName) !== -1;
       }
 
+      function checkIsTagForbiddenByDisallowPatternList() {
+        if (options.disallowPatternList.length === 0) {
+          return false;
+        }
+
+        return options.disallowPatternList.some(
+          (pattern) => minimatch(tagName, pattern)
+        );
+      }
+
+      function checkIsTagForbiddenByDisallowOptions() {
+        return checkIsTagForbiddenByDisallowList() || checkIsTagForbiddenByDisallowPatternList();
+      }
+
+      const hasDisallowOptions = options.disallowList.length > 0 || options.disallowPatternList.length > 0;
+
       // disallowList should have a least one item (schema configuration)
-      const isTagForbidden = options.disallowList.length > 0
-        ? options.disallowList.indexOf(tagName) !== -1
+      const isTagForbidden = hasDisallowOptions
+        ? checkIsTagForbiddenByDisallowOptions()
         : checkIsTagForbiddenByAllowOptions();
 
       // if the tagName is undefined (`<this.something>`), we assume it's a forbidden element

tests/lib/rules/forbid-component-props.js

@@ -298,6 +298,30 @@ ruleTester.run('forbid-component-props', rule, {
         },
       ],
     },
+    {
+      code: `
+        const rootElement = (
+          <Root>
+            <SomeIcon className="size-lg" />
+            <AnotherIcon className="size-lg" />
+            <SomeSvg className="size-lg" />
+            <UICard className="size-lg" />
+            <UIButton className="size-lg" />
+          </Root>
+        );
+      `,
+      options: [
+        {
+          forbid: [
+            {
+              propName: 'className',
+              disallowedFor: ['Modal'],
+              disallowedForPatterns: ['*Legacy', 'Shared*'],
+            },
+          ],
+        },
+      ],
+    },
   ]),
 
   invalid: parsers.all([
@@ -797,5 +821,56 @@ ruleTester.run('forbid-component-props', rule, {
         },
       ],
     },
+    {
+      code: `
+        const rootElement = (
+          <Root>
+            <SomeIcon className="size-lg" />
+            <AnotherIcon className="size-lg" />
+            <SomeSvg className="size-lg" />
+            <UICard className="size-lg" />
+            <ButtonLegacy className="size-lg" />
+          </Root>
+        );
+      `,
+      options: [
+        {
+          forbid: [
+            {
+              propName: 'className',
+              disallowedFor: ['SomeSvg'],
+              disallowedForPatterns: ['UI*', '*Icon'],
+              message: 'Avoid using className for SomeSvg and components that match the `UI*` and `*Icon` patterns',
+            },
+          ],
+        },
+      ],
+      errors: [
+        {
+          message: 'Avoid using className for SomeSvg and components that match the `UI*` and `*Icon` patterns',
+          line: 4,
+          column: 23,
+          type: 'JSXAttribute',
+        },
+        {
+          message: 'Avoid using className for SomeSvg and components that match the `UI*` and `*Icon` patterns',
+          line: 5,
+          column: 26,
+          type: 'JSXAttribute',
+        },
+        {
+          message: 'Avoid using className for SomeSvg and components that match the `UI*` and `*Icon` patterns',
+          line: 6,
+          column: 22,
+          type: 'JSXAttribute',
+        },
+        {
+          message: 'Avoid using className for SomeSvg and components that match the `UI*` and `*Icon` patterns',
+          line: 7,
+          column: 21,
+          type: 'JSXAttribute',
+        },
+      ],
+    },
   ]),
 });