From e7192a7623d096709010e6ca7841112ed897a51e Mon Sep 17 00:00:00 2001 From: ISA Date: Thu, 21 Aug 2025 14:00:09 +0200 Subject: [PATCH] WIP: Kabelstrecken wird deaktiviert beim neuladen der Seite --- .env.development | 2 +- .env.production | 2 +- components/mainComponent/MapComponent.js | 5 ++- .../MapLayersControlPanel.js | 29 +++------------ package-lock.json | 4 +-- package.json | 2 +- .../polylines/polylineLayerVisibleSlice.js | 36 ++++++++++++++++++- 7 files changed, 49 insertions(+), 31 deletions(-) diff --git a/.env.development b/.env.development index 465b883ed..4608a2e30 100644 --- a/.env.development +++ b/.env.development @@ -24,4 +24,4 @@ NEXT_PUBLIC_USE_MOCKS=true # z.B. http://10.10.0.13/xyz/index.aspx -> basePath in config.json auf /xyz setzen # basePath wird jetzt in public/config.json gepflegt # App-Versionsnummer -NEXT_PUBLIC_APP_VERSION=1.1.336 +NEXT_PUBLIC_APP_VERSION=1.1.337 diff --git a/.env.production b/.env.production index 914a362b0..940a67e73 100644 --- a/.env.production +++ b/.env.production @@ -25,4 +25,4 @@ NEXT_PUBLIC_USE_MOCKS=false # basePath wird jetzt in public/config.json gepflegt # App-Versionsnummer -NEXT_PUBLIC_APP_VERSION=1.1.336 +NEXT_PUBLIC_APP_VERSION=1.1.337 diff --git a/components/mainComponent/MapComponent.js b/components/mainComponent/MapComponent.js index ef520a914..35dbe1b37 100644 --- a/components/mainComponent/MapComponent.js +++ b/components/mainComponent/MapComponent.js @@ -54,6 +54,7 @@ import { import { selectPolylineVisible, setPolylineVisible, + initializePolylineFromLocalStorageThunk, } from "@/redux/slices/database/polylines/polylineLayerVisibleSlice.js"; import { selectGisStationsStaticDistrict } from "@/redux/slices/webservice/gisStationsStaticDistrictSlice.js"; import { @@ -263,8 +264,10 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => { `📝 Keine gespeicherten Einstellungen für Map ${mapId}/User ${userId} gefunden` ); } + // Redux Polyline Sichtbarkeit initialisieren (map/user spezifisch) + dispatch(initializePolylineFromLocalStorageThunk()); } - }, []); // Nur einmal beim Mount ausführen useEffect(() => { + }, [dispatch]); // Nur einmal beim Mount ausführen useEffect(() => { if (linesData && Array.isArray(linesData)) { const transformed = linesData.map(item => ({ diff --git a/components/uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js b/components/uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js index e29bb9466..561327fbf 100644 --- a/components/uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js +++ b/components/uiWidgets/mapLayersControlPanel/MapLayersControlPanel.js @@ -16,7 +16,7 @@ import { incrementZoomTrigger } from "@/redux/slices/zoomTriggerSlice"; function MapLayersControlPanel() { const [editMode, setEditMode] = useState(false); // Zustand für editMode const [localStorageLoaded, setLocalStorageLoaded] = useState(false); // Tracking ob localStorage geladen wurde - const [kabelstreckenVisible, setKabelstreckenVisible] = useState(false); // Lokaler State für Kabelstrecken + const kabelstreckenVisible = useSelector(selectPolylineVisible); // Redux State für Kabelstrecken const poiVisible = useSelector(state => state.poiLayerVisible.visible); const setPoiVisible = value => dispatch(setVisible(value)); const dispatch = useDispatch(); @@ -40,9 +40,7 @@ function MapLayersControlPanel() { const handlePolylineCheckboxChange = event => { const checked = event.target.checked; - setKabelstreckenVisible(checked); - localStorage.setItem("kabelstreckenVisible", checked.toString()); - localStorage.setItem("polylineVisible", checked.toString()); + dispatch(setPolylineVisible(checked)); dispatch(setPolylineVisible(checked)); setTimeout(() => { const event = new Event("polylineVisibilityChanged"); @@ -75,23 +73,7 @@ function MapLayersControlPanel() { const mapStorageKey = mapId && userId ? `mapLayersVisibility_m${mapId}_u${userId}` : "mapLayersVisibility"; - // Kabelstrecken-Checkbox initialisieren - let storedKabelstreckenVisible = localStorage.getItem("kabelstreckenVisible"); - const storedPolylineVisible = localStorage.getItem("polylineVisible"); - if (storedKabelstreckenVisible === null && storedPolylineVisible !== null) { - storedKabelstreckenVisible = storedPolylineVisible; - localStorage.setItem("kabelstreckenVisible", storedPolylineVisible); - } - if (storedKabelstreckenVisible !== null) { - const shouldBeVisible = storedKabelstreckenVisible === "true"; - setKabelstreckenVisible(shouldBeVisible); - localStorage.setItem("polylineVisible", shouldBeVisible.toString()); - dispatch(setPolylineVisible(shouldBeVisible)); - setTimeout(() => { - const event = new Event("polylineVisibilityChanged"); - window.dispatchEvent(event); - }, 200); - } + // Kabelstrecken-Checkbox initialisieren: Redux übernimmt map/user-spezifisch, keine Manipulation von 'polylineVisible' oder 'kabelstreckenVisible' hier mehr! // mapLayersVisibility initialisieren const storedMapLayersVisibility = localStorage.getItem(mapStorageKey); @@ -187,8 +169,7 @@ function MapLayersControlPanel() { // Wenn TALAS (system-1) deaktiviert wird, Kabelstrecken deaktivieren if (key === "system-1" && !checked) { setKabelstreckenVisible(false); - localStorage.setItem("kabelstreckenVisible", "false"); - localStorage.setItem("polylineVisible", "false"); + // entfernt: keine Manipulation von 'kabelstreckenVisible' oder 'polylineVisible' mehr dispatch(setPolylineVisible(false)); setTimeout(() => { const polylineEvent = new Event("polylineVisibilityChanged"); @@ -333,7 +314,7 @@ function MapLayersControlPanel() {
dispatch => { + try { + const params = new URLSearchParams(window.location.search); + const mapId = params.get("m"); + const userId = params.get("u"); + if (mapId && userId) { + const key = `polylineVisible_m${mapId}_u${userId}`; + const stored = localStorage.getItem(key); + const visible = stored === "true"; + dispatch(initializePolylineFromLocalStorage(visible)); + // Optional: log for debugging + console.log( + `Redux: Initialized polyline visibility from localStorage key '${key}':`, + visible + ); + } + } catch (e) { + console.error("Error initializing polyline visibility from localStorage:", e); + } +}; + const initialState = { visible: false, // Standardwert - wird in der Komponente aus localStorage überschrieben isInitialized: false, // Flag um zu verfolgen, ob der Wert aus localStorage geladen wurde @@ -13,7 +36,18 @@ const polylineLayerVisibleSlice = createSlice({ setPolylineVisible: (state, action) => { state.visible = action.payload; state.isInitialized = true; - localStorage.setItem("polylineVisible", action.payload.toString()); + // Save to localStorage using mapId/userId key + try { + const params = new URLSearchParams(window.location.search); + const mapId = params.get("m"); + const userId = params.get("u"); + if (mapId && userId) { + const key = `polylineVisible_m${mapId}_u${userId}`; + localStorage.setItem(key, action.payload.toString()); + } + } catch (e) { + // fallback: do nothing + } console.log("💾 Redux: setPolylineVisible called with:", action.payload); }, initializePolylineFromLocalStorage: (state, action) => {