Revize de12c6be

draggable

re #9741

frontend/src/features/TrackingTool/MapMarker.tsx

@@ -1 @@
-import { LatLngTuple, Marker as MarkerPOJO } from 'leaflet'
-import { FunctionComponent, ReactNode, useMemo, useRef, useState } from 'react'
-import { Marker } from 'react-leaflet'
+import { LatLngTuple, Marker as MarkerPOJO } from "leaflet"
+import { FunctionComponent, ReactNode, useMemo, useRef, useState } from "react"
+import { Marker } from "react-leaflet"
 
 export interface MapMarkerProps {
     position: LatLngTuple
     children?: ReactNode
+    color?: "external" | "disabled" | "localCatalog"
+    updatePositionCallbackFn: (position: LatLngTuple) => void // Callback function to notify MapPath to rerender the path
 }
 
 // Custom Map Marker component
-const MapMarker: FunctionComponent<MapMarkerProps> = ({ position, children }) => {
+const MapMarker: FunctionComponent<MapMarkerProps> = ({
+    position,
+    children,
+    updatePositionCallbackFn,
+}) => {
     const [currentPosition, setCurrentPosition] = useState(position)
     const markerRef = useRef<MarkerPOJO | null>(null)
     const eventHandlers = useMemo(
@@ -21 +27 @@
                 }
                 const latlng = marker.getLatLng()
                 setCurrentPosition([latlng.lat, latlng.lng])
+                updatePositionCallbackFn([latlng.lat, latlng.lng])
             },
         }),
-        []
+        [updatePositionCallbackFn]
     )
 
     return (