Share template variables between pages and models in scaffold

packages/cli/src/commands/generate/scaffold/scaffold.js

@@ -286,6 +286,147 @@ const formatters = async (name, isTypescript) => {
   }
 }
 
+const modelRelatedVariables = (model) => {
+  const componentMetadata = {
+    Enum: {
+      componentName: 'RadioField',
+      defaultProp: 'defaultChecked',
+      validation: () => false,
+      listDisplayFunction: 'formatEnum',
+      displayFunction: 'formatEnum',
+    },
+    EnumList: {
+      componentName: 'CheckboxField',
+      defaultProp: 'defaultChecked',
+      validation: () => false,
+      listDisplayFunction: 'formatEnum',
+      displayFunction: 'formatEnum',
+    },
+    Boolean: {
+      componentName: 'CheckboxField',
+      defaultProp: 'defaultChecked',
+      validation: () => false,
+      listDisplayFunction: 'checkboxInputTag',
+      displayFunction: 'checkboxInputTag',
+    },
+    DateTime: {
+      componentName: 'DatetimeLocalField',
+      deserializeFunction: 'formatDatetime',
+      listDisplayFunction: 'timeTag',
+      displayFunction: 'timeTag',
+    },
+    Int: {
+      componentName: 'NumberField',
+    },
+    Json: {
+      componentName: 'TextAreaField',
+      validation: (isRequired) =>
+        `{{ valueAsJSON: true${isRequired ? ', required: true' : ''} }}`,
+      displayFunction: 'jsonDisplay',
+      listDisplayFunction: 'jsonTruncate',
+      deserializeFunction: 'JSON.stringify',
+    },
+    Float: {
+      validation: (isRequired) =>
+        `{{ valueAsNumber: true${isRequired ? ', required: true' : ''} }}`,
+    },
+    Decimal: {
+      validation: (isRequired) =>
+        `{{ valueAsNumber: true${isRequired ? ', required: true' : ''} }}`,
+    },
+    default: {
+      componentName: 'TextField',
+      defaultProp: 'defaultValue',
+      deserializeFunction: '',
+      validation: '{{ required: true }}',
+      displayFunction: undefined,
+      listDisplayFunction: 'truncate',
+    },
+  }
+
+  const columns = model.fields
+    .filter((field) => field.kind !== 'object')
+    .map((column) => {
+      let validation
+
+      if (componentMetadata[column.type]?.validation) {
+        validation = componentMetadata[column.type]?.validation(
+          column?.isRequired
+        )
+      } else {
+        validation = column?.isRequired
+          ? componentMetadata.default.validation
+          : null
+      }
+
+      const isEnum = column.kind === 'enum'
+      const isList = column.isList
+      const enumType = isEnum && isList ? 'EnumList' : 'Enum'
+      const metadataKey = isEnum ? enumType : column.type
+
+      return {
+        ...column,
+        label: humanize(column.name),
+        component:
+          componentMetadata[metadataKey]?.componentName ||
+          componentMetadata.default.componentName,
+        defaultProp:
+          componentMetadata[metadataKey]?.defaultProp ||
+          componentMetadata.default.defaultProp,
+        deserializeFunction:
+          componentMetadata[metadataKey]?.deserializeFunction ||
+          componentMetadata.default.deserializeFunction,
+        validation,
+        listDisplayFunction:
+          componentMetadata[metadataKey]?.listDisplayFunction ||
+          componentMetadata.default.listDisplayFunction,
+        displayFunction:
+          componentMetadata[metadataKey]?.displayFunction ||
+          componentMetadata.default.displayFunction,
+        values: column.enumValues || [],
+        isList,
+        isEnum,
+      }
+    })
+  const editableColumns = columns
+    .filter((column) => {
+      return NON_EDITABLE_COLUMNS.indexOf(column.name) === -1
+    })
+    .filter(filterAutoGeneratedColumnsForScaffold)
+  const fieldsToImport = Object.keys(
+    editableColumns.reduce((accumulator, column) => {
+      accumulator[column.component] = true
+      return accumulator
+    }, {})
+  )
+
+  if (!fieldsToImport.length) {
+    throw new Error(`There are no editable fields in the ${model.name} model`)
+  }
+
+  const formattersImports = columns
+    .map((column) => column.displayFunction)
+    .sort()
+    // filter out duplicates, so we only keep unique import names
+    .filter((name, index, array) => array.indexOf(name) === index)
+    .join(', ')
+
+  const listFormattersImports = columns
+    .map((column) => column.listDisplayFunction)
+    .sort()
+    // filter out duplicates, so we only keep unique import names
+    .filter((name, index, array) => array.indexOf(name) === index)
+    .join(', ')
+
+  return {
+    columns,
+    fieldsToImport,
+    editableColumns,
+    listFormattersImports,
+    formattersImports,
+  }
+}
+
 const layoutFiles = (name, force, generateTypescript, templateStrings) => {
   let fileList = {}
 
@@ -384,6 +525,7 @@ const pageFiles = async (
         name,
         pascalScaffoldPath,
         ...templateStrings,
+        ...modelRelatedVariables(model),
       }
     )
 
