diff --git a/.changeset/odd-planes-cheat.md b/.changeset/odd-planes-cheat.md new file mode 100644 index 0000000000..661ecaa0d4 --- /dev/null +++ b/.changeset/odd-planes-cheat.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog': patch +--- + +Fix type error on `CatalogTable` when using Material UI v5 diff --git a/plugins/catalog/package.json b/plugins/catalog/package.json index 7d5220e2fb..350d50da37 100644 --- a/plugins/catalog/package.json +++ b/plugins/catalog/package.json @@ -63,6 +63,7 @@ "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.61", + "@mui/utils": "^5.14.15", "@types/react": "^16.13.1 || ^17.0.0", "dataloader": "^2.0.0", "expiry-map": "^2.0.0", diff --git a/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx b/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx index 24ccb22908..04584f688a 100644 --- a/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx +++ b/plugins/catalog/src/components/CatalogTable/CatalogTable.tsx @@ -34,17 +34,18 @@ import { useEntityList, useStarredEntities, } from '@backstage/plugin-catalog-react'; -import { Typography } from '@material-ui/core'; +import Typography from '@material-ui/core/Typography'; import { withStyles } from '@material-ui/core/styles'; +import { visuallyHidden } from '@mui/utils'; import Edit from '@material-ui/icons/Edit'; import OpenInNew from '@material-ui/icons/OpenInNew'; import Star from '@material-ui/icons/Star'; import StarBorder from '@material-ui/icons/StarBorder'; import { capitalize } from 'lodash'; +import pluralize from 'pluralize'; import React, { ReactNode, useMemo } from 'react'; import { columnFactories } from './columns'; import { CatalogTableRow } from './types'; -import pluralize from 'pluralize'; /** * Props for {@link CatalogTable}. @@ -146,7 +147,7 @@ export const CatalogTable = (props: CatalogTableProps) => { return { icon: () => ( <> - {title} + {title} ), @@ -165,7 +166,7 @@ export const CatalogTable = (props: CatalogTableProps) => { return { icon: () => ( <> - {title} + {title} ), @@ -185,7 +186,7 @@ export const CatalogTable = (props: CatalogTableProps) => { cellStyle: { paddingLeft: '1em' }, icon: () => ( <> - {title} + {title} {isStarred ? : } ), diff --git a/yarn.lock b/yarn.lock index 714a17d713..cad6b0ee67 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6183,6 +6183,7 @@ __metadata: "@material-ui/core": ^4.12.2 "@material-ui/icons": ^4.9.1 "@material-ui/lab": 4.0.0-alpha.61 + "@mui/utils": ^5.14.15 "@testing-library/dom": ^9.0.0 "@testing-library/jest-dom": ^6.0.0 "@testing-library/react": ^14.0.0 @@ -14017,7 +14018,7 @@ __metadata: languageName: node linkType: hard -"@mui/utils@npm:^5.14.17": +"@mui/utils@npm:^5.14.15, @mui/utils@npm:^5.14.17": version: 5.14.17 resolution: "@mui/utils@npm:5.14.17" dependencies: