From 89b093f671039756af299ba062b6c6a0c8f026ae Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran Date: Thu, 21 Mar 2024 17:48:56 +0530 Subject: [PATCH] Add ESLint Rule to tech-radar Plugin Signed-off-by: AmbrishRamachandiran --- .changeset/four-terms-think.md | 5 +++++ plugins/tech-radar/.eslintrc.js | 6 +++++- .../tech-radar/src/components/RadarBubble/RadarBubble.tsx | 2 +- .../src/components/RadarDescription/RadarDescription.tsx | 4 +++- plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx | 2 +- .../tech-radar/src/components/RadarFooter/RadarFooter.tsx | 2 +- plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx | 2 +- .../tech-radar/src/components/RadarLegend/RadarLegend.tsx | 2 +- plugins/tech-radar/src/components/RadarPage.tsx | 4 +++- 9 files changed, 21 insertions(+), 8 deletions(-) create mode 100644 .changeset/four-terms-think.md diff --git a/.changeset/four-terms-think.md b/.changeset/four-terms-think.md new file mode 100644 index 0000000000..a014896746 --- /dev/null +++ b/.changeset/four-terms-think.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-tech-radar': patch +--- + +Added ESLint rule `no-top-level-material-ui-4-imports` in the `tech-radar` plugin to migrate the Material UI imports. diff --git a/plugins/tech-radar/.eslintrc.js b/plugins/tech-radar/.eslintrc.js index e2a53a6ad2..c69a8f6aff 100644 --- a/plugins/tech-radar/.eslintrc.js +++ b/plugins/tech-radar/.eslintrc.js @@ -1 +1,5 @@ -module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); +module.exports = require('@backstage/cli/config/eslint-factory')(__dirname, { + rules: { + '@backstage/no-top-level-material-ui-4-imports': 'error', + }, + }); diff --git a/plugins/tech-radar/src/components/RadarBubble/RadarBubble.tsx b/plugins/tech-radar/src/components/RadarBubble/RadarBubble.tsx index a904b981ca..3e580d69a8 100644 --- a/plugins/tech-radar/src/components/RadarBubble/RadarBubble.tsx +++ b/plugins/tech-radar/src/components/RadarBubble/RadarBubble.tsx @@ -15,7 +15,7 @@ */ import React, { useRef, useLayoutEffect } from 'react'; -import { makeStyles } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; export type Props = { visible: boolean; diff --git a/plugins/tech-radar/src/components/RadarDescription/RadarDescription.tsx b/plugins/tech-radar/src/components/RadarDescription/RadarDescription.tsx index 7e2dabc3d4..726c4b5d5d 100644 --- a/plugins/tech-radar/src/components/RadarDescription/RadarDescription.tsx +++ b/plugins/tech-radar/src/components/RadarDescription/RadarDescription.tsx @@ -17,7 +17,9 @@ import React from 'react'; import Dialog from '@material-ui/core/Dialog'; import DialogTitle from '@material-ui/core/DialogTitle'; -import { Button, DialogActions, DialogContent } from '@material-ui/core'; +import Button from '@material-ui/core/Button'; +import DialogActions from '@material-ui/core/DialogActions'; +import DialogContent from '@material-ui/core/DialogContent'; import LinkIcon from '@material-ui/icons/Link'; import { Link, MarkdownContent } from '@backstage/core-components'; import { isValidUrl } from '../../utils/components'; diff --git a/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx b/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx index 996b8d1040..20a8e1268b 100644 --- a/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx +++ b/plugins/tech-radar/src/components/RadarEntry/RadarEntry.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { makeStyles } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; import { WithLink } from '../../utils/components'; import { RadarDescription } from '../RadarDescription'; import type { EntrySnapshot } from '../../utils/types'; diff --git a/plugins/tech-radar/src/components/RadarFooter/RadarFooter.tsx b/plugins/tech-radar/src/components/RadarFooter/RadarFooter.tsx index e20c07bb00..54a1da3e4e 100644 --- a/plugins/tech-radar/src/components/RadarFooter/RadarFooter.tsx +++ b/plugins/tech-radar/src/components/RadarFooter/RadarFooter.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { makeStyles } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; export type Props = { x: number; diff --git a/plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx b/plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx index 8f4f8acc78..9e7b8e6459 100644 --- a/plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx +++ b/plugins/tech-radar/src/components/RadarGrid/RadarGrid.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { makeStyles } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; import type { Ring } from '../../utils/types'; export type Props = { diff --git a/plugins/tech-radar/src/components/RadarLegend/RadarLegend.tsx b/plugins/tech-radar/src/components/RadarLegend/RadarLegend.tsx index 0a7a69b73c..0eab1adf75 100644 --- a/plugins/tech-radar/src/components/RadarLegend/RadarLegend.tsx +++ b/plugins/tech-radar/src/components/RadarLegend/RadarLegend.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { makeStyles } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; import React from 'react'; import { RadarLegendQuadrant } from './RadarLegendQuadrant'; import { RadarLegendProps } from './types'; diff --git a/plugins/tech-radar/src/components/RadarPage.tsx b/plugins/tech-radar/src/components/RadarPage.tsx index a7ea538977..f4926223ba 100644 --- a/plugins/tech-radar/src/components/RadarPage.tsx +++ b/plugins/tech-radar/src/components/RadarPage.tsx @@ -22,7 +22,9 @@ import { SupportButton, Link, } from '@backstage/core-components'; -import { Grid, Input, makeStyles } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import Input from '@material-ui/core/Input'; +import { makeStyles } from '@material-ui/core/styles'; import Typography from '@material-ui/core/Typography'; import React from 'react'; import { RadarComponent, type TechRadarComponentProps } from './RadarComponent';