@ditojs/admin 1.18.0 → 1.19.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "1.18.0",
+  "version": "1.19.0",
   "type": "module",
   "description": "Dito.js Admin is a schema based admin interface for Dito.js Server, featuring auto-generated views and forms and built with Vue.js",
   "repository": "https://github.com/ditojs/dito/tree/master/packages/admin",
@@ -37,8 +37,8 @@
     "not ie_mob > 0"
   ],
   "dependencies": {
-    "@ditojs/ui": "^1.18.0",
-    "@ditojs/utils": "^1.18.0",
+    "@ditojs/ui": "^1.19.0",
+    "@ditojs/utils": "^1.19.0",
     "codeflask": "^1.4.1",
     "filesize": "^10.0.5",
     "filesize-parser": "^1.5.0",
@@ -60,7 +60,7 @@
     "vuedraggable": "^2.24.3"
   },
   "devDependencies": {
-    "@ditojs/build": "^1.14.0",
+    "@ditojs/build": "^1.19.0",
     "pug": "^3.0.2",
     "sass": "1.56.1",
     "type-fest": "^3.3.0",
@@ -69,5 +69,5 @@
     "vite-plugin-vue2": "^2.0.2"
   },
   "types": "types",
-  "gitHead": "6d5e8c9d08b4e5a15080b01d7f70a53f98b3a819"
+  "gitHead": "b6260469c956b99774657045f192fd429c6521d1"
 }

package/src/components/DitoForm.vue

@@ -1,6 +1,7 @@
 <template lang="pug">
 .dito-form.dito-scroll-parent(
   :class="{ 'dito-form-nested': isNestedRoute }"
+  :data-resource="sourceSchema.path"
 )
   // NOTE: Nested form components are kept alive by using `v-show` instead of
   // `v-if` here, so event handling and other things still work with nested

package/src/components/DitoPane.vue

@@ -40,7 +40,7 @@
     flex-flow: row wrap
     align-content: flex-start
     align-items: baseline
-    // Remove padding added by `.dito-container`
+    // Remove the padding added by `.dito-container` inside `.dito-pane`:
     margin: (-$form-spacing) (-$form-spacing-half)
     // Add removed horizontal margin again to max-width:
     max-width: $content-width + 2 * $form-spacing-half

package/src/components/DitoView.vue

@@ -1,24 +1,25 @@
 <template lang="pug">
