From b917ca72c97a46699c639f607c9e71baee92e3c6 Mon Sep 17 00:00:00 2001
From: Ross <xkjq@ymail.com>
Date: Mon, 30 Jun 2025 10:05:05 +0100
Subject: [PATCH] scope oncontextmenu correctly

---
 dicom-viewer/src/App.tsx | 25 +++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/dicom-viewer/src/App.tsx b/dicom-viewer/src/App.tsx
index 6e34425..deb11c8 100644
--- a/dicom-viewer/src/App.tsx
+++ b/dicom-viewer/src/App.tsx
@@ -148,6 +148,7 @@ type AppProps = {
 
 // App definintion
 function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewerState, ...props }: AppProps) {
+  const appRootRef = useRef<HTMLDivElement>(null);
   const elementRef = useRef<HTMLDivElement>(null)
   const running = useRef(false)
 
@@ -1173,15 +1174,17 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer
     };
   }, []);
 
-  useEffect(() => {
-    const handleContextMenu = (e: MouseEvent) => {
-      e.preventDefault();
-    };
-    document.addEventListener("contextmenu", handleContextMenu);
-    return () => {
-      document.removeEventListener("contextmenu", handleContextMenu);
-    };
-  }, []);
+useEffect(() => {
+  const el = appRootRef.current;
+  if (!el) return;
+  const handleContextMenu = (e: MouseEvent) => {
+    e.preventDefault();
+  };
+  el.addEventListener("contextmenu", handleContextMenu);
+  return () => {
+    el.removeEventListener("contextmenu", handleContextMenu);
+  };
+}, []);
 
   useEffect(() => {
     if (!referenceLinesEnabled) return;
@@ -2852,7 +2855,9 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer
 
   return (
     // App root
-    <div style={{
+    <div 
+    ref={appRootRef}
+    style={{
       position: "relative",
       inset: 0,
       width: "100%",