chore(react/collections/geomap): bring back open on click

apps/client/src/widgets/collections/geomap/index.tsx

@@ -67,6 +67,10 @@ function NoteMarker({ note, editable }: { note: FNote, editable: boolean }) {
     const latLng = location?.split(",", 2).map((el) => parseFloat(el)) as [ number, number ] | undefined;
     const icon = useMemo(() => buildIcon(iconClass, colorClass ?? undefined, title, note.noteId), [ iconClass, colorClass, title, note.noteId]);
 
+    const onClick = useCallback(() => {
+        appContext.triggerCommand("openInPopup", { noteIdOrPath: note.noteId });
+    }, [ note.noteId ]);
+
     // Middle click to open in new tab
     const onMouseDown = useCallback((e: MouseEvent) => {
         if (e.button === 1) {
@@ -83,9 +87,10 @@ function NoteMarker({ note, editable }: { note: FNote, editable: boolean }) {
     return latLng && <Marker
         coordinates={latLng}
         icon={icon}
-        mouseDown={onMouseDown}
         draggable={editable}
-        dragged={editable ? onDragged : undefined}
+        onMouseDown={onMouseDown}
+        onDragged={editable ? onDragged : undefined}
+        onClick={!editable ? onClick : undefined}
     />
 }
 

apps/client/src/widgets/collections/geomap/marker.tsx

@@ -5,12 +5,13 @@ import { DivIcon, Icon, LatLng, Marker as LeafletMarker, marker, MarkerOptions }
 export interface MarkerProps {
     coordinates: [ number, number ];
     icon?: Icon | DivIcon;
-    mouseDown?: (e: MouseEvent) => void;
-    dragged?: ((newCoordinates: LatLng) => void);
+    onClick?: () => void;
+    onMouseDown?: (e: MouseEvent) => void;
+    onDragged?: ((newCoordinates: LatLng) => void);
     draggable?: boolean;
 }
 
-export default function Marker({ coordinates, icon, draggable, dragged, mouseDown }: MarkerProps) {
+export default function Marker({ coordinates, icon, draggable, onClick, onDragged, onMouseDown }: MarkerProps) {
     const parentMap = useContext(ParentMap);
 
     useEffect(() => {
@@ -25,21 +26,25 @@ export default function Marker({ coordinates, icon, draggable, dragged, mouseDow
 
         const newMarker = marker(coordinates, options);
 
-        if (mouseDown) {
-            newMarker.on("mousedown", e => mouseDown(e.originalEvent));
+        if (onClick) {
+            newMarker.on("click", () => onClick());
         }
 
-        if (dragged) {
+        if (onMouseDown) {
+            newMarker.on("mousedown", e => onMouseDown(e.originalEvent));
+        }
+
+        if (onDragged) {
             newMarker.on("moveend", e => {
                 const coordinates = (e.target as LeafletMarker).getLatLng();
-                dragged(coordinates);
+                onDragged(coordinates);
             });
         }
 
         newMarker.addTo(parentMap);
 
         return () => newMarker.removeFrom(parentMap);
-    }, [ parentMap, coordinates, mouseDown ]);
+    }, [ parentMap, coordinates, onMouseDown, onDragged ]);
 
     return (<div />)
 }

apps/client/src/widgets/view_widgets/geo_view/markers.ts

@@ -3,7 +3,6 @@ import type FNote from "../../../entities/fnote.js";
 import openContextMenu from "./context_menu.js";
 import server from "../../../services/server.js";
 import { moveMarker } from "./editing.js";
-import appContext from "../../../components/app_context.js";
 import L from "leaflet";
 
 let gpxLoaded = false;
@@ -13,12 +12,6 @@ export default function processNoteWithMarker(map: Map, note: FNote, location: s
         openContextMenu(note.noteId, e, isEditable);
     });
 
-    if (!isEditable) {
-        newMarker.on("click", (e) => {
-            appContext.triggerCommand("openInPopup", { noteIdOrPath: note.noteId });
-        });
-    }
-
     return newMarker;
 }