-  // Only render DitoView when it is active, otherwise a normal router-view
-  // instead, to nest further route components.
-  // NOTE: This is different from the handling in DitoForm, where `v-show` is
-  // used to always render forms even when other nested forms are present.
-  router-view(
-    v-if="!isLastRoute"
-    :key="name"
+// Only render DitoView when it is active, otherwise a normal router-view
+// instead, to nest further route components.
+// NOTE: This is different from the handling in DitoForm, where `v-show` is
+// used to always render forms even when other nested forms are present.
+router-view(
+  v-if="!isLastRoute"
+  :key="name"
+)
+.dito-view.dito-scroll-parent(
+  v-else-if="shouldRender(viewSchema)"
+  :data-resource="sourceSchema.path"
+)
+  dito-schema.dito-scroll(
+    :schema="viewSchema"
+    :data="data"
+    :meta="meta"
+    :store="getChildStore(name)"
+    :disabled="isLoading"
+    :generateLabels="false"
+    :menuHeader="true"
   )
-  .dito-view.dito-scroll-parent(
-    v-else-if="shouldRender(viewSchema)"
-  )
-    dito-schema.dito-scroll(
-      :schema="viewSchema"
-      :data="data"
-      :meta="meta"
-      :store="getChildStore(name)"
-      :disabled="isLoading"
-      :generateLabels="false"
-      :menuHeader="true"
-    )
 </template>
 
 <script>
@@ -68,16 +69,17 @@ export default DitoComponent.component('dito-view', {
     },
 
     viewSchema() {
-      const { schema } = this
+      const { component, ...schema } = this.schema
       // Translate single-component schemas into multi-component schemas,
       // so they can be rendered directly through DitoSchema also:
       return this.isSingleComponentView
         ? {
-          name: schema.name,
+          ...schema,
           components: {
             [schema.name]: {
-              ...schema,
-              label: false
+              name: schema.name,
+              label: false,
+              ...component
             }
           }
         }

package/src/types/TypeList.vue

@@ -5,7 +5,9 @@
     :class="schema.class"
     :style="schema.style"
   )
-    .dito-navigation
+    .dito-navigation(
+      v-if="scopes || paginate"
+    )
       dito-scopes(
         v-if="scopes"
         :query="query"

package/src/utils/schema.js

@@ -40,14 +40,21 @@ export function forEachSchema(schema, callback) {
 }
 
 export function forEachSchemaComponent(schema, callback) {
-  return forEachSchema(schema, schema => {
-    for (const [name, component] of Object.entries(schema.components || {})) {
-      const res = callback(component, name)
-      if (res !== undefined) {
-        return res
-      }
+  if (isSingleComponentView(schema)) {
+    const res = callback(schema.component, schema.name)
+    if (res !== undefined) {
+      return res
     }
-  })
+  } else {
+    return forEachSchema(schema, schema => {
+      for (const [name, component] of Object.entries(schema.components || {})) {
+        const res = callback(component, name)
+        if (res !== undefined) {
+          return res
+        }
+      }
+    })
+  }
 }
 
 export function findSchemaComponent(schema, callback) {
@@ -71,6 +78,22 @@ export function everySchemaComponent(schema, callback) {
   ) !== false
 }
 
+export function isSchema(schema) {
+  return isObject(schema) && isString(schema.type)
+}
+
+export function isForm(schema) {
+  return isSchema(schema) && schema.type === 'form'
+}
+
+export function isView(schema) {
+  return isSchema(schema) && schema.type === 'view'
+}
+
+export function getSchemaIdentifier(schema) {
+  return schema.name || schema.label || schema.type
+}
+
 export async function resolveSchema(schema, unwrapModule = false) {
   if (isFunction(schema)) {
     schema = schema()
@@ -126,7 +149,7 @@ export async function resolveSchemas(
 
 export async function resolvePanels(schema) {
   const { panels } = schema
-  if (schema.panels) {
+  if (panels) {
     schema.panels = await resolveSchemas(panels)
   }
 }
@@ -135,11 +158,15 @@ export async function processView(component, api, schema, name, routes) {
   const children = []
   processRouteSchema(api, schema, name)
   await resolvePanels(schema)
-  if (isSingleComponentView(schema)) {
-    await processComponent(api, schema, name, children, 0)
+  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 {
-    // A multi-component view, start at level 1
-    await processSchemaComponents(api, schema, children, 1)
+    throw new Error(`Invalid view schema: '${getSchemaIdentifier(schema)}'`)
   }
   routes.push({
     path: `/${schema.path}`,
@@ -198,29 +225,36 @@ export async function processForms(api, schema, level) {
 
 export async function resolveForm(form) {
   form = await resolveSchema(form, true)
+  if (!isForm(form)) {
+    throw new Error(`Invalid form schema: '${getSchemaIdentifier(form)}'`)
+  }
   if (form) {
     await resolvePanels(form)
   }
   return form
 }
 
-export function isSingleComponentView(schema) {
-  // If the schema has a type, it is a single-component view.
-  return !!schema.type
-}
-
 export function hasFormSchema(schema) {
   // Support both single form and multiple forms notation, as well as inlined
   // components.
-  return isObject(schema) && !!(
-    schema.form ||
-    schema.forms ||
-    schema.components
+  return (
+    isSchema(schema) &&
+    isObject(schema.form || schema.forms || schema.components)
   )
 }
 
 export function hasMultipleFormSchemas(schema) {
-  return Object.keys(schema?.forms || {}).length > 1
+  return (
+    isSchema(schema) &&
+    Object.keys(schema?.forms || {}).length > 1
+  )
+}
+
+export function isSingleComponentView(schema) {
+  return (
+    isView(schema) &&
+    isObject(schema.component)
+  )
 }
 
 export function getViewSchema(schema, context) {