From 5cdcf77a45119419286422a2c2339220db50d9ff Mon Sep 17 00:00:00 2001 From: Bogdan Nechyporenko Date: Mon, 23 Oct 2023 11:05:30 +0200 Subject: [PATCH] Updated to a presentation Signed-off-by: Bogdan Nechyporenko --- .../scaffolder-backend/src/service/router.ts | 2 +- .../src/TemplateEntityV1beta3.ts | 8 ++++---- plugins/scaffolder-common/src/index.ts | 2 +- .../src/next/components/Stepper/Stepper.tsx | 17 +++++++++++++---- .../src/next/hooks/useTemplateSchema.ts | 6 +++--- plugins/scaffolder-react/src/types.ts | 4 ++-- 6 files changed, 24 insertions(+), 15 deletions(-) diff --git a/plugins/scaffolder-backend/src/service/router.ts b/plugins/scaffolder-backend/src/service/router.ts index 2bf44cdfc6..f8bdb48e2b 100644 --- a/plugins/scaffolder-backend/src/service/router.ts +++ b/plugins/scaffolder-backend/src/service/router.ts @@ -365,7 +365,7 @@ export async function createRouter( const parameters = [template.spec.parameters ?? []].flat(); res.json({ title: template.metadata.title ?? template.metadata.name, - configurations: template.spec.configurations ?? {}, + presentation: template.spec.presentation ?? {}, description: template.metadata.description, 'ui:options': template.metadata['ui:options'], steps: parameters.map(schema => ({ diff --git a/plugins/scaffolder-common/src/TemplateEntityV1beta3.ts b/plugins/scaffolder-common/src/TemplateEntityV1beta3.ts index c610886ac1..23cc3ca3d8 100644 --- a/plugins/scaffolder-common/src/TemplateEntityV1beta3.ts +++ b/plugins/scaffolder-common/src/TemplateEntityV1beta3.ts @@ -47,9 +47,9 @@ export interface TemplateEntityV1beta3 extends Entity { type: string; /** - * Template specific configurations. + * Template specific configuration of the presentation layer. */ - configurations?: TemplateConfigurationsV1beta3; + presentation?: TemplatePresentationV1beta3; /** * This is a JSONSchema or an array of JSONSchema's which is used to render a form in the frontend @@ -74,11 +74,11 @@ export interface TemplateEntityV1beta3 extends Entity { } /** - * The configuration of the template. + * The presentation of the template. * * @public */ -export interface TemplateConfigurationsV1beta3 extends JsonObject { +export interface TemplatePresentationV1beta3 extends JsonObject { /** * Overrides default buttons' text */ diff --git a/plugins/scaffolder-common/src/index.ts b/plugins/scaffolder-common/src/index.ts index 851c6ac7e5..3300aebf46 100644 --- a/plugins/scaffolder-common/src/index.ts +++ b/plugins/scaffolder-common/src/index.ts @@ -27,7 +27,7 @@ export { isTemplateEntityV1beta3, } from './TemplateEntityV1beta3'; export type { - TemplateConfigurationsV1beta3, + TemplatePresentationV1beta3, TemplateEntityV1beta3, TemplateEntityStepV1beta3, TemplateParametersV1beta3, diff --git a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.tsx b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.tsx index 1e43eba770..e52560e2a5 100644 --- a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.tsx +++ b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.tsx @@ -81,6 +81,7 @@ export type StepperProps = { components?: { ReviewStepComponent?: ComponentType; ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element; + backButtonText?: ReactNode; createButtonText?: ReactNode; reviewButtonText?: ReactNode; }; @@ -96,11 +97,12 @@ export const Stepper = (stepperProps: StepperProps) => { const { ReviewStateComponent = ReviewState, ReviewStepComponent, + backButtonText = 'Back', createButtonText = 'Create', reviewButtonText = 'Review', } = components; const analytics = useAnalytics(); - const { steps } = useTemplateSchema(props.manifest); + const { presentation, steps } = useTemplateSchema(props.manifest); const apiHolder = useApiHolder(); const [activeStep, setActiveStep] = useState(0); const [isValidating, setIsValidating] = useState(false); @@ -173,6 +175,13 @@ export const Stepper = (stepperProps: StepperProps) => { setFormState(current => ({ ...current, ...formData })); }; + const backLabel = + presentation?.buttonLabels?.backButtonText ?? backButtonText; + const createLabel = + presentation?.buttonLabels?.createButtonText ?? createButtonText; + const reviewLabel = + presentation?.buttonLabels?.reviewButtonText ?? reviewButtonText; + return ( <> {isValidating && } @@ -208,7 +217,7 @@ export const Stepper = (stepperProps: StepperProps) => { className={styles.backButton} disabled={activeStep < 1 || isValidating} > - Back + {backLabel} @@ -246,7 +255,7 @@ export const Stepper = (stepperProps: StepperProps) => { color="primary" onClick={handleCreate} > - {createButtonText} + {createLabel} diff --git a/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.ts b/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.ts index 738be10279..838f8b1c30 100644 --- a/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.ts +++ b/plugins/scaffolder-react/src/next/hooks/useTemplateSchema.ts @@ -14,7 +14,7 @@ * limitations under the License. */ import { featureFlagsApiRef, useApi } from '@backstage/core-plugin-api'; -import { TemplateConfigurationsV1beta3 } from '@backstage/plugin-scaffolder-common'; +import { TemplatePresentationV1beta3 } from '@backstage/plugin-scaffolder-common'; import { JsonObject } from '@backstage/types'; import { UiSchema } from '@rjsf/utils'; import { TemplateParameterSchema } from '@backstage/plugin-scaffolder-react'; @@ -42,7 +42,7 @@ export const useTemplateSchema = ( manifest: TemplateParameterSchema, ): { steps: ParsedTemplateSchema[]; - configurations?: TemplateConfigurationsV1beta3; + presentation?: TemplatePresentationV1beta3; } => { const featureFlags = useApi(featureFlagsApiRef); const steps = manifest.steps.map(({ title, description, schema }) => ({ @@ -80,7 +80,7 @@ export const useTemplateSchema = ( })); return { - configurations: manifest.configurations, + presentation: manifest.presentation, steps: returningSteps, }; }; diff --git a/plugins/scaffolder-react/src/types.ts b/plugins/scaffolder-react/src/types.ts index f5c4cabc04..c1c26f32bb 100644 --- a/plugins/scaffolder-react/src/types.ts +++ b/plugins/scaffolder-react/src/types.ts @@ -16,7 +16,7 @@ import { JsonObject } from '@backstage/types'; -import { TemplateConfigurationsV1beta3 } from '@backstage/plugin-scaffolder-common'; +import { TemplatePresentationV1beta3 } from '@backstage/plugin-scaffolder-common'; /** * The shape of each entry of parameters which gets rendered @@ -27,7 +27,7 @@ import { TemplateConfigurationsV1beta3 } from '@backstage/plugin-scaffolder-comm export type TemplateParameterSchema = { title: string; description?: string; - configurations?: TemplateConfigurationsV1beta3; + presentation?: TemplatePresentationV1beta3; steps: Array<{ title: string; description?: string;