Merge pull request #20133 from backstage/rugvip/reconfigure

core-plugin-api: remove experimental plugin configuration API
This commit is contained in:
Patrik Oldsberg
2023-09-26 10:54:02 +02:00
committed by GitHub
126 changed files with 156 additions and 1140 deletions
-68
View File
@@ -1,68 +0,0 @@
---
id: customization
title: Customization (Experimental)
description: Documentation on adding a customization logic to the plugin
---
## Overview
The Backstage core logic provides a possibility to make the component customizable in such a way that the application
developer can redefine the labels, icons, elements or even completely replace the component. It's up to each plugin
to decide what can be customized.
## For a plugin developer
When you are creating your plugin, you have a possibility to use a metadata field and define there all
customizable elements. For example
```typescript jsx
const plugin = createPlugin({
id: 'my-plugin',
__experimentalConfigure(
options?: CatalogInputPluginOptions,
): CatalogPluginOptions {
const defaultOptions = {
createButtonTitle: 'Create',
};
return { ...defaultOptions, ...options };
},
});
```
And the rendering part of the exposed component can retrieve that metadata as:
```typescript jsx
export type CatalogPluginOptions = {
createButtonTitle: string;
};
export type CatalogInputPluginOptions = {
createButtonTitle: string;
};
export const useCatalogPluginOptions = () =>
usePluginOptions<CatalogPluginOptions>();
export function DefaultMyPluginWelcomePage() {
const { createButtonTitle } = useCatalogPluginOptions();
return (
<div>
<button>{createButtonTitle}</button>
</div>
);
}
```
## For an application developer using the plugin
The way to reconfigure the default values provided by the plugin you can do it via reconfigure method, defined on the
plugin. Example:
```typescript jsx
import { myPlugin } from '@backstage/my-plugin';
myPlugin.__experimentalReconfigure({
createButtonTitle: 'New',
});
```