From 947317165c7ca8f17d4f1b15a3fb0dc0b0fb4918 Mon Sep 17 00:00:00 2001 From: Ismail Ali Date: Sun, 18 May 2025 17:49:48 +0200 Subject: [PATCH] refactor: Recoil-Zustand zoomTriggerState durch Redux zoomTriggerSlice ersetzt MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - MapComponent.js nutzt jetzt Redux useSelector für zoomTrigger - DataSheet.js verwendet dispatch(incrementZoomTrigger()) - Recoil vollständig entfernt und Store zentralisiert --- CHANGELOG.md | 17 +++++++++++++++++ components/DataSheet.js | 7 +++---- components/mainComponent/MapComponent.js | 3 +-- config/appVersion.js | 2 +- redux/slices/zoomTriggerSlice.js | 23 +++++++++++++++++++---- redux/store.js | 2 ++ 6 files changed, 43 insertions(+), 11 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d12b5ad6d..ed1f9d6cc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,23 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie --- +## [1.1.88] – 2025-05-22 + +### Changed + +- Recoil-Atom `zoomTriggerState` vollständig durch Redux `zoomTriggerSlice` ersetzt +- Betroffene Komponenten: + - `MapComponent.js` – liest `zoomTrigger` aus Redux `useSelector(...)` + - `DataSheet.js` – verwendet `dispatch(incrementZoomTrigger())` bei Icon-Klick +- Redux-Store erweitert um `zoomTriggerReducer` + +### Removed + +- Entfernt: `useRecoilState(zoomTriggerState)` in `DataSheet.js` +- Entfernt: `useRecoilValue(zoomTriggerState)` in `MapComponent.js` + +--- + ## [1.1.86] – 2025-05-21 ### Changed diff --git a/components/DataSheet.js b/components/DataSheet.js index 0643e55a9..b429cc79f 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -5,7 +5,7 @@ import { gisStationsStaticDistrictState } from "../redux/slices/webService/gisSt import { gisSystemStaticState } from "../redux/slices/webService/gisSystemStaticSlice.js"; import { mapLayersState } from "../redux/slices/mapLayersSlice"; import { setSelectedArea } from "../redux/slices/selectedAreaSlice"; -import { zoomTriggerState } from "../redux/slices/zoomTriggerSlice.js"; + import EditModeToggle from "./EditModeToggle"; import { polylineLayerVisibleState } from "../redux/slices/polylineLayerVisibleSlice"; // Import für Polyline-Visibility import { useSelector, useDispatch } from "react-redux"; @@ -18,6 +18,7 @@ import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisS import { selectMapLayersState, setLayerVisibility } from "../redux/slices/mapLayersSlice"; import { setVisible } from "../redux/slices/poiLayerVisibleSlice"; +import { incrementZoomTrigger } from "../redux/slices/zoomTriggerSlice"; function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode @@ -31,8 +32,6 @@ function DataSheet() { const GisSystemStatic = useSelector(selectGisSystemStatic) || []; const GisStationsStatic = useSelector(selectGisStationsStatic) || []; //Area-Name/Bereiche dropdownmenu - const setZoomTrigger = useSetRecoilState(zoomTriggerState); - const polylineVisible = useSelector(selectPolylineVisible); const handlePolylineCheckboxChange = (event) => { @@ -141,7 +140,7 @@ function DataSheet() { const handleIconClick = () => { setSelectedArea("Station wählen"); - setZoomTrigger((current) => current + 1); + dispatch(incrementZoomTrigger()); }; //--------------------------- diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index e85461cd8..4b9b9c873 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -43,7 +43,6 @@ import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js"; import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js"; import { selectMapLayersState } from "../../redux/slices/mapLayersSlice"; -import { zoomTriggerState } from "../../redux/slices/zoomTriggerSlice.js"; import { polylineLayerVisibleState } from "../../redux/slices/polylineLayerVisibleSlice.js"; //-------------------------------------------- import { useSelector, useDispatch } from "react-redux"; @@ -138,7 +137,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const [showPoiUpdateModal, setShowPoiUpdateModal] = useState(false); const [currentPoiData, setCurrentPoiData] = useState(null); const [showVersionInfoModal, setShowVersionInfoModal] = useState(false); - const zoomTrigger = useRecoilValue(zoomTriggerState); + const zoomTrigger = useSelector((state) => state.zoomTrigger.trigger); const [gisSystemStaticLoaded, setGisSystemStaticLoaded] = useState(false); const [poiTypMap, setPoiTypMap] = useState(new Map()); const [showPopup, setShowPopup] = useState(false); diff --git a/config/appVersion.js b/config/appVersion.js index da4df546c..d4b388c16 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.87"; +export const APP_VERSION = "1.1.88"; diff --git a/redux/slices/zoomTriggerSlice.js b/redux/slices/zoomTriggerSlice.js index 848665d42..43b17e616 100644 --- a/redux/slices/zoomTriggerSlice.js +++ b/redux/slices/zoomTriggerSlice.js @@ -1,7 +1,22 @@ // redux/slices/zoomTriggerSlice.js -import { atom } from "recoil"; +import { createSlice } from "@reduxjs/toolkit"; -export const zoomTriggerState = atom({ - key: "zoomTriggerState", - default: 0, // Dies kann eine einfache Zählvariable sein, die inkrementiert wird. +const initialState = { + trigger: 0, +}; + +const zoomTriggerSlice = createSlice({ + name: "zoomTrigger", + initialState, + reducers: { + incrementZoomTrigger: (state) => { + state.trigger += 1; + }, + resetZoomTrigger: (state) => { + state.trigger = 0; + }, + }, }); + +export const { incrementZoomTrigger, resetZoomTrigger } = zoomTriggerSlice.actions; +export default zoomTriggerSlice.reducer; diff --git a/redux/store.js b/redux/store.js index b4842d332..4a5fbbcf6 100644 --- a/redux/store.js +++ b/redux/store.js @@ -20,6 +20,7 @@ import poiReadFromDbTriggerReducer from "./slices/poiReadFromDbTriggerSlice"; import polylineEventsDisabledReducer from "./slices/polylineEventsDisabledSlice"; import readPoiMarkersStoreReducer from "./slices/readPoiMarkersStoreSlice"; import selectedAreaReducer from "./slices/selectedAreaSlice"; +import zoomTriggerReducer from "./slices/zoomTriggerSlice"; export const store = configureStore({ reducer: { @@ -43,5 +44,6 @@ export const store = configureStore({ polylineEventsDisabled: polylineEventsDisabledReducer, readPoiMarkersStore: readPoiMarkersStoreReducer, selectedArea: selectedAreaReducer, + zoomTrigger: zoomTriggerReducer, }, });