extract ObjectFieldTemplate from uiSchema

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

packages/app/src/App.tsx

@@ -105,7 +105,10 @@ import { ApacheAirflowPage } from '@backstage/plugin-apache-airflow';
 import { RequirePermission } from '@backstage/plugin-permission-react';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common';
 import { PlaylistIndexPage } from '@backstage/plugin-playlist';
-import { Customlayout } from './components/scaffolder/customScaffolderLayouts';
+import {
+  AnotherCustomlayout,
+  CustomLayout,
+} from './components/scaffolder/customScaffolderLayouts';
 
 const app = createApp({
   apis,
@@ -222,7 +225,8 @@ const routes = (
           <LowerCaseValuePickerFieldExtension />
         </ScaffolderFieldExtensions>
         <ScaffolderLayouts>
-          <Customlayout />
+          <CustomLayout />
+          <AnotherCustomlayout />
         </ScaffolderLayouts>
       </>
     </Route>

packages/app/src/components/scaffolder/customScaffolderLayouts.tsx

@@ -35,9 +35,34 @@ const ALayout: ObjectFieldTemplate = ({ properties, description }) => {
   );
 };
 
-export const Customlayout = scaffolderPlugin.provide(
+const AnotherCustomLayout: ObjectFieldTemplate = ({
+  properties,
+  description,
+}) => {
+  // eslint-disable-next-line no-console
+  return (
+    <div>
+      <h1>ANOTHER CUSTOM LAYOUT!!!!!</h1>
+      <div>
+        {properties.map(prop => (
+          <div key={prop.content.key}>{prop.content}</div>
+        ))}
+      </div>
+      {description}
+    </div>
+  );
+};
+
+export const CustomLayout = scaffolderPlugin.provide(
   createScaffolderLayout({
     name: 'CustomLayout',
     component: ALayout,
   }),
 );
+
+export const AnotherCustomlayout = scaffolderPlugin.provide(
+  createScaffolderLayout({
+    name: 'AnotherCustomLayout',
+    component: AnotherCustomLayout,
+  }),
+);

packages/app/src/components/scaffolder/defaultPreviewTemplate.ts

@@ -34,6 +34,7 @@ parameters:
           allowedKinds:
             - Group
   - title: Choose a location
+    ui:ObjectFieldTemplate: 'AnotherCustomLayout'
     required:
       - repoUrl
     properties: