fix(poi): Fehler beim Hinzufügen von POIs behoben (Modal blieb offen)

- Falsche URL im addPoiService korrigiert (/addLocation → /addPoi)
- Redux-Status wird nach erfolgreichem Hinzufügen zurückgesetzt (resetAddPoiStatus)
- Modal schließt jetzt zuverlässig nach dem Dispatch
- Ladeanzeige "Wird hinzugefügt..." verschwindet korrekt
- Version auf 1.1.176 erhöht

pages/api/talas_v5_DB/pois/addPoi.js

@@ -1,4 +1,4 @@
-// pages/api/talas_v5_DB/pois/addLocation.js
+// pages/api/talas_v5_DB/pois/addPoi.js
 import getPool from "../../../../utils/mysqlPool"; // Singleton-Pool importieren
 
 export default async function handler(req, res) {

pages/api/talas_v5_DB/pois/readAllPOIs.js

@@ -1,4 +1,4 @@
-// pages/api/talas_v5_DB/pois/readLocations.js
+// pages/api/talas_v5_DB/pois/readAllPOIs.js
 import getPool from "../../../../utils/mysqlPool"; // Singleton-Pool importieren
 
 export default async function handler(req, res) {

pages/index.js

@@ -1,84 +1,66 @@
 "use client";
 import React, { useEffect, useState } from "react";
 import dynamic from "next/dynamic";
-import { setPoiMarkers } from "../redux/slices/database/pois/readPoiMarkersStoreSlice.js";
 import { useSelector, useDispatch } from "react-redux";
 
+import { fetchPoiMarkersThunk } from "../redux/thunks/database/pois/fetchPoiMarkersThunk";
+import { addPoiThunk } from "../redux/thunks/database/pois/addPoiThunk";
+
+import { selectPoiMarkers } from "../redux/slices/database/pois/poiMarkersSlice";
+import { selectAddPoiStatus, selectAddPoiError } from "../redux/slices/database/pois/addPoiSlice";
+
 const MapComponentWithNoSSR = dynamic(() => import("../components/mainComponent/MapComponent"), { ssr: false });
 const TestScriptWithNoSSR = dynamic(() => import("../components/TestScript"), { ssr: false });
 
 export default function Home() {
-  const poiReadTrigger = useSelector((state) => state.poiReadFromDbTrigger.trigger);
   const dispatch = useDispatch();
-  const locations = useSelector((state) => state.readPoiMarkersStore.poiMarkers);
+
+  // Redux State
+  const locations = useSelector(selectPoiMarkers);
+  const poiReadTrigger = useSelector((state) => state.poiReadFromDbTrigger.trigger);
+  const addPoiStatus = useSelector(selectAddPoiStatus);
+  const addPoiError = useSelector(selectAddPoiError);
+
+  // Lokale State (für URL-Parameter)
   const [mParam, setMParam] = useState("");
   const [uParam, setUParam] = useState("");
 
-  // Daten abrufen
-  const loadData = async () => {
-    try {
-      const response = await fetch("/api/talas_v5_DB/pois/readLocations");
-      if (!response.ok) {
-        throw new Error("Fehler beim Laden der Standortdaten");
-      }
-      const data = await response.json();
-      dispatch(setPoiMarkers(data));
-    } catch (error) {
-      console.error(error.message);
-    }
-  };
-
-  // Verhindert mehrfaches Laden durch doppelte Registrierung
+  // URL-Parameter auslesen und POIs laden
   useEffect(() => {
-    let isMounted = true;
-
-    function getURLParameter(name) {
+    const getURLParameter = (name) => {
       const params = new URLSearchParams(window.location.search);
       return params.get(name);
-    }
+    };
 
     setMParam(getURLParameter("m"));
     setUParam(getURLParameter("u"));
 
-    const fetchData = async () => {
-      await loadData();
-    };
+    dispatch(fetchPoiMarkersThunk());
+  }, [dispatch, poiReadTrigger]);
 
-    if (isMounted) {
-      fetchData();
-    }
+  // POI hinzufügen über Redux-Thunk
+  const handleAddLocation = async (name, poiTypeId, lat, lng) => {
+    const idLD = 0; // ⬅️ Falls IDLD dynamisch bestimmt werden soll, anpassen
+    const formData = { name, poiTypeId, latitude: lat, longitude: lng, idLD };
 
-    return () => {
-      isMounted = false;
-    };
-  }, [poiReadTrigger]); // Nur einmal bei Änderung von poiReadTrigger ausführen
-
-  // POI hinzufügen
-  const handleAddLocation = async (name, type, lat, lng) => {
     try {
-      const response = await fetch("/api/talas_v5_DB/pois/addLocation", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ name, type, latitude: lat, longitude: lng }),
-      });
-      if (!response.ok) {
-        throw new Error("Fehler beim Hinzufügen des Standorts");
+      const resultAction = await dispatch(addPoiThunk(formData));
+      if (addPoiThunk.fulfilled.match(resultAction)) {
+        dispatch(fetchPoiMarkersThunk()); // neu laden
+      } else {
+        console.error("❌ Fehler beim Hinzufügen:", resultAction.payload);
       }
-      loadData();
     } catch (error) {
-      console.error(error.message);
+      console.error("❌ Fehler im addPoiThunk:", error.message);
     }
   };
 
-  // Standort aktualisieren
-  const handleLocationUpdate = (id, newLatitude, newLongitude) => {
-    setLocations((prevLocations) => prevLocations.map((location) => (location.idPoi === id ? { ...location, position: `POINT(${newLongitude} ${newLatitude})` } : location)));
-  };
-
   return (
     <div>
-      <MapComponentWithNoSSR locations={locations} onAddLocation={handleAddLocation} onLocationUpdate={handleLocationUpdate} />
+      <MapComponentWithNoSSR locations={locations} onAddLocation={handleAddLocation} />
       <TestScriptWithNoSSR />
+
+      {addPoiStatus === "failed" && <p className="text-red-600">❌ Fehler: {addPoiError}</p>}
     </div>
   );
 }