@ditojs/admin 2.1.1 → 2.1.3

package/src/utils/schema.js

@@ -35,20 +35,16 @@ export function getTypeComponent(type, allowNull = false) {
   return component
 }
 
-function getSchemas(schema) {
-  return schema
-    ? [...Object.values(schema.tabs || {}), schema]
-    : []
-}
-
-export function iterateSchemaComponents(schema, callback) {
-  if (isSingleComponentView(schema)) {
-    return callback(schema.component, schema.name)
-  } else {
-    const schemas = getSchemas(schema)
-    for (const schema of schemas) {
+export function iterateSchemaComponents(schemas, callback) {
+  for (const schema of schemas) {
+    if (isSingleComponentView(schema)) {
+      const res = callback(schema.component, schema.name, 0)
+      if (res !== undefined) {
+        return res
+      }
+    } else {
       for (const [name, component] of Object.entries(schema.components || {})) {
-        const res = callback(component, name)
+        const res = callback(component, name, 1)
         if (res !== undefined) {
           return res
         }
@@ -57,32 +53,36 @@ export function iterateSchemaComponents(schema, callback) {
   }
 }
 
+export function iterateNestedSchemaComponents(schema, callback) {
+  return schema
+    ? iterateSchemaComponents([schema, ...getAllTabSchemas(schema)], callback)
+    : undefined
+}
+
 export function findSchemaComponent(schema, callback) {
   return (
-    iterateSchemaComponents(
+    iterateNestedSchemaComponents(
       schema,
-      (component, name) => (callback(component, name) ? component : undefined)
+      component => (callback(component) ? component : undefined)
     ) || null
   )
 }
 
 export function someSchemaComponent(schema, callback) {
   return (
-    iterateSchemaComponents(
+    iterateNestedSchemaComponents(
       schema,
-      (component, name) => (callback(component, name) ? true : undefined)
-    ) ===
-    true
+      component => (callback(component) ? true : undefined)
+    ) === true
   )
 }
 
 export function everySchemaComponent(schema, callback) {
   return (
-    iterateSchemaComponents(
+    iterateNestedSchemaComponents(
       schema,
-      (component, name) => (!callback(component, name) ? false : undefined)
-    ) !==
-    false
+      component => (callback(component) ? undefined : false)
+    ) !== false
   )
 }
 
@@ -98,6 +98,14 @@ export function isView(schema) {
   return isSchema(schema) && schema.type === 'view'
 }
 
+export function isTab(schema) {
+  return isSchema(schema) && schema.type === 'tab'
+}
+
+export function isPanel(schema) {
+  return isSchema(schema) && schema.type === 'panel'
+}
+
 export function getSchemaIdentifier(schema) {
   return schema.name || schema.label || schema.type
 }
@@ -161,13 +169,6 @@ export async function resolveSchemas(
   return schemas
 }
 
-export async function resolvePanels(schema) {
-  const { panels } = schema
-  if (panels) {
-    schema.panels = await resolveSchemas(panels)
-  }
-}
-
 export async function resolveSchemaComponent(schema) {
   // Resolves async schema components and adds DitoMixin and TypeMixin to them.
   let { component } = schema
@@ -190,21 +191,54 @@ export async function resolveSchemaComponents(schemas) {
   await mapConcurrently(Object.values(schemas || {}), resolveSchemaComponent)
 }
 
+export async function processSchemaComponents(api, schema, routes, level) {
+  const promises = []
+  const process = (component, name, relativeLevel) => {
+    promises.push(
+      processSchemaComponent(
+        api,
+        component,
+        name,
+        routes,
+        level + relativeLevel
+      )
+    )
+  }
+
+  iterateNestedSchemaComponents(schema, process)
+  iterateSchemaComponents(getAllPanelSchemas(schema), process)
+
+  await Promise.all(promises)
+}
+
+export async function processSchemaComponent(api, schema, name, routes, level) {
+  processDefaults(api, schema)
+
+  await Promise.all([
+    // Also process nested panel schemas.
+    mapConcurrently(getAllPanelSchemas(schema), panel =>
+      processSchemaComponents(api, panel, routes, level)
+    ),
+    // Delegate schema processing to the actual type components.
+    await getTypeOptions(schema)?.processSchema?.(
+      api,
+      schema,
+      name,
+      routes,
+      level
+    )
+  ])
+}
+
 export async function processView(component, api, schema, name) {
+  if (!isView(schema)) {
+    throw new Error(`Invalid view schema: '${getSchemaIdentifier(schema)}'`)
+  }
   processRouteSchema(api, schema, name)
   processDefaults(api, schema)
-  await resolvePanels(schema)
+  await resolveNestedSchemas(api, schema)
   const children = []
-  if (isView(schema)) {
-    if (isSingleComponentView(schema)) {
-      await processComponent(api, schema.component, name, children, 0)
-    } else {
-      // A multi-component view, start at level 1
-      await processSchemaComponents(api, schema, children, 1)
-    }
-  } else {
-    throw new Error(`Invalid view schema: '${getSchemaIdentifier(schema)}'`)
-  }
+  await processSchemaComponents(api, schema, children, 0)
   return {
     path: `/${schema.path}`,
     children,
@@ -216,18 +250,6 @@ export async function processView(component, api, schema, name) {
   }
 }
 
-export async function processComponent(api, schema, name, routes, level) {
-  processDefaults(api, schema)
-  // Delegate schema processing to the actual type components.
-  await getTypeOptions(schema)?.processSchema?.(
-    api,
-    schema,
-    name,
-    routes,
-    level
-  )
-}
-
 export function processDefaults(api, schema) {
   let defaults = api.defaults[schema.type]
   if (defaults) {
@@ -252,27 +274,15 @@ export function processRouteSchema(api, schema, name) {
   schema.path ||= api.normalizePath(name)
 }
 
-export async function processSchemaComponents(api, schema, routes, level) {
-  const promises = []
-  iterateSchemaComponents(schema, (component, name) => {
-    promises.push(processComponent(api, component, name, routes, level))
-  })
-  await Promise.all(promises)
-}
-
 export async function processForms(api, schema, level) {
-  const processForm = async form => {
-    form = await resolveForm(form)
-    processDefaults(api, schema)
-    return form
-  }
-
   // First resolve the forms and store the results back on the schema.
   let { form, forms, components } = schema
   if (forms) {
-    forms = schema.forms = await resolveSchemas(forms, processForm)
+    forms = schema.forms = await resolveSchemas(forms, form =>
+      processForm(api, form)
+    )
   } else if (form) {
-    form = schema.form = await processForm(form)
+    form = schema.form = await processForm(api, form)
   } else if (components) {
     // NOTE: Processing forms in computed components is not supported, since it
     // only can be computed in conjunction with actual data.
@@ -284,20 +294,55 @@ export async function processForms(api, schema, level) {
   forms ||= { default: form } // Only used for process loop below.
   const children = []
   for (const form of Object.values(forms)) {
-    await processSchemaComponents(api, form, children, level + 1)
+    await processSchemaComponents(api, form, children, level)
   }
   return children
 }
 
-export async function resolveForm(schema) {
+export async function processForm(api, schema) {
   schema = await resolveSchema(schema, true)
   if (!isForm(schema)) {
     throw new Error(`Invalid form schema: '${getSchemaIdentifier(schema)}'`)
   }
-  await resolvePanels(schema)
+  processDefaults(api, schema)
+  await resolveNestedSchemas(api, schema)
+  return schema
+}
+
+export async function processTab(api, schema) {
+  schema = await resolveSchema(schema, true)
+  if (!isTab(schema)) {
+    throw new Error(`Invalid tab schema: '${getSchemaIdentifier(schema)}'`)
+  }
+  processDefaults(api, schema)
+  return schema
+}
+
+export async function processPanel(api, schema) {
+  schema = await resolveSchema(schema, true)
+  if (!isPanel(schema)) {
+    throw new Error(`Invalid panel schema: '${getSchemaIdentifier(schema)}'`)
+  }
+  processDefaults(api, schema)
   return schema
 }
 
+export async function resolveNestedSchemas(api, schema) {
+  const { tabs, panels } = schema
+  if (tabs) {
+    schema.tabs = await resolveSchemas(
+      tabs,
+      tab => processTab(api, tab)
+    )
+  }
+  if (panels) {
+    schema.panels = await resolveSchemas(
+      panels,
+      panel => processPanel(api, panel)
+    )
+  }
+}
+
 export function hasFormSchema(schema) {
   // Support both single form and multiple forms notation, as well as inlined
   // components.
@@ -327,11 +372,7 @@ export function getViewFormSchema(schema, context) {
   return viewSchema
     ? // NOTE: Views can have tabs, in which case the view component is nested
       // in one of the tabs, go find it.
-      iterateSchemaComponents(viewSchema, schema => {
-        if (hasFormSchema(schema)) {
-          return schema
-        }
-      }) || null
+      findSchemaComponent(viewSchema, hasFormSchema) || null
     : null
 }
 
@@ -474,6 +515,7 @@ export function computeValue(schema, data, name, dataPath, {
   if (compute) {
     const value = compute(
       DitoContext.get(component, {
+        schema,
         // Override value to prevent endless recursion through calling the
         // getter for `this.value` in `DitoContext`:
         value: data[name],
@@ -569,6 +611,7 @@ export function processData(schema, sourceSchema, data, dataPath, {
     // NOTE: We don't cache this context, since `value` is changing.
     const getContext = () =>
       DitoContext.get(component, {
+        schema,
         value,
         name,
         data,
@@ -659,6 +702,7 @@ export function processSchemaData(
                 ? getDataPath(componentDataPath, index)
                 : componentDataPath
             const context = DitoContext.get(options.component, {
+              schema: componentSchema,
               data,
               value: item,
               dataPath,
@@ -726,13 +770,11 @@ export function processSchemaData(
   }
 
   processComponents(schema.components)
-  if (schema.tabs) {
-    for (const tab of Object.values(schema.tabs)) {
-      processComponents(tab.components)
-    }
+  for (const tab of getAllTabSchemas(schema)) {
+    processComponents(tab.components)
   }
-  for (const panel of getAllPanelSchemas(schema, dataPath)) {
-    processComponents(panel.schema.components)
+  for (const panel of getAllPanelSchemas(schema)) {
+    processComponents(panel.components)
   }
 
   return processedData || data
@@ -803,52 +845,68 @@ export function getSourceType(schemaOrType) {
   )
 }
 
-export function getPanelSchema(schema, dataPath, tabComponent) {
+export function getPanelEntry(schema, dataPath = null, tabComponent = null) {
   return schema
     ? {
         schema,
         // If the panel provides its own name, append it to the dataPath.
         // This is used e.g. for $filters panels.
-        dataPath: schema.name
-          ? appendDataPath(dataPath, schema.name)
-          : dataPath,
+        dataPath:
+          dataPath != null && schema.name
+            ? appendDataPath(dataPath, schema.name)
+            : dataPath,
         tabComponent
       }
     : null
 }
 
-export function getPanelSchemas(schemas, dataPath, tabComponent, panels = []) {
-  if (schemas) {
-    for (const [key, schema] of Object.entries(schemas)) {
-      const panel = getPanelSchema(
+export function getPanelEntries(
+  panelSchemas,
+  dataPath = null,
+  tabComponent = null,
+  panelEntries = []
+) {
+  if (panelSchemas) {
+    for (const [key, schema] of Object.entries(panelSchemas)) {
+      const entry = getPanelEntry(
         schema,
-        appendDataPath(dataPath, key),
+        dataPath != null ? appendDataPath(dataPath, key) : null,
         tabComponent
       )
-      if (panel) {
-        panels.push(panel)
+      if (entry) {
+        panelEntries.push(entry)
       }
     }
   }
-  return panels
+  return panelEntries
 }
 
-export function getAllPanelSchemas(
+export function getAllTabSchemas(schema) {
+  return schema?.tabs ? Object.values(schema.tabs) : []
+}
+
+export function getAllPanelSchemas(schema) {
+  return getAllPanelEntries(schema).map(entry => entry.schema)
+}
+
+export function getAllPanelEntries(
   schema,
-  dataPath,
+  dataPath = null,
   schemaComponent = null,
   tabComponent = null
 ) {
-  const panel = getTypeOptions(schema)?.getPanelSchema?.(
+  const panelSchema = getTypeOptions(schema)?.getPanelSchema?.(
     schema,
     dataPath,
     schemaComponent
   )
-  const panels = panel ? [getPanelSchema(panel, dataPath, tabComponent)] : []
+  const panelEntries = panelSchema
+    ? [getPanelEntry(panelSchema, dataPath, tabComponent)]
+    : []
   // Allow each component to provide its own set of panels, in
-  // addition to the default one (e.g. $filter):
-  getPanelSchemas(schema.panels, dataPath, tabComponent, panels)
-  return panels
+  // addition to the default one (e.g. getFiltersPanel(), $filters):
+  getPanelEntries(schema?.panels, dataPath, tabComponent, panelEntries)
+  return panelEntries
 }
 
 export function isObjectSource(schemaOrType) {