Convert to subgraph command

src/lib/ComfyGraphCanvas.ts

@@ -1,4 +1,4 @@
-import { BuiltInSlotShape, LGraph, LGraphCanvas, LGraphNode, LiteGraph, NodeMode, type MouseEventExt, type Vector2, type Vector4, TitleMode, type ContextMenuItem, type IContextMenuItem } from "@litegraph-ts/core";
+import { BuiltInSlotShape, LGraph, LGraphCanvas, LGraphNode, LiteGraph, NodeMode, type MouseEventExt, type Vector2, type Vector4, TitleMode, type ContextMenuItem, type IContextMenuItem, Subgraph } from "@litegraph-ts/core";
 import type ComfyApp from "./components/ComfyApp";
 import queueState from "./stores/queueState";
 import { get } from "svelte/store";
@@ -322,6 +322,34 @@ export default class ComfyGraphCanvas extends LGraphCanvas {
         }
     }
 
+    private convertToSubgraph(_value: IContextMenuItem, _options, mouseEvent, prevMenu, callback?: (node: LGraphNode) => void) {
+        if (Object.keys(this.selected_nodes).length === 0)
+            return
+
+        const selected = Object.values(this.selected_nodes).filter(n => n != null);
+        this.selected_nodes = {}
+
+        const subgraph = LiteGraph.createNode(Subgraph);
+        subgraph.buildFromNodes(selected)
+
+        this.graph.add(subgraph)
+    }
+
+    override getCanvasMenuOptions(): ContextMenuItem[] {
+        const options = super.getCanvasMenuOptions();
+
+        options.push(
+            {
+                content: "Convert to Subgraph",
+                has_submenu: false,
+                disabled: Object.keys(this.selected_nodes).length === 0,
+                callback: this.convertToSubgraph.bind(this)
+            },
+        )
+
+        return options
+    }
+
     override getNodeMenuOptions(node: LGraphNode): ContextMenuItem[] {
         const options = super.getNodeMenuOptions(node);