docs: address copilot review feedback
Fix links in viewing-catalog.md and filter-catalog.md to point to the new frontend system catalog-customization.md instead of the old guide. Fix the Kubernetes entity content extension ID to use the correct `entity-content:kubernetes/kubernetes` format. Wrap raw extension definitions in `createFrontendModule` in search and scaffolder docs. Correct TechDocs addon installation instructions to explicitly install addon modules rather than claiming auto-discovery. Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com> Made-with: Cursor
This commit is contained in:
@@ -24,7 +24,7 @@ The Kubernetes tab is shown by default for entities where Kubernetes data is ava
|
||||
```yaml title="app-config.yaml"
|
||||
app:
|
||||
extensions:
|
||||
- entity-content:kubernetes:
|
||||
- entity-content:kubernetes/kubernetes:
|
||||
config:
|
||||
filter:
|
||||
metadata.annotations.backstage.io/kubernetes-id:
|
||||
|
||||
@@ -119,14 +119,24 @@ export const MySearchResultListItem = SearchResultListItemBlueprint.make({
|
||||
});
|
||||
```
|
||||
|
||||
Install this in your app by passing it to `createApp`:
|
||||
Install this in your app by wrapping it in a frontend module and passing it to `createApp`:
|
||||
|
||||
```tsx title="packages/app/src/search/searchModule.ts"
|
||||
import { createFrontendModule } from '@backstage/frontend-plugin-api';
|
||||
import { MySearchResultListItem } from './MySearchResultListItem';
|
||||
|
||||
export const searchCustomizations = createFrontendModule({
|
||||
pluginId: 'search',
|
||||
extensions: [MySearchResultListItem],
|
||||
});
|
||||
```
|
||||
|
||||
```tsx title="packages/app/src/App.tsx"
|
||||
import { createApp } from '@backstage/frontend-defaults';
|
||||
import { MySearchResultListItem } from './search/MySearchResultListItem';
|
||||
import { searchCustomizations } from './search/searchModule';
|
||||
|
||||
const app = createApp({
|
||||
features: [MySearchResultListItem],
|
||||
features: [searchCustomizations],
|
||||
});
|
||||
|
||||
export default app.createRoot();
|
||||
|
||||
@@ -178,14 +178,24 @@ The extension is then exported from your plugin's alpha entry point and
|
||||
automatically discovered when the plugin is installed.
|
||||
|
||||
If you need to provide a search result list item extension from your app
|
||||
rather than a plugin, you can install it directly in `createApp`:
|
||||
rather than a plugin, wrap it in a frontend module and pass it to `createApp`:
|
||||
|
||||
```tsx title="packages/app/src/search/searchModule.ts"
|
||||
import { createFrontendModule } from '@backstage/frontend-plugin-api';
|
||||
import { YourSearchResultListItem } from './YourSearchResultListItem';
|
||||
|
||||
export const searchCustomizations = createFrontendModule({
|
||||
pluginId: 'search',
|
||||
extensions: [YourSearchResultListItem],
|
||||
});
|
||||
```
|
||||
|
||||
```tsx title="packages/app/src/App.tsx"
|
||||
import { createApp } from '@backstage/frontend-defaults';
|
||||
import { YourSearchResultListItem } from './search/YourSearchResultListItem';
|
||||
import { searchCustomizations } from './search/searchModule';
|
||||
|
||||
const app = createApp({
|
||||
features: [YourSearchResultListItem],
|
||||
features: [searchCustomizations],
|
||||
});
|
||||
|
||||
export default app.createRoot();
|
||||
|
||||
@@ -117,14 +117,24 @@ export const ValidateKebabCaseFieldExtension = FormFieldBlueprint.make({
|
||||
export { ValidateKebabCaseFieldExtension } from './extensions';
|
||||
```
|
||||
|
||||
Once the extension is created, install it in your app by passing it to `createApp`:
|
||||
Once the extension is created, install it in your app by wrapping it in a frontend module and passing it to `createApp`:
|
||||
|
||||
```tsx title="packages/app/src/scaffolder/scaffolderModule.ts"
|
||||
import { createFrontendModule } from '@backstage/frontend-plugin-api';
|
||||
import { ValidateKebabCaseFieldExtension } from './ValidateKebabCase';
|
||||
|
||||
export const scaffolderCustomizations = createFrontendModule({
|
||||
pluginId: 'scaffolder',
|
||||
extensions: [ValidateKebabCaseFieldExtension],
|
||||
});
|
||||
```
|
||||
|
||||
```tsx title="packages/app/src/App.tsx"
|
||||
import { createApp } from '@backstage/frontend-defaults';
|
||||
import { ValidateKebabCaseFieldExtension } from './scaffolder/ValidateKebabCase';
|
||||
import { scaffolderCustomizations } from './scaffolder/scaffolderModule';
|
||||
|
||||
const app = createApp({
|
||||
features: [ValidateKebabCaseFieldExtension],
|
||||
features: [scaffolderCustomizations],
|
||||
});
|
||||
|
||||
export default app.createRoot();
|
||||
|
||||
@@ -29,15 +29,30 @@ The plugin provides a docs index page at `/docs` and a reader page for individua
|
||||
|
||||
## Using TechDocs Addons
|
||||
|
||||
The TechDocs Addon framework lets you render React components in documentation pages. Addons are provided as separate plugin packages that are automatically discovered when installed.
|
||||
The TechDocs Addon framework lets you render React components in documentation pages. Addons are provided as separate plugin modules.
|
||||
|
||||
For example, to add the Report Issue addon:
|
||||
For example, to add the Report Issue addon, first install the package:
|
||||
|
||||
```bash title="From your Backstage root directory"
|
||||
yarn --cwd packages/app add @backstage/plugin-techdocs-module-addons-contrib
|
||||
```
|
||||
|
||||
Once installed, the addon is automatically active. You can see it in action when you highlight text in your documentation:
|
||||
Then install the addon module in your app:
|
||||
|
||||
```tsx title="packages/app/src/App.tsx"
|
||||
import { createApp } from '@backstage/frontend-defaults';
|
||||
import { techDocsReportIssueAddonModule } from '@backstage/plugin-techdocs-module-addons-contrib/alpha';
|
||||
|
||||
const app = createApp({
|
||||
features: [techDocsReportIssueAddonModule],
|
||||
});
|
||||
|
||||
export default app.createRoot();
|
||||
```
|
||||
|
||||
The same package also provides `techDocsExpandableNavigationAddonModule`, `techDocsTextSizeAddonModule`, and `techDocsLightBoxAddonModule`.
|
||||
|
||||
You can see the Report Issue addon in action when you highlight text in your documentation:
|
||||
|
||||
<!-- todo: Needs zoomable plugin -->
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@ Audience: All
|
||||
|
||||
## Overview
|
||||
|
||||
The Catalog can be filtered by any combination of owner, kind, type, lifecycle, processing status, namespace, and name. [Customize Filters](../features/software-catalog/catalog-customization--old.md#customize-filters) provides information on how to modify the available filter criteria.
|
||||
The Catalog can be filtered by any combination of owner, kind, type, lifecycle, processing status, namespace, and name. [Catalog filters](../features/software-catalog/catalog-customization.md#catalog-filters) provides information on how to modify the available filter criteria.
|
||||
|
||||

|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ Initially, the Catalog displays registered entities matching the following filte
|
||||
- `Processing Status` - normal
|
||||
- `Namespace` - The ID of a [namespace](../features/software-catalog/descriptor-format.md#namespace-optional) to which the entity belongs
|
||||
|
||||
You can change the initial setting for the [Owner](../features/software-catalog/catalog-customization--old.md#initially-selected-filter) and [Kind](../features/software-catalog/catalog-customization--old.md#initially-selected-kind) filters.
|
||||
You can change the initial setting for the [Owner](../features/software-catalog/catalog-customization.md#catalog-filters) and [Kind](../features/software-catalog/catalog-customization.md#catalog-filters) filters.
|
||||
|
||||
## Informational columns for each entity
|
||||
|
||||
@@ -55,7 +55,7 @@ For each kind of entity, a set of columns display information regarding the enti
|
||||
- `Tags` - an optional field that can be used for searching
|
||||
- `Actions` - see [Catalog Actions](#catalog-actions)
|
||||
|
||||
You can modify the columns associated with each kind of entity, following the instructions in [Customize Columns](../features/software-catalog/catalog-customization--old.md#customize-columns).
|
||||
You can modify the columns associated with each kind of entity, following the instructions in [Customizing columns, actions, and table options](../features/software-catalog/catalog-customization.md#customizing-columns-actions-and-table-options).
|
||||
|
||||
## Catalog Actions
|
||||
|
||||
@@ -69,7 +69,7 @@ From left to right, the actions are:
|
||||
- Edit - Edit the `catalog-info.yaml` file that defines the entity. See [Updating a Component](../getting-started/update-a-component.md)
|
||||
- Star - Designate the entity as a favorite. You can [filter](../getting-started/filter-catalog.md) the catalog for starred entities.
|
||||
|
||||
[Customize Actions](../features/software-catalog/catalog-customization--old.md#customize-actions) describes how you can modify the actions that are displayed.
|
||||
[Customizing columns, actions, and table options](../features/software-catalog/catalog-customization.md#customizing-columns-actions-and-table-options) describes how you can modify the actions that are displayed.
|
||||
|
||||
## Viewing entity details
|
||||
|
||||
|
||||
Reference in New Issue
Block a user