From b0824f6c7c69cdf7d70d831626be37f606d70f73 Mon Sep 17 00:00:00 2001
From: Jonathan Fuchs <jfuchs@github.com>
Date: Mon, 15 Nov 2021 09:11:09 -0800
Subject: [PATCH] Updates no-system-props rule to always exclude the 'variant'
 prop no matter which component.

---
 .changeset/orange-tools-begin.md            |  5 +++++
 src/rules/__tests__/no-system-props.test.js |  3 ++-
 src/rules/no-system-props.js                | 12 ++++++------
 3 files changed, 13 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/orange-tools-begin.md

diff --git a/.changeset/orange-tools-begin.md b/.changeset/orange-tools-begin.md
new file mode 100644
index 00000000..9995cb76
--- /dev/null
+++ b/.changeset/orange-tools-begin.md
@@ -0,0 +1,5 @@
+---
+'eslint-plugin-primer-react': minor
+---
+
+Updates no-system-props rule to always exclude the 'variant' prop no matter which component.
diff --git a/src/rules/__tests__/no-system-props.test.js b/src/rules/__tests__/no-system-props.test.js
index 56ebb5a6..5053fe05 100644
--- a/src/rules/__tests__/no-system-props.test.js
+++ b/src/rules/__tests__/no-system-props.test.js
@@ -18,7 +18,8 @@ ruleTester.run('no-system-props', rule, {
     `import {Button} from '@primer/components'; <Button someOtherProp="foo" />`,
     `import {Box} from '@primer/components'; <Box width={200} />`,
     `import {ProgressBar} from '@primer/components'; <ProgressBar bg="howdy" />`,
-    `import {Button} from '@primer/components'; <Button {...someExpression()} />`
+    `import {Button} from '@primer/components'; <Button {...someExpression()} />`,
+    `import {Button} from '@primer/components'; <Button variant="large" />`
   ],
   invalid: [
     {
diff --git a/src/rules/no-system-props.js b/src/rules/no-system-props.js
index 91ae0b41..a76a6b11 100644
--- a/src/rules/no-system-props.js
+++ b/src/rules/no-system-props.js
@@ -15,13 +15,13 @@ const excludedComponentProps = new Map([
   ['AnchoredOverlay', new Set(['width', 'height'])],
   ['Avatar', new Set(['size'])],
   ['Dialog', new Set(['width', 'height'])],
-  ['Flash', new Set(['variant'])],
-  ['Label', new Set(['variant'])],
   ['ProgressBar', new Set(['bg'])],
   ['Spinner', new Set(['size'])],
   ['StyledOcticon', new Set(['size'])]
 ])
 
+const alwaysExcludedProps = new Set(['variant'])
+
 module.exports = {
   meta: {
     type: 'suggestion',
@@ -65,12 +65,12 @@ module.exports = {
         // Create an array of system prop attribute nodes
         let systemProps = Object.values(pick(propsByNameObject))
 
+        let excludedProps = excludedComponentProps.has(jsxNode.name.name)
+          ? new Set([...alwaysExcludedProps, ...excludedComponentProps.get(jsxNode.name.name)])
+          : alwaysExcludedProps
+
         // Filter out our exceptional props
         systemProps = systemProps.filter(prop => {
-          const excludedProps = excludedComponentProps.get(jsxNode.name.name)
-          if (!excludedProps) {
-            return true
-          }
           return !excludedProps.has(prop.name.name)
         })