core-app-api: add missing core feature icons + move icon things around a bit

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/app-defaults/src/defaults/icons.tsx

@@ -18,6 +18,9 @@ import { IconComponent } from '@backstage/core-plugin-api';
 import MuiApartmentIcon from '@material-ui/icons/Apartment';
 import MuiBrokenImageIcon from '@material-ui/icons/BrokenImage';
 import MuiCategoryIcon from '@material-ui/icons/Category';
+import MuiCreateNewFolderIcon from '@material-ui/icons/CreateNewFolder';
+import MuiSubjectIcon from '@material-ui/icons/Subject';
+import MuiSearchIcon from '@material-ui/icons/Search';
 import MuiChatIcon from '@material-ui/icons/Chat';
 import MuiDashboardIcon from '@material-ui/icons/Dashboard';
 import MuiDocsIcon from '@material-ui/icons/Description';
@@ -36,6 +39,9 @@ export const icons = {
   brokenImage: MuiBrokenImageIcon as IconComponent,
   // To be confirmed: see https://github.com/backstage/backstage/issues/4970
   catalog: MuiMenuBookIcon as IconComponent,
+  scaffolder: MuiCreateNewFolderIcon as IconComponent,
+  techdocs: MuiSubjectIcon as IconComponent,
+  search: MuiSearchIcon as IconComponent,
   chat: MuiChatIcon as IconComponent,
   dashboard: MuiDashboardIcon as IconComponent,
   docs: MuiDocsIcon as IconComponent,

packages/core-app-api/api-report.md

@@ -165,7 +165,7 @@ export type AppContext = {
   getComponents(): AppComponents;
 };
 
-// @public (undocumented)
+// @public
 export type AppIcons = {
   'kind:api': IconComponent;
   'kind:component': IconComponent;
@@ -183,6 +183,9 @@ export type AppIcons = {
   github: IconComponent;
   group: IconComponent;
   help: IconComponent;
+  scaffolder: IconComponent;
+  search: IconComponent;
+  techdocs: IconComponent;
   user: IconComponent;
   warning: IconComponent;
 };

packages/core-app-api/src/app/AppManager.test.tsx

@@ -24,7 +24,6 @@ import { lightTheme } from '@backstage/theme';
 import { render, screen } from '@testing-library/react';
 import React, { PropsWithChildren } from 'react';
 import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
-import { defaultAppIcons } from './icons';
 import {
   configApiRef,
   createApiFactory,
@@ -38,7 +37,7 @@ import {
   analyticsApiRef,
 } from '@backstage/core-plugin-api';
 import { generateBoundRoutes, AppManager } from './AppManager';
-import { AppComponents } from './types';
+import { AppComponents, AppIcons } from './types';
 
 describe('generateBoundRoutes', () => {
   it('runs happy path', () => {
@@ -187,6 +186,8 @@ describe('Integration Test', () => {
     ThemeProvider: ({ children }) => <>{children}</>,
   };
 
+  const icons = {} as AppIcons;
+
   it('runs happy paths', async () => {
     const app = new AppManager({
       apis: [noOpAnalyticsApi],
@@ -199,7 +200,7 @@ describe('Integration Test', () => {
           theme: lightTheme,
         },
       ],
-      icons: defaultAppIcons,
+      icons,
       plugins: [],
       components,
       bindRoutes: ({ bind }) => {
@@ -253,7 +254,7 @@ describe('Integration Test', () => {
           theme: lightTheme,
         },
       ],
-      icons: defaultAppIcons,
+      icons,
       plugins: [],
       components,
       bindRoutes: ({ bind }) => {
@@ -310,7 +311,7 @@ describe('Integration Test', () => {
           theme: lightTheme,
         },
       ],
-      icons: defaultAppIcons,
+      icons,
       plugins: [
         createPlugin({
           id: 'test',
@@ -360,7 +361,7 @@ describe('Integration Test', () => {
           theme: lightTheme,
         },
       ],
-      icons: defaultAppIcons,
+      icons,
       plugins: [],
       components,
       bindRoutes: ({ bind }) => {
@@ -420,7 +421,7 @@ describe('Integration Test', () => {
           theme: lightTheme,
         },
       ],
-      icons: defaultAppIcons,
+      icons,
       plugins: [],
       components,
       bindRoutes: ({ bind }) => {

packages/core-app-api/src/app/icons.tsx

@@ -1,87 +0,0 @@
-/*
- * Copyright 2020 The Backstage Authors
- *
- * 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 { IconComponent } from '@backstage/core-plugin-api';
-import MuiApartmentIcon from '@material-ui/icons/Apartment';
-import MuiBrokenImageIcon from '@material-ui/icons/BrokenImage';
-import MuiCategoryIcon from '@material-ui/icons/Category';
-import MuiCreateNewFolderIcon from '@material-ui/icons/CreateNewFolder';
-import MuiSubjectIcon from '@material-ui/icons/Subject';
-import MuiSearchIcon from '@material-ui/icons/Search';
-import MuiChatIcon from '@material-ui/icons/Chat';
-import MuiDashboardIcon from '@material-ui/icons/Dashboard';
-import MuiDocsIcon from '@material-ui/icons/Description';
-import MuiEmailIcon from '@material-ui/icons/Email';
-import MuiExtensionIcon from '@material-ui/icons/Extension';
-import MuiGitHubIcon from '@material-ui/icons/GitHub';
-import MuiHelpIcon from '@material-ui/icons/Help';
-import MuiLocationOnIcon from '@material-ui/icons/LocationOn';
-import MuiMemoryIcon from '@material-ui/icons/Memory';
-import MuiMenuBookIcon from '@material-ui/icons/MenuBook';
-import MuiPeopleIcon from '@material-ui/icons/People';
-import MuiPersonIcon from '@material-ui/icons/Person';
-import MuiWarningIcon from '@material-ui/icons/Warning';
-
-/** @public */
-export type AppIcons = {
-  'kind:api': IconComponent;
-  'kind:component': IconComponent;
-  'kind:domain': IconComponent;
-  'kind:group': IconComponent;
-  'kind:location': IconComponent;
-  'kind:system': IconComponent;
-  'kind:user': IconComponent;
-
-  brokenImage: IconComponent;
-  catalog: IconComponent;
-  chat: IconComponent;
-  dashboard: IconComponent;
-  docs: IconComponent;
-  email: IconComponent;
-  github: IconComponent;
-  group: IconComponent;
-  help: IconComponent;
-  scaffolder: IconComponent;
-  search: IconComponent;
-  techdocs: IconComponent;
-  user: IconComponent;
-  warning: IconComponent;
-};
-
-export const defaultAppIcons: AppIcons = {
-  brokenImage: MuiBrokenImageIcon,
-  // To be confirmed: see https://github.com/backstage/backstage/issues/4970
-  catalog: MuiMenuBookIcon,
-  scaffolder: MuiCreateNewFolderIcon,
-  techdocs: MuiSubjectIcon,
-  search: MuiSearchIcon,
-  chat: MuiChatIcon,
-  dashboard: MuiDashboardIcon,
-  docs: MuiDocsIcon,
-  email: MuiEmailIcon,
-  github: MuiGitHubIcon,
-  group: MuiPeopleIcon,
-  help: MuiHelpIcon,
-  'kind:api': MuiExtensionIcon,
-  'kind:component': MuiMemoryIcon,
-  'kind:domain': MuiApartmentIcon,
-  'kind:group': MuiPeopleIcon,
-  'kind:location': MuiLocationOnIcon,
-  'kind:system': MuiCategoryIcon,
-  'kind:user': MuiPersonIcon,
-  user: MuiPersonIcon,
-  warning: MuiWarningIcon,
-};

packages/core-app-api/src/app/index.ts

@@ -17,5 +17,4 @@
 export { createApp } from './createApp';
 export { createSpecializedApp } from './createSpecializedApp';
 export { defaultConfigLoader } from './defaultConfigLoader';
-export type { AppIcons } from './icons';
 export * from './types';

packages/core-app-api/src/app/types.ts

@@ -27,7 +27,6 @@ import {
   PluginOutput,
 } from '@backstage/core-plugin-api';
 import { AppConfig } from '@backstage/config';
-import { AppIcons } from './icons';
 
 /**
  * Props for the `BootErrorPage` component of {@link AppComponents}.
@@ -111,6 +110,36 @@ export type AppComponents = {
   SignInPage?: ComponentType<SignInPageProps>;
 };
 
+/**
+ * A set of well-known icons that should be available within an app.
+ *
+ * @public
+ */
+export type AppIcons = {
+  'kind:api': IconComponent;
+  'kind:component': IconComponent;
+  'kind:domain': IconComponent;
+  'kind:group': IconComponent;
+  'kind:location': IconComponent;
+  'kind:system': IconComponent;
+  'kind:user': IconComponent;
+
+  brokenImage: IconComponent;
+  catalog: IconComponent;
+  chat: IconComponent;
+  dashboard: IconComponent;
+  docs: IconComponent;
+  email: IconComponent;
+  github: IconComponent;
+  group: IconComponent;
+  help: IconComponent;
+  scaffolder: IconComponent;
+  search: IconComponent;
+  techdocs: IconComponent;
+  user: IconComponent;
+  warning: IconComponent;
+};
+
 /**
  * A function that loads in the App config that will be accessible via the ConfigApi.
  *

packages/test-utils/src/testUtils/appWrappers.tsx

@@ -41,6 +41,9 @@ const mockIcons = {
 
   brokenImage: () => <span />,
   catalog: () => <span />,
+  scaffolder: () => <span />,
+  techdocs: () => <span />,
+  search: () => <span />,
   chat: () => <span />,
   dashboard: () => <span />,
   docs: () => <span />,