refactor context menu to separate component

src/components/Graph.tsx

@@ -8,6 +8,7 @@ import { Modal } from "antd";
 import { Input } from "antd";
 import type { BreadcrumbItemType } from "antd/es/breadcrumb/Breadcrumb";
 import { cloneDeep } from "lodash";
+import NodeContextMenu from "./NodeContextMenu";
 
 export class GraphModel {
   nodes: NodeModel[] = [];
@@ -224,7 +225,10 @@ export default function Graph({ setGraphPath }) {
       <div ref={containerRef} className="w-full h-full bg-white rounded shadow" style={{ minHeight: '600px', overflow: 'auto' }}>
 
       </div>
-      <Dropdown menu={{ items, onClick: onMenuClick }} trigger={['contextMenu']} open={contextMenuOpened} onOpenChange={contextMenuOpenChange} getPopupContainer={() => document.body}
+      <NodeContextMenu coords={coords} openContextMenu={openContextMenu} contextMenuOpened={contextMenuOpened}>
+
+      </NodeContextMenu>
+      {/* <Dropdown menu={{ items, onClick: onMenuClick }} trigger={['contextMenu']} open={contextMenuOpened} onOpenChange={contextMenuOpenChange} getPopupContainer={() => document.body}
         // 👇 Key part: manually position the dropdown
         overlayStyle={{
           position: "absolute",
@@ -232,7 +236,7 @@ export default function Graph({ setGraphPath }) {
           top: coords.y,
         }}>
 
-      </Dropdown>
+      </Dropdown> */}
       <Modal
         title="Rename"
         open={renameModalOpened}