@operato/scene-grist 1.0.0-alpha.9 → 1.0.2

package/helps/scene/component/grist.md

@@ -4,12 +4,24 @@ It is a component that expresses multiple record data in the form of a data grid
 Data grid is suitable for web application UI, and data list is suitable for mobile application.
 This can be set with the grist mode attribute.
 
+If you bind the following type of data to the value property of the grist component, you can see that the data is rendered in each record in grist.
+
+```
+[
+  { name: "name 1", description: "record 1", ...  },
+  { name: "name 2", description: "record 2", ...  },
+  { name: "name 3", description: "record 3", ...  },
+  { name: "name 4", description: "record 4", ...  },
+]
+```
+
 ## Properties
 
 - grist mode
   - Grid: Data grid format that organizes multi-columns in a table format
-  - list: Data list format that composes multi-column information in the form of an item block
-  - Depends on device : Depending on the current display, it is automatically selected in the form of a data grid or a data list.
+  - List: Data list format that composes multi-column information in the form of an item block
+  - Card: Data list format that composes multi-column information in the form of an item block
+  - Depends on device : Depending on the current display, it is automatically selected in the form of a Grid or a List.
 - config
   - Configuration for grist
   - It consists of column, header, record and pagination information.

package/helps/scene/component/grist.zh.md

@@ -4,11 +4,23 @@
 数据网格适用于 Web 应用程序 UI，数据列表适用于移动应用程序。
 可以使用 grist 模式属性进行移动端应用设置。
 
+如果将以下类型的数据绑定到 grist 组件的 value 属性上，可以看到 grist 中的每条记录都呈现了数据。
+
+```
+[
+  { name: "name 1", description: "record 1", ...  },
+  { name: "name 2", description: "record 2", ...  },
+  { name: "name 3", description: "record 3", ...  },
+  { name: "name 4", description: "record 4", ...  },
+]
+```
+
 ## Properties
 
 - 模式
   - Grid: 数据网格格式，以表格格式组织多列
-  - list: 以项目块的形式组成多列信息的数据列表格式
+  - List: 以项目块的形式组成多列信息的数据列表格式
+  - Card: 卡片式数据列表
   - Depends on device : 根据当前设备自动选择数据网格或数据列表
 - 配置
   - 用于 grist 的配置

package/logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 2
+    },
+    "auditLog": "logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json",
+    "files": [
+        {
+            "date": 1654827950935,
+            "name": "logs/application-2022-06-10-11.log",
+            "hash": "2c183d3b88a5c349a78c57cf655a3030"
+        }
+    ],
+    "hashType": "md5"
+}

package/logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 14
+    },
+    "auditLog": "logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json",
+    "files": [
+        {
+            "date": 1654827953311,
+            "name": "logs/connections-2022-06-10-11.log",
+            "hash": "3ee93a30080fbb5f93fe4b5ab97c8283"
+        }
+    ],
+    "hashType": "md5"
+}

package/logs/application-2022-06-10-11.log

@@ -0,0 +1,12 @@
+2022-06-10T11:25:52+09:00 info: File Storage is Ready.
+2022-06-10T11:26:12+09:00 info: File Storage is Ready.
+2022-06-10T11:26:17+09:00 info: Database connection established
+2022-06-10T11:26:18+09:00 error: listen EADDRINUSE: address already in use :::3000
+2022-06-10T11:26:40+09:00 info: File Storage is Ready.
+2022-06-10T11:26:42+09:00 info: Database connection established
+2022-06-10T11:26:43+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2022-06-10T11:26:43+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions
+2022-06-10T11:36:15+09:00 info: File Storage is Ready.
+2022-06-10T11:36:20+09:00 info: Database connection established
+2022-06-10T11:36:21+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2022-06-10T11:36:21+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/subscriptions

package/logs/connections-2022-06-10-11.log

