refactor: POI-Typ-Fetch in AddPOIModal auf Redux umgestellt

- Manuelle fetch-Anfrage zu /api/talas_v5_DB/poiTyp/readPoiTyp entfernt - Stattdessen fetchPoiTypes Redux-Thunk verwendet - Initialwert für poiTypeId weiterhin über useEffect gesetzt - Code vereinfacht und zentral über Redux-Store verwaltet
2025-05-23 11:56:28 +02:00
parent 62c508e2c3
commit a8a0efa8ea
4 changed files with 31 additions and 43 deletions
--- a/README.md
+++ b/README.md
@@ -84,9 +84,7 @@ components/     → UI-Komponenten inkl. Karte und Layer-Control-Panel (`MapLaye
 ┃ ┃ ┃ ┗ 📜PlusRoundIcon.js
 ┣ 📂mainComponent
 ┃ ┣ 📂hooks
- ┃ ┃ ┣ 📜useFetchPoiData.js
- ┃ ┃ ┣ 📜useInitializeMap.js
- ┃ ┃ ┗ 📜useRestoreMapSettings.js
+ ┃ ┃ ┗ 📜useInitializeMap.js
 ┃ ┗ 📜MapComponent.js
 ┣ 📂pois
 ┃ ┣ 📜AddPOIModal.js
@@ -122,7 +120,9 @@ redux/          → globale Zustände (Slices)
 ┃ ┃ ┣ 📜gisLinesSlice.js
 ┃ ┃ ┣ 📜locationDevicesFromDBSlice.js
 ┃ ┃ ┣ 📜locationDevicesSlice.js
+ ┃ ┃ ┣ 📜poiIconsDataSlice.js
 ┃ ┃ ┣ 📜poiTypesSlice.js
+ ┃ ┃ ┣ 📜poiTypSlice.js
 ┃ ┃ ┗ 📜priorityConfigSlice.js
 ┃ ┣ 📂webservice
 ┃ ┃ ┣ 📜gisLinesStatusSlice.js
@@ -151,6 +151,8 @@ redux/          → globale Zustände (Slices)
 ┃ ┃ ┣ 📜addPoiThunk.js
 ┃ ┃ ┣ 📜fetchGisLinesThunk.js
 ┃ ┃ ┣ 📜fetchLocationDevicesThunk.js
+ ┃ ┃ ┣ 📜fetchPoiIconsDataThunk.js
+ ┃ ┃ ┣ 📜fetchPoiTypThunk.js
 ┃ ┃ ┗ 📜fetchPriorityConfigThunk.js
 ┃ ┗ 📂webservice
 ┃ ┃ ┣ 📜fetchGisLinesStatusThunk.js
@@ -168,7 +170,10 @@ services/       → API-Kommunikation, Mock-Logik
 ┃ ┣ 📜fetchDeviceNameByIdService.js
 ┃ ┣ 📜fetchGisLinesService.js
 ┃ ┣ 📜fetchLocationDevicesService.js
+ ┃ ┣ 📜fetchPoiDataByIdService.js
 ┃ ┣ 📜fetchPoiDataService.js
+ ┃ ┣ 📜fetchPoiIconsDataService.js
+ ┃ ┣ 📜fetchPoiTypService.js
 ┃ ┣ 📜fetchPriorityConfigService.js
 ┃ ┗ 📜updateLocationInDatabaseService.js
 ┣ 📂utils
--- a/components/mainComponent/MapComponent.js
+++ b/components/mainComponent/MapComponent.js
@@ -25,29 +25,37 @@ import useLayerVisibility from "../../hooks/useLayerVisibility.js";
 import useLineData from "../../hooks/useLineData.js";
 import { useMapComponentState } from "../../hooks/useMapComponentState.js";
 import { updateLocation } from "../../utils/updateBereichUtil.js";
-import { selectMapLayersState } from "../../redux/slices/mapLayersSlice";
-import { useSelector, useDispatch } from "react-redux";
-import { setCurrentPoi } from "../../redux/slices/currentPoiSlice.js";
 import CoordinatePopup from "../contextmenu/CoordinatePopup.js";
 //----------Ui Widgets----------------
 import MapLayersControlPanel from "../uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js";
-import VersionInfoModal from "../uiWidgets/VersionInfoModal.js";
 import CoordinateInput from "../uiWidgets/CoordinateInput.js";
-//------------------------Daten aus API--------------------
+import VersionInfoModal from "../uiWidgets/VersionInfoModal.js";
+//----------Daten aus API--------------------
 import { fetchPoiDataService } from "../../services/database/fetchPoiDataByIdService.js";
-import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js";
-import { selectGisStationsStaticDistrict } from "../../redux/slices/webservice/gisStationsStaticDistrictSlice.js";
-import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webservice/gisSystemStaticSlice.js";
-import ShowAddStationPopup from "../pois/AddPOIModal.js";
+import AddPOIModal from "../pois/AddPOIModal.js";
 import { enablePolylineEvents, disablePolylineEvents } from "../../utils/polylines/eventHandlers";
-import { updateCountdown, closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice";
-//-------------------MapComponent.js hooks--------------------
+//----------MapComponent.js hooks--------------------
 import useInitializeMap from "./hooks/useInitializeMap";
-
+//-------------------Redux--------------------
+import { useSelector, useDispatch } from "react-redux";
+//-------------------Redux-Slices--------------------
 import { setSelectedPoi } from "../../redux/slices/selectedPoiSlice";
 import { setDisabled } from "../../redux/slices/polylineEventsDisabledSlice";
 import { setMapId, setUserId } from "../../redux/slices/urlParameterSlice";
 import { fetchPoiTypes } from "../../redux/slices/database/poiTypesSlice";
+import { selectMapLayersState } from "../../redux/slices/mapLayersSlice";
+import { setCurrentPoi } from "../../redux/slices/currentPoiSlice.js";
+import { selectGisLines } from "../../redux/slices/database/gisLinesSlice";
+import { selectGisLinesStatus } from "../../redux/slices/webservice/gisLinesStatusSlice";
+import { selectPoiTypData, selectPoiTypStatus } from "../../redux/slices/database/poiTypSlice";
+import { selectPriorityConfig } from "../../redux/slices/database/priorityConfigSlice";
+import { selectPoiIconsData, selectPoiIconsStatus } from "../../redux/slices/database/poiIconsDataSlice";
+import { selectGisLinesStatusFromWebservice } from "../../redux/slices/webservice/gisLinesStatusSlice";
+import { selectGisUserRightsFromWebservice } from "../../redux/slices/webservice/userRightsSlice";
+import { updateCountdown, closePolylineContextMenu } from "../../redux/slices/polylineContextMenuSlice";
+import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js";
+import { selectGisStationsStaticDistrict } from "../../redux/slices/webservice/gisStationsStaticDistrictSlice.js";
+import { selectGisSystemStatic, setGisSystemStatic } from "../../redux/slices/webservice/gisSystemStaticSlice.js";
 //-----------Redux-Thunks-------------------
 import { fetchGisStationsMeasurementsThunk } from "../../redux/thunks/webservice/fetchGisStationsMeasurementsThunk";
 import { fetchGisSystemStaticThunk } from "../../redux/thunks/webservice/fetchGisSystemStaticThunk";
@@ -55,19 +63,13 @@ import { fetchGisStationsStaticDistrictThunk } from "../../redux/thunks/webservi
 import { fetchGisStationsStatusDistrictThunk } from "../../redux/thunks/webservice/fetchGisStationsStatusDistrictThunk";
 import { fetchLocationDevicesThunk } from "../../redux/thunks/database/fetchLocationDevicesThunk";
 import { fetchPriorityConfigThunk } from "../../redux/thunks/database/fetchPriorityConfigThunk";
-import { selectPriorityConfig } from "../../redux/slices/database/priorityConfigSlice";
 import { fetchGisLinesThunk } from "../../redux/thunks/database/fetchGisLinesThunk";
 import { fetchGisLinesStatusThunk } from "../../redux/thunks/webservice/fetchGisLinesStatusThunk";
 import { fetchUserRightsThunk } from "../../redux/thunks/webservice/fetchUserRightsThunk";
-import { selectGisLines } from "../../redux/slices/database/gisLinesSlice";
-import { selectGisLinesStatus } from "../../redux/slices/webservice/gisLinesStatusSlice";
-import { selectGisLinesStatusFromWebservice } from "../../redux/slices/webservice/gisLinesStatusSlice";
-import { selectGisUserRightsFromWebservice } from "../../redux/slices/webservice/userRightsSlice";
 import { fetchPoiIconsDataThunk } from "../../redux/thunks/database/fetchPoiIconsDataThunk";
 import { fetchPoiTypThunk } from "../../redux/thunks/database/fetchPoiTypThunk";
-import { selectPoiIconsData, selectPoiIconsStatus } from "../../redux/slices/database/poiIconsDataSlice";
-import { selectPoiTypData, selectPoiTypStatus } from "../../redux/slices/database/poiTypSlice";

+//-----------------------------------------------------------------------------------------------------
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  //-------------------------------
  const dispatch = useDispatch();
@@ -885,7 +887,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
  return (
    <>
      {/* Zeigt das POI-Modal, wenn `showPoiModal` true ist */}
-      {showPoiModal && <ShowAddStationPopup latlng={popupCoordinates} onClose={() => setShowPoiModal(false)} />}
+      {showPoiModal && <AddPOIModal latlng={popupCoordinates} onClose={() => setShowPoiModal(false)} />}
      <ToastContainer />
      <div>{showPoiUpdateModal && <PoiUpdateModal onClose={() => setShowPoiUpdateModal(false)} poiData={currentPoiData} onSubmit={() => {}} latlng={popupCoordinates} />}</div>

--- a/components/pois/AddPOIModal.js
+++ b/components/pois/AddPOIModal.js
@@ -21,25 +21,6 @@ const AddPOIModal = ({ onClose, map, latlng }) => {

  const [deviceName, setDeviceName] = useState("");
  //-----------------------------------------------------
-  useEffect(() => {
-    const fetchpoiTypData = async () => {
-      try {
-        const response = await fetch("/api/talas_v5_DB/poiTyp/readPoiTyp");
-        const data = await response.json();
-        setpoiTypData(data);
-
-        if (data && data.length > 0) {
-          console.log("POI-Typen geladen:", data);
-          setPoiTypeId(data[0].idPoiTyp); // Setzt den ersten Typ
-          setPoiTypeName(data[0].name);
-        }
-      } catch (error) {
-        console.error("Fehler beim Abrufen der poiTyp Daten:", error);
-      }
-    };
-
-    fetchpoiTypData();
-  }, []);

  useEffect(() => {
    if (poiTypData.length > 0 && !poiTypeId) {
--- a/config/appVersion.js
+++ b/config/appVersion.js
@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.156";
+export const APP_VERSION = "1.1.157";