add writing-custom-step-layouts to sidebars.json

Signed-off-by: Paul Cowan <paul.cowan@cutting.scot>
2022-09-21 18:03:09 +01:00
parent 2b908d00b7
commit ff4f8bb9e5
3 changed files with 24 additions and 19 deletions
@@ -27,24 +27,29 @@ import {
 } from '@backstage/plugin-scaffolder';
 import { Grid } from '@material-ui/core';

-const TwoColumn: LayoutTemplate = ({ properties, description, title }) => (
-  <>
-    <h1>{title}</h1>
-    <Grid container justifyContent="flex-end">
-      {properties.slice(0, mid).map(prop => (
-        <Grid item xs={6} key={prop.content.key}>
-          {prop.content}
-        </Grid>
-      ))}
-      {properties.slice(mid).map(prop => (
-        <Grid item xs={6} key={prop.content.key}>
-          {prop.content}
-        </Grid>
-      ))}
-    </Grid>
-    {description}
-  </>
-);
+const TwoColumn: LayoutTemplate = ({ properties, description, title }) => {
+  const mid = Math.ceil(properties.length / 2);
+
+  return (
+    <>
+      <h1>{title}</h1>
+      <h2>In two column layout!!</h2>
+      <Grid container justifyContent="flex-end">
+        {properties.slice(0, mid).map(prop => (
+          <Grid item xs={6} key={prop.content.key}>
+            {prop.content}
+          </Grid>
+        ))}
+        {properties.slice(mid).map(prop => (
+          <Grid item xs={6} key={prop.content.key}>
+            {prop.content}
+          </Grid>
+        ))}
+      </Grid>
+      {description}
+    </>
+  );
+};

 export const TwoColumnLayout = scaffolderPlugin.provide(
  createScaffolderLayout({