@@ -0,0 +1,70 @@
+2022-06-10T11:26:44+09:00 info: Initializing ConnectionManager...
+2022-06-10T11:26:44+09:00 info: Connector 'echo-back-server' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'echo-back' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'http-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'graphql-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'sqlite-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'postgresql-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'mqtt-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'mssql-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'oracle-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'mysql-connector' started to ready
+2022-06-10T11:26:44+09:00 info: Connector 'socket-server' started to ready
+2022-06-10T11:26:44+09:00 info: echo-back-servers are ready
+2022-06-10T11:26:44+09:00 info: echo-back connections are ready
+2022-06-10T11:26:44+09:00 info: http-connector connections are ready
+2022-06-10T11:26:44+09:00 info: graphql-connector connections are ready
+2022-06-10T11:26:44+09:00 info: sqlite-connector connections are ready
+2022-06-10T11:26:44+09:00 info: postgresql-connector connections are ready
+2022-06-10T11:26:44+09:00 info: mqtt-connector connections are ready
+2022-06-10T11:26:44+09:00 info: mssql-connector connections are ready
+2022-06-10T11:26:44+09:00 info: oracle-connector connections are ready
+2022-06-10T11:26:44+09:00 info: mysql-connector connections are ready
+2022-06-10T11:26:44+09:00 info: socket servers are ready
+2022-06-10T11:26:44+09:00 info: All connector for 'echo-back-server' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'echo-back' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'http-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'graphql-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'sqlite-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'postgresql-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'mqtt-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'mssql-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'oracle-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'mysql-connector' ready
+2022-06-10T11:26:44+09:00 info: All connector for 'socket-server' ready
+2022-06-10T11:26:44+09:00 info: ConnectionManager initialization done:
+2022-06-10T11:36:22+09:00 info: Initializing ConnectionManager...
+2022-06-10T11:36:22+09:00 info: Connector 'echo-back-server' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'echo-back' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'http-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'graphql-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'sqlite-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'postgresql-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'mqtt-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'mssql-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'oracle-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'mysql-connector' started to ready
+2022-06-10T11:36:22+09:00 info: Connector 'socket-server' started to ready
+2022-06-10T11:36:22+09:00 info: echo-back-servers are ready
+2022-06-10T11:36:22+09:00 info: echo-back connections are ready
+2022-06-10T11:36:22+09:00 info: http-connector connections are ready
+2022-06-10T11:36:22+09:00 info: graphql-connector connections are ready
+2022-06-10T11:36:22+09:00 info: sqlite-connector connections are ready
+2022-06-10T11:36:22+09:00 info: postgresql-connector connections are ready
+2022-06-10T11:36:22+09:00 info: mqtt-connector connections are ready
+2022-06-10T11:36:22+09:00 info: mssql-connector connections are ready
+2022-06-10T11:36:22+09:00 info: oracle-connector connections are ready
+2022-06-10T11:36:22+09:00 info: mysql-connector connections are ready
+2022-06-10T11:36:22+09:00 info: socket servers are ready
+2022-06-10T11:36:22+09:00 info: All connector for 'echo-back-server' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'echo-back' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'http-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'graphql-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'sqlite-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'postgresql-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'mqtt-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'mssql-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'oracle-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'mysql-connector' ready
+2022-06-10T11:36:22+09:00 info: All connector for 'socket-server' ready
+2022-06-10T11:36:22+09:00 info: ConnectionManager initialization done:

package/package.json

@@ -3,7 +3,7 @@
   "description": "Grist UI component for things-scene",
   "license": "MIT",
   "author": "heartyoh",
-  "version": "1.0.0-alpha.9",
+  "version": "1.0.2",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "things-scene": true,
@@ -17,7 +17,7 @@
     "directory": "packages/grist"
   },
   "scripts": {
-    "serve": "tsc && things-factory-dev",
+    "serve": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"things-factory-dev\"",
     "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
     "build": "tsc",
     "prepublish": "tsc",
@@ -26,15 +26,13 @@
     "migration": "things-factory-migration"
   },
   "dependencies": {
-    "@hatiolab/things-scene": "^2.7.34",
-    "@operato/data-grist": "^1.0.0-alpha.51",
-    "uuid": "^3.4.0"
+    "@hatiolab/things-scene": "^3.0.19",
+    "@operato/data-grist": "^1.0.0"
   },
   "devDependencies": {
     "@hatiolab/prettier-config": "^1.0.0",
-    "@operato/board": "^1.0.0-alpha.51",
-    "@things-factory/builder": "^5.0.0-alpha.28",
-    "@things-factory/operato-board": "^5.0.0-alpha.28",
+    "@things-factory/builder": "^5.0.0",
+    "@things-factory/operato-board": "^5.0.0",
     "@types/lodash-es": "^4.17.5",
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
@@ -60,5 +58,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "0f3a63c7937857320e260cfbbf841f54fa9c62ca"
+  "gitHead": "484b3aefc64bc7f15b67fae16f1b674f81767113"
 }

