feat: Add persistent localStorage for Kabelstrecken (polylines) visibility

- Add kabelstreckenVisible state with localStorage persistence
- Implement dual localStorage variables (kabelstreckenVisible + polylineVisible) for compatibility
- Add event system for cross-component polyline visibility updates
- Update MapComponent to listen for polylineVisibilityChanged events
- Ensure polylines display correctly on browser reload
- Migrate from Redux-only state to localStorage-first approach
- Add comprehensive debug logging for troubleshooting

Fixes issue where Kabelstrecken checkbox state was lost on page reload
and polylines were not displayed until manual toggle.
This commit is contained in:
ISA
2025-07-25 13:09:18 +02:00
parent 56a2e305f1
commit 9d7a696f91
7 changed files with 117 additions and 20 deletions

View File

@@ -2,7 +2,8 @@
import { createSlice } from "@reduxjs/toolkit";
const initialState = {
visible: false, // oder Standardwert
visible: false, // Standardwert - wird in der Komponente aus localStorage überschrieben
isInitialized: false, // Flag um zu verfolgen, ob der Wert aus localStorage geladen wurde
};
const polylineLayerVisibleSlice = createSlice({
@@ -11,11 +12,21 @@ const polylineLayerVisibleSlice = createSlice({
reducers: {
setPolylineVisible: (state, action) => {
state.visible = action.payload;
localStorage.setItem("polylineVisible", action.payload);
state.isInitialized = true;
localStorage.setItem("polylineVisible", action.payload.toString());
console.log("💾 Redux: setPolylineVisible called with:", action.payload);
},
initializePolylineFromLocalStorage: (state, action) => {
// Diese Action wird nur beim Initialisieren aus localStorage verwendet
state.visible = action.payload;
state.isInitialized = true;
console.log("🔧 Redux: initializePolylineFromLocalStorage called with:", action.payload);
},
},
});
export const { setPolylineVisible } = polylineLayerVisibleSlice.actions;
export const selectPolylineVisible = (state) => state.polylineLayerVisible.visible;
export const { setPolylineVisible, initializePolylineFromLocalStorage } =
polylineLayerVisibleSlice.actions;
export const selectPolylineVisible = state => state.polylineLayerVisible.visible;
export const selectPolylineInitialized = state => state.polylineLayerVisible.isInitialized;
export default polylineLayerVisibleSlice.reducer;