@things-factory/dataset 5.0.0-alpha.1 → 5.0.0-alpha.12

package/client/bootstrap.js

@@ -1,3 +1,16 @@
-import { store } from '@things-factory/shell'
+import {
+  Json5Renderer,
+  registerEditor as registerGristEditor,
+  registerRenderer as registerGristRenderer
+} from '@operato/data-grist'
 
-export default function bootstrap() {}
+import { OxGristEditorDataItemSpec } from '@operato/dataset/grist-editor'
+import { OxGristEditorPartitionKeys } from '@operato/app/grist-editor/ox-grist-editor-partition-keys.js'
+
+export default function bootstrap() {
+  registerGristEditor('data-item-spec', OxGristEditorDataItemSpec)
+  registerGristRenderer('data-item-spec', Json5Renderer)
+
+  registerGristEditor('partition-keys', OxGristEditorPartitionKeys)
+  registerGristRenderer('partition-keys', Json5Renderer)
+}

package/client/pages/data-entry-form.js

@@ -0,0 +1,75 @@
+import gql from 'graphql-tag'
+import { css, html, LitElement } from 'lit'
+
+import { client } from '@operato/graphql'
+import { i18next, localize } from '@operato/i18n'
+import '@operato/dataset/ox-data-entry-form.js'
+
+class DataEntryForm extends localize(i18next)(LitElement) {
+  static get properties() {
+    return {
+      dataSet: Object
+    }
+  }
+
+  static get styles() {
+    return [
+      css`
+        :host {
+          display: flex;
+          flex-direction: column;
+
+          background-color: #fff;
+        }
+
+        ox-data-entry-form {
+          flex: 1;
+          margin: 10px;
+        }
+
+        .button-container {
+          display: flex;
+          margin-left: auto;
+          padding: var(--padding-default);
+        }
+      `
+    ]
+  }
+
+  get entryForm() {
+    return this.renderRoot.querySelector('ox-data-entry-form')
+  }
+
+  render() {
+    return html`
+      <ox-data-entry-form .dataSet=${this.dataSet}></ox-data-entry-form>
+      <div class="button-container">
+        <mwc-button raised @click=${this._updateDataItems.bind(this)}>${i18next.t('button.save')}</mwc-button>
+      </div>
+    `
+  }
+
+  async _updateDataItems() {
+    const data = this.entryForm.buildValue()
+    const dataSample = {
+      dataSetId: this.dataSet.id,
+      data
+    }
+
+    const response = await client.mutate({
+      mutation: gql`
+        mutation ($dataSample: NewDataSample!) {
+          createDataSample(dataSample: $dataSample) {
+            id
+            collectedAt
+          }
+        }
+      `,
+      variables: {
+        dataSample
+      }
+    })
+  }
+}
+
+window.customElements.define('data-entry-form', DataEntryForm)

package/client/pages/data-item-list.js

@@ -1,8 +1,8 @@
-import gql from 'graphql-tag'
-import { css, html, LitElement } from 'lit'
+import { LitElement, css, html } from 'lit'
+import { i18next, localize } from '@operato/i18n'
 
 import { client } from '@operato/graphql'
-import { i18next, localize } from '@operato/i18n'
+import gql from 'graphql-tag'
 import { isMobileDevice } from '@operato/utils'
 
 class DataItemList extends localize(i18next)(LitElement) {
@@ -33,9 +33,6 @@ class DataItemList extends localize(i18next)(LitElement) {
           padding: var(--padding-default);
         }
 
-        form {
-          position: relative;
-        }
         [danger] {
           --mdc-theme-primary: var(--mdc-danger-button-primary-color);
         }
@@ -46,7 +43,7 @@ class DataItemList extends localize(i18next)(LitElement) {
     ]
   }
 
