1 files changed, 49 insertions, 14 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 4490b8dec..647986568 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable no-restricted-syntax */
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Popup, PopupTrigger, Type } from 'browndash-components';
-import { ObservableMap, action, computed, makeObservable, observable, observe } from 'mobx';
+import { ObservableMap, action, autorun, computed, makeObservable, observable, observe } from 'mobx';
 import { observer } from 'mobx-react';
 import * as React from 'react';
 import { returnEmptyDoclist, returnEmptyString, returnFalse, returnIgnore, returnNever, returnTrue, setupMoveUpEvents, smoothScroll } from '../../../../ClientUtils';
@@ -85,10 +85,11 @@ export class CollectionSchemaView extends CollectionSubView() {
     @observable _selectedCol: number = 0;
     @observable _selectedCells: Array<Doc> = [];
     @observable _mouseCoordinates = { x: 0, y: 0 };
-    @observable _lowestSelectedIndex = -1; //lowest index among selected rows; used to properly sync dragged docs with cursor position
-    @observable _relCursorIndex = -1; //cursor index relative to the current selected cells
-    @observable _draggedColIndex = 0;
-    @observable _colBeingDragged = false;
+    @observable _lowestSelectedIndex: number = -1; //lowest index among selected rows; used to properly sync dragged docs with cursor position
+    @observable _relCursorIndex: number = -1; //cursor index relative to the current selected cells
+    @observable _draggedColIndex: number = 0;
+    @observable _colBeingDragged: boolean = false;
+    @observable _colKeysFiltered: boolean = false;
 
     // target HTMLelement portal for showing a popup menu to edit cell values.
     public get MenuTarget() {
@@ -282,7 +283,7 @@ export class CollectionSchemaView extends CollectionSubView() {
     @undoBatch
     changeColumnKey = (index: number, newKey: string, defaultVal?: any) => {
         if (!this.documentKeys.includes(newKey)) {
-            this.addNewKey(newKey, defaultVal);
+            this.addNewKey(newKey, defaultVal, false);
         }
 
         const currKeys = [...this.columnKeys];
@@ -293,7 +294,7 @@ export class CollectionSchemaView extends CollectionSubView() {
     @undoBatch
     addColumn = (key: string, defaultVal?: any) => {
         if (!this.documentKeys.includes(key)) {
-            this.addNewKey(key, defaultVal);
+            this.addNewKey(key, defaultVal, false);
         }
 
         const newColWidth = this.tableWidth / (this.storedColumnWidths.length + 1);
@@ -308,10 +309,37 @@ export class CollectionSchemaView extends CollectionSubView() {
     };
 
     @action
-    addNewKey = (key: string, defaultVal: any) =>
-        this.childDocs.forEach(doc => {
-            doc[DocData][key] = defaultVal;
+    addNewKey = (key: string, defaultVal: any, isEquation: boolean) => {
+        if (isEquation) {
+            this.childDocs.forEach(doc => {
+                const eq = this.parseEquation(key);
+                doc[DocData][key] = this.parsedEquationResult(eq);
+                this.setupAutoUpdate(eq, doc);
+            });
+        } else {
+            this.childDocs.forEach(doc => {
+                doc[DocData][key] = defaultVal;
+            });
+        }
+    }
+
+    @action
+    setupAutoUpdate = (equation: string, doc: Doc) => {
+        return autorun(() => {
+            const result = this.parsedEquationResult(equation);
+            doc[DocData][equation] = result;
         });
+    }
+
+    parseEquation = (eq: string): string => {
+        const variablePattern = /[a-z]+/gi;
+        return eq.replace(variablePattern, (match) => `doc[DocData]['${match}']`);
+    }
+
+    parsedEquationResult = (eq: string): number => {
+        const result = new Function('return ' + eq).call(this);
+        return result;
+    }
 
     @undoBatch
     removeColumn = (index: number) => {
@@ -743,9 +771,15 @@ export class CollectionSchemaView extends CollectionSubView() {
         return true;
     };
 
-    activeMenuKeys = () => {
-        let activeKeys = this.documentKeys.filter(key => this.childDocsInclude(key));
-        return activeKeys
+    @action
+    toggleMenuKeyFilter = () => {
+        if (!this._colKeysFiltered){
+            this._colKeysFiltered = true;
+            this._menuKeys = this.documentKeys.filter(key => this.childDocsInclude(key));
+        } else {
+            this._colKeysFiltered = false;
+            this._menuKeys = this.documentKeys;
+        }
     }
     
     childDocsInclude = (key: string) => {
@@ -947,11 +981,12 @@ export class CollectionSchemaView extends CollectionSubView() {
             </div>
         );
     }
+
     get renderKeysMenu() {
         return (
             <div className="schema-column-menu" style={{ left: 0, minWidth: CollectionSchemaView._minColWidth }}>
                 <input className="schema-key-search-input" type="text" onKeyDown={this.onSearchKeyDown} onChange={this.updateKeySearch} onPointerDown={e => e.stopPropagation()} />
-                <button className="schema-column-menu-toggle" onClick={() => this._menuKeys = this.activeMenuKeys()}></button> 
+                <button className="schema-column-menu-button" onClick={() => this.toggleMenuKeyFilter()}>{this._colKeysFiltered ? "All keys" : "Active keys only"}</button> 
                 {this._makeNewField ? this.newFieldMenu : this.keysDropdown}
             </div>
         );