[groups] Fix up various delete/undo actions with groups

packages/node_modules/@node-red/editor-client/src/js/history.js

@@ -203,12 +203,35 @@ RED.history = (function() {
                         n.dirty = true;
                     });
                 }
+                if (ev.groups) {
+                    inverseEv.groups = [];
+                    var groupsToAdd = new Set(ev.groups.map(function(g) { return g.id }));
+                    for (i=0;i<ev.groups.length;i++) {
+                        RED.nodes.addGroup(ev.groups[i])
+                        modifiedTabs[ev.groups[i].z] = true;
+                        inverseEv.groups.push(ev.groups[i].id);
+                        if (!groupsToAdd.has(ev.groups[i].g)) {
+                            group = RED.nodes.group(ev.groups[i].g);
+                            if (group.nodes.indexOf(ev.groups[i]) === -1) {
+                                group.nodes.push(ev.groups[i]);
+                            }
+                            RED.group.markDirty(ev.groups[i])
+                        }
+                    }
+                }
                 if (ev.nodes) {
                     inverseEv.nodes = [];
                     for (i=0;i<ev.nodes.length;i++) {
                         RED.nodes.add(ev.nodes[i]);
                         modifiedTabs[ev.nodes[i].z] = true;
                         inverseEv.nodes.push(ev.nodes[i].id);
+                        if (ev.nodes[i].g) {
+                            group = RED.nodes.group(ev.nodes[i].g);
+                            if (group.nodes.indexOf(ev.nodes[i]) === -1) {
+                                group.nodes.push(ev.nodes[i]);
+                            }
+                            RED.group.markDirty(group)
+                        }
                     }
                 }
                 if (ev.links) {
@@ -218,14 +241,6 @@ RED.history = (function() {
                         inverseEv.links.push(ev.links[i]);
                     }
                 }
-                if (ev.groups) {
-                    inverseEv.groups = [];
-                    for (i=0;i<ev.groups.length;i++) {
-                        RED.nodes.addGroup(ev.groups[i])
-                        modifiedTabs[ev.groups[i].z] = true;
-                        inverseEv.groups.push(ev.groups[i].id);
-                    }
-                }
                 if (ev.createdLinks) {
                     inverseEv.removedLinks = [];
                     for (i=0;i<ev.createdLinks.length;i++) {
@@ -542,8 +557,8 @@ RED.history = (function() {
             });
 
             RED.nodes.dirty(ev.dirty);
+            RED.view.updateActive();
             RED.view.select(null);
-            RED.view.redraw(true);
             RED.palette.refresh();
             RED.workspaces.refresh();
             RED.sidebar.config.refresh();

packages/node_modules/@node-red/editor-client/src/js/nodes.js

@@ -1528,9 +1528,9 @@ RED.nodes = (function() {
             if (groups[group.g]) {
                 var index = groups[group.g].nodes.indexOf(group);
                 groups[group.g].nodes.splice(index,1);
-                groups[group.g].dirty = true;
             }
         }
+        RED.group.markDirty(group);
 
         delete groups[group.id];
     }

packages/node_modules/@node-red/editor-client/src/js/ui/group.js

@@ -404,6 +404,9 @@ RED.group = (function() {
                 throw new Error("Cannot create group using nodes from different groups")
             }
         }
+        // The nodes are already in a group. The assumption is they should be
+        // wrapped in the newly provided group, and that group added to in their
+        // place to the existing containing group.
         if (g) {
             g = RED.nodes.group(g);
             g.nodes.push(group);
@@ -447,17 +450,14 @@ RED.group = (function() {
             n.dirty = true;
             var index = group.nodes.indexOf(n);
             group.nodes.splice(index,1);
-            group.dirty = true;
             if (reparent && group.g) {
                 n.g = group.g
                 parentGroup.nodes.push(n);
-                parentGroup.dirty = true;
             } else {
                 delete n.g;
             }
-
         }
-
+        markDirty(group);
     }
 
     function getNodes(group,recursive) {
@@ -549,6 +549,14 @@ RED.group = (function() {
 
     }
 
+    function markDirty(group) {
+        group.dirty = true;
+        while(group) {
+            console.log("dirty",group.id)
+            group.dirty = true;
+            group = RED.nodes.group(group.g);
+        }
+    }
 
 
     return {
@@ -559,6 +567,7 @@ RED.group = (function() {
         addToGroup: addToGroup,
         removeFromGroup: removeFromGroup,
         getNodes: getNodes,
-        contains: groupContains
+        contains: groupContains,
+        markDirty: markDirty
     }
 })();

packages/node_modules/@node-red/editor-client/src/js/ui/view.js

@@ -580,9 +580,6 @@ RED.view = (function() {
         activeGroups.sort(function(a,b) {
             return a._depth - b._depth;
         });
-        groupLayer.selectAll(".red-ui-flow-group").sort(function(a,b) {
-            return a._depth - b._depth;
-        })
     }
 
     function generateLinkPath(origX,origY, destX, destY, sc) {
@@ -1897,6 +1894,13 @@ if (DEBUG_EVENTS) { console.warn("clearSelection", mouse_mode); }
                         removedNodes.push(node);
                         removedNodes = removedNodes.concat(removedEntities.nodes);
                         removedLinks = removedLinks.concat(removedEntities.links);
+                        if (node.g) {
+                            var group = RED.nodes.group(node.g);
+                            if (!group.selected || group.active) {
+                                RED.group.removeFromGroup(group,node);
+                                node.g = group.id;
+                            }
+                        }
                     } else {
                         if (node.direction === "out") {
                             removedSubflowOutputs.push(node);
@@ -2861,6 +2865,13 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
                 if (!d3.event.ctrlKey && !d3.event.metaKey) {
                     clearSelection();
                 }
+                if (activeGroup) {
+                    if (!RED.group.contains(activeGroup,g)) {
+                        // Clicked on a group that is outside the activeGroup
+                        exitActiveGroup();
+                    } else {
+                    }
+                }
                 selectGroup(g,true);//!wasSelected);
             } else {
                 exitActiveGroup();
@@ -4027,7 +4038,9 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
             group.exit().remove();
             var groupEnter = group.enter().insert("svg:g")
                 .attr("class", "red-ui-flow-group")
+            var addedGroups = false;
             groupEnter.each(function(d,i) {
+                addedGroups = true;
                 var g = d3.select(this);
                 g.attr("id",d.id);
 
@@ -4047,7 +4060,11 @@ if (DEBUG_EVENTS) { console.warn("nodeMouseDown", mouse_mode,d); }
                 g.append('svg:text').attr("class","red-ui-flow-group-label").text(d.name);
                 d.dirty = true;
             });
-
+            if (addedGroups) {
+                group.sort(function(a,b) {
+                    return a._depth - b._depth;
+                })
+            }
             group[0].reverse();
 
             group.each(function(d,i) {