@web-seven/backstage-plugin-scaffolder-extensions
v0.0.12
Published
This plugin for Backstage provides a `ScaffolderFieldExtensions` that enhances the functionality of the `EntityPicker` field. The plugin allows you to select and use as value the entire object of the selected entity or select which field of Entity will be
Downloads
183
Readme
EntityObjectPicker Field Extension Plugin
This plugin for Backstage provides a ScaffolderFieldExtensions
that enhances the functionality of the EntityPicker
field. The plugin allows you to select and use as value the entire object of the selected entity or select which field of Entity will be used as value. Also this plugin provide custom ReviewStepComponent to show in preview link to selected entity.
Configuration
EntityValuePicker
Configuration is done through the field's settings in the template. The following options are supported:
ui:options.labelVariant
: Specifies which variant of thelabel
should be used for displaying the options. The supported values are:primaryTitle
: The primary title of the entity.secondaryTitle
: The secondary title of the entity.entityRef
: The entity reference.
ui:options.valuePath
: Specifies which field of selected entity will be used as value.
EntityObjectPicker
ui:options.labelVariant
: same as for EntityValuePicker
Example Usage
To use the field extension, you need to import it and add the following section to the ScaffolderPage
route in App.tsx
:
import {
EntityObjectPickerFieldExtension,
EntityValuePickerFieldExtension
} from '@web-seven/backstage-plugin-scaffolder-extensions';
<Route path="/create" element={<ScaffolderPage />}>
<ScaffolderFieldExtensions>
<EntityObjectPickerFieldExtension />
<EntityValuePickerFieldExtension />
</ScaffolderFieldExtensions>
</Route>
To use the custom ReviewStepComponent, you need to import it and add the following prop for ScaffolderPage
component in App.tsx
:
import { ReviewStepComponent } from '@web-seven/backstage-plugin-scaffolder-extensions';
<Route path="/create" element={<ScaffolderPage components={{ReviewStepComponent}} />}>
...
</Route>
Example configuration of the EntityObjectPicker
field in a template:
ui:field: EntityObjectPicker
ui:options:
labelVariant: primaryTitle
Example configuration of the EntityValuePicker
field in a template:
ui:field: EntityObjectPicker
ui:options:
labelVariant: primaryTitle,
valuePath: metadata.name