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:
@@ -635,11 +635,40 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
|
||||
|
||||
//--------------------------------------------
|
||||
// Beim ersten Client-Render den Wert aus localStorage laden
|
||||
// Prüfe beide localStorage-Variablen (neue und alte)
|
||||
useEffect(() => {
|
||||
const storedPolylineVisible = localStorage.getItem("polylineVisible") === "true";
|
||||
let storedPolylineVisible = localStorage.getItem("kabelstreckenVisible") === "true";
|
||||
|
||||
// Fallback auf alte Variable, falls neue nicht existiert
|
||||
if (localStorage.getItem("kabelstreckenVisible") === null) {
|
||||
const oldValue = localStorage.getItem("polylineVisible") === "true";
|
||||
storedPolylineVisible = oldValue;
|
||||
// Migriere zur neuen Variable
|
||||
localStorage.setItem("kabelstreckenVisible", oldValue.toString());
|
||||
}
|
||||
|
||||
console.log(
|
||||
"🔄 MapComponent: Loading polylineVisible from localStorage:",
|
||||
storedPolylineVisible
|
||||
);
|
||||
dispatch(setPolylineVisible(storedPolylineVisible));
|
||||
}, [dispatch]);
|
||||
//--------------------------------------------
|
||||
// Event-Listener für Polyline-Sichtbarkeitsänderungen
|
||||
useEffect(() => {
|
||||
const handlePolylineVisibilityChange = () => {
|
||||
const storedValue = localStorage.getItem("kabelstreckenVisible") === "true";
|
||||
console.log("🔄 MapComponent: Received polylineVisibilityChanged event, value:", storedValue);
|
||||
dispatch(setPolylineVisible(storedValue));
|
||||
};
|
||||
|
||||
window.addEventListener("polylineVisibilityChanged", handlePolylineVisibilityChange);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("polylineVisibilityChanged", handlePolylineVisibilityChange);
|
||||
};
|
||||
}, [dispatch]);
|
||||
//--------------------------------------------
|
||||
useEffect(() => {
|
||||
if (statusStaticDistrict === "idle") {
|
||||
dispatch(fetchGisStationsStaticDistrictThunk());
|
||||
|
||||
Reference in New Issue
Block a user