docs(catalog-unprocessed-entities): update README for new frontend system as default

Make package discovery the default installation path. Move old frontend
system wiring to an "Old Frontend System" section and remove the
separate "Integrating with the New Frontend System" section.

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
Made-with: Cursor
This commit is contained in:
Patrik Oldsberg
2026-03-04 11:40:38 +01:00
parent 8c4a718067
commit db7d147d17
+16 -39
View File
@@ -32,7 +32,22 @@ Requires the `@backstage/plugin-catalog-backend-module-unprocessed` module to be
yarn --cwd packages/app add @backstage/plugin-catalog-unprocessed-entities
```
Import into your `App.tsx` and include into the `<FlatRoutes>` component:
Once installed, the plugin is automatically available in your app through the default package discovery. For more details and alternative installation methods, see [installing plugins](https://backstage.io/docs/frontend-system/building-apps/installing-plugins).
You can optionally add unprocessed entities as a tab in DevTools through configuration:
```yaml
app:
extensions:
# Enable the catalog-unprocessed-entities tab in devtools
- devtools-content:catalog-unprocessed-entities: true
# Disable the catalog-unprocessed-entities element outside devtools including the sidebar
- page:catalog-unprocessed-entities: false
```
## Old Frontend System
If your Backstage app uses the old frontend system, import into your `App.tsx` and include into the `<FlatRoutes>` component:
```tsx title="packages/app/src/App.tsx"
import { CatalogUnprocessedEntitiesPage } from '@backstage/plugin-catalog-unprocessed-entities';
@@ -44,44 +59,6 @@ import { CatalogUnprocessedEntitiesPage } from '@backstage/plugin-catalog-unproc
/>;
```
### Integrating with the New Frontend System
Follow this section if you are using Backstage's [new frontend system](https://backstage.io/docs/frontend-system/).
Import `catalogUnprocessedEntitiesPlugin` in your `App.tsx` and add it to your app's `features` array:
```typescript
import catalogUnprocessedEntitiesPlugin from '@backstage/plugin-catalog-unprocessed-entities';
import { unprocessedEntitiesDevToolsContent } from '@backstage/plugin-catalog-unprocessed-entities/alpha';
// Optionally add unprocessed entities route to devtools
const devtoolsPluginUnprocessed = createFrontendModule({
pluginId: 'catalog-unprocessed-entities',
extensions: [unprocessedEntitiesDevToolsContent],
});
export const app = createApp({
features: [
// ...
catalogUnprocessedEntitiesPlugin,
// Optionally add unprocessed entities route to devtools
devtoolsPluginUnprocessed,
devtoolsPlugin, // devtools plugin needs to be added too, if autodiscover is disabled
// ...
],
});
```
```yaml
app:
extensions:
# Enable the catalog-unprocessed-entities tab in devtools
- devtools-content:catalog-unprocessed-entities: true
# Disable the catalog-unprocessed-entities element outside devtools including the sidebar
- page:catalog-unprocessed-entities: false
```
## Customization
If you want to use the provided endpoints in a different way, you can use the ApiRef doing the following: