fix: Beschreibung in Popup bei POI bearbeiten war nicht sichtbar, nur Platzhalter

components/MapComponent.js

@@ -40,16 +40,15 @@ import { set } from "lodash";
 import { poiLayerVisibleState } from "../store/atoms/poiLayerVisible.js";
 import { data } from "autoprefixer";
 import plusRoundIcon from "./PlusRoundIcon.js";
-/* import {
-  parsePoint,
-  handleEditPoi,
-  insertNewMarker,
-  redrawPolyline,
-  saveLineData,
-} from "../utils/utils.js"; */
+import {} from //parsePoint,
+//handleEditPoi,
+//insertNewMarker,
+//redrawPolyline,
+//saveLineData,
+"../utils/utils.js";
 import { parsePoint, findClosestPoints } from "../utils/geometryUtils.js";
 import {
-  handleEditPoi,
+  //handleEditPoi,
   insertNewMarker,
   removeMarker,
 } from "../utils/markerUtils.js";
@@ -487,6 +486,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
                 <div class="mt-2">${statusInfo}</div>
               </div>
             `);
+
           return marker;
         });
 
@@ -499,6 +499,44 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   //--------------------------------------------------------------------------------
 
   const mapLayersVisibility = useRecoilValue(mapLayersState);
+  //----------------------------------------------
+  const handleEditPoi = (selectedPoi) => {
+    // Prüfung, ob der Benutzer die notwendigen Rechte hat
+    if (!userRights || !userRights.includes(56)) {
+      toast.error("Benutzer hat keine Berechtigung zum Bearbeiten.", {
+        position: "top-center",
+        autoClose: 5000,
+        hideProgressBar: false,
+        closeOnClick: true,
+        pauseOnHover: true,
+        draggable: true,
+        progress: undefined,
+      });
+      console.log("Benutzer hat keine Berechtigung zum Bearbeiten.");
+      return; // Beendet die Funktion frühzeitig, wenn keine Berechtigung vorliegt
+    }
+
+    //console.log("Selected Marker ID (idPoi):", marker.options.idPoi);
+    console.log(
+      "Selected Marker Description:",
+      selectedPoi.options.description
+    );
+    console.log("Selected Marker :", selectedPoi.options);
+
+    setCurrentPoiData({
+      idPoi: selectedPoi.options.id,
+      name: selectedPoi.options.name,
+      description: selectedPoi.options.description,
+    });
+    //console.log("POI-Daten1:", currentPoiData);
+
+    fetchPoiData(selectedPoi.options.id);
+    fetchPoiData(selectedPoi.options.name);
+    //fetchPoiData(selectedPoi.options);
+
+    setShowPoiUpdateModal(true);
+  };
+  //----------------------------------------------
 
   //------------------------------------------
   //------------------------------------------ */
@@ -1051,6 +1089,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
               }),
               draggable: canDrag,
               id: location.idPoi,
+              name: location.name,
+              description: location.description,
             }).bindContextMenu({
               contextmenu: true,
               contextmenuWidth: 140,
@@ -2280,7 +2320,18 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, [zoomTrigger, map]);
   //---------------------------------------------------------
   //---------------------------------------------------------zoomen in kontextmenü
-
+  // Beispiel für die Verwendung von fetchPoiData mit Recoil Zustand
+  /*   useEffect(() => {
+    if (selectedPoi) {
+      fetchPoiData(selectedPoi.idPoi)
+        .then((data) => {
+          console.log("Fetched POI data:", data);
+        })
+        .catch((error) => {
+          console.error("Fehler beim Abrufen der POI-Daten:", error);
+        });
+    }
+  }, [selectedPoi]); */
   //---------------------------------------------------------
   //---------------------------------------------------------