fix(network): context menu on groups + group/ungroup in properties panel

Context menu fix:
- Group nodes pass pointer events through to children in React Flow, so
  right-clicking a group fires onPaneContextMenu instead of onNodeContextMenu
- handlePaneContextMenu now checks for selected nodes and shows the node
  context menu (with align/group options) when any nodes are selected

Properties panel multi-select:
- Add Group section with type dropdown (Subnet, VLAN, Site, DMZ, Custom)
- "Group into [Type]" button creates a group of the chosen type
- Ungroup button appears when a group node is in the selection
- useDiagramCommands.groupSelection now accepts a groupType param and
  uses it as the label and color key for the new group node

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/pages/NetworkDiagrams/DiagramEditor.tsx

@@ -399,11 +399,22 @@ function DiagramEditorInner() {
 
   const handlePaneContextMenu = useCallback((event: MouseEvent | React.MouseEvent) => {
     event.preventDefault()
-    setContextMenu({
-      type: 'canvas',
-      position: { x: event.clientX, y: event.clientY },
-    })
-  }, [])
+    // Group nodes pass pointer events through to children, so right-clicking a group
+    // may fire onPaneContextMenu instead of onNodeContextMenu. If nodes are selected,
+    // show the node context menu so group/align/ungroup options are accessible.
+    const selected = getNodes().filter(n => n.selected)
+    if (selected.length > 0) {
+      setContextMenu({
+        type: 'node',
+        position: { x: event.clientX, y: event.clientY },
+      })
+    } else {
+      setContextMenu({
+        type: 'canvas',
+        position: { x: event.clientX, y: event.clientY },
+      })
+    }
+  }, [getNodes])
 
   const closeContextMenu = useCallback(() => {
     setContextMenu(null)
@@ -735,6 +746,10 @@ function DiagramEditorInner() {
           onDistributeV={diagramCommands.distributeVertically}
           canAlign={diagramCommands.canAlign}
           canDistribute={diagramCommands.canDistribute}
+          canGroup={diagramCommands.canGroup}
+          canUngroup={diagramCommands.canUngroup}
+          onGroupSelection={diagramCommands.groupSelection}
+          onUngroupSelection={diagramCommands.ungroupSelection}
         />
       </div>
       {contextMenu && (