paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 34 Packages Projects Releases Wiki Activity

Incorporated the feedback.

Browse Source 
Signed-off-by: bnechyporenko <bnechyporenko@bol.com>
This commit is contained in:
bnechyporenko
2022-07-06 11:46:41 +02:00
parent 4bfc953236
commit a66aabe733
14 changed files with 118 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
microsite/sidebars.json
-1
View File
@@ -212,7 +212,6 @@
"plugins/structure-of-a-plugin",
"plugins/integrating-plugin-into-software-catalog",
"plugins/integrating-search-into-plugins",
"plugins/customization",
"plugins/composability",
"plugins/analytics",
{
packages/core-plugin-api/package.json
+1 -1
View File
@@ -24,7 +24,7 @@
"main": "src/index.ts",
"types": "src/index.ts",
"scripts": {
"build": "backstage-cli package build",
"build": "backstage-cli package build --experimental-type-build",
"lint": "backstage-cli package lint",
"test": "backstage-cli package test",
"prepack": "backstage-cli package prepack",
packages/core-plugin-api/src/extensions/extensions.tsx
+3 -5
View File
@@ -21,7 +21,7 @@ import { RouteRef, useRouteRef } from '../routing';
import { attachComponentData } from './componentData';
import { Extension, BackstagePlugin } from '../plugin';
import { PluginErrorBoundary } from './PluginErrorBoundary';
import { PluginOptionsProvider } from '../plugin-options';
import { PluginProvider } from '../plugin-options';
/**
* Lazy or synchronous retrieving of extension components.
@@ -246,11 +246,9 @@ export function createReactExtension<
...(mountPoint && { routeRef: mountPoint.id }),
}}
>
<PluginOptionsProvider
pluginOptions={plugin.getPluginOptions()}
>
<PluginProvider plugin={plugin}>
<Component {...props} />
</PluginOptionsProvider>
</PluginProvider>
</AnalyticsContext>
</PluginErrorBoundary>
</Suspense>
packages/core-plugin-api/src/plugin-options/index.ts
+1 -1
View File
@@ -14,4 +14,4 @@
* limitations under the License.
*/
export { usePluginOptions, PluginOptionsProvider } from './usePluginOptions';
export { usePluginOptions, PluginProvider } from './usePluginOptions';
packages/core-plugin-api/src/plugin-options/usePluginOptions.test.tsx
+13 -7
View File
@@ -16,21 +16,27 @@
import React from 'react';
import { renderHook } from '@testing-library/react-hooks';
import { usePluginOptions, PluginOptionsProvider } from './usePluginOptions';
import { usePluginOptions, PluginProvider } from './usePluginOptions';
import { createPlugin, PluginOptions } from '../plugin';
describe('usePluginOptions', () => {
it('should provide a versioned value to hook', () => {
const plugin = createPlugin({
id: 'my-plugin',
options: { 'key-1': 'value-1', 'key-2': 'value-2' },
});
const rendered = renderHook(() => usePluginOptions(), {
wrapper: ({ children }) => (
<PluginOptionsProvider
pluginOptions={{ 'key-1': 'value-1', 'key-2': 'value-2' }}
>
{children}
</PluginOptionsProvider>
<PluginProvider plugin={plugin}>{children}</PluginProvider>
),
});
expect(rendered.result.current).toEqual({
const config = rendered.result.current.config as unknown as {
options: PluginOptions;
};
expect(config.options).toEqual({
'key-1': 'value-1',
'key-2': 'value-2',
});
packages/core-plugin-api/src/plugin-options/usePluginOptions.tsx
+9 -6
View File
@@ -19,7 +19,7 @@ import {
createVersionedValueMap,
useVersionedContext,
} from '@backstage/version-bridge';
import { PluginOptions } from '../plugin';
import { BackstagePlugin, PluginOptions } from '../plugin';
import React, { ReactNode } from 'react';
const contextKey: string = 'plugin-options-context';
@@ -31,14 +31,17 @@ const contextKey: string = 'plugin-options-context';
*/
export interface PluginOptionsProviderProps {
children: ReactNode;
pluginOptions?: PluginOptions;
plugin?: BackstagePlugin;
}
export const PluginOptionsProvider = ({
export const PluginProvider = ({
children,
pluginOptions,
plugin,
}: PluginOptionsProviderProps): JSX.Element => {
const value = { pluginOptions };
const providerPlugin = plugin as unknown as {
getPluginOptions(): PluginOptions;
};
const value = { pluginOptions: providerPlugin.getPluginOptions() };
const { Provider } = createVersionedContext<{ 1: PluginOptions }>(contextKey);
return (
<Provider value={createVersionedValueMap({ 1: value })}>
@@ -51,7 +54,7 @@ export const PluginOptionsProvider = ({
* Grab the current entity from the context, throws if the entity has not yet been loaded
* or is not available.
*
* @public
* @alpha
*/
export function usePluginOptions<
TPluginOptions extends PluginOptions = PluginOptions,
packages/core-plugin-api/src/plugin/Plugin.tsx
+5 -5
View File
@@ -60,15 +60,15 @@ export class PluginImpl<
return extension.expose(this);
}
reconfigure(options: PluginInputOptions): void {
if (this.config.configure) {
this.config.options = this.config.configure(options);
__experimentalReconfigure(options: PluginInputOptions): void {
if (this.config.__experimentalConfigure) {
this.config.options = this.config.__experimentalConfigure(options);
}
}
getPluginOptions(): PluginOptions {
if (this.config.configure && !this.config.options) {
this.config.options = this.config.configure();
if (this.config.__experimentalConfigure && !this.config.options) {
this.config.options = this.config.__experimentalConfigure();
}
return this.config.options ?? ({} as PluginOptions);
}
packages/core-plugin-api/src/plugin/types.ts
+2 -3
View File
@@ -68,10 +68,9 @@ export type BackstagePlugin<
*/
getFeatureFlags(): Iterable<PluginFeatureFlagConfig>;
provide<T>(extension: Extension<T>): T;
getPluginOptions(): PluginOptions;
reconfigure(options: PluginInputOptions): void;
routes: Routes;
externalRoutes: ExternalRoutes;
__experimentalReconfigure(options: PluginInputOptions): void;
};
/**
@@ -99,7 +98,7 @@ export type PluginConfig<
externalRoutes?: ExternalRoutes;
featureFlags?: PluginFeatureFlagConfig[];
options?: PluginOptions;
configure?(options?: PluginInputOptions): PluginOptions;
__experimentalConfigure?(options?: PluginInputOptions): PluginOptions;
};
/**
plugins/catalog-customized/package.json
+1 -1
View File
@@ -34,7 +34,7 @@
"clean": "backstage-cli package clean"
},
"dependencies": {
"@backstage/plugin-catalog": "^1.3.1-next.0",
"@backstage/plugin-catalog": "1.4.0-next.2",
"@backstage/plugin-catalog-react": "^1.1.2-next.0"
},
"peerDependencies": {
plugins/catalog-customized/src/plugin.ts
+1 -11
View File
@@ -16,18 +16,8 @@
import { catalogPlugin } from '@backstage/plugin-catalog';
import {
EntityOwnerPicker,
EntityTypePicker,
UserListPicker,
} from './components';
catalogPlugin.reconfigure({
EntityOwnerPicker,
EntityTypePicker,
UserListPicker,
catalogPlugin.__experimentalReconfigure({
createButtonTitle: 'Maybe Create',
showButtonText: 'Mine catalog entities',
});
export const customizedCatalog = catalogPlugin;
plugins/catalog/src/components/CatalogPage/DefaultCatalogPage.tsx
+6 -9
View File
@@ -34,14 +34,17 @@ import {
EntityLifecyclePicker,
EntityListProvider,
EntityProcessingStatusPicker,
EntityOwnerPicker,
EntityTagPicker,
EntityTypePicker,
UserListFilterKind,
UserListPicker,
} from '@backstage/plugin-catalog-react';
import React from 'react';
import { createComponentRouteRef } from '../../routes';
import { CatalogTable, CatalogTableRow } from '../CatalogTable';
import { CatalogKindHeader } from '../CatalogKindHeader';
import { CatalogPageOptionsProps } from '../../types';
import { CatalogPluginOptions } from '../../options';
/**
* Props for root catalog pages.
@@ -68,13 +71,7 @@ export function DefaultCatalogPage(props: DefaultCatalogPageProps) {
useApi(configApiRef).getOptionalString('organization.name') ?? 'Backstage';
const createComponentLink = useRouteRef(createComponentRouteRef);
const {
EntityOwnerPicker,
EntityTypePicker,
UserListPicker,
createButtonTitle,
showButtonText,
} = usePluginOptions<CatalogPageOptionsProps>();
const { createButtonTitle } = usePluginOptions<CatalogPluginOptions>();
return (
<PageWithHeader title={`${orgName} Catalog`} themeId="home">
@@ -87,7 +84,7 @@ export function DefaultCatalogPage(props: DefaultCatalogPageProps) {
title={createButtonTitle}
to={createComponentLink && createComponentLink()}
/>
<SupportButton>${showButtonText}</SupportButton>
<SupportButton>All your software catalog entities</SupportButton>
</ContentHeader>
<CatalogFilterLayout>
<CatalogFilterLayout.Filters>
plugins/catalog/src/types.ts → plugins/catalog/src/options.ts
+1 -10
View File
@@ -14,15 +14,6 @@
* limitations under the License.
*/
import {
EntityTypePickerProps,
UserListPickerProps,
} from '@backstage/plugin-catalog-react';
export type CatalogPageOptionsProps = {
EntityOwnerPicker: () => JSX.Element | null;
EntityTypePicker: (props: EntityTypePickerProps) => JSX.Element | null;
UserListPicker: (props: UserListPickerProps) => JSX.Element | null;
export type CatalogPluginOptions = {
createButtonTitle: string;
showButtonText: string;
};
plugins/catalog/src/plugin.ts
+2 -10
View File
@@ -18,10 +18,7 @@ import { CatalogClient } from '@backstage/catalog-client';
import { Entity } from '@backstage/catalog-model';
import {
catalogApiRef,
EntityOwnerPicker,
entityRouteRef,
EntityTypePicker,
UserListPicker,
starredEntitiesApiRef,
} from '@backstage/plugin-catalog-react';
import { createComponentRouteRef, viewTechDocRouteRef } from './routes';
@@ -34,6 +31,7 @@ import {
fetchApiRef,
storageApiRef,
PluginOptions,
PluginInputOptions,
} from '@backstage/core-plugin-api';
import { DefaultStarredEntitiesApi } from './apis';
import { AboutCardProps } from './components/AboutCard';
@@ -48,8 +46,6 @@ import { HasSystemsCardProps } from './components/HasSystemsCard';
import { RelatedEntitiesCardProps } from './components/RelatedEntitiesCard';
import { rootRouteRef } from './routes';
export interface PluginInputOptions {}
/** @public */
export const catalogPlugin = createPlugin({
id: 'catalog',
@@ -78,13 +74,9 @@ export const catalogPlugin = createPlugin({
createComponent: createComponentRouteRef,
viewTechDoc: viewTechDocRouteRef,
},
configure(options?: PluginInputOptions): PluginOptions {
__experimentalConfigure(options?: PluginInputOptions): PluginOptions {
const defaultOptions = {
EntityOwnerPicker,
EntityTypePicker,
UserListPicker,
createButtonTitle: 'Create',
showButtonText: 'All your software catalog entities',
};
if (!options) {
return defaultOptions;
yarn.lock
+73
View File
@@ -1602,6 +1602,51 @@
zen-observable "^0.8.15"
zod "^3.11.6"
"@backstage/core-components@^0.9.6-next.1":
version "0.9.6-next.1"
resolved "https://registry.npmjs.org/@backstage/core-components/-/core-components-0.9.6-next.1.tgz#52fc93339ee9f9adf11833fb6f54a6a2c7f6526e"
integrity sha512-TTNGzypjcDI7xAqSz+d3SLN7W2duHiOAebCiyoi38MHzHeQGjga7feBu0HuxEcXxfn8i6E0j3cdmZIlCIlcUXA==
dependencies:
"@backstage/config" "^1.0.1"
"@backstage/core-plugin-api" "^1.0.3"
"@backstage/errors" "^1.1.0-next.0"
"@backstage/theme" "^0.2.16-next.0"
"@backstage/version-bridge" "^1.0.1"
"@material-table/core" "^3.1.0"
"@material-ui/core" "^4.12.2"
"@material-ui/icons" "^4.9.1"
"@material-ui/lab" "4.0.0-alpha.57"
"@react-hookz/web" "^14.0.0"
"@types/react-sparklines" "^1.7.0"
"@types/react-text-truncate" "^0.14.0"
ansi-regex "^6.0.1"
classnames "^2.2.6"
d3-selection "^3.0.0"
d3-shape "^3.0.0"
d3-zoom "^3.0.0"
dagre "^0.8.5"
history "^5.0.0"
immer "^9.0.1"
lodash "^4.17.21"
pluralize "^8.0.0"
prop-types "^15.7.2"
qs "^6.9.4"
rc-progress "3.3.3"
react-helmet "6.1.0"
react-hook-form "^7.12.2"
react-markdown "^8.0.0"
react-router "6.0.0-beta.0"
react-router-dom "6.0.0-beta.0"
react-sparklines "^1.7.0"
react-syntax-highlighter "^15.4.5"
react-text-truncate "^0.19.0"
react-use "^17.3.2"
react-virtualized-auto-sizer "^1.0.6"
react-window "^1.8.6"
remark-gfm "^3.0.1"
zen-observable "^0.8.15"
zod "^3.11.6"
"@backstage/errors@^1.0.0":
version "1.0.0"
resolved "https://registry.npmjs.org/@backstage/errors/-/errors-1.0.0.tgz#08ebf53afdeaca32362955ea8551e8ffa0bb3cd7"
@@ -1677,6 +1722,33 @@
yaml "^1.10.0"
zen-observable "^0.8.15"
"@backstage/plugin-catalog@^1.3.1-next.0":
version "1.3.1-next.1"
resolved "https://registry.npmjs.org/@backstage/plugin-catalog/-/plugin-catalog-1.3.1-next.1.tgz#c191a6bc8bbef485a40dffe0a1d0ab9114497be2"
integrity sha512-aPSpX33ZHdok0ruJg5k7BPQd28k4ARjPHwEQCNvAVXLRJHIeU63ZOgsQPQ/iWSutRJE/6seELnZ1a4tWSGYe6Q==
dependencies:
"@backstage/catalog-client" "^1.0.4-next.1"
"@backstage/catalog-model" "^1.1.0-next.1"
"@backstage/core-components" "^0.9.6-next.1"
"@backstage/core-plugin-api" "^1.0.3"
"@backstage/errors" "^1.1.0-next.0"
"@backstage/integration-react" "^1.1.2-next.1"
"@backstage/plugin-catalog-common" "^1.0.4-next.0"
"@backstage/plugin-catalog-react" "^1.1.2-next.1"
"@backstage/plugin-search-common" "^0.3.6-next.0"
"@backstage/plugin-search-react" "^0.2.2-next.1"
"@backstage/theme" "^0.2.16-next.0"
"@backstage/types" "^1.0.0"
"@material-ui/core" "^4.12.2"
"@material-ui/icons" "^4.9.1"
"@material-ui/lab" "4.0.0-alpha.57"
history "^5.0.0"
lodash "^4.17.21"
react-helmet "6.1.0"
react-router "6.0.0-beta.0"
react-use "^17.2.4"
zen-observable "^0.8.15"
"@backstage/plugin-home@^0.4.19", "@backstage/plugin-home@^0.4.22":
version "0.4.22"
resolved "https://registry.npmjs.org/@backstage/plugin-home/-/plugin-home-0.4.22.tgz#efc54ebffb83a2a36dcd43e65142c30be5d8559d"
@@ -12690,6 +12762,7 @@ evp_bytestokey@^1.0.0, evp_bytestokey@^1.0.3:
"@backstage/plugin-todo" "^0.2.9-next.2"
"@backstage/plugin-user-settings" "^0.4.6-next.2"
"@backstage/theme" "^0.2.16-next.1"
"@internal/plugin-catalog-customized" "1.2.1-next.1"
"@material-ui/core" "^4.12.2"
"@material-ui/icons" "^4.9.1"
"@material-ui/lab" "4.0.0-alpha.57"