From 4859eea711f4d9f0423aaa193724fa7007243146 Mon Sep 17 00:00:00 2001 From: Dan Labrecque Date: Mon, 30 Sep 2024 12:24:11 -0400 Subject: [PATCH] feat(charts): import charts from @patternfly/react-charts/victory --- .../rules/v6/chartPromoted/chart-promoted.ts | 31 +++++ .../chartsVictory-promoted.md | 17 +++ .../chartsVictory-promoted.test.ts | 106 ++++++++++++++++++ .../chartsVictory-promoted.ts | 62 ++++++++++ .../chartsVictoryPromotedInput.tsx | 1 + .../chartsVictoryPromotedOutput.tsx | 1 + packages/pf-codemods/README.md | 18 +++ 7 files changed, 236 insertions(+) create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartPromoted/chart-promoted.ts create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.md create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.test.ts create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.ts create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedInput.tsx create mode 100644 packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedOutput.tsx diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartPromoted/chart-promoted.ts b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartPromoted/chart-promoted.ts new file mode 100644 index 00000000..a9b426b2 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartPromoted/chart-promoted.ts @@ -0,0 +1,31 @@ +import { Rule } from "eslint"; +import { JSXOpeningElement } from "estree-jsx"; +import { getAllImportsFromPackage, checkMatchingJSXOpeningElement, getAttribute } from "../../helpers"; + +// https://github.com/patternfly/patternfly-react/pull/1234 +module.exports = { + meta: { fixable: "code" }, + create: function (context: Rule.RuleContext) { + const basePackage = "@patternfly/react-core"; + const componentImports = getAllImportsFromPackage(context, basePackage, ["Chart"]); + + return !componentImports.length + ? {} + : { + JSXOpeningElement(node: JSXOpeningElement) { + if (checkMatchingJSXOpeningElement(node, componentImports)) { + const Prop = getAttribute(node, ""); + if (Prop) { + context.report({ + node, + message: "this is a test", + fix(fixer) { + return fixer.replaceText(Prop, ""); + }, + }); + } + } + }, + }; + }, +}; diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.md b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.md new file mode 100644 index 00000000..b207a8e6 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.md @@ -0,0 +1,17 @@ +### chartsVictory-promoted [(#11091)](https://github.com/patternfly/patternfly-react/pull/11091) + +In order to support multiple chart libraries, Victory has become a peer dependency. This rule will update existing import paths to our victory directory. + +#### Examples + +In: + +```jsx +%inputExample% +``` + +Out: + +```jsx +%outputExample% +``` diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.test.ts b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.test.ts new file mode 100644 index 00000000..8330ee50 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.test.ts @@ -0,0 +1,106 @@ +const ruleTester = require("../../ruletester"); +import * as rule from "./chartsVictory-promoted"; +import { + ValidTests, + InvalidTests, + createValidTest, + createInvalidTest, +} from "../../helpers/testHelpers"; + +const specifiersToMove = [ + 'Chart', + 'ChartArea', + 'ChartAxis', + 'ChartBar', + 'ChartBoxPlot', + 'ChartBullet', + 'ChartBulletComparativeErrorMeasure', + 'ChartBulletComparativeMeasure', + 'ChartBulletComparativeWarningMeasure', + 'ChartBulletPrimaryDotMeasure', + 'ChartBulletPrimarySegmentedMeasure', + 'ChartBulletQualitativeRange', + 'ChartContainer', + 'ChartCursorContainer', + 'ChartCursorTooltip', + 'ChartCursorFlyout', + 'ChartDonut', + 'ChartDonutThreshold', + 'ChartDonutUtilization', + 'ChartGroup', + 'ChartLabel', + 'ChartLegend', + 'ChartLegendTooltip', + 'ChartLegendTooltipContent', + 'ChartLegendTooltipLabel', + 'ChartLine', + 'ChartPie', + 'ChartPoint', + 'ChartScatter', + 'ChartStack', + 'ChartTheme', + 'ChartThemeColor', + 'ChartThreshold', + 'ChartTooltip', + 'ChartVoronoiContainer', + 'createContainer', + 'getInteractiveLegendEvents', + 'getInteractiveLegendItemStyles', + 'getCustomTheme', + 'getTheme', + 'getThemeColors' +]; + +const validTests: ValidTests = []; +const invalidTests: InvalidTests = []; + +specifiersToMove.forEach((specifier) => { + validTests.push(createValidTest(`<${specifier} />`)); + validTests.push( + createValidTest( + `import { ${specifier} } from '@patternfly/react-charts/victory';` + ) + ); + + const errorMessage = `${specifier} has been promoted. This rule will update import paths.`; + invalidTests.push( + createInvalidTest( + `import { ${specifier} } from '@patternfly/react-charts';`, + `import {\n\t${specifier}\n} from '@patternfly/react-charts/victory';`, + [{ message: errorMessage, type: "ImportDeclaration" }] + ) + ); + invalidTests.push( + createInvalidTest( + `import { ${specifier} as CustomSpecifier } from '@patternfly/react-charts';`, + `import {\n\t${specifier} as CustomSpecifier\n} from '@patternfly/react-charts/victory';`, + [{ message: errorMessage, type: "ImportDeclaration" }] + ) + ); + invalidTests.push( + createInvalidTest( + `import { ${specifier} } from '@patternfly/react-charts/dist/esm/components/index.js';`, + `import {\n\t${specifier}\n} from '@patternfly/react-charts/dist/esm/victory/components/Chart/index.js';`, + [{ message: errorMessage, type: "ImportDeclaration" }] + ) + ); + invalidTests.push( + createInvalidTest( + `import { ${specifier} } from '@patternfly/react-charts/dist/js/components/index.js';`, + `import {\n\t${specifier}\n} from '@patternfly/react-charts/victory';`, + [{ message: errorMessage, type: "ImportDeclaration" }] + ) + ); + invalidTests.push( + createInvalidTest( + `import { ${specifier} } from '@patternfly/react-charts/dist/dynamic/components/index.js';`, + `import {\n\t${specifier}\n} from '@patternfly/react-charts/victory';`, + [{ message: errorMessage, type: "ImportDeclaration" }] + ) + ); +}); + +ruleTester.run("chartVictory-promoted", rule, { + valid: validTests, + invalid: invalidTests, +}); diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.ts b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.ts new file mode 100644 index 00000000..f284ca34 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictory-promoted.ts @@ -0,0 +1,62 @@ +import { moveSpecifiers } from "../../helpers"; + +// https://github.com/patternfly/patternfly-react/pull/11091 + +const specifiersToMove = [ +'Chart', +'ChartArea', +'ChartAxis', +'ChartBar', +'ChartBoxPlot', +'ChartBullet', +'ChartBulletComparativeErrorMeasure', +'ChartBulletComparativeMeasure', +'ChartBulletComparativeWarningMeasure', +'ChartBulletPrimaryDotMeasure', +'ChartBulletPrimarySegmentedMeasure', +'ChartBulletQualitativeRange', +'ChartContainer', +'ChartCursorContainer', +'ChartCursorTooltip', +'ChartCursorFlyout', +'ChartDonut', +'ChartDonutThreshold', +'ChartDonutUtilization', +'ChartGroup', +'ChartLabel', +'ChartLegend', +'ChartLegendTooltip', +'ChartLegendTooltipContent', +'ChartLegendTooltipLabel', +'ChartLine', +'ChartPie', +'ChartPoint', +'ChartScatter', +'ChartStack', +'ChartTheme', +'ChartThemeColor', +'ChartThreshold', +'ChartTooltip', +'ChartVoronoiContainer', +'createContainer', +'getInteractiveLegendEvents', +'getInteractiveLegendItemStyles', +'getCustomTheme', +'getTheme', +'getThemeColors' +]; + +const fromPackage = "@patternfly/react-charts"; +const toPackage = "@patternfly/react-charts/victory"; +const messageAfterImportNameChange = + "been promoted. This rule will update import paths."; + +module.exports = { + meta: { fixable: "code" }, + create: moveSpecifiers( + specifiersToMove, + fromPackage, + toPackage, + messageAfterImportNameChange + ), +}; diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedInput.tsx b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedInput.tsx new file mode 100644 index 00000000..8a176f5b --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedInput.tsx @@ -0,0 +1 @@ +import { Chart } from "@patternfly/react-charts"; diff --git a/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedOutput.tsx b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedOutput.tsx new file mode 100644 index 00000000..fc0419d6 --- /dev/null +++ b/packages/eslint-plugin-pf-codemods/src/rules/v6/chartsVictoryPromoted/chartsVictoryPromotedOutput.tsx @@ -0,0 +1 @@ +import { Chart } from '@patternfly/react-charts/victory'; diff --git a/packages/pf-codemods/README.md b/packages/pf-codemods/README.md index ff3b08ed..42a23a20 100644 --- a/packages/pf-codemods/README.md +++ b/packages/pf-codemods/README.md @@ -368,6 +368,24 @@ export const CardUpdatedClickableMarkupInput = () => { }; ``` +### chartsVictory-promoted [(#11091)](https://github.com/patternfly/patternfly-react/pull/11091) + +In order to support multiple chart libraries, Victory has become a peer dependency. This rule will update existing import paths to our victory directory. + +#### Examples + +In: + +```jsx +import { Chart } from "@patternfly/react-charts"; +``` + +Out: + +```jsx +import { Chart } from '@patternfly/react-charts/victory'; +``` + ### checkbox-radio-replace-isLabelBeforeButton [(#10016)](https://github.com/patternfly/patternfly-react/pull/10016) The `isLabelBeforeButton` prop in Checkbox and Radio has been replaced with `labelPosition="start"`