Skip to content

Commit

Permalink
chore(masthead): Improve codemod error messages
Browse files Browse the repository at this point in the history
  • Loading branch information
@wise-king-sullyman
wise-king-sullyman committed Aug 13, 2024
1 parent 83cfbc4 commit b892ff8
Show file tree
Hide file tree
Showing 2 changed files with 64 additions and 34 deletions.
58 changes: 34 additions & 24 deletions ...ugin-pf-codemods/src/rules/v6/mastheadStructureChanges/masthead-structure-changes.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,62 +3,72 @@ import * as rule from "./masthead-structure-changes";

ruleTester.run("masthead-structure-changes", rule, {
valid: [
// no pf import and has NOT had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `<Masthead />`,
code: `<Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand>Bar</MastheadBrand></MastheadMain></Masthead>`,
},
// no pf import and has had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead } from '@patternfly/react-core'; <Masthead someOtherProp />`,
code: `<Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadLogo>Bar</MastheadLogo></MastheadMain></Masthead>`,
},
//toggle already wrapped in MastheadMain and brand double wrapped with data-codemods on the top level, has NOT had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadBrand, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadBrand>Bar</MastheadBrand></MastheadBrand></MastheadMain></Masthead>`,
},
// toggle already wrapped in MastheadMain and logo wrapped in a brand with data-codemods, has had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
},
],
invalid: [
// stage one of a pre-renamed file
// stage one of a file that has NOT had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadBrand, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand>Bar</MastheadBrand></MastheadMain></Masthead>`,
output: `import { Masthead, MastheadBrand, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand>Bar</MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, the PF5 MastheadBrand has been renamed to MastheadLogo (this renaming is handled by our masthead-name-changes codemod) and should now be wrapped in a new MastheadBrand.`,
type: "JSXOpeningElement",
},
],
},
// stage two of a pre-renamed file
// stage two of a file that has NOT had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadBrand, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand>Bar</MastheadBrand></MastheadMain></Masthead>`,
output: `import { Masthead, MastheadBrand, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadBrand>Bar</MastheadBrand></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, the PF5 MastheadBrand has been renamed to MastheadLogo (this renaming is handled by our masthead-name-changes codemod) and should now be wrapped in a new MastheadBrand.`,
type: "JSXOpeningElement",
},
],
},
// stage one of a post-renamed file
// stage one of a file that has had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle } from '@patternfly/react-core'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadLogo>Bar</MastheadLogo></MastheadMain></Masthead>`,
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadLogo should now be wrapped in MastheadBrand.`,
type: "JSXOpeningElement",
},
],
},
// stage two of a post-renamed file
// stage two of a file that has had MastheadBrand renamed to MastheadLogo by the masthead-name-changes codemod
{
code: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -69,11 +79,11 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead as MH, MastheadBrand as MB, MastheadMain as MM, MastheadToggle as MT } from '@patternfly/react-core'; <MH><MM><MT>Foo</MT><MB>Bar</MB></MM></MH>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, the PF5 MastheadBrand has been renamed to MastheadLogo (this renaming is handled by our masthead-name-changes codemod) and should now be wrapped in a new MastheadBrand.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -83,7 +93,7 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead as MH, MastheadBrand as MB, MastheadMain as MM, MastheadToggle as MT } from '@patternfly/react-core'; <MH><MM><MT>Foo</MT><MB data-codemods><MB>Bar</MB></MB></MM></MH>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, the PF5 MastheadBrand has been renamed to MastheadLogo (this renaming is handled by our masthead-name-changes codemod) and should now be wrapped in a new MastheadBrand.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -94,11 +104,11 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/esm/components/Masthead'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadLogo should now be wrapped in MastheadBrand.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -108,7 +118,7 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/esm/components/Masthead'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -118,11 +128,11 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/js/components/Masthead'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadLogo should now be wrapped in MastheadBrand.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -132,7 +142,7 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/js/components/Masthead'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -142,11 +152,11 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/dynamic/components/Masthead'; <Masthead><MastheadToggle>Foo</MastheadToggle><MastheadMain><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadLogo should now be wrapped in MastheadBrand.`,
type: "JSXOpeningElement",
},
],
Expand All @@ -156,7 +166,7 @@ ruleTester.run("masthead-structure-changes", rule, {
output: `import { Masthead, MastheadLogo, MastheadMain, MastheadToggle, MastheadBrand } from '@patternfly/react-core/dist/dynamic/components/Masthead'; <Masthead><MastheadMain><MastheadToggle>Foo</MastheadToggle><MastheadBrand data-codemods><MastheadLogo>Bar</MastheadLogo></MastheadBrand></MastheadMain></Masthead>`,
errors: [
{
message: `The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.`,
message: `The structure of Masthead has been updated, MastheadToggle should now be wrapped in MastheadMain.`,
type: "JSXOpeningElement",
},
],
Expand Down
40 changes: 30 additions & 10 deletions ...nt-plugin-pf-codemods/src/rules/v6/mastheadStructureChanges/masthead-structure-changes.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,21 @@ function wrapNodeInMastheadBrand(
return fixes;
}

function formatMessage(
component: "MastheadToggle" | "MastheadBrand" | "MastheadLogo"
) {
const baseMessage = "The structure of Masthead has been updated, ";

const restOfMessage = {
MastheadToggle: "MastheadToggle should now be wrapped in MastheadMain.",
MastheadBrand:
"the PF5 MastheadBrand has been renamed to MastheadLogo (this renaming is handled by our masthead-name-changes codemod) and should now be wrapped in a new MastheadBrand.",
MastheadLogo: "MastheadLogo should now be wrapped in MastheadBrand.",
};

return baseMessage + restOfMessage[component];
}

module.exports = {
meta: { fixable: "code" },
create: function (context: Rule.RuleContext) {
Expand All @@ -89,14 +104,9 @@ module.exports = {
"@patternfly/react-core",
targetComponents
);
const _namedImports = componentImports.filter(
const namedImports = componentImports.filter(
(imp) => imp.type === "ImportSpecifier"
);
// TS isn't properly resolving that namedImports is just ImportSpecifiers, hence this seemingly unneeded assertion
const namedImports = _namedImports as ImportSpecifier[];

const message =
"The structure of Masthead has been updated, MastheadToggle and MastheadBrand should now be wrapped in MastheadMain.";
) as ImportSpecifier[];

return !namedImports.length
? {}
Expand Down Expand Up @@ -124,7 +134,7 @@ module.exports = {
) {
context.report({
node,
message,
message: formatMessage("MastheadToggle"),
fix: (fixer) =>
moveNodeIntoMastheadMain(context, fixer, node, namedImports),
});
Expand All @@ -140,10 +150,20 @@ module.exports = {
nodeImportedName === "MastheadLogo" &&
parentImportedName !== "MastheadBrand";

if (isPreRenameMastheadBrand || isPostRenameMastheadBrand) {
if (isPreRenameMastheadBrand) {
context.report({
node,
message: formatMessage("MastheadBrand"),
fix: (fixer) =>
wrapNodeInMastheadBrand(fixer, node, namedImports),
});
return;
}

if (isPostRenameMastheadBrand) {
context.report({
node,
message,
message: formatMessage("MastheadLogo"),
fix: (fixer) =>
wrapNodeInMastheadBrand(fixer, node, namedImports),
});
Expand Down

0 comments on commit b892ff8

Please sign in to comment.