package/src/grist-action.ts

@@ -4,8 +4,6 @@
  * grist 컴포넌트를 보조하여 grist의 각종 동작을 수행하는 컴포넌트.
  */
 
-import uuid from 'uuid'
-
 import { Component, ComponentNature, Properties, RectPath, ValueHolder } from '@hatiolab/things-scene'
 import { DataGrist } from '@operato/data-grist'
 import { GristData, GristRecord, SorterConfig } from '@operato/data-grist/src/types.js'
@@ -98,14 +96,12 @@ const NATURE: ComponentNature = {
 }
 
 export default class GristAction extends ValueHolder(RectPath(Component)) {
-  static get nature() {
+  private _data: any
+
+  get nature() {
     return NATURE
   }
 
-  // grist의 fetchHandler를 사용할 때 이 컴포넌트를 판별할 ID
-  private uuid = uuid.v4()
-  private _data: any
-
   ready() {
     // 뷰어 시작시에도 action 값이 getPageInfo로 되어 있을 경우 fetchHandler를 등록하기 위해 onchange를 호출함
     this.onchange({ action: this.state.action })
@@ -132,10 +128,11 @@ export default class GristAction extends ValueHolder(RectPath(Component)) {
     // action 값이 바뀌면 getPageInfo인지 확인하고 grist에 fetchHandler를 등록하거나 폐기함
     if ('action' in after) {
       const gristComponent = this.targetGristComponent
+      const { refid } = this.state
 
       if (gristComponent) {
         if (after.action == ACTIONS.GET_PAGE_INFO) {
-          gristComponent.beforeFetchFuncs[this.uuid] = (fetchedData: {
+          gristComponent.beforeFetchFuncs[refid] = (fetchedData: {
             page: number
             limit: number
             total: number
@@ -145,7 +142,7 @@ export default class GristAction extends ValueHolder(RectPath(Component)) {
             this.doDataMap()
           }
         } else {
-          delete gristComponent.beforeFetchFuncs[this.uuid]
+          delete gristComponent.beforeFetchFuncs[refid]
         }
       }
     }

package/src/grist.ts

@@ -6,7 +6,8 @@ import '@operato/data-grist'
 
 import { Component, ComponentNature, HTMLOverlayElement, Properties, error } from '@hatiolab/things-scene'
 import { DataGrist, FetchResult } from '@operato/data-grist'
-import { FetchOption, GristRecord } from '@operato/data-grist/dist/src/types'
+
+import { FetchOption } from '@operato/data-grist/dist/src/types'
 
 const NATURE: ComponentNature = {
   mutable: false,
@@ -27,6 +28,10 @@ const NATURE: ComponentNature = {
             display: 'List',
             value: 'LIST'
           },
+          {
+            display: 'Card',
+            value: 'CARD'
+          },
           {
             display: 'Depends on device',
             value: 'DEVICE'
@@ -86,10 +91,6 @@ const NATURE: ComponentNature = {
 const isMobileDevice = () => false
 
 export default class SceneGrist extends HTMLOverlayElement {
-  static get nature() {
-    return NATURE
-  }
-
   public beforeFetchFuncs: any = {}
 
   private __value: any = {}
@@ -98,6 +99,10 @@ export default class SceneGrist extends HTMLOverlayElement {
 
   public grist?: DataGrist
 
+  get nature() {
+    return NATURE
+  }
+
   ready() {
     super.ready()