@vuu-ui/vuu-data-local 0.13.9 → 0.13.10

package/cjs/array-data-source/array-data-source.js

@@ -0,0 +1,669 @@
+'use strict';
+
+var vuuFilterParser = require('@vuu-ui/vuu-filter-parser');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var aggregateUtils = require('./aggregate-utils.js');
+var arrayDataUtils = require('./array-data-utils.js');
+var groupUtils = require('./group-utils.js');
+var sortUtils = require('./sort-utils.js');
+
+var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var _columnMap, _data, _keys, _links, _range, _selectedRowsCount, _status, _title;
+const { debug, info } = vuuUtils.logger("ArrayDataSource");
+const { KEY } = vuuUtils.metadataKeys;
+const toDataSourceRow = (key) => (data, index) => {
+  return [index, index, true, false, 1, 0, String(data[key]), 0, ...data];
+};
+const buildTableSchema = (columns, keyColumn) => {
+  const schema = {
+    columns: columns.map(({ name, serverDataType = "string" }) => ({
+      name,
+      serverDataType
+    })),
+    key: keyColumn ?? columns[0].name,
+    table: { module: "", table: "Array" }
+  };
+  return schema;
+};
+class ArrayDataSource extends vuuUtils.EventEmitter {
+  constructor({
+    aggregations,
+    baseFilterSpec,
+    // different from RemoteDataSource
+    columnDescriptors,
+    data,
+    dataMap,
+    filterSpec,
+    groupBy,
+    keyColumn,
+    rangeChangeRowset = "delta",
+    sort,
+    title,
+    viewport
+  }) {
+    super();
+    __publicField(this, "clientCallback");
+    __publicField(this, "columnDescriptors");
+    /** sorted offsets of data within raw data, reflecting sort order
+     * of columns specified by client.
+     */
+    __publicField(this, "dataIndices");
+    /** Map reflecting positions of data items in raw data */
+    __publicField(this, "dataMap");
+    __publicField(this, "groupMap");
+    /** the index of key field within raw data row */
+    __publicField(this, "key");
+    __publicField(this, "lastRangeServed", { from: 0, to: 0 });
+    __publicField(this, "rangeChangeRowset");
+    __publicField(this, "openTreeNodes", []);
+    /** Map reflecting positions of columns in client data sent to user */
+    __privateAdd(this, _columnMap);
+    __publicField(this, "_config", vuuUtils.vanillaConfig);
+    __privateAdd(this, _data);
+    __privateAdd(this, _keys, new vuuUtils.KeySet(vuuUtils.NULL_RANGE));
+    __privateAdd(this, _links);
+    __privateAdd(this, _range, vuuUtils.Range(0, 0));
+    __privateAdd(this, _selectedRowsCount, 0);
+    __privateAdd(this, _status, "initialising");
+    __privateAdd(this, _title);
+    __publicField(this, "_menu");
+    __publicField(this, "selectedRows", []);
+    __publicField(this, "tableSchema");
+    __publicField(this, "viewport");
+    __publicField(this, "processedData");
+    __publicField(this, "insert", (row) => {
+      const dataSourceRow = toDataSourceRow(this.key)(row, this.size);
+      __privateGet(this, _data).push(dataSourceRow);
+      const { from, to } = __privateGet(this, _range);
+      const [rowIdx] = dataSourceRow;
+      if (rowIdx >= from && rowIdx < to) {
+        this.sendRowsToClient();
+      }
+    });
+    __publicField(this, "updateDataItem", (keyValue, columnName, value) => {
+      this.validateDataValue(columnName, value);
+      const colIndex = __privateGet(this, _columnMap)[columnName];
+      const dataColIndex = this.dataMap?.[columnName];
+      const dataIndex = this.indexOfRowWithKey(keyValue);
+      if (dataIndex !== -1 && dataColIndex !== void 0) {
+        const dataSourceRow = __privateGet(this, _data)[dataIndex];
+        dataSourceRow[colIndex] = value;
+        const { from, to } = __privateGet(this, _range);
+        const [rowIdx] = dataSourceRow;
+        if (rowIdx >= from && rowIdx < to) {
+          this.sendRowsToClient(false, dataSourceRow);
+        }
+      }
+    });
+    __publicField(this, "indexOfRowWithKey", (key) => __privateGet(this, _data).findIndex((row) => row[KEY] === key));
+    __publicField(this, "update", (row, columnName) => {
+      const keyValue = row[this.key];
+      const dataColIndex = this.dataMap?.[columnName];
+      return this.updateDataItem(keyValue, columnName, row[dataColIndex]);
+    });
+    __publicField(this, "updateRow", (row) => {
+      const keyValue = row[this.key];
+      const dataIndex = __privateGet(this, _data).findIndex((row2) => row2[KEY] === keyValue);
+      if (dataIndex !== -1) {
+        const dataSourceRow = toDataSourceRow(this.key)(row, dataIndex);
+        __privateGet(this, _data)[dataIndex] = dataSourceRow;
+        const { from, to } = __privateGet(this, _range);
+        if (dataIndex >= from && dataIndex < to) {
+          this.sendRowsToClient(false, dataSourceRow);
+        }
+      }
+    });
+    if (!data || !columnDescriptors) {
+      throw Error(
+        "ArrayDataSource constructor called without data or without columnDescriptors"
+      );
+    }
+    this.columnDescriptors = columnDescriptors;
+    this.dataMap = dataMap;
+    this.key = keyColumn ? this.columnDescriptors.findIndex((col) => col.name === keyColumn) : 0;
+    this.rangeChangeRowset = rangeChangeRowset;
+    this.tableSchema = buildTableSchema(columnDescriptors, keyColumn);
+    this.viewport = viewport || vuuUtils.uuid();
+    __privateSet(this, _title, title);
+    const columns = columnDescriptors.map((col) => col.name);
+    __privateSet(this, _columnMap, vuuUtils.buildColumnMap(columns));
+    this.dataIndices = arrayDataUtils.buildDataToClientMap(__privateGet(this, _columnMap), this.dataMap);
+    __privateSet(this, _data, data.map(toDataSourceRow(this.key)));
+    this.config = {
+      ...this._config,
+      aggregations: aggregations || this._config.aggregations,
+      baseFilterSpec,
+      columns,
+      filterSpec: filterSpec || this._config.filterSpec,
+      groupBy: groupBy || this._config.groupBy,
+      sort: sort || this._config.sort
+    };
+    debug?.(`columnMap: ${JSON.stringify(__privateGet(this, _columnMap))}`);
+  }
+  async subscribe({
+    viewport = this.viewport ?? (this.viewport = vuuUtils.uuid()),
+    columns,
+    aggregations,
+    baseFilterSpec,
+    range,
+    selectedIndexValues,
+    selectedKeyValues,
+    sort,
+    groupBy,
+    filterSpec
+  }, callback) {
+    console.log(`%cArrayDataSource subscribe`, "color: red;font-weight:bold;");
+    this.clientCallback = callback;
+    this.viewport = viewport;
+    __privateSet(this, _status, "subscribed");
+    this.selectedRows = selectedIndexValues ?? this.convertKeysToIndexValues(selectedKeyValues) ?? [];
+    __privateSet(this, _selectedRowsCount, vuuUtils.selectionCount(this.selectedRows));
+    this.lastRangeServed = { from: 0, to: 0 };
+    let config = this._config;
+    const hasConfigProps = aggregations || columns || filterSpec || groupBy || sort;
+    if (hasConfigProps) {
+      if (range) {
+        this.setRange(range);
+      }
+      config = {
+        ...config,
+        aggregations: aggregations || this._config.aggregations,
+        baseFilterSpec: baseFilterSpec || this._config.baseFilterSpec,
+        columns: columns || this._config.columns,
+        filterSpec: filterSpec || this._config.filterSpec,
+        groupBy: groupBy || this._config.groupBy,
+        sort: sort || this._config.sort
+      };
+    }
+    const subscribedMessage = {
+      ...config,
+      type: "subscribed",
+      clientViewportId: this.viewport,
+      range: __privateGet(this, _range),
+      tableSchema: this.tableSchema
+    };
+    this.clientCallback?.(subscribedMessage);
+    this.emit("subscribed", subscribedMessage);
+    if (hasConfigProps) {
+      this.config = config;
+    } else {
+      this.clientCallback({
+        clientViewportId: this.viewport,
+        mode: "size-only",
+        type: "viewport-update",
+        size: __privateGet(this, _data).length
+      });
+      if (range && !__privateGet(this, _range).equals(range)) {
+        this.range = range;
+      } else if (__privateGet(this, _range) !== vuuUtils.NULL_RANGE) {
+        this.sendRowsToClient();
+      }
+      if (this.range.to !== 0) {
+        const pageCount = Math.ceil(
+          this.size / (this.range.to - this.range.from)
+        );
+        this.emit("page-count", pageCount);
+      }
+    }
+  }
+  unsubscribe() {
+    __privateSet(this, _status, "unsubscribed");
+    this.emit("unsubscribed", this.viewport);
+  }
+  suspend() {
+    if (__privateGet(this, _status) !== "unsubscribed") {
+      info?.(`suspend #${this.viewport}, current status ${__privateGet(this, _status)}`);
+      __privateSet(this, _status, "suspended");
+      this.emit("suspended", this.viewport);
+    }
+  }
+  resume(callback) {
+    const isSuspended = __privateGet(this, _status) === "suspended";
+    info?.(`resume #${this.viewport}, current status ${__privateGet(this, _status)}`);
+    if (callback) {
+      this.clientCallback = callback;
+    }
+    if (isSuspended) {
+      __privateSet(this, _status, "subscribed");
+    }
+    this.emit("resumed", this.viewport);
+    this.sendRowsToClient(true);
+  }
+  disable() {
+    this.emit("disabled", this.viewport);
+  }
+  enable() {
+    this.emit("enabled", this.viewport);
+  }
+  select(selected) {
+    __privateSet(this, _selectedRowsCount, vuuUtils.selectionCount(selected));
+    debug?.(`select ${JSON.stringify(selected)}`);
+    this.selectedRows = selected;
+    this.setRange(__privateGet(this, _range), true);
+    this.emit("row-selection", selected, __privateGet(this, _selectedRowsCount));
+  }
+  getRowKey(keyOrIndex) {
+    if (typeof keyOrIndex === "string") {
+      return keyOrIndex;
+    }
+    const row = this.getRowAtIndex(keyOrIndex);
+    if (row === void 0) {
+      throw Error(`row not found at index ${keyOrIndex}`);
+    }
+    return row?.[KEY];
+  }
+  openTreeNode(keyOrIndex) {
+    const key = this.getRowKey(keyOrIndex);
+    this.openTreeNodes.push(key);
+    this.processedData = groupUtils.expandGroup(
+      this.openTreeNodes,
+      __privateGet(this, _data),
+      this._config.groupBy,
+      __privateGet(this, _columnMap),
+      this.groupMap,
+      this.processedData
+    );
+    this.setRange(__privateGet(this, _range).reset, true);
+  }
+  closeTreeNode(keyOrIndex) {
+    const key = this.getRowKey(keyOrIndex);
+    this.openTreeNodes = this.openTreeNodes.filter((value) => value !== key);
+    if (this.processedData) {
+      this.processedData = groupUtils.collapseGroup(key, this.processedData);
+      this.setRange(__privateGet(this, _range).reset, true);
+    }
+  }
+  get pageSize() {
+    return __privateGet(this, _range).to - __privateGet(this, _range).from;
+  }
+  get links() {
+    return __privateGet(this, _links);
+  }
+  set links(links) {
+    __privateSet(this, _links, links);
+  }
+  get menu() {
+    return this._menu;
+  }
+  get status() {
+    return __privateGet(this, _status);
+  }
+  get data() {
+    return __privateGet(this, _data);
+  }
+  // Only used by the UpdateGenerator
+  get currentData() {
+    return this.processedData ?? __privateGet(this, _data);
+  }
+  get table() {
+    return this.tableSchema.table;
+  }
+  get config() {
+    return this._config;
+  }
+  set config(config) {
+    const configChanges = this.applyConfig(config);
+    if (configChanges) {
+      if (config) {
+        const originalConfig = this._config;
+        const newConfig = config?.filterSpec?.filter && config?.filterSpec.filterStruct === void 0 ? {
+          ...config,
+          filterSpec: {
+            filter: config.filterSpec.filter,
+            filterStruct: vuuFilterParser.parseFilter(config.filterSpec.filter)
+          }
+        } : config;
+        this._config = vuuUtils.withConfigDefaults(newConfig);
+        let processedData;
+        if (vuuUtils.hasFilter(config) || vuuUtils.hasBaseFilter(config)) {
+          const {
+            filterSpec: { filterStruct }
+          } = vuuUtils.combineFilters(this._config);
+          if (filterStruct) {
+            const fn = vuuFilterParser.filterPredicate(__privateGet(this, _columnMap), filterStruct);
+            processedData = __privateGet(this, _data).filter(fn);
+          } else {
+            throw Error("filter must include filterStruct");
+          }
+        }
+        if (vuuUtils.hasSort(config)) {
+          processedData = sortUtils.sortRows(
+            processedData ?? __privateGet(this, _data),
+            config.sort,
+            __privateGet(this, _columnMap)
+          );
+        }
+        if (this.openTreeNodes.length > 0 && vuuUtils.isGroupByChanged(originalConfig, config)) {
+          if (this._config.groupBy.length === 0) {
+            this.openTreeNodes.length = 0;
+          }
+        }
+        if (vuuUtils.hasGroupBy(config)) {
+          const [groupedData, groupMap] = groupUtils.groupRows(
+            processedData ?? __privateGet(this, _data),
+            config.groupBy,
+            __privateGet(this, _columnMap)
+          );
+          this.groupMap = groupMap;
+          processedData = groupedData;
+          if (this.openTreeNodes.length > 0) {
+            processedData = groupUtils.expandGroup(
+              this.openTreeNodes,
+              __privateGet(this, _data),
+              this._config.groupBy,
+              __privateGet(this, _columnMap),
+              this.groupMap,
+              processedData
+            );
+          }
+        }
+        this.processedData = processedData?.map((row, i) => {
+          const dolly = row.slice();
+          dolly[0] = i;
+          dolly[1] = i;
+          return dolly;
+        });
+      }
+      if (__privateGet(this, _status) === "subscribed") {
+        this.setRange(__privateGet(this, _range).reset, true);
+        this.emit("config", this._config, this.range, void 0, configChanges);
+      }
+    }
+  }
+  applyConfig(config, preserveExistingConfigAttributes = false) {
+    const { noChanges, ...otherChanges } = vuuUtils.isConfigChanged(
+      this._config,
+      config
+    );
+    if (noChanges !== true) {
+      if (config) {
+        const newConfig = config?.filterSpec?.filter && config?.filterSpec.filterStruct === void 0 ? {
+          ...config,
+          filterSpec: {
+            filter: config.filterSpec.filter,
+            filterStruct: vuuFilterParser.parseFilter(config.filterSpec.filter)
+          }
+        } : config;
+        if (preserveExistingConfigAttributes) {
+          this._config = {
+            ...this._config,
+            ...config
+          };
+        } else {
+          this._config = vuuUtils.withConfigDefaults(newConfig);
+        }
+        return otherChanges;
+      }
+    }
+  }
+  get columnMap() {
+    return __privateGet(this, _columnMap);
+  }
+  get selectedRowsCount() {
+    return __privateGet(this, _selectedRowsCount);
+  }
+  get size() {
+    return this.processedData?.length ?? __privateGet(this, _data).length;
+  }
+  get range() {
+    return __privateGet(this, _range);
+  }
+  set range(range) {
+    this.setRange(range);
+  }
+  getRowAtIndex(rowIndex) {
+    return this.processedData?.[rowIndex];
+  }
+  delete(row) {
+    console.log(`delete row ${row.join(",")}`);
+  }
+  validateDataValue(columnName, value) {
+    const columnDescriptor = this.columnDescriptors.find(
+      (col) => col.name === columnName
+    );
+    if (columnDescriptor) {
+      switch (columnDescriptor.serverDataType) {
+        case "int":
+          {
+            if (typeof value === "number") {
+              if (Math.floor(value) !== value) {
+                throw Error(`${columnName} is int but value = ${value}`);
+              }
+            } else if (typeof value === "string") {
+              const numericValue = parseFloat(value);
+              if (Math.floor(numericValue) !== numericValue) {
+                throw Error(`${columnName} is ${value} is not a valid integer`);
+              }
+            }
+          }
+          break;
+      }
+    } else {
+      throw Error(`Unknown column ${columnName}`);
+    }
+  }
+  setRange(range, forceFullRefresh = false) {
+    if (range.from !== __privateGet(this, _range).from || range.to !== __privateGet(this, _range).to) {
+      const currentPageCount = Math.ceil(
+        this.size / (__privateGet(this, _range).to - __privateGet(this, _range).from)
+      );
+      const newPageCount = Math.ceil(this.size / (range.to - range.from));
+      __privateSet(this, _range, range);
+      const keysResequenced = __privateGet(this, _keys).reset(range);
+      this.sendRowsToClient(forceFullRefresh || keysResequenced);
+      requestAnimationFrame(() => {
+        if (newPageCount !== currentPageCount) {
+          this.emit("page-count", newPageCount);
+        }
+        this.emit("range", range);
+      });
+    } else if (forceFullRefresh) {
+      this.sendRowsToClient(forceFullRefresh);
+    }
+  }
+  sendRowsToClient(forceFullRefresh = false, row) {
+    if (row) {
+      this.clientCallback?.({
+        clientViewportId: this.viewport,
+        mode: "update",
+        rows: [
+          arrayDataUtils.toClientRow(row, __privateGet(this, _keys), this.selectedRows, this.dataIndices)
+        ],
+        type: "viewport-update"
+      });
+    } else {
+      const rowRange = this.rangeChangeRowset === "delta" && !forceFullRefresh ? vuuUtils.rangeNewItems(this.lastRangeServed, __privateGet(this, _range)) : __privateGet(this, _range);
+      const data = this.processedData ?? __privateGet(this, _data);
+      const rowsWithinViewport = data.slice(rowRange.from, rowRange.to).map(
+        (row2) => arrayDataUtils.toClientRow(row2, __privateGet(this, _keys), this.selectedRows, this.dataIndices)
+      );
+      this.clientCallback?.({
+        clientViewportId: this.viewport,
+        mode: "batch",
+        range: __privateGet(this, _range),
+        rows: rowsWithinViewport,
+        size: data.length,
+        type: "viewport-update"
+      });
+      this.lastRangeServed = {
+        from: __privateGet(this, _range).from,
+        to: __privateGet(this, _range).to
+        // to: Math.min(
+        //   this.#range.to,
+        //   this.#range.from + rowsWithinViewport.length,
+        // ),
+      };
+    }
+  }
+  get columns() {
+    return this._config.columns;
+  }
+  set columns(columns) {
+    const addedColumns = vuuUtils.getAddedItems(this.config.columns, columns);
+    if (addedColumns.length > 0) {
+      const columnsWithoutDescriptors = vuuUtils.getMissingItems(
+        this.columnDescriptors,
+        addedColumns,
+        (col) => col.name
+      );
+      console.log(`columnsWithoutDescriptors`, {
+        columnsWithoutDescriptors
+      });
+    }
+    __privateSet(this, _columnMap, vuuUtils.buildColumnMap(columns));
+    this.dataIndices = arrayDataUtils.buildDataToClientMap(__privateGet(this, _columnMap), this.dataMap);
+    this.config = {
+      ...this._config,
+      columns
+    };
+  }
+  get aggregations() {
+    return this._config.aggregations;
+  }
+  set aggregations(aggregations) {
+    this._config = {
+      ...this._config,
+      aggregations
+    };
+    const targetData = this.processedData ?? __privateGet(this, _data);
+    const leafData = __privateGet(this, _data);
+    aggregateUtils.aggregateData(
+      aggregations,
+      targetData,
+      this._config.groupBy,
+      leafData,
+      __privateGet(this, _columnMap),
+      this.groupMap
+    );
+    this.setRange(__privateGet(this, _range).reset, true);
+    this.emit("config", this._config, this.range);
+  }
+  get sort() {
+    return this._config.sort;
+  }
+  set sort(sort) {
+    debug?.(`sort ${JSON.stringify(sort)}`);
+    this.config = {
+      ...this._config,
+      sort
+    };
+  }
+  get baseFilter() {
+    return this._config.baseFilterSpec;
+  }
+  set baseFilter(baseFilter) {
+    debug?.(`baseFilter ${JSON.stringify(baseFilter)}`);
+    this.config = {
+      ...this._config,
+      baseFilterSpec: baseFilter
+    };
+  }
+  get filter() {
+    return this._config.filterSpec;
+  }
+  set filter(filter) {
+    debug?.(`filter ${JSON.stringify(filter)}`);
+    this.config = {
+      ...this._config,
+      filterSpec: filter
+    };
+  }
+  get groupBy() {
+    return this._config.groupBy;
+  }
+  set groupBy(groupBy) {
+    this.config = {
+      ...this._config,
+      groupBy
+    };
+  }
+  get title() {
+    return __privateGet(this, _title) ?? `${this.table.module} ${this.table.table}`;
+  }
+  set title(title) {
+    __privateSet(this, _title, title);
+    this.emit("title-changed", this.viewport, title);
+  }
+  get _clientCallback() {
+    return this.clientCallback;
+  }
+  createLink({
+    parentVpId,
+    link: { fromColumn, toColumn }
+  }) {
+    console.log("create link", {
+      parentVpId,
+      fromColumn,
+      toColumn
+    });
+  }
+  removeLink() {
+    console.log("remove link");
+  }
+  applyEdit(rowKey, columnName, value) {
+    console.log(`ArrayDataSource applyEdit ${rowKey} ${columnName} ${value}`);
+    return Promise.resolve(true);
+  }
+  async remoteProcedureCall() {
+    return Promise.reject();
+  }
+  async menuRpcCall(rpcRequest) {
+    return new Promise((resolve) => {
+      if (vuuUtils.isEditCellRequest(rpcRequest)) {
+        const { rowKey, field, value } = rpcRequest;
+        try {
+          this.updateDataItem(rowKey, field, value);
+          resolve({
+            action: {
+              type: "VP_EDIT_SUCCESS"
+            },
+            rpcName: "VP_EDIT_CELL_RPC",
+            type: "VIEW_PORT_MENU_RESP",
+            vpId: this.viewport
+          });
+        } catch (error) {
+          resolve({
+            error: String(error),
+            rpcName: "VP_EDIT_CELL_RPC",
+            type: "VIEW_PORT_MENU_REJ",
+            vpId: this.viewport
+          });
+        }
+      } else {
+        throw Error("menuRpcCall invalid rpcRequest");
+      }
+    });
+  }
+  convertKeysToIndexValues(keys) {
+    if (Array.isArray(keys)) {
+      const indexValues = [];
+      keys.forEach((key) => {
+        const rowIdx = this.indexOfRowWithKey(key);
+        if (rowIdx !== -1) {
+          indexValues.push(rowIdx);
+        }
+      });
+      return indexValues;
+    }
+  }
+}
+_columnMap = new WeakMap();
+_data = new WeakMap();
+_keys = new WeakMap();
+_links = new WeakMap();
+_range = new WeakMap();
+_selectedRowsCount = new WeakMap();
+_status = new WeakMap();
+_title = new WeakMap();
+
+exports.ArrayDataSource = ArrayDataSource;
+//# sourceMappingURL=array-data-source.js.map