cleanup: MapComponent.js

components/mainComponent/MapComponent.js

@@ -66,6 +66,7 @@ import { fetchGisLinesStatusThunk } from "../../redux/thunks/webservice/fetchGis
 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";
 
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   //-------------------------------
@@ -90,10 +91,10 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const polylineEventsDisabled = useSelector((state) => state.polylineEventsDisabled.disabled);
   const mapLayersVisibility = useSelector(selectMapLayersState) || {};
   const selectedArea = useSelector((state) => state.selectedArea.area);
-  const linesData = useSelector((state) => state.gisLines.data);
-  const gisLinesStatus = useSelector((state) => state.gisLines.status);
+  const linesData = useSelector((state) => state.gisLinesFromDatabase.data);
+  const gisLinesStatus = useSelector((state) => state.gisLinesStatusFromWebservice.status);
 
-  const { data: gisLinesStatusData, status: statusGisLinesStatus } = useSelector(selectGisLinesStatus);
+  const { data: gisLinesStatusData, status: statusGisLinesStatus } = useSelector(selectGisLinesStatusFromWebservice);
   useEffect(() => {
     console.log("✅ Redux: gisLinesStatusData:", gisLinesStatusData);
   }, [gisLinesStatusData]);
@@ -219,31 +220,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const sonstigeMarkersLayerRef = useRef(null);
   const tkComponentsMarkersRef = useRef(null);
   useInitializeMap(map, mapRef, setMap, setOms, setMenuItemAdded, addItemsToMapContextMenu, hasRights, (value) => dispatch(setDisabled(value)));
