Additional improvements to Store and Record API

CHANGELOG.md

@@ -18,6 +18,10 @@
   `agOptions.defaultGroupSortComparator`).
 * The `Column.cellClass` and `Column.headerClass` configs now accept functions to dynamically
   generate custom classes based on the Record and/or Column being rendered.
+
+### 💥 Breaking Changes
+* The argument `LocalStore.processRawData` now expects a function that *returns* a modified object with the
+  necessary edits.  This allows implementations to safely *clone* the raw data rather than mutating it.     
 
 ### ⚙️ Technical
 

data/Field.js

@@ -5,8 +5,6 @@
  * Copyright © 2019 Extremely Heavy Industries Inc.
  */
 
-import {Record} from '@xh/hoist/data/Record';
-import {throwIf} from '@xh/hoist/utils/js';
 import {startCase, isEqual as lodashIsEqual} from 'lodash';
 import {XH} from '@xh/hoist/core';
 
@@ -38,12 +36,6 @@ export class Field {
         label = startCase(name),
         defaultValue = null
     }) {
-
-        throwIf(
-            Record.RESERVED_FIELD_NAMES.includes(name),
-            `Field name "${name}" cannot be used. It is reserved as a top-level property of the Record class.`
-        );
-
         this.name = name;
         this.type = type;
         this.label = label;

data/LocalStore.js

@@ -31,7 +31,8 @@ export class LocalStore extends BaseStore {
     /**
      * @param {Object} c - LocalStore configuration.
      * @param {function} [c.processRawData] - function to run on each individual data object
-     *      presented to loadData() prior to creating a record from that raw object.
+     *      presented to loadData() prior to creating a record from that object.  This function should
+     *      return a data object, taking care to clone the original object if edits are necessary.
      * @param {(function|string)} [c.idSpec] - specification for selecting or producing an immutable
      *      unique id for each record. May be either a property (default is 'id') or a function to
      *      create an id from a record. If there is no natural id to select/generate, you can use

data/Record.js

@@ -4,7 +4,8 @@
  *
  * Copyright © 2019 Extremely Heavy Industries Inc.
  */
-import {isEqual} from 'lodash';
+import {isEqual, isNil, isString} from 'lodash';
+import {throwIf} from '@xh/hoist/utils/js';
 
 /**
  * Wrapper object for each data element within a {@see BaseStore}.
@@ -14,8 +15,6 @@ import {isEqual} from 'lodash';
  */
 export class Record {
 
-    static RESERVED_FIELD_NAMES = ['parentId', 'store', 'xhTreePath']
-
     /** @member {(string|number)} */
     id;
     /** @member {BaseStore} */
@@ -43,20 +42,31 @@ export class Record {
      * requiring children to also be recreated.)
      *
      * @param {Object} c - Record configuration
+     * @param {Object} c.data - data for constructing the record.
      * @param {Object} c.raw - raw data for record.
      * @param {BaseStore} c.store - store containing this record.
      * @param {Record} [c.parent] - parent record, if any.
      */
-    constructor({raw, store, parent}) {
-        const id = raw.id;
+    constructor({data, raw, store, parent}) {
+        const {idSpec} = store,
+            id = isString(idSpec) ? data[idSpec] : idSpec(data);
+
+        throwIf(isNil(id), "Record has an undefined ID. Use 'LocalStore.idSpec' to resolve a unique ID for each record.");
 
         this.id = id;
         this.store = store;
+        this.raw = raw;
         this.parentId = parent ? parent.id : null;
         this.xhTreePath = parent ? [...parent.xhTreePath, id] : [id];
 
         store.fields.forEach(f => {
-            this[f.name] = f.parseVal(raw[f.name]);
+            const {name} = f;
+            if (name == 'id') return;
+            throwIf(
+                name in this,
+                `Field name "${name}" cannot be used for data. It is reserved as a top-level property of the Record class.`
+            );
+            this[name] = f.parseVal(data[name]);
         });
     }
 

data/impl/RecordSet.js

@@ -5,7 +5,7 @@
  * Copyright © 2019 Extremely Heavy Industries Inc.
  */
 
-import {isString, isNil, partition} from 'lodash';
+import {partition} from 'lodash';
 import {throwIf} from '@xh/hoist/utils/js/';
 import {Record} from '../Record';
 
@@ -164,28 +164,22 @@ export class RecordSet {
     }
 
     createRecord(raw, records, parent) {
-        const {store} = this,
-            {idSpec} = store;
+        const {store} = this;
 
-        if (store.processRawData) store.processRawData(raw);
-
-        raw.id = isString(idSpec) ? raw[idSpec] : idSpec(raw);
-
-        throwIf(
-            isNil(raw.id),
-            "Record has a null/undefined ID. Use the 'LocalStore.idSpec' config to resolve a unique ID for each record."
-        );
+        let data = raw;
+        if (store.processRawData) {
+            data = store.processRawData(raw);
+            throwIf(!data, 'processRawData should return an object. If writing/editing, be sure to return a clone!');
+        }
 
+        const rec = new Record({data, raw, parent, store});
         throwIf(
-            records.has(raw.id),
-            `ID ${raw.id} is not unique. Use the 'LocalStore.idSpec' config to resolve a unique ID for each record.`
+            records.has(rec.id),
+            `ID ${rec.id} is not unique. Use the 'LocalStore.idSpec' config to resolve a unique ID for each record.`
         );
-
-        const rec = new Record({raw, parent, store});
         records.set(rec.id, rec);
-
-        if (raw.children) {
-            raw.children.forEach(rawChild => this.createRecord(rawChild, records, rec));
+        if (data.children) {
+            data.children.forEach(rawChild => this.createRecord(rawChild, records, rec));
         }
     }
 

desktop/cmp/leftrightchooser/LeftRightChooserModel.js

@@ -8,7 +8,6 @@ import {HoistModel, XH, managed} from '@xh/hoist/core';
 import {GridModel} from '@xh/hoist/cmp/grid';
 import {computed} from '@xh/hoist/mobx';
 import {convertIconToSvg, Icon} from '@xh/hoist/icon';
-import {isNil} from 'lodash';
 
 /**
  * A Model for managing the state of a LeftRightChooser.
@@ -173,21 +172,21 @@ export class LeftRightChooserModel {
 
     preprocessData(data) {
         return data
-            .filter(rec => !rec.exclude)
-            .map(raw => {
-                raw.group = raw.group || this._ungroupedName;
-                raw.side = raw.side || 'left';
-                raw.id = isNil(raw.id) ? XH.genId() : raw.id;
-                return raw;
+            .filter(r => !r.exclude)
+            .map(r => {
+                return {
+                    id: XH.genId(),
+                    group: this._ungroupedName,
+                    side: 'left',
+                    ...r
+                };
             });
     }
 
     moveRows(rows) {
         rows.forEach(rec => {
             if (rec.locked) return;
-
-            const rawRec = this._data.find(raw => raw === rec.raw);
-            rawRec.side = (rec.side === 'left' ? 'right' : 'left');
+            rec.raw.side = (rec.side === 'left' ? 'right' : 'left');
         });
 
         this.refreshStores();