From cd872b9fbae5ce50b3c3c2ed3e84727bb3cfbbfb Mon Sep 17 00:00:00 2001 From: Aditya Kumar Date: Tue, 19 Mar 2024 14:23:57 +0530 Subject: [PATCH] Add ESLint Rule to Search Plugin Signed-off-by: Aditya Kumar --- .changeset/sour-wasps-dream.md | 5 ++++ plugins/search/.eslintrc.js | 6 ++++- plugins/search/src/alpha.tsx | 4 ++- .../HomePageSearchBar.stories.tsx | 3 ++- .../SearchModal/SearchModal.stories.tsx | 18 ++++++------- .../components/SearchModal/SearchModal.tsx | 16 +++++------- .../SearchType/SearchType.Accordion.tsx | 26 +++++++++---------- .../components/SearchType/SearchType.Tabs.tsx | 4 ++- .../SearchType/SearchType.stories.tsx | 3 ++- .../src/components/SearchType/SearchType.tsx | 18 ++++++------- 10 files changed, 55 insertions(+), 48 deletions(-) create mode 100644 .changeset/sour-wasps-dream.md diff --git a/.changeset/sour-wasps-dream.md b/.changeset/sour-wasps-dream.md new file mode 100644 index 0000000000..b346fe7830 --- /dev/null +++ b/.changeset/sour-wasps-dream.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-search': patch +--- + +Added ESLint rule `no-top-level-material-ui-4-imports` in the `search` plugin to migrate the Material UI imports. diff --git a/plugins/search/.eslintrc.js b/plugins/search/.eslintrc.js index e2a53a6ad2..a2d8179106 100644 --- a/plugins/search/.eslintrc.js +++ b/plugins/search/.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/search/src/alpha.tsx b/plugins/search/src/alpha.tsx index f4dd09088a..9fffa41bfb 100644 --- a/plugins/search/src/alpha.tsx +++ b/plugins/search/src/alpha.tsx @@ -16,7 +16,9 @@ import React from 'react'; -import { makeStyles, Theme, Grid, Paper } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import Paper from '@material-ui/core/Paper'; +import { makeStyles, Theme } from '@material-ui/core/styles'; import SearchIcon from '@material-ui/icons/Search'; import { diff --git a/plugins/search/src/components/HomePageComponent/HomePageSearchBar.stories.tsx b/plugins/search/src/components/HomePageComponent/HomePageSearchBar.stories.tsx index c1b1f0df87..c3a54f442b 100644 --- a/plugins/search/src/components/HomePageComponent/HomePageSearchBar.stories.tsx +++ b/plugins/search/src/components/HomePageComponent/HomePageSearchBar.stories.tsx @@ -17,7 +17,8 @@ import { rootRouteRef, HomePageSearchBar } from '../../plugin'; import { searchApiRef } from '@backstage/plugin-search-react'; import { wrapInTestApp, TestApiProvider } from '@backstage/test-utils'; -import { Grid, makeStyles } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import { makeStyles } from '@material-ui/core/styles'; import React, { ComponentType, PropsWithChildren } from 'react'; export default { diff --git a/plugins/search/src/components/SearchModal/SearchModal.stories.tsx b/plugins/search/src/components/SearchModal/SearchModal.stories.tsx index 525eadc9df..7f789d2e53 100644 --- a/plugins/search/src/components/SearchModal/SearchModal.stories.tsx +++ b/plugins/search/src/components/SearchModal/SearchModal.stories.tsx @@ -23,16 +23,14 @@ import { SearchResultPager, } from '@backstage/plugin-search-react'; import { TestApiProvider, wrapInTestApp } from '@backstage/test-utils'; -import { - Box, - Button, - DialogActions, - DialogContent, - DialogTitle, - Grid, - IconButton, - List, -} from '@material-ui/core'; +import Box from '@material-ui/core/Box'; +import Button from '@material-ui/core/Button'; +import DialogActions from '@material-ui/core/DialogActions'; +import DialogContent from '@material-ui/core/DialogContent'; +import DialogTitle from '@material-ui/core/DialogTitle'; +import Grid from '@material-ui/core/Grid'; +import IconButton from '@material-ui/core/IconButton'; +import List from '@material-ui/core/List'; import { makeStyles } from '@material-ui/core/styles'; import CloseIcon from '@material-ui/icons/Close'; import React, { ComponentType, PropsWithChildren } from 'react'; diff --git a/plugins/search/src/components/SearchModal/SearchModal.tsx b/plugins/search/src/components/SearchModal/SearchModal.tsx index dec0f9f482..814779fb45 100644 --- a/plugins/search/src/components/SearchModal/SearchModal.tsx +++ b/plugins/search/src/components/SearchModal/SearchModal.tsx @@ -21,15 +21,13 @@ import { SearchResult, SearchResultPager, } from '@backstage/plugin-search-react'; -import { - Dialog, - DialogActions, - DialogContent, - DialogTitle, - Divider, - Grid, - useTheme, -} from '@material-ui/core'; +import Dialog from '@material-ui/core/Dialog'; +import DialogActions from '@material-ui/core/DialogActions'; +import DialogContent from '@material-ui/core/DialogContent'; +import DialogTitle from '@material-ui/core/DialogTitle'; +import Divider from '@material-ui/core/Divider'; +import Grid from '@material-ui/core/Grid'; +import { useTheme } from '@material-ui/core/styles'; import Box from '@material-ui/core/Box'; import Button from '@material-ui/core/Button'; import IconButton from '@material-ui/core/IconButton'; diff --git a/plugins/search/src/components/SearchType/SearchType.Accordion.tsx b/plugins/search/src/components/SearchType/SearchType.Accordion.tsx index a77af17a7e..d9c03b39c5 100644 --- a/plugins/search/src/components/SearchType/SearchType.Accordion.tsx +++ b/plugins/search/src/components/SearchType/SearchType.Accordion.tsx @@ -17,20 +17,18 @@ import React, { cloneElement, Fragment, useEffect, useState } from 'react'; import { useApi } from '@backstage/core-plugin-api'; import { searchApiRef, useSearch } from '@backstage/plugin-search-react'; -import { - Accordion, - AccordionSummary, - AccordionDetails, - Card, - CardContent, - CardHeader, - Divider, - List, - ListItem, - ListItemIcon, - ListItemText, - makeStyles, -} from '@material-ui/core'; +import Accordion from '@material-ui/core/Accordion'; +import AccordionSummary from '@material-ui/core/AccordionSummary'; +import AccordionDetails from '@material-ui/core/AccordionDetails'; +import Card from '@material-ui/core/Card'; +import CardContent from '@material-ui/core/CardContent'; +import CardHeader from '@material-ui/core/CardHeader'; +import Divider from '@material-ui/core/Divider'; +import List from '@material-ui/core/List'; +import ListItem from '@material-ui/core/ListItem'; +import ListItemIcon from '@material-ui/core/ListItemIcon'; +import ListItemText from '@material-ui/core/ListItemText'; +import { makeStyles } from '@material-ui/core/styles'; import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; import AllIcon from '@material-ui/icons/FontDownload'; import useAsync from 'react-use/lib/useAsync'; diff --git a/plugins/search/src/components/SearchType/SearchType.Tabs.tsx b/plugins/search/src/components/SearchType/SearchType.Tabs.tsx index 5b3990f7bb..d48420bdac 100644 --- a/plugins/search/src/components/SearchType/SearchType.Tabs.tsx +++ b/plugins/search/src/components/SearchType/SearchType.Tabs.tsx @@ -16,7 +16,9 @@ import React, { useEffect } from 'react'; import { useSearch } from '@backstage/plugin-search-react'; -import { makeStyles, Tab, Tabs } from '@material-ui/core'; +import Tab from '@material-ui/core/Tab'; +import Tabs from '@material-ui/core/Tabs'; +import { makeStyles } from '@material-ui/core/styles'; const useStyles = makeStyles(theme => ({ tabs: { diff --git a/plugins/search/src/components/SearchType/SearchType.stories.tsx b/plugins/search/src/components/SearchType/SearchType.stories.tsx index 250eab051d..8cce7eb5e3 100644 --- a/plugins/search/src/components/SearchType/SearchType.stories.tsx +++ b/plugins/search/src/components/SearchType/SearchType.stories.tsx @@ -14,7 +14,8 @@ * limitations under the License. */ -import { Grid, Paper } from '@material-ui/core'; +import Grid from '@material-ui/core/Grid'; +import Paper from '@material-ui/core/Paper'; import CatalogIcon from '@material-ui/icons/MenuBook'; import DocsIcon from '@material-ui/icons/Description'; import UsersGroupsIcon from '@material-ui/icons/Person'; diff --git a/plugins/search/src/components/SearchType/SearchType.tsx b/plugins/search/src/components/SearchType/SearchType.tsx index b20e8b5fba..1a803c328f 100644 --- a/plugins/search/src/components/SearchType/SearchType.tsx +++ b/plugins/search/src/components/SearchType/SearchType.tsx @@ -13,16 +13,14 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { - Checkbox, - Chip, - FormControl, - InputLabel, - ListItemText, - makeStyles, - MenuItem, - Select, -} from '@material-ui/core'; +import Checkbox from '@material-ui/core/Checkbox'; +import Chip from '@material-ui/core/Chip'; +import FormControl from '@material-ui/core/FormControl'; +import InputLabel from '@material-ui/core/InputLabel'; +import ListItemText from '@material-ui/core/ListItemText'; +import MenuItem from '@material-ui/core/MenuItem'; +import Select from '@material-ui/core/Select'; +import { makeStyles } from '@material-ui/core/styles'; import React, { ChangeEvent } from 'react'; import useEffectOnce from 'react-use/lib/useEffectOnce'; import {