add support to the new frontend system

Signed-off-by: Nurit Izrailov <nuriti@spotify.com>
2024-07-23 11:33:26 -04:00
parent 2ab03460d5
commit e6c15cc304
14 changed files with 363 additions and 1 deletions
@@ -26,8 +26,38 @@ For more information, see the [formal documentation about the Kubernetes feature

 ## Getting started

-Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/kubernetes](http://localhost:3000/kubernetes).
+Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/kubernetes](http://localhost:3000/catalog/default/component/:component-name/kubernetes).

 You can also serve the plugin in isolation by running `yarn start` in the plugin directory.
 This method of serving the plugin provides quicker iteration speed and a faster startup and hot reloads.
 It is only meant for local development, and the setup for it can be found inside the [/dev](./dev) directory.
+
+### Integrating with `EntityPage` (New Frontend System)
+
+Follow this section if you are using Backstage's [new frontend system](https://backstage.io/docs/frontend-system/).
+
+1. Import `kubernetesPlugin` in your `App.tsx` and add it to your app's `features` array:
+
+```typescript
+import kubernetesPlugin from '@backstage/plugin-kubernetes/alpha';
+
+// ...
+
+export const app = createApp({
+  features: [
+    // ...
+    kubernetesPlugin,
+    // ...
+  ],
+});
+```
+
+2. Next, enable your desired extensions in `app-config.yaml`
+
+```yaml
+app:
+  extensions:
+    - entity-content:kubernetes/kubernetes
+```
+
+Now, the extension appears on your entity page as one of the tabs, which is called `KUBERNETES`