Skip to content

Modules

Matej Maloča edited this page May 28, 2021 · 12 revisions

A module represents a collection in the database. It consists of three configurations a schema, layout and definitions.

Schema

The schema is a standard JSON Schema it's used to define the format of documents in the collection.

Example

{
  "properties": {
    "name": {
      "type": "string"
    },
    "age": {
      "type": "number"
    }
  }
}

Layout

The layout is used for configuring how the schema is displayed in the overview and form segments. Below is the layout definition:

{
  icon?: string;
  table?: {
    sort?: TableSort;
    tableColumns?: TableColumn[];
  };
  instance: {
    segments: InstanceSegment[];
  };
  sortModule?: SortModule;
}

Table Column

{
  /**
   * This flags indicates that the column
   * should be turned in to a form control
   * if it's true the key property needs
   * to be a string
   */
  control?: boolean;

  key: string | string[];
  label?: string;
  pipe?: PipeType;
  pipeArguments?: any[];
  sortable?: boolean;
  join?: string;
  nestedColumns?: NestedTableColumn[];
}

Instance Segments

Sort Module

Example

Definitions

This configuration is used for defining additional field based options. Changing the label or what component is used to represent the field in the form. The ModuleDefinition looks like this:

Property Type Description Default
label string Label of the field uses the name of the property
hint string Shows a hint below the field if defined -
defaultValue any What the value of the field should be if empty -
component object {type: string, configuration: any} - The type defines the field to use and the configuration is used for any additional component specific options Whatever is the default for the property type

Component Types

Name Selector Description Configuration Options
Input input A simple input {type: 'text', 'number', 'email'}

Example

{
  "name": {
    "label": "Name",
    "defaultValue": "John"
  },
  "age": {
    "label": "Age",
    "component": {
      "type": "slider"
    }
  }
}

Subcollections

It's possible to define a module for a subcollection (this is mostly relevant in firestore). A subcollection module is defined in the exact same way as a collection module. The only exception being what the id property should be. Instead of being the name of the collection, it should be in the following format [collectionId]~{docId}~[subCollectionId]. We use ~ instead of / because / in firestore results in subcollections being created. It's also important that the {docId} segment is exactly that since we use that lookup when replacing it with the actual document id.

Example

The following defines a module for the notes subcollection on each user document.

{
  id: 'users~{docId}~notes',
  name: 'User Notes',
  authorization: {
    read: ['admin'],
    write: ['admin']
  },
  layout: {
    table: {
      tableColumns: [
        {
          key: '/note',
          label: 'Note'
        }
      ]
    }
  },
  schema: {
    properties: {
      id: {type: 'string'},
      note: {type: 'string'}
    }
  }
}

CollectionGroup

It's possible to define a module for a collectionGroup (group all specific subcollection documents). A collection group module is defined in the exact same way as a collection module and a subcollection module. The only exception is defining collectionGroup flag. Name of subcollection needs to be unique and firestore rule needs to be defined.

Firestore rules

match /{allCollections=**}/notes/{id} {
  allow read: if true;
  allow write: if true;
}

Example

The following defines a module for all notes of all users.

{
  id: 'notes',
  name: 'Users Notes',
  collectionGroup: true,
  authorization: {
    read: ['admin'],
    write: ['admin']
  },
  layout: {
    table: {
      tableColumns: [
        {
          key: '/note',
          label: 'Note'
        },
        {
          key: '/ref',
          label: 'User link',
          pipe: ['custom'],
          pipeArguments: {
            0: 'value => `<a class="link" href="/m/users/single/${value.parent.parent.id}" target="_blank">${value.parent.parent.id}</a>`'
          }
        }
      ]
    }
  },
  schema: {
    properties: {
      id: {type: 'string'},
      note: {type: 'string'}
    }
  }
}

Auto-Save

To enable auto-save on a module you can add metadata.autoSave, it should be a number representing the interval in milliseconds for how often to perform automatic saves. If set to 0 saves happens on every data change.

Clone this wiki locally