Merge pull request #33193 from backstage/rugvip/nfs-icon-sizing

frontend-app-api: align icon sizing in nfs

plugins/api-docs/src/alpha.tsx

@@ -43,7 +43,7 @@ const apiDocsNavItem = NavItemBlueprint.make({
   params: {
     title: 'APIs',
     routeRef: rootRoute,
-    icon: () => <AppIcon id="kind:api" />,
+    icon: () => <AppIcon fontSize="inherit" id="kind:api" />,
   },
 });
 
@@ -211,7 +211,7 @@ const apiDocsApisEntityContent = EntityContentBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'api-docs',
   title: 'APIs',
-  icon: <AppIcon id="kind:api" />,
+  icon: <AppIcon fontSize="inherit" id="kind:api" />,
   info: { packageJson: () => import('../package.json') },
   routes: {
     root: rootRoute,

plugins/app/src/extensions/AppNav.tsx

@@ -172,6 +172,7 @@ function NavContentRenderer(props: {
       // We want the priority: page (config/params) -> nav item -> plugin -> pluginId
       const resolvedTitle = node.instance.getData(coreExtensionData.title);
       const pluginTitle = node.spec.plugin.title;
+      const pluginIcon = node.spec.plugin.icon;
       const pluginId = node.spec.plugin.pluginId;
       const hasExplicitPageTitle =
         resolvedTitle !== undefined &&
@@ -194,6 +195,8 @@ function NavContentRenderer(props: {
         icon = <NavItemIcon />;
       } else if (resolvedIcon) {
         icon = resolvedIcon;
+      } else if (pluginIcon) {
+        icon = pluginIcon;
       }
 
       if (!title || !icon) {

plugins/catalog-unprocessed-entities/src/alpha/plugin.tsx

@@ -69,7 +69,7 @@ export const catalogUnprocessedEntitiesNavItem = NavItemBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'catalog-unprocessed-entities',
   title: 'Unprocessed Entities',
-  icon: <QueueIcon />,
+  icon: <QueueIcon fontSize="inherit" />,
   info: { packageJson: () => import('../../package.json') },
   routes: {
     root: rootRouteRef,

plugins/catalog/src/alpha/pages.tsx

@@ -59,7 +59,7 @@ export const catalogPage = PageBlueprint.makeWithOverrides({
     return originalFactory({
       path: '/catalog',
       routeRef: rootRouteRef,
-      icon: <CategoryIcon />,
+      icon: <CategoryIcon fontSize="inherit" />,
       title: 'Catalog',
       loader: async () => {
         const { BaseCatalogPage } = await import('../components/CatalogPage');

plugins/catalog/src/alpha/plugin.tsx

@@ -40,7 +40,7 @@ import contextMenuItems from './contextMenuItems';
 export default createFrontendPlugin({
   pluginId: 'catalog',
   title: 'Catalog',
-  icon: <CategoryIcon />,
+  icon: <CategoryIcon fontSize="inherit" />,
   info: {
     packageJson: () => import('../../package.json'),
   },

plugins/devtools/src/alpha/plugin.tsx

@@ -89,7 +89,7 @@ export const devToolsNavItem = NavItemBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'devtools',
   title: 'DevTools',
-  icon: <BuildIcon />,
+  icon: <BuildIcon fontSize="inherit" />,
   info: { packageJson: () => import('../../package.json') },
   routes: {
     root: rootRouteRef,

plugins/scaffolder/src/alpha/plugin.tsx

@@ -61,7 +61,7 @@ const scaffolderEntityIconLink = EntityIconLinkBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'scaffolder',
   title: 'Create',
-  icon: <CreateComponentIcon />,
+  icon: <CreateComponentIcon fontSize="inherit" />,
   info: { packageJson: () => import('../../package.json') },
   routes: {
     root: rootRouteRef,

plugins/search/src/alpha.tsx

@@ -277,7 +277,7 @@ export const searchNavItem = NavItemBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'search',
   title: 'Search',
-  icon: <SearchIcon />,
+  icon: <SearchIcon fontSize="inherit" />,
   info: { packageJson: () => import('../package.json') },
   extensions: [searchApi, searchPage, searchNavItem],
   routes: {

plugins/techdocs/src/alpha/index.tsx

@@ -280,7 +280,7 @@ const techDocsNavItem = NavItemBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'techdocs',
   title: 'Docs',
-  icon: <LibraryBooks />,
+  icon: <LibraryBooks fontSize="inherit" />,
   info: { packageJson: () => import('../../package.json') },
   extensions: [
     techDocsClientApi,

plugins/user-settings/src/alpha.tsx

@@ -63,7 +63,7 @@ export const settingsNavItem = NavItemBlueprint.make({
 export default createFrontendPlugin({
   pluginId: 'user-settings',
   title: 'Settings',
-  icon: <SettingsIcon />,
+  icon: <SettingsIcon fontSize="inherit" />,
   info: { packageJson: () => import('../package.json') },
   extensions: [userSettingsPage, settingsNavItem],
   routes: {