diff --git a/apps/client/src/widgets/collections/geomap/index.tsx b/apps/client/src/widgets/collections/geomap/index.tsx
index fee1a36bf..430f56694 100644
--- a/apps/client/src/widgets/collections/geomap/index.tsx
+++ b/apps/client/src/widgets/collections/geomap/index.tsx
@@ -12,7 +12,7 @@ import markerIcon from "leaflet/dist/images/marker-icon.png";
import markerIconShadow from "leaflet/dist/images/marker-shadow.png";
import appContext from "../../../components/app_context";
import { createNewNote, moveMarker } from "./api";
-import openContextMenu from "./context_menu";
+import openContextMenu, { openMapContextMenu } from "./context_menu";
import toast from "../../../services/toast";
import { t } from "../../../services/i18n";
@@ -66,6 +66,7 @@ export default function GeoView({ note, noteIds, viewConfig, saveConfig }: ViewM
};
window.addEventListener("keydown", globalKeyListener);
});
+
const onClick = useCallback(async (e: LeafletMouseEvent) => {
if (state === State.NewNote) {
toast.closePersistent("geo-new-note");
@@ -74,6 +75,10 @@ export default function GeoView({ note, noteIds, viewConfig, saveConfig }: ViewM
}
}, [ state ]);
+ const onContextMenu = useCallback((e: LeafletMouseEvent) => {
+ openMapContextMenu(note.noteId, e, !isReadOnly);
+ }, [ note.noteId, isReadOnly ]);
+
return (
diff --git a/apps/client/src/widgets/collections/geomap/map.tsx b/apps/client/src/widgets/collections/geomap/map.tsx
index 8fe102210..bb4f22c03 100644
--- a/apps/client/src/widgets/collections/geomap/map.tsx
+++ b/apps/client/src/widgets/collections/geomap/map.tsx
@@ -13,10 +13,11 @@ interface MapProps {
layerName: string;
viewportChanged: (coordinates: LatLng, zoom: number) => void;
children: ComponentChildren;
- onClick: (e: LeafletMouseEvent) => void;
+ onClick?: (e: LeafletMouseEvent) => void;
+ onContextMenu?: (e: LeafletMouseEvent) => void;
}
-export default function Map({ coordinates, zoom, layerName, viewportChanged, children, onClick }: MapProps) {
+export default function Map({ coordinates, zoom, layerName, viewportChanged, children, onClick, onContextMenu }: MapProps) {
const mapRef = useRef
(null);
const containerRef = useRef(null);
@@ -82,7 +83,19 @@ export default function Map({ coordinates, zoom, layerName, viewportChanged, chi
};
}, [ mapRef, viewportChanged ]);
- useEffect(() => { mapRef.current && mapRef.current.on("click", onClick) }, [ mapRef, onClick ]);
+ useEffect(() => {
+ if (onClick && mapRef.current) {
+ mapRef.current.on("click", onClick);
+ return () => mapRef.current?.off("click", onClick);
+ }
+ }, [ mapRef, onClick ]);
+
+ useEffect(() => {
+ if (onContextMenu && mapRef.current) {
+ mapRef.current.on("contextmenu", onContextMenu);
+ return () => mapRef.current?.off("contextmenu", onContextMenu);
+ }
+ }, [ mapRef, onContextMenu ]);
return (
{
}
const isEditable = !this.isReadOnly;
- map.on("contextmenu", (e) => openMapContextMenu(this.parentNote.noteId, e, isEditable));
if (isEditable) {
setupDragging(this.$container, map, this.parentNote.noteId);