refactor: Entfernt Recoil-Atoms mapIdState & userIdState – ersetzt durch Redux-Slice urlParameter

- MapComponent.js nutzt jetzt useSelector für mapId/userId
- Übergabe dynamischer Parameter via dispatch(setMapId), dispatch(setUserId)
- Store um urlParameterReducer erweitert

CHANGELOG.md

@@ -4,6 +4,23 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
 
 ---
 
+## [1.1.89] – 2025-05-22
+
+### Changed
+
+- Recoil-Atoms `mapIdState` und `userIdState` entfernt
+- Stattdessen: Umstellung auf Redux-Slice `urlParameterSlice`
+- `MapComponent.js` verwendet jetzt:
+  - `useSelector(...)` für `mapId` und `userId`
+  - `dispatch(setMapId(...))`, `dispatch(setUserId(...))` in `useEffect`
+- Redux-Store erweitert um `urlParameterReducer`
+
+### Removed
+
+- Recoil-Import `useRecoilState(mapIdState / userIdState)` entfernt aus `MapComponent.js`
+
+---
+
 ## [1.1.88] – 2025-05-22
 
 ### Changed

components/mainComponent/MapComponent.js

@@ -38,7 +38,6 @@ import { updateLocation } from "../../utils/updateBereichUtil.js";
 //--------------------------------------------
 //import { currentPoiState } from "../redux/slices/currentPoiSlice.js";
 
-import { mapIdState, userIdState } from "../../redux/slices/urlParameterSlice.js";
 import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js";
 import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js";
 import { selectMapLayersState } from "../../redux/slices/mapLayersSlice";
@@ -83,6 +82,7 @@ import useRestoreMapSettings from "./hooks/useRestoreMapSettings";
 import { setSelectedPoi, clearSelectedPoi } from "../../redux/slices/selectedPoiSlice";
 import { setupDevices } from "../../utils/setupDevices";
 import { setDisabled } from "../../redux/slices/polylineEventsDisabledSlice";
+import { setMapId, setUserId } from "../../redux/slices/urlParameterSlice";
 
 const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const dispatch = useDispatch();
@@ -129,8 +129,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible);
   const [isRightsLoaded, setIsRightsLoaded] = useState(false);
   const [hasRights, setHasRights] = useState(false);
-  const [mapId, setMapId] = useRecoilState(mapIdState);
+
-  const [userId, setUserId] = useRecoilState(userIdState);
   const [AddPoiModalWindowState, setAddPoiModalWindowState] = useState(false);
   const [userRights, setUserRights] = useState(null);
 
@@ -252,12 +251,14 @@ 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)));
+  const mapId = useSelector((state) => state.urlParameter.mapId);
+  const userId = useSelector((state) => state.urlParameter.userId);
   //---------------------------------------------------------------
   useEffect(() => {
     const params = new URL(window.location.href).searchParams;
-    setMapId(params.get("m"));
+    dispatch(setMapId(params.get("m")));
-    setUserId(params.get("u"));
+    dispatch(setUserId(params.get("u")));
-  }, [setMapId, setUserId]);
+  }, [dispatch]);
   //---------------------------------------------------------------
   useFetchWebServiceMap(mapGisStationsStatusDistrictUrl, mapGisStationsMeasurementsUrl, mapGisSystemStaticUrl, setGisStationsStatusDistrict, setGisStationsMeasurements, setGisSystemStatic, setGisSystemStaticLoaded);
   //Test in useEffect

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.88";
+export const APP_VERSION = "1.1.89";

redux/slices/urlParameterSlice.js

@@ -1,14 +1,28 @@
-// /redux/slices/urlParameterSlice.js
+// redux/slices/urlParameterSlice.js
-import { atom } from "recoil";
+import { createSlice } from "@reduxjs/toolkit";
 
-// Atom für die Speicherung der mapId aus der URL
+const initialState = {
-export const mapIdState = atom({
+  mapId: "10",
-  key: "mapIdState", // Eindeutiger Schlüssel (innerhalb des gesamten Projekts)
+  userId: "484",
-  default: "10", // Standardwert
+};
+
+const urlParameterSlice = createSlice({
+  name: "urlParameter",
+  initialState,
+  reducers: {
+    setMapId: (state, action) => {
+      state.mapId = action.payload;
+    },
+    setUserId: (state, action) => {
+      state.userId = action.payload;
+    },
+    setFromURL: (state, action) => {
+      const { m, u } = action.payload;
+      if (m) state.mapId = m;
+      if (u) state.userId = u;
+    },
+  },
 });
 
-// Atom für die Speicherung der userId aus der URL
+export const { setMapId, setUserId, setFromURL } = urlParameterSlice.actions;
-export const userIdState = atom({
+export default urlParameterSlice.reducer;
-  key: "userIdState",
-  default: "484",
-});

redux/store.js

@@ -21,6 +21,7 @@ import polylineEventsDisabledReducer from "./slices/polylineEventsDisabledSlice"
 import readPoiMarkersStoreReducer from "./slices/readPoiMarkersStoreSlice";
 import selectedAreaReducer from "./slices/selectedAreaSlice";
 import zoomTriggerReducer from "./slices/zoomTriggerSlice";
+import urlParameterReducer from "./slices/urlParameterSlice";
 
 export const store = configureStore({
   reducer: {
@@ -45,5 +46,6 @@ export const store = configureStore({
     readPoiMarkersStore: readPoiMarkersStoreReducer,
     selectedArea: selectedAreaReducer,
     zoomTrigger: zoomTriggerReducer,
+    urlParameter: urlParameterReducer,
   },
 });