refactor: lazily initialize context menu model singleton

Co-authored-by: sawka <2722291+sawka@users.noreply.github.com>

Author: Copilot

frontend/app/aipanel/aipanel-contextmenu.ts

@@ -155,5 +155,5 @@ export async function handleWaveAIContextMenu(e: React.MouseEvent, showCopy: boo
         });
     }
 
-    ContextMenuModel.showContextMenu(menu, e);
+    ContextMenuModel.getInstance().showContextMenu(menu, e);
 }

frontend/app/app.tsx

@@ -130,7 +130,7 @@ async function handleContextMenu(e: React.MouseEvent<HTMLDivElement>) {
             },
         });
     }
-    ContextMenuModel.showContextMenu(menu, e);
+    ContextMenuModel.getInstance().showContextMenu(menu, e);
 }
 
 function AppSettingsUpdater() {

frontend/app/block/blockframe-header.tsx

@@ -57,7 +57,7 @@ function handleHeaderContextMenu(
             click: () => uxCloseBlock(blockId),
         }
     );
-    ContextMenuModel.showContextMenu(menu, e);
+    ContextMenuModel.getInstance().showContextMenu(menu, e);
 }
 
 type HeaderTextElemsProps = {

frontend/app/store/contextmenu.test.ts

@@ -0,0 +1,28 @@
+import { describe, expect, it, vi } from "vitest";
+
+describe("ContextMenuModel", () => {
+    it("initializes only when getInstance is called", async () => {
+        const onContextMenuClick = vi.fn();
+        const getApi = vi.fn(() => ({
+            onContextMenuClick,
+            showContextMenu: vi.fn(),
+        }));
+
+        vi.resetModules();
+        vi.doMock("./global", () => ({
+            atoms: {},
+            getApi,
+            globalStore: { get: vi.fn() },
+        }));
+
+        const { ContextMenuModel } = await import("./contextmenu");
+        expect(getApi).not.toHaveBeenCalled();
+
+        const firstInstance = ContextMenuModel.getInstance();
+        const secondInstance = ContextMenuModel.getInstance();
+
+        expect(firstInstance).toBe(secondInstance);
+        expect(getApi).toHaveBeenCalledTimes(1);
+        expect(onContextMenuClick).toHaveBeenCalledTimes(1);
+    });
+});

frontend/app/store/contextmenu.ts

@@ -3,13 +3,21 @@
 
 import { atoms, getApi, globalStore } from "./global";
 
-class ContextMenuModelType {
+class ContextMenuModel {
+    private static instance: ContextMenuModel;
     handlers: Map<string, () => void> = new Map(); // id -> handler
 
-    constructor() {
+    private constructor() {
         getApi().onContextMenuClick(this.handleContextMenuClick.bind(this));
     }
 
+    static getInstance(): ContextMenuModel {
+        if (ContextMenuModel.instance == null) {
+            ContextMenuModel.instance = new ContextMenuModel();
+        }
+        return ContextMenuModel.instance;
+    }
+
     handleContextMenuClick(id: string): void {
         const handler = this.handlers.get(id);
         if (handler) {
@@ -63,6 +71,4 @@ class ContextMenuModelType {
     }
 }
 
-const ContextMenuModel = new ContextMenuModelType();
-
-export { ContextMenuModel, ContextMenuModelType };
+export { ContextMenuModel };

frontend/app/tab/tab.tsx

@@ -207,7 +207,7 @@ const TabInner = forwardRef<HTMLDivElement, TabProps>((props, ref) => {
                 menu.push({ label: "Backgrounds", type: "submenu", submenu }, { type: "separator" });
             }
             menu.push({ label: "Close Tab", click: () => onClose(null) });
-            ContextMenuModel.showContextMenu(menu, e);
+            ContextMenuModel.getInstance().showContextMenu(menu, e);
         },
         [handleRenameTab, id, onClose]
     );

frontend/app/view/preview/preview-directory.tsx

@@ -419,7 +419,7 @@ function TableBody({
                     click: () => handleFileDelete(model, finfo.path, false, setErrorMsg),
                 }
             );
-            ContextMenuModel.showContextMenu(menu, e);
+            ContextMenuModel.getInstance().showContextMenu(menu, e);
         },
         [setRefreshVersion, conn]
     );
@@ -861,7 +861,7 @@ function DirectoryPreview({ model }: DirectoryPreviewProps) {
             ];
             addOpenMenuItems(menu, conn, finfo);
 
-            ContextMenuModel.showContextMenu(menu, e);
+            ContextMenuModel.getInstance().showContextMenu(menu, e);
         },
         [setRefreshVersion, conn, newFile, newDirectory, dirPath]
     );

frontend/app/view/preview/preview-model.tsx

@@ -209,7 +209,7 @@ export class PreviewModel implements ViewModel {
                             label: `Go to ${bookmark.label} (${bookmark.path})`,
                             click: () => this.goHistory(bookmark.path),
                         }));
-                        ContextMenuModel.showContextMenu(menuItems, e);
+                        ContextMenuModel.getInstance().showContextMenu(menuItems, e);
                     },
                 };
             }

frontend/app/view/term/term.tsx

@@ -369,7 +369,7 @@ const TerminalView = ({ blockId, model }: ViewComponentProps<TermViewModel>) =>
             e.preventDefault();
             e.stopPropagation();
             const menuItems = model.getContextMenuItems();
-            ContextMenuModel.showContextMenu(menuItems, e);
+            ContextMenuModel.getInstance().showContextMenu(menuItems, e);
         },
         [model]
     );

frontend/app/workspace/widgets.tsx

@@ -401,7 +401,7 @@ const Widgets = memo(() => {
                 },
             },
         ];
-        ContextMenuModel.showContextMenu(menu, e);
+        ContextMenuModel.getInstance().showContextMenu(menu, e);
     };
 
     return (