Feature: "Cancel" newly-created unsaved node/edge removes it

app/view/netcreate/components/NCEdge.jsx

@@ -76,6 +76,7 @@ class NCEdge extends UNISYS.Component {
     this.ReqLoadEdge = this.ReqLoadEdge.bind(this);
     // DATA LOADING
     this.LoadEdge = this.LoadEdge.bind(this);
+    this.DeleteEdge = this.DeleteEdge.bind(this);
     this.LoadAttributes = this.LoadAttributes.bind(this);
     this.LockEdge = this.LockEdge.bind(this);
     this.UnlockEdge = this.UnlockEdge.bind(this);
@@ -163,9 +164,9 @@ class NCEdge extends UNISYS.Component {
       targetId: null,
       attributes: [],
       provenance: [],
-      // created: undefined,
-      // updated: undefined,
-      // revision: 0
+      created: undefined,
+      updated: undefined,
+      revision: 0,
 
       // SYSTEM STATE
       // isLoggedIn: false, // don't clear session state!
@@ -317,11 +318,11 @@ class NCEdge extends UNISYS.Component {
         id: edge.id,
         sourceId: edge.source,
         targetId: edge.target,
-        attributes: attributes
-        // provenance: edge.provenance,
-        // created: edge.created,
-        // updated: edge.updated,
-        // revision: edge.revision
+        attributes: attributes,
+        provenance: edge.provenance,
+        created: edge.created,
+        updated: edge.updated,
+        revision: edge.revision
       },
       () => this.UpdateDerivedValues()
     );
@@ -595,12 +596,30 @@ class NCEdge extends UNISYS.Component {
   /// DATA SAVING
   ///
   SaveEdge() {
-    const { id, sourceId, targetId, attributes, provenance } = this.state;
+    const {
+      id,
+      sourceId,
+      targetId,
+      attributes,
+      provenance,
+      created,
+      updated,
+      revision
+    } = this.state;
+
+    // update revision number
+    const updatedRevision = revision + 1;
+    // update time stamp
+    const timestamp = new Date().toLocaleString('en-US');
+
     const edge = {
       id,
       source: sourceId,
       target: targetId,
-      provenance
+      provenance,
+      created,
+      updated: timestamp,
+      revision: updatedRevision
     };
     Object.keys(attributes).forEach(k => (edge[k] = attributes[k]));
     this.AppCall('DB_UPDATE', { edge }).then(() => {
@@ -612,11 +631,17 @@ class NCEdge extends UNISYS.Component {
         this.setState({
           uViewMode: NCUI.VIEWMODE.VIEW,
           uIsLockedByDB: false,
-          uSelectSourceTarget: undefined
+          uSelectSourceTarget: undefined,
+          updated: edge.updated,
+          revision: edge.revision
         });
       });
     });
   }
+  DeleteEdge() {
+    const { id } = this.state;
+    this.AppCall('DB_UPDATE', { edgeID: id }); // Calling DB_UPDATE with `edgeID` will remove the edge
+  }
 
   /// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   /// HELPER METHODS
@@ -710,7 +735,15 @@ class NCEdge extends UNISYS.Component {
   }
 
   UICancelEditMode() {
-    const { previousState } = this.state;
+    const { revision, previousState } = this.state;
+
+    // if user is cancelling a newly created unsaved edge, delete the edge instead
+    if (revision < 0) {
+      this.UIDisableEditMode();
+      this.DeleteEdge();
+      return;
+    }
+
     // restore previous state
     this.setState(
       {
@@ -742,9 +775,8 @@ class NCEdge extends UNISYS.Component {
   }
 
   UIDeleteEdge() {
-    const { id } = this.state;
     this.UIDisableEditMode();
-    this.AppCall('DB_UPDATE', { edgeID: id }); // Calling DB_UPDATE with `edgeID` will remove the edge
+    this.DeleteEdge();
   }
 
   UIInputUpdate(key, value) {
@@ -909,6 +941,7 @@ class NCEdge extends UNISYS.Component {
     const {
       sourceId,
       targetId,
+      revision,
       uSelectedTab,
       uSelectSourceTarget,
       uBackgroundColor,
@@ -979,9 +1012,11 @@ class NCEdge extends UNISYS.Component {
             </div>
             {/* CONTROL BAR - - - - - - - - - - - - - - - - */}
             <div className="controlbar" style={{ justifyContent: 'space-between' }}>
-              <button className="cancelbtn" onClick={this.UIDeleteEdge}>
-                Delete
-              </button>
+              {revision > -1 && (
+                <button className="cancelbtn" onClick={this.UIDeleteEdge}>
+                  Delete
+                </button>
+              )}
               <button className="cancelbtn" onClick={this.UICancelEditMode}>
                 Cancel
               </button>

app/view/netcreate/components/NCNode.jsx

@@ -110,7 +110,7 @@ class NCNode extends UNISYS.Component {
     this.UIRequestEditNode = this.UIRequestEditNode.bind(this);
     this.UIReplacementNodeIdUpdate = this.UIReplacementNodeIdUpdate.bind(this);
     this.UIAddEdge = this.UIAddEdge.bind(this);
-    this.EnableEditMode = this.EnableEditMode.bind(this);
+    this.UIEnableEditMode = this.UIEnableEditMode.bind(this);
     this.UICancelEditMode = this.UICancelEditMode.bind(this);
     this.UIDisableEditMode = this.UIDisableEditMode.bind(this);
     this.UIInputUpdate = this.UIInputUpdate.bind(this);
@@ -160,6 +160,17 @@ class NCNode extends UNISYS.Component {
   ResetState() {
     const TEMPLATE = this.AppState('TEMPLATE');
     this.setState({
+      // NODE DEFS
+      id: null,
+      label: '',
+      degrees: null,
+      attributes: [],
+      provenance: [],
+      created: undefined,
+      updated: undefined,
+      revision: 0,
+      // EDGES
+      edges: [], // selected nodes' edges not ALL edges
       // SYSTEM STATE
       // isLoggedIn: false, // don't clear session state!
       // isAdmin: false,
@@ -178,18 +189,7 @@ class NCNode extends UNISYS.Component {
       uHideDeleteNodeButton: TEMPLATE.hideDeleteNodeButton,
       uReplacementNodeId: '',
       uIsValidReplacementNodeID: true,
-      uShowCitationDialog: false,
-      // NODE DEFS
-      id: null,
-      label: '',
-      degrees: null,
-      attributes: [],
-      provenance: [],
-      created: undefined,
-      updated: undefined,
-      revision: 0,
-      // EDGES
-      edges: [] // selected nodes' edges not ALL edges
+      uShowCitationDialog: false
     });
   }
 
@@ -445,7 +445,19 @@ class NCNode extends UNISYS.Component {
     const { id, label, attributes, provenance, created, updated, revision } =
       this.state;
 
-    const node = { id, label, provenance, created, updated, revision };
+    // update revision number
+    const updatedRevision = revision + 1;
+    // update time stamp
+    const timestamp = new Date().toLocaleString('en-US');
+
+    const node = {
+      id,
+      label,
+      provenance,
+      created,
+      updated: timestamp,
+      revision: updatedRevision
+    };
     Object.keys(attributes).forEach(k => (node[k] = attributes[k]));
 
     // write data to database
@@ -455,7 +467,9 @@ class NCNode extends UNISYS.Component {
       this.UnlockNode(() => {
         this.setState({
           uViewMode: VIEWMODE.VIEW,
-          uIsLockedByDB: false
+          uIsLockedByDB: false,
+          updated: node.updated,
+          revision: node.revision
         });
       });
     });
@@ -508,7 +522,7 @@ class NCNode extends UNISYS.Component {
     if (!isLoggedIn) return;
     this.LockNode(lockSuccess => {
       this.setState({ uIsLockedByDB: !lockSuccess }, () => {
-        if (lockSuccess) this.EnableEditMode();
+        if (lockSuccess) this.UIEnableEditMode();
       });
     });
   }
@@ -539,7 +553,7 @@ class NCNode extends UNISYS.Component {
     });
   }
 
-  EnableEditMode() {
+  UIEnableEditMode() {
     const { uSelectedTab, label, attributes, provenance } = this.state;
     // If user was on Edges tab while requesting edit (e.g. from Node Table), then
     // switch to Attributes tab first.
@@ -557,7 +571,15 @@ class NCNode extends UNISYS.Component {
   }
 
   UICancelEditMode() {
-    const { previousState } = this.state;
+    const { revision, previousState } = this.state;
+
+    // if user is cancelling a newly created unsaved node, delete the node instead
+    if (revision < 0) {
+      this.UIDisableEditMode();
+      this.DeleteNode();
+      return;
+    }
+
     // restore previous state
     this.setState(
       {

app/view/netcreate/nc-logic.js

@@ -498,11 +498,15 @@ MOD.Hook('INITIALIZE', () => {
   UDATA.HandleMessage('NODE_CREATE', data => {
     // provenance
     const session = UDATA.AppState('SESSION');
-    const timestamp = new Date().toLocaleDateString('en-US');
-    const provenance_str = `Added by ${session.token} on ${timestamp}`;
+    const timestamp = new Date().toLocaleString('en-US');
+    const provenance = `Added by ${session.token} on ${timestamp}`;
 
     return DATASTORE.PromiseNewNodeID().then(newNodeID => {
-      const node = { id: newNodeID, label: data.label, provenance: provenance_str };
+      const node = {
+        id: newNodeID, label: data.label, provenance,
+        created: timestamp,
+        revision: -1
+      };
       return UDATA.LocalCall('DB_UPDATE', { node }).then(() => {
         NCDATA.nodes.push(node);
         UDATA.SetAppState('NCDATA', NCDATA);
@@ -613,14 +617,22 @@ MOD.Hook('INITIALIZE', () => {
    *  @param {string} data.nodeId
    */
   UDATA.HandleMessage('EDGE_CREATE', data => {
+    // provenance
+    const session = UDATA.AppState('SESSION');
+    const timestamp = new Date().toLocaleString('en-US');
+    const provenance = `Added by ${session.token} on ${timestamp}`;
+
     // call server to retrieve an unused edge ID
     return DATASTORE.PromiseNewEdgeID().then(newEdgeID => {
       // Add it to local state for now
       const edge = {
         id: newEdgeID,
         source: data.nodeId,
         target: undefined,
-        attributes: {}
+        attributes: {},
+        provenance,
+        created: timestamp,
+        revision: -1
       };
       return UDATA.LocalCall('DB_UPDATE', { edge }).then(() => {
         console.log('...DB_UPDATE node is now', edge);