diff --git a/packages/eslint-plugin-pf-codemods/src/ruleCustomization.ts b/packages/eslint-plugin-pf-codemods/src/ruleCustomization.ts index b7e524ff2..5bd9d29fb 100644 --- a/packages/eslint-plugin-pf-codemods/src/ruleCustomization.ts +++ b/packages/eslint-plugin-pf-codemods/src/ruleCustomization.ts @@ -1,6 +1,7 @@ // if you want your rule to only run when explicitly called for using the --only flag, add the rule name to the below array export const betaRuleNames: string[] = [ "checkbox-radio-replace-isLabelBeforeButton", + "formGroup-rename-labelIcon", "menuItemAction-warn-update-markup", "menuToggle-warn-iconOnly-toggle", ]; diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.md b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.md new file mode 100644 index 000000000..038021e16 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.md @@ -0,0 +1,17 @@ +### formGroup-rename-labelIcon [(#10016)](https://github.com/patternfly/patternfly-react/pull/10016) + +The `labelIcon` prop for FormGroup has been renamed to `labelHelp`. We recommend using FormGroupLabelHelp element for the labelHelp prop. The markup has also changed, we now wrap the labelHelp element in ``, so there is no need to add `className="pf-v6-c-form__group-label-help"` to the labelHelp element. + +#### Examples + +In: + +```jsx +%inputExample% +``` + +Out: + +```jsx +%outputExample% +``` diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.test.ts b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.test.ts new file mode 100644 index 000000000..a9d58a721 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.test.ts @@ -0,0 +1,25 @@ +const ruleTester = require("../../ruletester"); +import * as rule from "./formGroup-rename-labelIcon"; + +ruleTester.run("formGroup-rename-labelIcon", rule, { + valid: [ + { + code: ``, + }, + { + code: `import { FormGroup } from '@patternfly/react-core'; `, + }, + ], + invalid: [ + { + code: `import { FormGroup } from '@patternfly/react-core'; Help icon} />`, + output: `import { FormGroup } from '@patternfly/react-core'; Help icon} />`, + errors: [ + { + message: `The \`labelIcon\` prop for FormGroup has been renamed to \`labelHelp\`. We recommend using FormGroupLabelHelp element for the labelHelp prop. The markup has also changed, we now wrap the labelHelp element in \`\`, so there is no need to add \`className="pf-v6-c-form__group-label-help"\` to the labelHelp element.`, + type: "JSXOpeningElement", + }, + ], + }, + ], +}); diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.ts b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.ts new file mode 100644 index 000000000..577341dd8 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroup-rename-labelIcon.ts @@ -0,0 +1,14 @@ +import { renameProps } from "../../helpers"; + +// https://github.com/patternfly/patternfly-react/pull/10016 +module.exports = { + meta: { fixable: "code" }, + create: renameProps({ + FormGroup: { + labelIcon: { + newName: "labelHelp", + message: `The \`labelIcon\` prop for FormGroup has been renamed to \`labelHelp\`. We recommend using FormGroupLabelHelp element for the labelHelp prop. The markup has also changed, we now wrap the labelHelp element in \`\`, so there is no need to add \`className="pf-v6-c-form__group-label-help"\` to the labelHelp element.`, + }, + }, + }), +}; diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconInput.tsx b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconInput.tsx new file mode 100644 index 000000000..d9968d41f --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconInput.tsx @@ -0,0 +1,5 @@ +import { FormGroup } from "@patternfly/react-core"; + +export const FormGroupRenameLabelIconInput = () => ( + Help icon} /> +); diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconOutput.tsx b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconOutput.tsx new file mode 100644 index 000000000..050928d9d --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/formGroupRenameLabelIcon/formGroupRenameLabelIconOutput.tsx @@ -0,0 +1,5 @@ +import { FormGroup } from "@patternfly/react-core"; + +export const FormGroupRenameLabelIconInput = () => ( + Help icon} /> +);