scope oncontextmenu correctly

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(() => {
+useEffect(() => {
+  const el = appRootRef.current;
+  if (!el) return;
   const handleContextMenu = (e: MouseEvent) => {
     e.preventDefault();
   };
-    document.addEventListener("contextmenu", handleContextMenu);
+  el.addEventListener("contextmenu", handleContextMenu);
   return () => {
-      document.removeEventListener("contextmenu", handleContextMenu);
+    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%",