feat(Banner): added color and status props (#649)

* feat(Banner): added color and status props

* PR feedback

packages/eslint-plugin-pf-codemods/src/rules/v6/bannerReplaceVariantProp/banner-replace-variantProp.md

@@ -0,0 +1,19 @@
+### banner-replace-variantProp [(#9891)](https://github.com/patternfly/patternfly-react/pull/9891)
+
+The `variant` property has been removed from Banner. We recommend using our new `color` or `status` properties, depending on the original intent of the `variant` property.
+
+Running the fix for this rule will either replace the `variant` property with the `color` property, or remove the `variant` property entirely, but additional updates may need to be made.
+
+#### Examples
+
+In:
+
+```jsx
+%inputExample%
+```
+
+Out:
+
+```jsx
+%outputExample%
+```

packages/eslint-plugin-pf-codemods/src/rules/v6/bannerReplaceVariantProp/banner-replace-variantProp.test.ts

@@ -0,0 +1,82 @@
+const ruleTester = require("../../ruletester");
+import * as rule from "./banner-replace-variantProp";
+
+const createErrorMessage = (hasValueOfDefault?: boolean) =>
+  `The variant property has been removed from Banner. We recommend using our new color or status properties, depending on the original intent of the variant property. Running the fix for this rule will ${
+    hasValueOfDefault
+      ? "remove the variant property"
+      : "replace the variant property with the color property"
+  }, but additional manual updates may need to be made.`;
+
+ruleTester.run("banner-replace-variantProp", rule, {
+  valid: [
+    {
+      code: `<Banner variant />`,
+    },
+    {
+      code: `import { Banner } from '@patternfly/react-core'; <Banner />`,
+    },
+  ],
+  invalid: [
+    {
+      code: `import { Banner } from '@patternfly/react-core'; <Banner variant="default" />`,
+      output: `import { Banner } from '@patternfly/react-core'; <Banner  />`,
+      errors: [
+        {
+          message: createErrorMessage(true),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+    {
+      code: `import { Banner } from '@patternfly/react-core'; <Banner variant="red" />`,
+      output: `import { Banner } from '@patternfly/react-core'; <Banner color="red" />`,
+      errors: [
+        {
+          message: createErrorMessage(),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+    {
+      code: `import { Banner as CustomBanner } from '@patternfly/react-core'; <CustomBanner variant="default" />`,
+      output: `import { Banner as CustomBanner } from '@patternfly/react-core'; <CustomBanner  />`,
+      errors: [
+        {
+          message: createErrorMessage(true),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+    {
+      code: `import { Banner } from '@patternfly/react-core/dist/esm/components/Banner/index.js'; <Banner variant="default" />`,
+      output: `import { Banner } from '@patternfly/react-core/dist/esm/components/Banner/index.js'; <Banner  />`,
+      errors: [
+        {
+          message: createErrorMessage(true),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+    {
+      code: `import { Banner } from '@patternfly/react-core/dist/js/components/Banner/index.js'; <Banner variant="default" />`,
+      output: `import { Banner } from '@patternfly/react-core/dist/js/components/Banner/index.js'; <Banner  />`,
+      errors: [
+        {
+          message: createErrorMessage(true),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+    {
+      code: `import { Banner } from '@patternfly/react-core/dist/dynamic/components/Banner/index.js'; <Banner variant="default" />`,
+      output: `import { Banner } from '@patternfly/react-core/dist/dynamic/components/Banner/index.js'; <Banner  />`,
+      errors: [
+        {
+          message: createErrorMessage(true),
+          type: "JSXOpeningElement",
+        },
+      ],
+    },
+  ],
+});

packages/eslint-plugin-pf-codemods/src/rules/v6/bannerReplaceVariantProp/banner-replace-variantProp.ts

@@ -0,0 +1,51 @@
+import { Rule } from "eslint";
+import { JSXOpeningElement } from "estree-jsx";
+import { getFromPackage, getAttribute, getAttributeValue } from "../../helpers";
+
+// https://github.com/patternfly/patternfly-react/pull/9891
+module.exports = {
+  meta: { fixable: "code" },
+  create: function (context: Rule.RuleContext) {
+    const { imports } = getFromPackage(context, "@patternfly/react-core");
+
+    const bannerImport = imports.find(
+      (specifier) => specifier.imported.name === "Banner"
+    );
+
+    return !bannerImport
+      ? {}
+      : {
+          JSXOpeningElement(node: JSXOpeningElement) {
+            if (
+              node.name.type === "JSXIdentifier" &&
+              bannerImport.local.name === node.name.name
+            ) {
+              const attribute = getAttribute(node, "variant");
+              if (!attribute) {
+                return;
+              }
+              const attributeValue = getAttributeValue(
+                context,
+                attribute.value
+              );
+              const isValueDefault = attributeValue === "default";
+              const fixMessage = isValueDefault
+                ? "remove the variant property"
+                : "replace the variant property with the color property";
+
+              context.report({
+                node,
+                message: `The variant property has been removed from Banner. We recommend using our new color or status properties, depending on the original intent of the variant property. Running the fix for this rule will ${fixMessage}, but additional manual updates may need to be made.`,
+                fix(fixer) {
+                  if (isValueDefault) {
+                    return fixer.replaceText(attribute, "");
+                  }
+
+                  return fixer.replaceText(attribute.name, "color");
+                },
+              });
+            }
+          },
+        };
+  },
+};

packages/eslint-plugin-pf-codemods/src/rules/v6/bannerReplaceVariantProp/bannerReplaceVariantPropInput.tsx

@@ -0,0 +1,8 @@
+import { Banner } from "@patternfly/react-core";
+
+export const BannerReplaceVariantPropInput = () => (
+  <>
+    <Banner variant='default' />
+    <Banner variant='red' />
+  </>
+);

packages/eslint-plugin-pf-codemods/src/rules/v6/bannerReplaceVariantProp/bannerReplaceVariantPropOutput.tsx

@@ -0,0 +1,8 @@
+import { Banner } from "@patternfly/react-core";
+
+export const BannerReplaceVariantPropInput = () => (
+  <>
+    <Banner  />
+    <Banner color='red' />
+  </>
+);