@@ -408,122 +550,6 @@ const componentFiles = async (
   const idType = getIdType(model)
   const intForeignKeys = intForeignKeysForModel(model)
   let fileList = {}
-  const componentMetadata = {
-    Enum: {
-      componentName: 'RadioField',
-      defaultProp: 'defaultChecked',
-      validation: () => false,
-      listDisplayFunction: 'formatEnum',
-      displayFunction: 'formatEnum',
-    },
-    EnumList: {
-      componentName: 'CheckboxField',
-      defaultProp: 'defaultChecked',
-      validation: () => false,
-      listDisplayFunction: 'formatEnum',
-      displayFunction: 'formatEnum',
-    },
-    Boolean: {
-      componentName: 'CheckboxField',
-      defaultProp: 'defaultChecked',
-      validation: () => false,
-      listDisplayFunction: 'checkboxInputTag',
-      displayFunction: 'checkboxInputTag',
-    },
-    DateTime: {
-      componentName: 'DatetimeLocalField',
-      deserializeFunction: 'formatDatetime',
-      listDisplayFunction: 'timeTag',
-      displayFunction: 'timeTag',
-    },
-    Int: {
-      componentName: 'NumberField',
-    },
-    Json: {
-      componentName: 'TextAreaField',
-      validation: (isRequired) =>
-        `{{ valueAsJSON: true${isRequired ? ', required: true' : ''} }}`,
-      displayFunction: 'jsonDisplay',
-      listDisplayFunction: 'jsonTruncate',
-      deserializeFunction: 'JSON.stringify',
-    },
-    Float: {
-      validation: (isRequired) =>
-        `{{ valueAsNumber: true${isRequired ? ', required: true' : ''} }}`,
-    },
-    Decimal: {
-      validation: (isRequired) =>
-        `{{ valueAsNumber: true${isRequired ? ', required: true' : ''} }}`,
-    },
-    default: {
-      componentName: 'TextField',
-      defaultProp: 'defaultValue',
-      deserializeFunction: '',
-      validation: '{{ required: true }}',
-      displayFunction: undefined,
-      listDisplayFunction: 'truncate',
-    },
-  }
-
-  const columns = model.fields
-    .filter((field) => field.kind !== 'object')
-    .map((column) => {
-      let validation
-
-      if (componentMetadata[column.type]?.validation) {
-        validation = componentMetadata[column.type]?.validation(
-          column?.isRequired
-        )
-      } else {
-        validation = column?.isRequired
-          ? componentMetadata.default.validation
-          : null
-      }
-
-      const isEnum = column.kind === 'enum'
-      const isList = column.isList
-      const enumType = isEnum && isList ? 'EnumList' : 'Enum'
-      const metadataKey = isEnum ? enumType : column.type
-
-      return {
-        ...column,
-        label: humanize(column.name),
-        component:
-          componentMetadata[metadataKey]?.componentName ||
-          componentMetadata.default.componentName,
-        defaultProp:
-          componentMetadata[metadataKey]?.defaultProp ||
-          componentMetadata.default.defaultProp,
-        deserializeFunction:
-          componentMetadata[metadataKey]?.deserializeFunction ||
-          componentMetadata.default.deserializeFunction,
-        validation,
-        listDisplayFunction:
-          componentMetadata[metadataKey]?.listDisplayFunction ||
-          componentMetadata.default.listDisplayFunction,
-        displayFunction:
-          componentMetadata[metadataKey]?.displayFunction ||
-          componentMetadata.default.displayFunction,
-        values: column.enumValues || [],
-        isList,
-        isEnum,
-      }
-    })
-  const editableColumns = columns
-    .filter((column) => {
-      return NON_EDITABLE_COLUMNS.indexOf(column.name) === -1
-    })
-    .filter(filterAutoGeneratedColumnsForScaffold)
-  const fieldsToImport = Object.keys(
-    editableColumns.reduce((accumulator, column) => {
-      accumulator[column.component] = true
-      return accumulator
-    }, {})
-  )
-
-  if (!fieldsToImport.length) {
-    throw new Error(`There are no editable fields in the ${name} model`)
-  }
 
   const components = fs.readdirSync(
     customOrDefaultTemplatePath({
@@ -533,20 +559,6 @@ const componentFiles = async (
     })
   )
 
-  const formattersImports = columns
-    .map((column) => column.displayFunction)
-    .sort()
-    // filter out duplicates, so we only keep unique import names
-    .filter((name, index, array) => array.indexOf(name) === index)
-    .join(', ')
-
-  const listFormattersImports = columns
-    .map((column) => column.listDisplayFunction)
-    .sort()
-    // filter out duplicates, so we only keep unique import names
-    .filter((name, index, array) => array.indexOf(name) === index)
-    .join(', ')
-
   await asyncForEach(components, (component) => {
     const outputComponentName = component
       .replace(/Names/, pluralName)
@@ -572,15 +584,11 @@ const componentFiles = async (
       }),
       {
         name,
-        columns,
-        fieldsToImport,
-        editableColumns,
         idType,
         intForeignKeys,
         pascalScaffoldPath,
-        listFormattersImports,
-        formattersImports,
         ...templateStrings,
+        ...modelRelatedVariables(model),
       }
     )