chore: migrate ESLint config for Markdown (#10742)

Signed-off-by: Jon Koops <[email protected]>
patternfly · Jul 15, 2024 · 4474715 · 4474715
1 parent 28b8f02
commit 4474715
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 35 deletions.
diff --git a/.eslintrc-md.json b/.eslintrc-md.json
diff --git a/eslint.config-md.mjs b/eslint.config-md.mjs
@@ -0,0 +1,33 @@
+import tsParser from '@typescript-eslint/parser';
+import markdown from 'eslint-plugin-markdown';
+import patternflyReact from 'eslint-plugin-patternfly-react';
+import react from 'eslint-plugin-react';
+
+export default [
+  ...markdown.configs.recommended,
+  {
+    plugins: {
+      react,
+      'patternfly-react': patternflyReact
+    },
+    languageOptions: {
+      parser: tsParser
+    },
+    settings: {
+      react: {
+        version: 'detect'
+      }
+    },
+    rules: {
+      'eol-last': 'error',
+      'spaced-comment': 'error',
+      'no-unused-vars': 'off',
+      'no-this-before-super': 'error',
+      'patternfly-react/import-tokens-icons': 'error',
+      'react/jsx-uses-react': 'error',
+      'react/jsx-uses-vars': 'error',
+      'react/no-unknown-property': 'error',
+      'react/jsx-no-undef': 'error'
+    }
+  }
+];
diff --git a/package.json b/package.json
@@ -89,7 +89,7 @@
     "generate": "yarn plop",
     "lint": "eslint --ext js,jsx,ts,tsx --cache --cache-strategy content",
     "lint:all": "yarn lint:md && yarn lint:ts",
-    "lint:md": "yarn eslint packages --ext md --no-eslintrc --config .eslintrc-md.json --cache --cache-strategy content",
+    "lint:md": "ESLINT_USE_FLAT_CONFIG=true eslint **/*.md --cache --cache-strategy content --config eslint.config-md.mjs --no-warn-ignored",
     "lint:ts": "yarn lint packages/*/src",
     "lint:tests": "yarn lint packages/*/src/components/*/__tests__/*.test.*",
     "postinstall": "ts-patch install -s && husky",

diff --git a/packages/react-charts/src/components/Skeletons/examples/skeletons.md b/packages/react-charts/src/components/Skeletons/examples/skeletons.md
@@ -37,6 +37,7 @@ PatternFly React charts are based on the [Victory](https://formidable.com/open-s
 ### Area chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartArea, ChartAxis, ChartGroup, ChartVoronoiContainer } from '@patternfly/react-charts';
 
 export const ChartAreaSkeleton: React.FunctionComponent = () => {
@@ -118,6 +119,7 @@ export const ChartAreaSkeleton: React.FunctionComponent = () => {
 ### Bar chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartBar, ChartAxis, ChartGroup, ChartVoronoiContainer } from '@patternfly/react-charts';
 
 export const ChartBarSkeleton: React.FunctionComponent = () => {
@@ -175,6 +177,7 @@ export const ChartBarSkeleton: React.FunctionComponent = () => {
 ### Box plot chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartBoxPlot } from '@patternfly/react-charts';
 
 export const ChartBoxPlotSkeleton: React.FunctionComponent = () => {
@@ -233,6 +236,7 @@ export const ChartBoxPlotSkeleton: React.FunctionComponent = () => {
 ### Bullet chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartBullet, ChartLegend } from '@patternfly/react-charts';
 
 export const ChartBulletSkeleton: React.FunctionComponent = () => {
@@ -287,6 +291,7 @@ export const ChartBulletSkeleton: React.FunctionComponent = () => {
 ### Donut chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartDonut } from '@patternfly/react-charts';
 
 export const ChartDonutSkeleton: React.FunctionComponent = () => {
@@ -326,6 +331,7 @@ export const ChartDonutSkeleton: React.FunctionComponent = () => {
 ### Donut utilization chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartDonutUtilization } from '@patternfly/react-charts';
 
 export const ChartDonutUtilizationSkeleton: React.FunctionComponent = () => {
@@ -375,6 +381,7 @@ export const ChartDonutUtilizationSkeleton: React.FunctionComponent = () => {
 ### Donut utilization threshold
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartDonutThreshold, ChartDonutUtilization } from '@patternfly/react-charts';
 
 export const ChartDonutUtilizationSkeleton: React.FunctionComponent = () => {
@@ -419,7 +426,8 @@ export const ChartDonutUtilizationSkeleton: React.FunctionComponent = () => {
 ### Line chart
 ```js
 import React from 'react';
-import { Chart, ChartAxis, ChartLine } from '@patternfly/react-charts';
+import { Switch } from '@patternfly/react-core';
+import { Chart, ChartVoronoiContainer, ChartGroup, ChartAxis, ChartLine } from '@patternfly/react-charts';
 
 export const ChartLineSkeleton: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
@@ -509,6 +517,7 @@ export const ChartLineSkeleton: React.FunctionComponent = () => {
 ### Pie chart
 ```js
 import React from 'react';
+import { Switch } from '@patternfly/react-core';
 import { Chart, ChartAxis, ChartPie } from '@patternfly/react-charts';
 
 export const ChartPieSkeleton: React.FunctionComponent = () => {
@@ -557,7 +566,8 @@ export const ChartPieSkeleton: React.FunctionComponent = () => {
 ### Scatter chart
 ```js
 import React from 'react';
-import { Chart, ChartAxis, ChartScatter } from '@patternfly/react-charts';
+import { Switch } from '@patternfly/react-core';
+import { Chart, ChartVoronoiContainer, ChartGroup, ChartAxis, ChartScatter } from '@patternfly/react-charts';
 
 export const ChartScatterSkeleton: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
@@ -614,7 +624,8 @@ export const ChartScatterSkeleton: React.FunctionComponent = () => {
 ### Stack chart
 ```js
 import React from 'react';
-import { Chart, ChartAxis, ChartStack } from '@patternfly/react-charts';
+import { Switch } from '@patternfly/react-core';
+import { Chart, ChartVoronoiContainer, ChartAxis, ChartStack, ChartBar } from '@patternfly/react-charts';
 
 export const ChartStackSkeleton: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
@@ -670,7 +681,8 @@ export const ChartStackSkeleton: React.FunctionComponent = () => {
 ### Threshold chart
 ```js
 import React from 'react';
-import { Chart, ChartAxis, ChartThreshold } from '@patternfly/react-charts';
+import { Switch } from '@patternfly/react-core';
+import { Chart, ChartVoronoiContainer, ChartLegend, ChartAxis, ChartThreshold, ChartGroup, ChartArea } from '@patternfly/react-charts';
 import chart_color_blue_300 from '@patternfly/react-tokens/dist/esm/chart_color_blue_300';
 
 export const ChartThresholdSkeleton: React.FunctionComponent = () => {