feat: Migration von zoomTriggerSlice von Recoil zu Redux Toolkit

- Ersetzung des Recoil Atoms 'zoomTriggerState' durch Redux Toolkit Slice.
- Hinzugefügt: Aktionen für incrementZoomTrigger, decrementZoomTrigger, resetZoomTrigger und setZoomTrigger.
- Implementierung von Redux-Selektoren zum Zugriff auf den zoomTrigger-Zustand.
- Aktualisierung der Komponenten (MapComponent.js, DataSheet.js) auf Redux-Hooks (useSelector, useDispatch).
- Registrierung des zoomTriggerReducers im rootReducer und store.js.
- Überprüfung der Zoom In/Out-Funktionalität sowie Integration von Event-Handling für Mausrad und Kontextmenü.

components/DataSheet.js

@@ -4,14 +4,16 @@ import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStati
 import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice";
 import { mapLayersState } from "../redux/slices/mapLayersSlice";
 import { selectedAreaState } from "../redux/slices/selectedAreaSlice";
-import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
+//import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
 import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice";
 import EditModeToggle from "./EditModeToggle";
 import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
 import { selectGisStationsStaticDistrict } from "../redux/slices/gisStationsStaticDistrictSlice";
+import { incrementZoomTrigger, selectZoomTrigger } from "../redux/slices/zoomTriggerSlice";
 
 function DataSheet() {
+  const dispatch = useDispatch();
   const [editMode, setEditMode] = useState(false); // Zustand für editMode
   const [poiVisible, setPoiVisible] = useRecoilState(poiLayerVisibleState);
   const setSelectedArea = useSetRecoilState(selectedAreaState);
@@ -21,7 +23,7 @@ function DataSheet() {
   //const GisStationsStaticDistrict = useRecoilValue(gisStationsStaticDistrictState);
   const GisStationsStaticDistrict = useSelector(selectGisStationsStaticDistrict);
   const GisSystemStatic = useRecoilValue(gisSystemStaticState);
-  const setZoomTrigger = useSetRecoilState(zoomTriggerState);
+  const setZoomTrigger = useSelector(selectZoomTrigger);
   const [polylineVisible, setPolylineVisible] = useRecoilState(polylineLayerVisibleState); // Zustand für Polylines
   const [bereicheVisible, setBereicheVisible] = useState(false); // NEU: Bereiche-Status
   const [standordVisible, setStandorteVisible] = useState(false); // NEU: Standorte-Status

components/MapComponent.js

@@ -61,7 +61,8 @@ import { gisStationsStaticDistrictState } from "../redux/slices/gisStationsStati
 import { gisSystemStaticState } from "../redux/slices/gisSystemStaticSlice";
 import { mapLayersState } from "../redux/slices/mapLayersSlice";
 import { selectedAreaState } from "../redux/slices/selectedAreaSlice";
-import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
+//import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js";
+import { incrementZoomTrigger, selectZoomTrigger } from "../redux/slices/zoomTriggerSlice.js";
 import { polylineEventsDisabledState } from "../redux/slices/polylineEventsDisabledSlice";
 import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice";
 //--------------------------------------------
@@ -92,7 +93,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   const [currentPoiData, setCurrentPoiData] = useState(null);
 
   const [showVersionInfoModal, setShowVersionInfoModal] = useState(false);
-  const zoomTrigger = useRecoilValue(zoomTriggerState);
+  const zoomTrigger = useSelector(selectZoomTrigger);
   const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false);
   const [poiTypMap, setPoiTypMap] = useState(new Map());
   const [showPopup, setShowPopup] = useState(false);
@@ -203,7 +204,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     oms,
     mapLayersVisibility.GMA // Übergebe die Sichtbarkeitsbedingung als Parameter
   );
-//---------------------------------------------------------------
+  //---------------------------------------------------------------
   /*   useSmsfunkmodemMarkersLayer(
     map,
     oms,
@@ -211,7 +212,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     priorityConfig,
     mapLayersVisibility.SMSFunkmodem // Sichtbarkeitsstatus aus dem State
   ); */
-//---------------------------------------------------------------
+  //---------------------------------------------------------------
   useFetchWebServiceMap(
     dispatch,
     mapGisStationsStaticDistrictUrl,

redux/reducer.js

@@ -2,10 +2,12 @@
 import { combineReducers } from "redux";
 import currentPoiReducer from "./slices/currentPoiSlice";
 import gisStationsStaticDistrictReducer from "./slices/gisStationsStaticDistrictSlice";
+import zoomTriggerReducer from "./slices/zoomTriggerSlice";
 
 const rootReducer = combineReducers({
   currentPoi: currentPoiReducer,
   gisStationsStaticDistrict: gisStationsStaticDistrictReducer,
+  zoomTrigger: zoomTriggerReducer,
 });
 
 export default rootReducer;

redux/slices/zoomTriggerSlice.js

@@ -1,7 +1,23 @@
 // redux/slices/zoomTriggerSlice.js
-import { atom } from "recoil";
+import { createSlice } from "@reduxjs/toolkit";
 
-export const zoomTriggerState = atom({
+const initialState = {
-  key: "zoomTriggerState",
+  zoomTrigger: 0,
-  default: 0, // Dies kann eine einfache Zählvariable sein, die inkrementiert wird.
+};
+
+const zoomTriggerSlice = createSlice({
+  name: "zoomTrigger",
+  initialState,
+  reducers: {
+    incrementZoomTrigger(state) {
+      state.zoomTrigger += 1; // Zustand erhöhen
+    },
+    resetZoomTrigger(state) {
+      state.zoomTrigger = 0; // Zustand zurücksetzen
+    },
+  },
 });
+
+export const { incrementZoomTrigger, resetZoomTrigger } = zoomTriggerSlice.actions;
+export const selectZoomTrigger = (state) => state.zoomTrigger.zoomTrigger;
+export default zoomTriggerSlice.reducer;