chore: added some docs and cleanup the todos

Signed-off-by: blam <ben@blam.sh>
2024-07-23 08:01:34 +02:00
parent b1f3c44e42
commit 97abfa22b9
4 changed files with 32 additions and 2 deletions
@@ -45,6 +45,7 @@ This extension is the first extension attached to the extension tree. It is resp
 | themes       | The app themes list.       | [createThemeExtension.themeDataRef](https://backstage.io/docs/reference/frontend-plugin-api.createthemeextension.themedataref)                         | false    | See [default themes](#default-theme-extensions).          | [createThemeExtension](https://backstage.io/docs/reference/frontend-plugin-api.createthemeextension)             |
 | components   | The app components list.   | [createComponentExtension.componentDataRef](https://backstage.io/docs/reference/frontend-plugin-api.createcomponentextension.componentdataref)         | false    | See [default components](#default-components-extensions). | [createComponentExtension](https://backstage.io/docs/reference/frontend-plugin-api.createcomponentextension)     |
 | translations | The app translations list. | [createTranslationExtension.translationDataRef](https://backstage.io/docs/reference/frontend-plugin-api.createtranslationextension.translationdataref) | false    | -                                                         | [createTranslationExtension](https://backstage.io/docs/reference/frontend-plugin-api.createtranslationextension) |
+| icons        | The app icons list.        | [IconBundleBlueprint.dataRefs.icons](https://backstage.io/docs/reference/frontend-plugin-api.iconbundleblueprint.dataRefs.icons)                       | true     | -                                                         | [IconBundleBlueprint](https://backstage.io/docs/reference/frontend-plugin-api.iconbundleblueprint)               |

 #### Default theme extensions

@@ -314,6 +314,31 @@ const app = createApp({
 });
 ```

+### `icons`
+
+Icons are now installed as extensions, using the `IconBundleBlueprint` to make new instances which can be added to the app.
+
+```ts
+import { IconBundleBlueprint } from '@backstage/frontend-plugin-api';
+
+const exampleIconBundle = IconBundleBlueprint.make({
+  name: 'example-bundle',
+  params: {
+    icons: {
+      user: MyOwnUserIcon,
+    },
+  },
+});
+
+const app = createApp({
+  features: [
+    createExtensionOverrides({
+      extensions: [exampleIconBundle],
+    }),
+  ],
+});
+```
+
 ### `bindRoutes`

 Route bindings can still be done using this option, but you now also have the ability to bind routes using static configuration instead. See the section on [binding routes](../architecture/07-routes.md#binding-external-route-references) for more information.
@@ -38,6 +38,10 @@ Sign-in page extension have a single purpose - to implement a custom sign-in pag

 Theme extensions provide custom themes for the app. They are always attached to the app extension and you can have any number of themes extensions installed in an app at once, letting the user choose which theme to use.

+### Icons - [Reference](../../reference/frontend-plugin-api.iconbundleblueprint.md)
+
+Icon bundle extensions provide the ability to replace or provide new icons to the app. You can use the above blueprint to make new extension instances which can be installed into the app.
+
 ### Translation - [Reference](../../reference/frontend-plugin-api.createtranslationextension.md)

 Translation extension provide custom translation messages for the app. They can be used both to override the default english messages to custom ones, as well as provide translations for additional languages.
@@ -172,7 +172,7 @@ export interface CreateAppFeatureLoader {

 /** @public */
 export function createApp(options?: {
-  /** @deprecated - TODO */
+  /** @deprecated - Please use {@link @backstage/frontend-app-api#IconBundleBlueprint} to make new icon bundles which can be installed in the app seperately */
  icons?: { [key in string]: IconComponent };
  features?: (FrontendFeature | CreateAppFeatureLoader)[];
  configLoader?: () => Promise<{ config: ConfigApi }>;
@@ -248,7 +248,7 @@ export function createApp(options?: {
 * @public
 */
 export function createSpecializedApp(options?: {
-  /** @deprecated - TODO */
+  /** @deprecated - Please use {@link @backstage/frontend-app-api#IconBundleBlueprint} to make new icon bundles which can be installed in the app seperately */
  icons?: { [key in string]: IconComponent };
  features?: FrontendFeature[];
  config?: ConfigApi;