diff --git a/workspaces/scorecard/.changeset/mui-v5-scorecard.md b/workspaces/scorecard/.changeset/mui-v5-scorecard.md new file mode 100644 index 0000000000..9d8703e6a7 --- /dev/null +++ b/workspaces/scorecard/.changeset/mui-v5-scorecard.md @@ -0,0 +1,6 @@ +-- +'@red-hat-developer-hub/backstage-plugin-scorecard': patch + +--- + +Replace Material UI v4 imports with MUI v5 and scope JSS class names to prevent style collisions. diff --git a/workspaces/scorecard/eslint.frontend-shared.cjs b/workspaces/scorecard/eslint.frontend-shared.cjs new file mode 100644 index 0000000000..bc70f9cde0 --- /dev/null +++ b/workspaces/scorecard/eslint.frontend-shared.cjs @@ -0,0 +1,43 @@ +/* + * Copyright Red Hat, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +const materialUiMigrationEslintConfig = { + restrictedImports: [ + { + name: '@material-ui/core', + message: 'Use @mui/material instead of Material UI v4.', + }, + { + name: '@material-ui/lab', + message: 'Use @mui/material instead of Material UI v4.', + }, + { + name: '@material-ui/styles', + message: + 'Use @mui/styles, @mui/material (sx/styled), or Backstage UI instead of Material UI v4.', + }, + ], + restrictedImportPatterns: ['@material-ui/*'], +}; + +/** + * Shared ESLint config for frontend packages in the scorecard workspace. + */ +module.exports = packageDir => + require('@backstage/cli/config/eslint-factory')( + packageDir, + materialUiMigrationEslintConfig, + ); diff --git a/workspaces/scorecard/packages/app-legacy/.eslintrc.js b/workspaces/scorecard/packages/app-legacy/.eslintrc.js index e2a53a6ad2..493ce7565d 100644 --- a/workspaces/scorecard/packages/app-legacy/.eslintrc.js +++ b/workspaces/scorecard/packages/app-legacy/.eslintrc.js @@ -1 +1,18 @@ -module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); +/* + * Copyright Red Hat, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +// eslint-disable-next-line @backstage/no-relative-monorepo-imports -- workspace ESLint shared config +module.exports = require('../../eslint.frontend-shared.cjs')(__dirname); diff --git a/workspaces/scorecard/packages/app-legacy/package.json b/workspaces/scorecard/packages/app-legacy/package.json index 9e4cd0b070..a483858563 100644 --- a/workspaces/scorecard/packages/app-legacy/package.json +++ b/workspaces/scorecard/packages/app-legacy/package.json @@ -46,12 +46,13 @@ "@backstage/plugin-user-settings": "^0.9.1", "@backstage/theme": "^0.7.2", "@backstage/ui": "^0.13.2", - "@material-ui/core": "^4.12.2", - "@material-ui/icons": "^4.9.1", + "@mui/icons-material": "5.18.0", + "@mui/material": "5.18.0", + "@mui/styles": "5.18.0", "@openshift/dynamic-plugin-sdk": "^5.0.1", "@red-hat-developer-hub/backstage-plugin-dynamic-home-page": "^1.10.2", "@red-hat-developer-hub/backstage-plugin-scorecard": "workspace:^", - "@red-hat-developer-hub/backstage-plugin-theme": "^0.12.0", + "@red-hat-developer-hub/backstage-plugin-theme": "^0.14.0", "@roadiehq/backstage-plugin-github-pull-requests": "^3.5.1", "@roadiehq/backstage-plugin-jira": "^2.13.1", "@scalprum/react-core": "0.11.1", diff --git a/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoFull.tsx b/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoFull.tsx deleted file mode 100644 index d30f1c4d94..0000000000 --- a/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoFull.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Copyright Red Hat, Inc. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { makeStyles } from '@material-ui/core'; - -const useStyles = makeStyles({ - svg: { - width: 'auto', - height: 30, - }, - path: { - fill: '#7df3e1', - }, -}); -const LogoFull = () => { - const classes = useStyles(); - - return ( - - - - ); -}; - -export default LogoFull; diff --git a/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoIcon.tsx b/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoIcon.tsx deleted file mode 100644 index 66be748f8e..0000000000 --- a/workspaces/scorecard/packages/app-legacy/src/components/Root/LogoIcon.tsx +++ /dev/null @@ -1,45 +0,0 @@ -/* - * Copyright Red Hat, Inc. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { makeStyles } from '@material-ui/core'; - -const useStyles = makeStyles({ - svg: { - width: 'auto', - height: 28, - }, - path: { - fill: '#7df3e1', - }, -}); - -const LogoIcon = () => { - const classes = useStyles(); - - return ( - - - - ); -}; - -export default LogoIcon; diff --git a/workspaces/scorecard/packages/app-legacy/src/components/Root/Root.tsx b/workspaces/scorecard/packages/app-legacy/src/components/Root/Root.tsx index d087604ed4..cf61deffec 100644 --- a/workspaces/scorecard/packages/app-legacy/src/components/Root/Root.tsx +++ b/workspaces/scorecard/packages/app-legacy/src/components/Root/Root.tsx @@ -14,14 +14,19 @@ * limitations under the License. */ import { PropsWithChildren } from 'react'; -import { makeStyles } from '@material-ui/core'; -import HomeIcon from '@material-ui/icons/Home'; -import CategoryIcon from '@material-ui/icons/Category'; -import ExtensionIcon from '@material-ui/icons/Extension'; -import LibraryBooks from '@material-ui/icons/LibraryBooks'; -import CreateComponentIcon from '@material-ui/icons/AddCircleOutline'; -import LogoFull from './LogoFull'; -import LogoIcon from './LogoIcon'; +import Box from '@mui/material/Box'; +import HomeIcon from '@mui/icons-material/Home'; +import CategoryIcon from '@mui/icons-material/Category'; +import ExtensionIcon from '@mui/icons-material/Extension'; +import LibraryBooks from '@mui/icons-material/LibraryBooks'; +import CreateComponentIcon from '@mui/icons-material/AddCircleOutline'; +import MenuIcon from '@mui/icons-material/Menu'; +import SearchIcon from '@mui/icons-material/Search'; +import GroupIcon from '@mui/icons-material/People'; +import { + LogoFull, + LogoIcon, +} from '@red-hat-developer-hub/backstage-plugin-theme'; import { Settings as SidebarSettings, UserSettingsSignInAvatar, @@ -40,36 +45,34 @@ import { useSidebarOpenState, Link, } from '@backstage/core-components'; -import MenuIcon from '@material-ui/icons/Menu'; -import SearchIcon from '@material-ui/icons/Search'; import { MyGroupsSidebarItem } from '@backstage/plugin-org'; -import GroupIcon from '@material-ui/icons/People'; - -const useSidebarLogoStyles = makeStyles({ - root: { - width: sidebarConfig.drawerWidthClosed, - height: 3 * sidebarConfig.logoHeight, - display: 'flex', - flexFlow: 'row nowrap', - alignItems: 'center', - marginBottom: -14, - }, - link: { - width: sidebarConfig.drawerWidthClosed, - marginLeft: 24, - }, -}); const SidebarLogo = () => { - const classes = useSidebarLogoStyles(); const { isOpen } = useSidebarOpenState(); return ( -
- + + {isOpen ? : } -
+ ); }; diff --git a/workspaces/scorecard/packages/app-legacy/src/components/catalog/EntityPage.tsx b/workspaces/scorecard/packages/app-legacy/src/components/catalog/EntityPage.tsx index f900143506..8ee48f856a 100644 --- a/workspaces/scorecard/packages/app-legacy/src/components/catalog/EntityPage.tsx +++ b/workspaces/scorecard/packages/app-legacy/src/components/catalog/EntityPage.tsx @@ -13,7 +13,8 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { Button, Grid } from '@material-ui/core'; +import Grid from '@mui/material/Grid'; +import Button from '@mui/material/Button'; import { EntityApiDefinitionCard, EntityConsumedApisCard, @@ -282,7 +283,7 @@ const websiteEntityPage = ( * NOTE: This page is designed to work on small screens such as mobile devices. * This is based on Material UI Grid. If breakpoints are used, each grid item must set the `xs` prop to a column size or to `true`, * since this does not default. If no breakpoints are used, the items will equitably share the available space. - * https://material-ui.com/components/grid/#basic-grid. + * https://mui.com/material-ui/react-grid/#basic-grid. */ const defaultEntityPage = ( diff --git a/workspaces/scorecard/packages/app-legacy/src/components/search/SearchPage.tsx b/workspaces/scorecard/packages/app-legacy/src/components/search/SearchPage.tsx index 5d651901f0..3b881427bc 100644 --- a/workspaces/scorecard/packages/app-legacy/src/components/search/SearchPage.tsx +++ b/workspaces/scorecard/packages/app-legacy/src/components/search/SearchPage.tsx @@ -13,40 +13,35 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { makeStyles, Theme, Grid, Paper } from '@material-ui/core'; +import { + CatalogIcon, + Content, + DocsIcon, + Header, + Page, +} from '@backstage/core-components'; +import { useApi } from '@backstage/core-plugin-api'; import { CatalogSearchResultListItem } from '@backstage/plugin-catalog'; import { - catalogApiRef, CATALOG_FILTER_EXISTS, + catalogApiRef, } from '@backstage/plugin-catalog-react'; -import { TechDocsSearchResultListItem } from '@backstage/plugin-techdocs'; - import { SearchType } from '@backstage/plugin-search'; import { SearchBar, SearchFilter, - SearchResult, SearchPagination, + SearchResult, useSearch, } from '@backstage/plugin-search-react'; -import { - CatalogIcon, - Content, - DocsIcon, - Header, - Page, -} from '@backstage/core-components'; -import { useApi } from '@backstage/core-plugin-api'; +import { TechDocsSearchResultListItem } from '@backstage/plugin-techdocs'; +import Grid from '@mui/material/Grid'; +import Paper from '@mui/material/Paper'; +import { Theme } from '@mui/material/styles'; +import { makeStyles } from '@mui/styles'; const useStyles = makeStyles((theme: Theme) => ({ - bar: { - padding: theme.spacing(1, 0), - }, - filters: { - padding: theme.spacing(2), - marginTop: theme.spacing(2), - }, filter: { '& + &': { marginTop: theme.spacing(2.5), @@ -65,7 +60,11 @@ const SearchPage = () => { - + @@ -86,14 +85,18 @@ const SearchPage = () => { }, ]} /> - + {types.includes('techdocs') && ( { - // Return a list of entities which are documented. const { items } = await catalogApi.getEntities({ fields: ['metadata.name'], filter: { diff --git a/workspaces/scorecard/packages/app/.eslintrc.js b/workspaces/scorecard/packages/app/.eslintrc.js index e2a53a6ad2..493ce7565d 100644 --- a/workspaces/scorecard/packages/app/.eslintrc.js +++ b/workspaces/scorecard/packages/app/.eslintrc.js @@ -1 +1,18 @@ -module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); +/* + * Copyright Red Hat, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +// eslint-disable-next-line @backstage/no-relative-monorepo-imports -- workspace ESLint shared config +module.exports = require('../../eslint.frontend-shared.cjs')(__dirname); diff --git a/workspaces/scorecard/packages/app/package.json b/workspaces/scorecard/packages/app/package.json index 079dacd1f1..5de5b7cdcc 100644 --- a/workspaces/scorecard/packages/app/package.json +++ b/workspaces/scorecard/packages/app/package.json @@ -33,12 +33,12 @@ "@backstage/plugin-techdocs": "^1.17.2", "@backstage/plugin-user-settings": "^0.9.1", "@backstage/ui": "^0.13.2", - "@material-ui/core": "^4.12.2", "@mui/icons-material": "^5.18.0", + "@mui/material": "^5.18.0", "@red-hat-developer-hub/backstage-plugin-dynamic-home-page": "1.11.0", "@red-hat-developer-hub/backstage-plugin-scorecard": "workspace:^", "@red-hat-developer-hub/backstage-plugin-scorecard-common": "workspace:^", - "@red-hat-developer-hub/backstage-plugin-theme": "^0.13.0", + "@red-hat-developer-hub/backstage-plugin-theme": "^0.14.0", "react": "^18.0.2", "react-dom": "^18.0.2" }, diff --git a/workspaces/scorecard/packages/app/src/modules/nav/LogoFull.tsx b/workspaces/scorecard/packages/app/src/modules/nav/LogoFull.tsx deleted file mode 100644 index 6b6a1bd8c1..0000000000 --- a/workspaces/scorecard/packages/app/src/modules/nav/LogoFull.tsx +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright Red Hat, Inc. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { makeStyles } from '@material-ui/core'; - -const useStyles = makeStyles({ - svg: { - width: 'auto', - height: 30, - }, - path: { - fill: '#7df3e1', - }, -}); - -export const LogoFull = () => { - const classes = useStyles(); - - return ( - - - - ); -}; diff --git a/workspaces/scorecard/packages/app/src/modules/nav/LogoIcon.tsx b/workspaces/scorecard/packages/app/src/modules/nav/LogoIcon.tsx deleted file mode 100644 index 87024b08c2..0000000000 --- a/workspaces/scorecard/packages/app/src/modules/nav/LogoIcon.tsx +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright Red Hat, Inc. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { makeStyles } from '@material-ui/core'; - -const useStyles = makeStyles({ - svg: { - width: 'auto', - height: 28, - }, - path: { - fill: '#7df3e1', - }, -}); - -export const LogoIcon = () => { - const classes = useStyles(); - - return ( - - - - ); -}; diff --git a/workspaces/scorecard/packages/app/src/modules/nav/SidebarLogo.tsx b/workspaces/scorecard/packages/app/src/modules/nav/SidebarLogo.tsx index 0085b75fce..8bfa1e9aeb 100644 --- a/workspaces/scorecard/packages/app/src/modules/nav/SidebarLogo.tsx +++ b/workspaces/scorecard/packages/app/src/modules/nav/SidebarLogo.tsx @@ -18,34 +18,37 @@ import { sidebarConfig, useSidebarOpenState, } from '@backstage/core-components'; -import { makeStyles } from '@material-ui/core'; -import { LogoFull } from './LogoFull'; -import { LogoIcon } from './LogoIcon'; - -const useSidebarLogoStyles = makeStyles({ - root: { - width: sidebarConfig.drawerWidthClosed, - height: 3 * sidebarConfig.logoHeight, - display: 'flex', - flexFlow: 'row nowrap', - alignItems: 'center', - marginBottom: -14, - }, - link: { - width: sidebarConfig.drawerWidthClosed, - marginLeft: 24, - }, -}); +import Box from '@mui/material/Box'; +import { + LogoFull, + LogoIcon, +} from '@red-hat-developer-hub/backstage-plugin-theme'; export const SidebarLogo = () => { - const classes = useSidebarLogoStyles(); const { isOpen } = useSidebarOpenState(); return ( -
- + + {isOpen ? : } -
+ ); }; diff --git a/workspaces/scorecard/plugins/scorecard/.eslintrc.js b/workspaces/scorecard/plugins/scorecard/.eslintrc.js index e2a53a6ad2..493ce7565d 100644 --- a/workspaces/scorecard/plugins/scorecard/.eslintrc.js +++ b/workspaces/scorecard/plugins/scorecard/.eslintrc.js @@ -1 +1,18 @@ -module.exports = require('@backstage/cli/config/eslint-factory')(__dirname); +/* + * Copyright Red Hat, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +// eslint-disable-next-line @backstage/no-relative-monorepo-imports -- workspace ESLint shared config +module.exports = require('../../eslint.frontend-shared.cjs')(__dirname); diff --git a/workspaces/scorecard/plugins/scorecard/package.json b/workspaces/scorecard/plugins/scorecard/package.json index f78ca61cec..2cba5cbac3 100644 --- a/workspaces/scorecard/plugins/scorecard/package.json +++ b/workspaces/scorecard/plugins/scorecard/package.json @@ -63,6 +63,7 @@ "@backstage/theme": "^0.7.2", "@mui/icons-material": "5.18.0", "@mui/material": "5.18.0", + "@mui/styles": "5.18.0", "@red-hat-developer-hub/backstage-plugin-scorecard-common": "workspace:^", "@tanstack/react-query": "^5.95.2", "date-fns": "^4.1.0", diff --git a/workspaces/scorecard/plugins/scorecard/src/components/Scorecard/EntityScorecardContent.tsx b/workspaces/scorecard/plugins/scorecard/src/components/Scorecard/EntityScorecardContent.tsx index 5cbe486b15..857a92f902 100644 --- a/workspaces/scorecard/plugins/scorecard/src/components/Scorecard/EntityScorecardContent.tsx +++ b/workspaces/scorecard/plugins/scorecard/src/components/Scorecard/EntityScorecardContent.tsx @@ -24,10 +24,11 @@ import Scorecard from './Scorecard'; import { useScorecards } from '../../hooks/useScorecards'; import { getStatusConfig, resolveMetricTranslation } from '../../utils'; import PermissionRequiredState from '../Common/PermissionRequiredState'; +import { ScorecardStylesProvider } from '../ScorecardStylesProvider'; import { useTranslation } from '../../hooks/useTranslation'; import { CardLoading } from '../Common/CardLoading'; -export const EntityScorecardContent = () => { +const EntityScorecardContentInner = () => { const { data: scorecards, isLoading, error } = useScorecards(); const { t } = useTranslation(); @@ -102,3 +103,9 @@ export const EntityScorecardContent = () => { ); }; + +export const EntityScorecardContent = () => ( + + + +); diff --git a/workspaces/scorecard/plugins/scorecard/src/components/ScorecardHomepageSection/ScorecardHomepageCard.tsx b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardHomepageSection/ScorecardHomepageCard.tsx index 8fe2eaf008..db64a39de6 100644 --- a/workspaces/scorecard/plugins/scorecard/src/components/ScorecardHomepageSection/ScorecardHomepageCard.tsx +++ b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardHomepageSection/ScorecardHomepageCard.tsx @@ -23,6 +23,7 @@ import { EmptyStatePanel } from './EmptyStatePanel'; import { Metric } from '@red-hat-developer-hub/backstage-plugin-scorecard-common'; import { useMetricDisplayLabels } from '../../hooks/useMetricDisplayLabels'; import { CardLoading } from '../Common/CardLoading'; +import { ScorecardStylesProvider } from '../ScorecardStylesProvider'; /** Coerces unknown/missing values to a finite number for safe UI math (NaN → 0). */ function toSafeFiniteNumber(value: unknown): number { @@ -129,7 +130,9 @@ export const ScorecardHomepageCardWithProvider = (props: { showSubheader?: boolean; showInfo?: boolean; }) => ( - - - + + + + + ); diff --git a/workspaces/scorecard/plugins/scorecard/src/components/ScorecardPage/ScorecardPage.tsx b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardPage/ScorecardPage.tsx index c6f07b68ce..ee79c023b7 100644 --- a/workspaces/scorecard/plugins/scorecard/src/components/ScorecardPage/ScorecardPage.tsx +++ b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardPage/ScorecardPage.tsx @@ -25,6 +25,7 @@ import Divider from '@mui/material/Divider'; import { ScorecardQueryProvider } from '../../api'; import { ScorecardHomepageCard } from '../ScorecardHomepageSection/ScorecardHomepageCard'; import NotFoundState from '../Common/NotFoundState'; +import { ScorecardStylesProvider } from '../ScorecardStylesProvider'; import { useTranslation } from '../../hooks/useTranslation'; import { resolveMetricTranslation } from '../../utils/translationUtils'; @@ -125,7 +126,9 @@ export const ScorecardPage = () => { * when rendered outside a tree that already has a provider (e.g. on the homepage). */ export const ScorecardPageWithProvider = () => ( - - - + + + + + ); diff --git a/workspaces/scorecard/plugins/scorecard/src/components/ScorecardStylesProvider.tsx b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardStylesProvider.tsx new file mode 100644 index 0000000000..ee2f4dd820 --- /dev/null +++ b/workspaces/scorecard/plugins/scorecard/src/components/ScorecardStylesProvider.tsx @@ -0,0 +1,33 @@ +/* + * Copyright Red Hat, Inc. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import type { ReactNode } from 'react'; + +import { createGenerateClassName, StylesProvider } from '@mui/styles'; + +const generateClassName = createGenerateClassName({ + seed: 'scorecard', +}); + +export const ScorecardStylesProvider = ({ + children, +}: { + readonly children: ReactNode; +}) => ( + + {children} + +); diff --git a/workspaces/scorecard/yarn.lock b/workspaces/scorecard/yarn.lock index 533b452791..45de5b9452 100644 --- a/workspaces/scorecard/yarn.lock +++ b/workspaces/scorecard/yarn.lock @@ -8464,7 +8464,7 @@ __metadata: languageName: node linkType: hard -"@mui/material@npm:5.18.0, @mui/material@npm:^5.12.2, @mui/material@npm:^5.14.18": +"@mui/material@npm:5.18.0, @mui/material@npm:^5.12.2, @mui/material@npm:^5.14.18, @mui/material@npm:^5.18.0": version: 5.18.0 resolution: "@mui/material@npm:5.18.0" dependencies: @@ -12380,6 +12380,7 @@ __metadata: "@backstage/ui": "npm:^0.13.2" "@mui/icons-material": "npm:5.18.0" "@mui/material": "npm:5.18.0" + "@mui/styles": "npm:5.18.0" "@red-hat-developer-hub/backstage-plugin-scorecard-common": "workspace:^" "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.13.0" "@tanstack/react-query": "npm:^5.95.2" @@ -12399,9 +12400,9 @@ __metadata: languageName: unknown linkType: soft -"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.12.0": - version: 0.12.0 - resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.12.0" +"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.13.0": + version: 0.13.0 + resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.13.0" dependencies: "@mui/icons-material": "npm:^5.17.1" peerDependencies: @@ -12411,23 +12412,25 @@ __metadata: "@mui/icons-material": ^5.17.1 "@mui/material": ^5.0.0 react: ^16.13.1 || ^17.0.0 || ^18.0.0 - checksum: 10c0/9ccc7f5360089f5efe98e85eeb68af061e75306b09f2386605306c8b362b67f79855592f90e7ddb63c051dd585dd3bab7d8e5ff300f9f8cc6370ccef18aea983 + checksum: 10c0/561c04203e9047f4df3fd9a0c29eb0e6b578740899dc3da07870f807a4c3324fb6880e2501f168b60d9a121521eb1f6a9d65d9d837e803f469415e2c0f526053 languageName: node linkType: hard -"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.13.0": - version: 0.13.0 - resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.13.0" +"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.14.0": + version: 0.14.7 + resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.14.7" dependencies: + "@backstage/frontend-plugin-api": "npm:^0.15.1" + "@backstage/plugin-app-react": "npm:^0.2.1" "@mui/icons-material": "npm:^5.17.1" peerDependencies: - "@backstage/core-plugin-api": ^1.12.0 - "@backstage/theme": ^0.7.0 + "@backstage/core-plugin-api": ^1.12.4 + "@backstage/theme": ^0.7.2 "@material-ui/icons": ^4.11.3 "@mui/icons-material": ^5.17.1 "@mui/material": ^5.0.0 react: ^16.13.1 || ^17.0.0 || ^18.0.0 - checksum: 10c0/561c04203e9047f4df3fd9a0c29eb0e6b578740899dc3da07870f807a4c3324fb6880e2501f168b60d9a121521eb1f6a9d65d9d837e803f469415e2c0f526053 + checksum: 10c0/6b8f066fb2b4884478888574860127b235bb54ec1ae11599ac7423d0cc8a598a172b87d3e0df0756f50d338731de802fbfaaa452dd7796f5de49ff741122510b languageName: node linkType: hard @@ -17340,14 +17343,15 @@ __metadata: "@backstage/test-utils": "npm:^1.7.16" "@backstage/theme": "npm:^0.7.2" "@backstage/ui": "npm:^0.13.2" - "@material-ui/core": "npm:^4.12.2" - "@material-ui/icons": "npm:^4.9.1" + "@mui/icons-material": "npm:5.18.0" + "@mui/material": "npm:5.18.0" + "@mui/styles": "npm:5.18.0" "@openshift/dynamic-plugin-sdk": "npm:^5.0.1" "@playwright/test": "npm:1.60.0" "@red-hat-developer-hub/backstage-plugin-dynamic-home-page": "npm:^1.10.2" "@red-hat-developer-hub/backstage-plugin-scorecard": "workspace:^" "@red-hat-developer-hub/backstage-plugin-scorecard-common": "workspace:^" - "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.12.0" + "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.14.0" "@roadiehq/backstage-plugin-github-pull-requests": "npm:^3.5.1" "@roadiehq/backstage-plugin-jira": "npm:^2.13.1" "@scalprum/react-core": "npm:0.11.1" @@ -17398,12 +17402,12 @@ __metadata: "@backstage/plugin-techdocs": "npm:^1.17.2" "@backstage/plugin-user-settings": "npm:^0.9.1" "@backstage/ui": "npm:^0.13.2" - "@material-ui/core": "npm:^4.12.2" "@mui/icons-material": "npm:^5.18.0" + "@mui/material": "npm:^5.18.0" "@red-hat-developer-hub/backstage-plugin-dynamic-home-page": "npm:1.11.0" "@red-hat-developer-hub/backstage-plugin-scorecard": "workspace:^" "@red-hat-developer-hub/backstage-plugin-scorecard-common": "workspace:^" - "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.13.0" + "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.14.0" "@types/react": "npm:^18" react: "npm:^18.0.2" react-dom: "npm:^18.0.2"