cleanup: MapComponent.js

components/mainComponent/MapComponent.js

@@ -7,8 +7,6 @@ import "leaflet-contextmenu";
 import "leaflet.smooth_marker_bouncing";
 import OverlappingMarkerSpiderfier from "overlapping-marker-spiderfier-leaflet"; //sieht deaktiviert aber ist das nicht so und wird benötigt
 import "react-toastify/dist/ReactToastify.css";
-import MapLayersControlPanel from "../uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js";
-
 import { InformationCircleIcon } from "@heroicons/react/20/solid";
 import PoiUpdateModal from "../pois/PoiUpdateModal.js";
 import { ToastContainer, toast } from "react-toastify";
@@ -23,7 +21,6 @@ import useSmsfunkmodemMarkersLayer from "../../hooks/layers/useSmsfunkmodemMarke
 import useBereicheMarkersLayer from "../../hooks/layers/useBereicheMarkersLayer.js";
 import { setupPolylines } from "../../utils/polylines/setupPolylines.js";
 import { setupPOIs } from "../../utils/setupPOIs.js";
-import VersionInfoModal from "../uiWidgets/VersionInfoModal.js";
 import useLayerVisibility from "../../hooks/useLayerVisibility.js";
 import useLineData from "../../hooks/useLineData.js";
 import { useMapComponentState } from "../../hooks/useMapComponentState.js";
@@ -31,8 +28,11 @@ 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 CoordinateInput from "../uiWidgets/CoordinateInput.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 { fetchPoiDataService } from "../../services/database/fetchPoiDataByIdService.js";
 import { selectPolylineVisible, setPolylineVisible } from "../../redux/slices/polylineLayerVisibleSlice.js";
@@ -63,7 +63,6 @@ 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";
@@ -94,20 +93,13 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const selectedArea = useSelector((state) => state.selectedArea.area);
   const linesData = useSelector((state) => state.gisLinesFromDatabase.data);
   const gisLinesStatus = useSelector((state) => state.gisLinesStatusFromWebservice.status);
-
   const { data: gisLinesStatusData, status: statusGisLinesStatus } = useSelector(selectGisLinesStatusFromWebservice);
-
   const poiIconsData = useSelector(selectPoiIconsData);
   const poiIconsStatus = useSelector(selectPoiIconsStatus);
-
   const poiTypData = useSelector(selectPoiTypData);
   const poiTypStatus = useSelector((state) => state.poiTypes.status);
   //const poiTypStatus = useSelector(selectPoiTypStatus);
 
-  /*   useEffect(() => {
-    console.log("✅ Redux: gisLinesStatusData:", gisLinesStatusData);
-  }, [gisLinesStatusData]);
- */
   //-------------------------------
   const { deviceName, setDeviceName } = useMapComponentState();
   const [locationDeviceData, setLocationDeviceData] = useState([]);
@@ -228,8 +220,20 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const ulafMarkersLayerRef = useRef(null);
   const sonstigeMarkersLayerRef = useRef(null);
   const tkComponentsMarkersRef = useRef(null);
-  useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, (value) => dispatch(setDisabled(value)));
+  //------------------------------
+  const [poiData, setPoiData] = useState([]);
+  //--------------------------------------------
 
+  const handleCoordinatesSubmit = (coords) => {
+    const [lat, lng] = coords.split(",").map(Number);
+    if (map && lat && lng) {
+      map.flyTo([lat, lng], 12); // Zentriere die Karte auf die Koordinaten
+    }
+  };
+  //-----------------------------Map Initialisierung----------------
+  useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, (value) => dispatch(setDisabled(value)));
+  //--------------------------------------------------------------------
+  //-------------------------React Hooks--------------------------------
   useEffect(() => {
     if (linesData && Array.isArray(linesData)) {
       const transformed = linesData.map((item) => ({
@@ -241,9 +245,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     }
   }, [linesData]);
   //--------------------------------------------
-  const [poiData, setPoiData] = useState([]);
-  // POIs Popup Informationen anzeigen
-
   useEffect(() => {
     dispatch(fetchPoiIconsDataThunk());
     dispatch(fetchPoiTypThunk());
@@ -531,7 +532,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     initializeContextMenu();
   }, [map]);
 
-  //--------------hokks-------------------------------------------
+  //--------------hooks-------------------------------------------
 
   useGmaMarkersLayer(
     map,
@@ -722,14 +723,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
       // initGeocoderFeature(map); // Geocoder-Feature initialisieren, kann von .env.local ausgeschaltet werden
     }
   }, [map]);
-  //--------------------------------------------
 
-  const handleCoordinatesSubmit = (coords) => {
-    const [lat, lng] = coords.split(",").map(Number);
-    if (map && lat && lng) {
-      map.flyTo([lat, lng], 12); // Zentriere die Karte auf die Koordinaten
-    }
-  };
   //--------------------------------------------
 
   useEffect(() => {

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.155";
+export const APP_VERSION = "1.1.156";