diff --git a/CHANGELOG.md b/CHANGELOG.md index 3ef593aec..b3513f257 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,27 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie --- +## [1.1.82] – 2025-05-18 + +### Changed + +- Recoil-Zustand `poiLayerVisibleState` vollständig durch Redux `poiLayerVisibleSlice` ersetzt +- Betroffene Komponenten: + - `useMapComponentState.js` – Zugriff via `useSelector` statt `useRecoilValue` + - `MapComponent.js` – Zugriff auf `poiLayerVisible` über Redux + - `DataSheet.js` – `useRecoilState` entfernt, `dispatch(setVisible(...))` integriert +- Redux-Store (`store.js`) erweitert um `poiLayerVisibleReducer` + +### Removed + +- Recoil-Atom `poiLayerVisibleState` entfernt + +### Added + +- Neue Redux Actions: `setVisible`, `toggleVisible` in `poiLayerVisibleSlice.js` + +--- + ## [1.1.78] – 2025-05-17 ### Changed diff --git a/components/DataSheet.js b/components/DataSheet.js index 751a5900f..f763c53b2 100644 --- a/components/DataSheet.js +++ b/components/DataSheet.js @@ -6,7 +6,6 @@ import { gisSystemStaticState } from "../redux/slices/webService/gisSystemStatic import { mapLayersState } from "../redux/slices/mapLayersSlice"; import { selectedAreaState } from "../redux/slices/selectedAreaSlice"; 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, useDispatch } from "react-redux"; @@ -18,10 +17,13 @@ import { fetchGisStationsStatic, selectGisStationsStatic } from "../redux/slices import { selectGisStationsStaticDistrict } from "../redux/slices/webService/gisStationsStaticDistrictSlice"; import { selectMapLayersState, setLayerVisibility } from "../redux/slices/mapLayersSlice"; +import { setVisible } from "../redux/slices/poiLayerVisibleSlice"; function DataSheet() { const [editMode, setEditMode] = useState(false); // Zustand für editMode - const [poiVisible, setPoiVisible] = useRecoilState(poiLayerVisibleState); + const dispatch = useDispatch(); + const poiVisible = useSelector((state) => state.poiLayerVisible.visible); + const setPoiVisible = (value) => dispatch(setVisible(value)); const setSelectedArea = useSetRecoilState(selectedAreaState); const mapLayersVisibility = useSelector(selectMapLayersState); const [stationListing, setStationListing] = useState([]); @@ -31,7 +33,7 @@ function DataSheet() { const GisStationsStatic = useSelector(selectGisStationsStatic) || []; //Area-Name/Bereiche dropdownmenu const setZoomTrigger = useSetRecoilState(zoomTriggerState); - const dispatch = useDispatch(); + const polylineVisible = useSelector(selectPolylineVisible); const handlePolylineCheckboxChange = (event) => { diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index 9ee654855..92e987410 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -39,7 +39,6 @@ import { updateLocation } from "../../utils/updateBereichUtil.js"; //import { currentPoiState } from "../redux/slices/currentPoiSlice.js"; import { mapIdState, userIdState } from "../../redux/slices/urlParameterSlice.js"; -import { poiLayerVisibleState } from "../../redux/slices/poiLayerVisibleSlice.js"; import { selectedPoiState } from "../../redux/slices/selectedPoiSlice.js"; import { poiReadFromDbTriggerAtom } from "../../redux/slices/poiReadFromDbTriggerSlice.js"; import { gisSystemStaticState } from "../../redux/slices/webService/gisSystemStaticSlice.js"; @@ -129,7 +128,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { const closePopup = () => setIsPopupOpen(false); const [currentCoordinates, setCurrentCoordinates] = useState(""); - const poiLayerVisible = useRecoilValue(poiLayerVisibleState); + const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible); const [isRightsLoaded, setIsRightsLoaded] = useState(false); const [hasRights, setHasRights] = useState(false); const [mapId, setMapId] = useRecoilState(mapIdState); diff --git a/config/appVersion.js b/config/appVersion.js index 661301077..5fbf22dc5 100644 --- a/config/appVersion.js +++ b/config/appVersion.js @@ -1,2 +1,2 @@ // /config/appVersion -export const APP_VERSION = "1.1.81"; +export const APP_VERSION = "1.1.82"; diff --git a/hooks/useMapComponentState.js b/hooks/useMapComponentState.js index a74b03ec6..40f224fb7 100644 --- a/hooks/useMapComponentState.js +++ b/hooks/useMapComponentState.js @@ -1,8 +1,7 @@ // hooks/useMapComponentState.js // POI -> Kontextmenü -> POI bearbeiten -> Dropdown Geräteauswahl import { useState, useEffect } from "react"; -import { useRecoilValue } from "recoil"; -import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice"; +import { useSelector } from "react-redux"; // ✅ Redux statt Recoil import { isMockMode } from "../config/config"; export const useMapComponentState = () => { @@ -12,7 +11,9 @@ export const useMapComponentState = () => { const [locationDeviceData, setLocationDeviceData] = useState([]); const [priorityConfig, setPriorityConfig] = useState([]); const [menuItemAdded, setMenuItemAdded] = useState(false); - const poiLayerVisible = useRecoilValue(poiLayerVisibleState); + + // ✅ Redux: Zustand der Sichtbarkeit des POI-Layers + const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible); useEffect(() => { const fetchPoiTypData = async () => { @@ -51,8 +52,6 @@ export const useMapComponentState = () => { try { const protocol = window.location.protocol; const host = window.location.hostname; - - // WebService läuft immer auf Port 80 (kein :port anhängen) const apiBaseUrl = `${protocol}//${host}/talas5/ClientData/WebServiceMap.asmx`; const params = new URLSearchParams(window.location.search); @@ -62,7 +61,6 @@ export const useMapComponentState = () => { console.log("🌐 Geräte-API:", url); const response = await fetch(url); - const data = await response.json(); setLocationDeviceData(data.Points || []); diff --git a/redux/slices/poiLayerVisibleSlice.js b/redux/slices/poiLayerVisibleSlice.js index 2fe18c1de..9efb2a4a3 100644 --- a/redux/slices/poiLayerVisibleSlice.js +++ b/redux/slices/poiLayerVisibleSlice.js @@ -1,9 +1,22 @@ // /redux/slices/poiLayerVisibleSlice.js -// Recoil atom for the visibility of the POI layer -// -import { atom } from "recoil"; +import { createSlice } from "@reduxjs/toolkit"; -export const poiLayerVisibleState = atom({ - key: "poiLayerVisibleState", - default: true, +const initialState = { + visible: true, +}; + +export const poiLayerVisibleSlice = createSlice({ + name: "poiLayerVisible", + initialState, + reducers: { + setVisible: (state, action) => { + state.visible = action.payload; + }, + toggleVisible: (state) => { + state.visible = !state.visible; + }, + }, }); + +export const { setVisible, toggleVisible } = poiLayerVisibleSlice.actions; +export default poiLayerVisibleSlice.reducer; diff --git a/redux/store.js b/redux/store.js index ae76726e1..48076da1f 100644 --- a/redux/store.js +++ b/redux/store.js @@ -15,6 +15,7 @@ import polylineContextMenuReducer from "./slices/polylineContextMenuSlice"; import selectedPoiReducer from "./slices/selectedPoiSlice"; import selectedDeviceReducer from "./slices/selectedDeviceSlice"; import mapLayersReducer from "./slices/mapLayersSlice"; +import poiLayerVisibleReducer from "./slices/poiLayerVisibleSlice"; export const store = configureStore({ reducer: { @@ -33,5 +34,6 @@ export const store = configureStore({ selectedPoi: selectedPoiReducer, selectedDevice: selectedDeviceReducer, mapLayers: mapLayersReducer, + poiLayerVisible: poiLayerVisibleReducer, }, });