react/maps: fix GeoJsonMarker not updating on prop change for Icon

liqd · Nov 27, 2024 · 3b030b0 · 3b030b0
1 parent c448694
commit 3b030b0
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 0 deletions.
diff --git a/adhocracy4/maps_react/static/a4maps_react/GeoJsonMarker.js b/adhocracy4/maps_react/static/a4maps_react/GeoJsonMarker.js
@@ -29,6 +29,9 @@ const createGeoJsonMarker = ({ feature, ...props }, context) => {
 
 const updateGeoJsonMarker = (instance, { feature, ...props }, prevProps) => {
   const coords = [...feature.geometry.coordinates].reverse()
+  if (props.icon !== prevProps.icon) {
+    instance.setIcon(props.icon)
+  }
   instance.setLatLng(coords)
 }
 

diff --git a/changelog/8447.md b/changelog/8447.md
@@ -0,0 +1,2 @@
+### Changes
+- fixed a bug where the GeoJsonMarker would not update if passing new props for `icon`
diff --git a/docs/react_maps.md b/docs/react_maps.md
@@ -162,6 +162,13 @@ marker with a custom icon on the map.
 * **...rest**: [Any other option](https://leafletjs.com/reference.html#marker)
   that you could pass to L.marker
 
+### Change the icon
+
+If you find yourself in a situation where you want to change the icon, for example
+when you want to highlight a marker that's currently active, you can pass `GeoJsonMarker`
+a `icon` prop. You can generate that by using the helper function mentioned below
+or call `L.icon` yourself to create an icon instance.
+
 ### makeIcon
 
 You can find this utility function in `GeoJsonMarker.js`. It creates and returns
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		### Changes
		- fixed a bug where the GeoJsonMarker would not update if passing new props for `icon`