-  get dataGrist() {
+  get grist() {
     return this.renderRoot.querySelector('ox-grist')
   }
 
@@ -64,8 +61,6 @@ class DataItemList extends localize(i18next)(LitElement) {
     `
   }
 
-  async updated(changedProps) {}
-
   async firstUpdated() {
     this.gristConfig = {
       list: { fields: ['name', 'description', 'active'] },
@@ -135,12 +130,58 @@ class DataItemList extends localize(i18next)(LitElement) {
           sortable: true,
           width: 60
         },
+        {
+          type: 'string',
+          name: 'tag',
+          header: i18next.t('field.tag'),
+          record: {
+            editable: true
+          },
+          width: 180
+        },
         {
           type: 'select',
           name: 'type',
           header: i18next.t('field.type'),
           record: {
-            options: ['number', 'text', 'select', 'boolean'],
+            options: ['', 'number', 'text', 'select', 'boolean', 'file'],
+            editable: true
+          },
+          width: 120
+        },
+        {
+          type: 'parameters',
+          name: 'options',
+          header: i18next.t('field.options'),
+          record: {
+            editable: true,
+            renderer: 'json5',
+            options: async (value, column, record, row, field) => {
+              return {
+                name: record.type,
+                help: '',
+                spec:
+                  record.type === 'select'
+                    ? [
+                        {
+                          type: 'options' /* property-editor type */,
+                          name: 'options',
+                          label: i18next.t('field.options')
+                        }
+                      ]
+                    : [],
+                context: this.grist,
+                objectified: true
+              }
+            }
+          },
+          width: 120
+        },
+        {
+          type: 'string',
+          name: 'unit',
+          header: i18next.t('field.unit'),
+          record: {
             editable: true
           },
           width: 120
@@ -155,11 +196,16 @@ class DataItemList extends localize(i18next)(LitElement) {
           width: 60
         },
         {
-          type: 'json',
+          type: 'data-item-spec',
           name: 'spec',
           header: i18next.t('field.spec'),
           record: {
-            editable: true
+            editable: true,
+            options: {
+              name: '',
+              help: '',
+              objectified: true /* prevent from stringifying */
+            }
           },
           width: 200
         }
@@ -198,7 +244,10 @@ class DataItemList extends localize(i18next)(LitElement) {
               description
               sequence
               active
+              tag
               type
+              options
+              unit
               quota
               spec
             }
@@ -215,7 +264,7 @@ class DataItemList extends localize(i18next)(LitElement) {
   }
 
   async _updateDataItems() {
-    let patches = this.dataGrist._data.records
+    let patches = this.grist._data.records
     if (patches && patches.length) {
       patches = patches.map(patch => {
         var patchField = {}
@@ -241,14 +290,14 @@ class DataItemList extends localize(i18next)(LitElement) {
         }
       })
 
-      if (!response.errors) this.dataGrist.fetch()
+      if (!response.errors) this.grist.fetch()
     }
   }
 
   async _deleteDataItems() {
     if (!confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) return
 
-    const ids = this.dataGrist.selected.map(record => record.id)
+    const ids = this.grist.selected.map(record => record.id)
     if (!(ids && ids.length > 0)) return
 
     const response = await client.mutate({
@@ -264,7 +313,7 @@ class DataItemList extends localize(i18next)(LitElement) {
 
     if (response.errors) return
 
-    this.dataGrist.fetch()
+    this.grist.fetch()
     await document.dispatchEvent(
       new CustomEvent('notify', {
         detail: {

package/client/pages/data-sample.js

@@ -1,15 +1,15 @@
 import '@operato/data-grist'
 
-import gql from 'graphql-tag'
+import { CommonButtonStyles, ScrollbarStyles } from '@operato/styles'
+import { PageView, store } from '@operato/shell'
 import { css, html } from 'lit'
-import { connect } from 'pwa-helpers/connect-mixin'
+import { i18next, localize } from '@operato/i18n'
 
 import { client } from '@operato/graphql'
-import { i18next, localize } from '@operato/i18n'
-import { notify } from '@operato/layout'
-import { PageView, store } from '@operato/shell'
-import { CommonButtonStyles, ScrollbarStyles } from '@operato/styles'
+import { connect } from 'pwa-helpers/connect-mixin'
+import gql from 'graphql-tag'
 import { isMobileDevice } from '@operato/utils'
+import { notify } from '@operato/layout'
 
 export class DataSample extends connect(store)(localize(i18next)(PageView)) {
   static get properties() {
@@ -121,7 +121,7 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
           },
           filter: 'search',
           sortable: true,
-          width: 150
+          width: 120
         },
         {
           type: 'string',
@@ -132,15 +132,29 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
             editable: true
           },
           filter: 'search',
-          width: 200
+          width: 150
         },
         {
-          type: 'string',
-          name: 'dataSetId',
-          hidden: true
+          type: 'resource-object',
+          name: 'dataSet',
+          header: i18next.t('field.dataSet'),
+          record: {
+            editable: false
+          },
+          sortable: true,
+          width: 120
         },
         {
-          type: 'json',
+          type: 'json5',
+          name: 'partitionKeys',
+          header: i18next.t('field.partition-keys'),
+          record: {
+            editable: false
+          },
+          width: 200
+        },
+        {
+          type: 'json5',
           name: 'data',
           header: i18next.t('field.data'),
           record: {
@@ -149,7 +163,7 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
           width: 200
         },
         {
-          type: 'json',
+          type: 'json5',
           name: 'spec',
           header: i18next.t('field.spec'),
           record: {
@@ -157,9 +171,17 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
           },
           width: 200
         },
-
         {
-          type: 'object',
+          type: 'text',
+          name: 'rawData',
+          header: i18next.t('field.raw-data'),
+          record: {
+            editable: false
+          },
+          width: 200
+        },
+        {
+          type: 'resource-object',
           name: 'updater',
           header: i18next.t('field.updater'),
           sortable: true,
@@ -171,6 +193,13 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
           header: i18next.t('field.updated_at'),
           sortable: true,
           width: 180
+        },
+        {
+          type: 'datetime',
+          name: 'collectedAt',
+          header: i18next.t('field.collected_at'),
+          sortable: true,
+          width: 180
         }
       ],
       rows: {
@@ -210,7 +239,12 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
               id
               name
               description
-              dataSetId
+              dataSet {
+                id
+                name
+                description
+              }
+              partitionKeys
               data
               spec
               updater {
@@ -218,6 +252,7 @@ export class DataSample extends connect(store)(localize(i18next)(PageView)) {
                 name
               }
               updatedAt
+              collectedAt
             }
             total
           }