diff --git a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx index e13b242718..6ec88777f2 100644 --- a/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx +++ b/plugins/scaffolder/src/components/MultistepJsonForm/MultistepJsonForm.tsx @@ -36,6 +36,7 @@ import { transformSchemaToProps } from './schema'; import { Content, StructuredMetadataTable } from '@backstage/core-components'; import cloneDeep from 'lodash/cloneDeep'; import * as fieldOverrides from './FieldOverrides'; +import { LayoutOptions, resolveStepLayout } from '../../layouts'; const Form = withTheme(MuiTheme); type Step = { diff --git a/plugins/scaffolder/src/layouts/index.tsx b/plugins/scaffolder/src/layouts/index.tsx index 1a34d48566..ff6544174d 100644 --- a/plugins/scaffolder/src/layouts/index.tsx +++ b/plugins/scaffolder/src/layouts/index.tsx @@ -15,21 +15,23 @@ */ import { attachComponentData, Extension } from '@backstage/core-plugin-api'; -import { UiSchema } from '@rjsf/core'; -import { DEFAULT_SCAFFOLDER_LAYOUT } from './default'; +import { ObjectFieldTemplateProps } from '@rjsf/core'; import type { LayoutOptions, ObjectFieldTemplate } from './types'; export const LAYOUTS_KEY = 'scaffolder.layout.v1'; export const LAYOUTS_WRAPPER_KEY = 'scaffolder.layouts.wrapper.v1'; -export type LayoutComponent<_TReturnValue, _TInputProps> = () => null; +type LayoutComponent<_TInputProps> = () => null; -export function createScaffolderLayout< - TFieldReturnValue = unknown, - TInputProps = unknown, ->( +type GetProps = T extends LayoutOptions + ? T['component'] extends ObjectFieldTemplate + ? LayoutComponent> + : never + : never; + +export function createScaffolderLayout( options: LayoutOptions, -): Extension> { +): Extension> { return { expose() { const LayoutDataHolder: any = () => null; @@ -50,22 +52,4 @@ export type { LayoutOptions, ObjectFieldTemplate } from './types'; export { DEFAULT_SCAFFOLDER_LAYOUT } from './default'; -export function resolveStepLayout( - uiSchema: UiSchema = {}, - layouts: LayoutOptions[], -): ObjectFieldTemplate { - const layoutName = - uiSchema?.['ui:ObjectFieldTemplate'] ?? DEFAULT_SCAFFOLDER_LAYOUT.name; - - delete uiSchema?.['ui:ObjectFieldTemplate']; - - const LayoutComponent = layouts.find( - layout => layout.name === layoutName, - )?.component; - - if (!LayoutComponent) { - throw new Error(`no step layout found for ${layoutName}`); - } - - return LayoutComponent; -} +export { resolveStepLayout } from './resolveStepLayout'; diff --git a/plugins/scaffolder/src/layouts/resolveStepLayout.ts b/plugins/scaffolder/src/layouts/resolveStepLayout.ts new file mode 100644 index 0000000000..bdcbf5817d --- /dev/null +++ b/plugins/scaffolder/src/layouts/resolveStepLayout.ts @@ -0,0 +1,39 @@ +/* + * Copyright 2022 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { UiSchema } from '@rjsf/core'; +import { DEFAULT_SCAFFOLDER_LAYOUT } from './default'; +import { LayoutOptions, ObjectFieldTemplate } from './types'; + +export function resolveStepLayout( + uiSchema: UiSchema = {}, + layouts: LayoutOptions[], +): ObjectFieldTemplate { + const layoutName = + uiSchema?.['ui:ObjectFieldTemplate'] ?? DEFAULT_SCAFFOLDER_LAYOUT.name; + + delete uiSchema?.['ui:ObjectFieldTemplate']; + + const LayoutComponent = layouts.find( + layout => layout.name === layoutName, + )?.component; + + if (!LayoutComponent) { + throw new Error(`no step layout found for ${layoutName}`); + } + + return LayoutComponent; +} diff --git a/plugins/scaffolder/src/layouts/types.ts b/plugins/scaffolder/src/layouts/types.ts index fb0e766a43..2c52d5a1d7 100644 --- a/plugins/scaffolder/src/layouts/types.ts +++ b/plugins/scaffolder/src/layouts/types.ts @@ -13,13 +13,13 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import type { FormProps } from '@rjsf/core'; +import type { ObjectFieldTemplateProps } from '@rjsf/core'; -export type ObjectFieldTemplate = Required< - FormProps ->['ObjectFieldTemplate']; +export type ObjectFieldTemplate

= ( + c: ObjectFieldTemplateProps

, +) => JSX.Element; -export interface LayoutOptions { +export interface LayoutOptions

{ name: string; - component: ObjectFieldTemplate; + component: ObjectFieldTemplate

; }