-  //---------------------------------------------------------------
-  useEffect(() => {
-    const params = new URL(window.location.href).searchParams;
-    dispatch(setMapId(params.get("m")));
-    dispatch(setUserId(params.get("u")));
-  }, [dispatch]);
-  //---------------------------------------------------------------
-  useEffect(() => {
-    dispatch(fetchPriorityConfigThunk());
-  }, [dispatch]);
-  //--------------------------------------------------------
-  useEffect(() => {
-    if (gisLinesStatus === "idle") {
-      dispatch(fetchGisLinesThunk());
-    }
-  }, [gisLinesStatus, dispatch]);
-  //--------------------------------------------------------
-  useEffect(() => {
-    dispatch(fetchGisLinesStatusThunk());
-  }, [dispatch]);
-  //---------------------------------------------------------
-  useEffect(() => {
-    dispatch(fetchUserRightsThunk());
-  }, [dispatch]);
-  //----------------------------------------------------
 
   useEffect(() => {
     if (linesData && Array.isArray(linesData)) {
@@ -370,13 +346,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     mapLayersVisibility, // Neu: Abhängigkeit für Sichtbarkeitsstatus
   ]);
 
-  //--------------------------------------------
-  useEffect(() => {
-    if (poiTypStatus === "idle") {
-      dispatch(fetchPoiTypes());
-    }
-  }, [poiTypStatus, dispatch]);
-
   //-----------------------------------------------------------------
   //Tooltip an mouse position anzeigen für die Linien
   useEffect(() => {
@@ -807,6 +776,23 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     dispatch(setPolylineVisible(storedPolylineVisible));
   }, [dispatch]);
   //--------------------------------------------
+  useEffect(() => {
+    if (statusStaticDistrict === "idle") {
+      dispatch(fetchGisStationsStaticDistrictThunk());
+    }
+  }, [statusStaticDistrict, dispatch]);
+
+  useEffect(() => {
+    if (statusStatusDistrict === "idle") {
+      dispatch(fetchGisStationsStatusDistrictThunk());
+    }
+  }, [statusStatusDistrict, dispatch]);
+
+  useEffect(() => {
+    if (statusMeasurements === "idle") {
+      dispatch(fetchGisStationsMeasurementsThunk());
+    }
+  }, [statusMeasurements, dispatch]);
 
   useEffect(() => {
     if (statusSystem === "idle") {
@@ -814,32 +800,41 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     }
   }, [statusSystem, dispatch]);
 
-  useEffect(() => {
-    if (statusStatusDistrict === "idle") {
-      dispatch(fetchGisStationsStatusDistrictThunk());
-    }
-  }, [statusStatusDistrict, dispatch]);
-
-  //----------------------------------------------
-  // speichere location devices in redux store
-
   useEffect(() => {
     dispatch(fetchLocationDevicesThunk());
   }, [dispatch]);
 
+  //---------------------------------------------------------------
   useEffect(() => {
-    if (statusStaticDistrict === "idle") {
-      dispatch(fetchGisStationsStaticDistrictThunk());
-    }
-  }, [statusStaticDistrict, dispatch]);
-  useEffect(() => {
-    if (statusMeasurements === "idle") {
-      dispatch(fetchGisStationsMeasurementsThunk());
-    }
-  }, [statusMeasurements, dispatch]);
-  useEffect(() => {
-    dispatch(fetchGisSystemStaticThunk());
+    const params = new URL(window.location.href).searchParams;
+    dispatch(setMapId(params.get("m")));
+    dispatch(setUserId(params.get("u")));
   }, [dispatch]);
+  //---------------------------------------------------------------
+  useEffect(() => {
+    dispatch(fetchPriorityConfigThunk());
+  }, [dispatch]);
+  //--------------------------------------------------------
+  useEffect(() => {
+    if (gisLinesStatus === "idle") {
+      dispatch(fetchGisLinesThunk());
+    }
+  }, [gisLinesStatus, dispatch]);
+  //--------------------------------------------------------
+  useEffect(() => {
+    dispatch(fetchGisLinesStatusThunk());
+  }, [dispatch]);
+  //---------------------------------------------------------
+  const rights = useSelector((state) => state.gisUserRightsFromWebservice.rights);
+  useEffect(() => {
+    dispatch(fetchUserRightsThunk());
+  }, [dispatch]);
+  //----------------------------------------------------
+  useEffect(() => {
+    if (poiTypStatus === "idle") {
+      dispatch(fetchPoiTypes());
+    }
+  }, [poiTypStatus, dispatch]);
 
   //--------------------------------------
   useEffect(() => {
@@ -869,6 +864,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     }
   }, [isPolylineContextMenuOpen, countdown, countdownActive, dispatch, window.map]);
   //----------------------------------
