polylines tooltip content

utils/handlePoiSelect.js

@@ -0,0 +1,39 @@
+// utils/handlePoiSelect.js
+const handlePoiSelect = async (poiData, setSelectedPoi, setLocationDeviceData, setDeviceName, poiLayerRef, poiTypMap) => {
+  setSelectedPoi(poiData); // poiData should be the data of the selected POI
+  //console.log("Selected POI:", poiData);
+  //console.log("Selected POI idLD:", poiData.deviceId);
+
+  try {
+    const response = await fetch("/api/talas_v5_DB/locationDevice/locationDevices");
+    const data = await response.json();
+    setLocationDeviceData(data);
+    //console.log("Standort- und Gerätedaten:", data);
+
+    const currentDevice = data.find((device) => device.idLD === poiData.deviceId);
+    if (currentDevice) {
+      setDeviceName(currentDevice.name);
+      //console.log("Current Device name in poiUpdate2:", currentDevice.name);
+
+      // Update the marker popup with the device name and type
+      const marker = poiLayerRef.current.getLayers().find((m) => m.options.id === poiData.id);
+      if (marker) {
+        marker.setPopupContent(
+          `
+            <div>
+              <b class="text-xl text-black-700">${poiData.description || "Unbekannt"}</b><br>
+              ${currentDevice.name}<br>
+              ${poiTypMap.get(poiData.idPoiTyp) || "Unbekannt"}<br>
+            </div>
+            `,
+        );
+        marker.openPopup();
+      }
+    }
+  } catch (error) {
+    console.error("Fehler beim Abrufen der Gerätedaten2:", error);
+    setLocationDeviceData([]);
+  }
+};
+
+export default handlePoiSelect;