diff --git a/packages/eslint-plugin-pf-codemods/lib/rules/v5/selectDropdown-rename-itemId.js b/packages/eslint-plugin-pf-codemods/lib/rules/v5/selectDropdown-rename-itemId.js new file mode 100644 index 000000000..ce905f6a5 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/lib/rules/v5/selectDropdown-rename-itemId.js @@ -0,0 +1,39 @@ +const { getFromPackage, renamePropsOnNode } = require("../../helpers"); +const renames = { + SelectOption: { + itemId: { + newName: "value", + message: (node) => + `itemId prop for ${node?.name?.name} has been renamed to value`, + }, + }, + DropdownItem: { + itemId: { + newName: "value", + message: (node) => + `itemId prop for ${node?.name?.name} has been renamed to value`, + }, + }, +}; + +// https://github.com/patternfly/patternfly-react/pull/9175 +module.exports = { + meta: { fixable: "code" }, + create: function (context) { + const { imports: coreImports } = getFromPackage( + context, + "@patternfly/react-core" + ); + const selectAndDropdownImports = coreImports.filter((imp) => + ["SelectOption", "DropdownItem"].includes(imp.imported?.name) + ); + + return !selectAndDropdownImports.length + ? {} + : { + JSXOpeningElement(node) { + renamePropsOnNode(context, selectAndDropdownImports, node, renames); + }, + }; + }, +}; diff --git a/packages/eslint-plugin-pf-codemods/test/rules/v5/selectDropdown-rename-itemId.js b/packages/eslint-plugin-pf-codemods/test/rules/v5/selectDropdown-rename-itemId.js new file mode 100644 index 000000000..e36249ee1 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/test/rules/v5/selectDropdown-rename-itemId.js @@ -0,0 +1,91 @@ +const ruleTester = require("../../ruletester"); +const rule = require("../../../lib/rules/v5/selectDropdown-rename-itemId"); + +ruleTester.run("selectDropdown-rename-itemId", rule, { + valid: [ + { + code: `import { SelectOption } from '@patternfly/react-core'; `, + }, + { + code: `import { SelectOption } from '@patternfly/react-core'; `, + }, + { + code: `import { DropdownItem } from '@patternfly/react-core'; `, + }, + { + code: `import { DropdownItem } from '@patternfly/react-core'; `, + }, + { + // No @patternfly/react-core import + code: ``, + }, + { + // No @patternfly/react-core import + code: ``, + }, + ], + invalid: [ + { + code: `import { SelectOption } from '@patternfly/react-core'; `, + output: `import { SelectOption } from '@patternfly/react-core'; `, + errors: [ + { + message: `itemId prop for SelectOption has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + { + code: `import { DropdownItem } from '@patternfly/react-core'; `, + output: `import { DropdownItem } from '@patternfly/react-core'; `, + errors: [ + { + message: `itemId prop for DropdownItem has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + // Import from dist + { + code: `import { SelectOption } from '@patternfly/react-core/dist/esm/components/Select/index.js'; `, + output: `import { SelectOption } from '@patternfly/react-core/dist/esm/components/Select/index.js'; `, + errors: [ + { + message: `itemId prop for SelectOption has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + { + code: `import { DropdownItem } from '@patternfly/react-core/dist/esm/components/Dropdown/index.js'; `, + output: `import { DropdownItem } from '@patternfly/react-core/dist/esm/components/Dropdown/index.js'; `, + errors: [ + { + message: `itemId prop for DropdownItem has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + // Aliased import + { + code: `import { SelectOption as PFSO } from '@patternfly/react-core'; `, + output: `import { SelectOption as PFSO } from '@patternfly/react-core'; `, + errors: [ + { + message: `itemId prop for PFSO has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + { + code: `import { DropdownItem as PFDI } from '@patternfly/react-core'; `, + output: `import { DropdownItem as PFDI } from '@patternfly/react-core'; `, + errors: [ + { + message: `itemId prop for PFDI has been renamed to value`, + type: "JSXOpeningElement", + }, + ], + }, + ], +}); diff --git a/packages/pf-codemods/README.md b/packages/pf-codemods/README.md index ef20d3ad6..09e162031 100644 --- a/packages/pf-codemods/README.md +++ b/packages/pf-codemods/README.md @@ -2409,6 +2409,26 @@ import { ; ``` +### selectDropdown-rename-itemId [(#9175)](https://github.com/patternfly/patternfly-react/pull/9175) + +The `itemId` prop for our new implementation of SelectOption and DropdownItem has been renamed to `value`. + +#### Examples + +In: + +```jsx + + +``` + +Out: + +```jsx + + +``` + ### simpleList-remove-isCurrent [(#8132)](https://github.com/patternfly/patternfly-react/pull/8132) We've removed the deprecated the `isCurrent` prop. This rule wil replace it with `isActive`. diff --git a/test/test.tsx b/test/test.tsx index d681540e9..1cec1fbe0 100644 --- a/test/test.tsx +++ b/test/test.tsx @@ -111,6 +111,7 @@ import { SelectOption, WizardBody as WizardBodyNext, WizardFooter, + DropdownItem as NextDropdownItem, } from "@patternfly/react-core/next"; import { Table, @@ -251,6 +252,7 @@ const alertVariantOption = AlertVariant.default;