add layouts to Workflow

Signed-off-by: Paul Cowan <paul.cowan@cutting.scot>

plugins/scaffolder-react/api-report.md

@@ -370,30 +370,22 @@ export const SecretsContextProvider: ({
 }: PropsWithChildren<{}>) => JSX.Element;
 
 // @alpha
-<<<<<<< HEAD
 export const Stepper: (stepperProps: StepperProps) => JSX.Element;
-=======
-export const Stepper: ({ layouts, ...props }: StepperProps) => JSX.Element;
->>>>>>> be504a73cc (run api-report)
 
 // @alpha
 export type StepperProps = {
   manifest: TemplateParameterSchema;
   extensions: NextFieldExtensionOptions<any, any>[];
   templateName?: string;
+  FormProps?: FormProps;
   initialState?: Record<string, JsonValue>;
-<<<<<<< HEAD
   onCreate: (values: Record<string, JsonValue>) => Promise<void>;
   components?: {
     ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element;
     createButtonText?: ReactNode;
     reviewButtonText?: ReactNode;
   };
-=======
-  onComplete: (values: Record<string, JsonValue>) => Promise<void>;
-  FormProps?: FormProps;
   layouts?: LayoutOptions[];
->>>>>>> be504a73cc (run api-report)
 };
 
 // @alpha
@@ -492,7 +484,12 @@ export type WorkflowProps = {
   onError(error: Error | undefined): JSX.Element | null;
 } & Pick<
   StepperProps,
-  'extensions' | 'FormProps' | 'components' | 'onCreate' | 'initialState'
+  | 'extensions'
+  | 'FormProps'
+  | 'components'
+  | 'onCreate'
+  | 'initialState'
+  | 'layouts'
 >;
 
 // (No @packageDocumentation comment for this package)

plugins/scaffolder-react/src/next/components/Stepper/Stepper.tsx

@@ -152,7 +152,7 @@ export const Stepper = (stepperProps: StepperProps) => {
     setFormState(current => ({ ...current, ...formData }));
   };
 
-  const currentStep = useTransformSchemaToProps(steps[activeStep], layouts);
+  const currentStep = useTransformSchemaToProps(steps[activeStep], { layouts });
 
   return (
     <>

plugins/scaffolder-react/src/next/components/Workflow/Workflow.tsx

@@ -51,7 +51,12 @@ export type WorkflowProps = {
   onError(error: Error | undefined): JSX.Element | null;
 } & Pick<
   StepperProps,
-  'extensions' | 'FormProps' | 'components' | 'onCreate' | 'initialState' | 'layouts'
+  | 'extensions'
+  | 'FormProps'
+  | 'components'
+  | 'onCreate'
+  | 'initialState'
+  | 'layouts'
 >;
 
 /**

plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.test.tsx

@@ -37,7 +37,7 @@ describe('useTransformSchemaToProps', () => {
     };
 
     const { result } = renderHook(
-      () => useTransformSchemaToProps(step, layouts),
+      () => useTransformSchemaToProps(step, { layouts }),
       {
         wrapper: ({ children }) => (
           <TestApiProvider apis={[]}>{children}</TestApiProvider>

plugins/scaffolder-react/src/next/hooks/useTransformSchemaToProps.ts

@@ -16,10 +16,15 @@
 import { type ParsedTemplateSchema } from './useTemplateSchema';
 import { type LayoutOptions } from '../types';
 
+interface Options {
+  layouts?: LayoutOptions[];
+}
+
 export const useTransformSchemaToProps = (
   step: ParsedTemplateSchema,
-  layouts: LayoutOptions[] = [],
+  options: Options = {},
 ): ParsedTemplateSchema => {
+  const { layouts = [] } = options;
   const objectFieldTemplate = step?.uiSchema['ui:ObjectFieldTemplate'] as
     | string
     | undefined;

plugins/scaffolder/src/next/Router/Router.tsx

@@ -86,9 +86,7 @@ export const Router = (props: PropsWithChildren<NextRouterProps>) => {
             <TemplateWizardPage
               customFieldExtensions={fieldExtensions}
               layouts={customLayouts}
-              FormProps={{
-                ...props.FormProps,
-              }}
+              FormProps={props.FormProps}
             />
           </SecretsContextProvider>
         }

plugins/scaffolder/src/next/TemplateWizardPage/TemplateWizardPage.tsx

@@ -26,11 +26,9 @@ import {
   scaffolderApiRef,
   useTemplateSecrets,
   Workflow,
-  type LayoutOptions
-} from '@backstage/plugin-scaffolder-react';
-import {
-  NextFieldExtensionOptions,
+  type LayoutOptions,
 } from '@backstage/plugin-scaffolder-react';
+import { NextFieldExtensionOptions } from '@backstage/plugin-scaffolder-react';
 import { JsonValue } from '@backstage/types';
 import { type FormProps } from '../types';
 import { nextRouteRef } from '../routes';