+  // map in window setzen für mehr Debugging
   useEffect(() => {
     if (map) {
       window.map = map;
@@ -877,6 +873,8 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, [map]);
 
   //---------------------------------------
+  // **Fehlerbehandlung für `contextmenu`**
+  // damit den Fehler mit contextmenu nicht angezeigt wird und überspringt wird und die Seite neu geladen wird
   useEffect(() => {
     window.onerror = function (message, source, lineno, colno, error) {
       if (message.includes("Cannot read properties of null (reading 'contextmenu')")) {
@@ -894,7 +892,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   }, []);
 
   //---------------------------------------------
-
   //--------------------------------------------
   return (
     <>

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.146";
+export const APP_VERSION = "1.1.147";

redux/slices/database/gisLinesSlice.js

@@ -3,7 +3,7 @@ import { createSlice } from "@reduxjs/toolkit";
 import { fetchGisLinesThunk } from "../../thunks/database/fetchGisLinesThunk";
 
 const gisLinesSlice = createSlice({
-  name: "gisLines",
+  name: "gisLinesFromDatabase",
   initialState: {
     data: [],
     status: "idle",

redux/slices/webService/gisLinesStatusSlice.js

@@ -9,7 +9,7 @@ const initialState = {
 };
 
 export const gisLinesStatusSlice = createSlice({
-  name: "gisLinesStatus",
+  name: "gisLinesStatusFromWebservice",
   initialState,
   reducers: {},
   extraReducers: (builder) => {
@@ -30,4 +30,4 @@ export const gisLinesStatusSlice = createSlice({
 
 export default gisLinesStatusSlice.reducer;
 
-export const selectGisLinesStatus = (state) => state.gisLinesStatus;
+export const selectGisLinesStatusFromWebservice = (state) => state.gisLinesStatusFromWebservice;

redux/slices/webService/userRightsSlice.js

@@ -9,7 +9,7 @@ const initialState = {
 };
 
 export const userRightsSlice = createSlice({
-  name: "userRights",
+  name: "gisUserRightsFromWebservice",
   initialState,
   reducers: {},
   extraReducers: (builder) => {
@@ -30,5 +30,5 @@ export const userRightsSlice = createSlice({
 
 export default userRightsSlice.reducer;
 
-export const selectUserRights = (state) => state.userRights.rights;
-export const selectUserRightsStatus = (state) => state.userRights.status;
+export const selectGisUserRightsFromWebservice = (state) => state.gisUserRightsFromWebservice.rights;
+export const selectGisUserRightsStatus = (state) => state.gisUserRightsFromWebservice.status;

redux/store.js

@@ -17,27 +17,30 @@ import zoomTriggerReducer from "./slices/zoomTriggerSlice";
 import urlParameterReducer from "./slices/urlParameterSlice";
 //-----database------------
 import priorityConfigReducer from "./slices/database/priorityConfigSlice";
-import gisLinesReducer from "./slices/database/gisLinesSlice";
 import poiTypesReducer from "./slices/database/poiTypesSlice";
 import locationDevicesFromDBReducer from "./slices/database/locationDevicesFromDBSlice";
+import gisLinesFromDatabaseReducer from "./slices/database/gisLinesSlice";
 //----webservice------------
 import gisStationsStaticDistrictReducer from "./slices/webservice/gisStationsStaticDistrictSlice";
 import gisStationsStatusDistrictReducer from "./slices/webservice/gisStationsStatusDistrictSlice";
 import gisStationsMeasurementsReducer from "./slices/webservice/gisStationsMeasurementsSlice";
 import gisSystemStaticReducer from "./slices/webservice/gisSystemStaticSlice";
-import gisLinesStatusReducer from "./slices/webservice/gisLinesStatusSlice";
 import userRightsReducer from "./slices/webservice/userRightsSlice";
+import gisLinesStatusFromWebserviceReducer from "./slices/webservice/gisLinesStatusSlice";
 
 export const store = configureStore({
   reducer: {
-    lineVisibility: lineVisibilityReducer,
-    currentPoi: currentPoiReducer,
-    polylineLayerVisible: polylineLayerVisibleReducer,
-    locationDevicesFromDB: locationDevicesFromDBReducer,
     gisStationsStaticDistrict: gisStationsStaticDistrictReducer,
     gisStationsStatusDistrict: gisStationsStatusDistrictReducer,
     gisStationsMeasurements: gisStationsMeasurementsReducer,
     gisSystemStatic: gisSystemStaticReducer,
+    gisUserRightsFromWebservice: userRightsReducer,
+    gisLinesStatusFromWebservice: gisLinesStatusFromWebserviceReducer,
+    gisLinesFromDatabase: gisLinesFromDatabaseReducer,
+    lineVisibility: lineVisibilityReducer,
+    currentPoi: currentPoiReducer,
+    polylineLayerVisible: polylineLayerVisibleReducer,
+    locationDevicesFromDB: locationDevicesFromDBReducer,
     poiTypes: poiTypesReducer,
     addPoiOnPolyline: addPoiOnPolylineReducer,
     polylineContextMenu: polylineContextMenuReducer,
@@ -52,8 +55,5 @@ export const store = configureStore({
     zoomTrigger: zoomTriggerReducer,
     urlParameter: urlParameterReducer,
     priorityConfig: priorityConfigReducer,
-    gisLines: gisLinesReducer,
-    gisLinesStatus: gisLinesStatusReducer,
-    userRights: userRightsReducer,
   },
 });