WIP: Bereich wird angezeigt, aber da ist noch ein Bug, Talas Marker erscheint trotz Checkbox ausgecheckt

components/DataSheet.js

@@ -20,6 +20,7 @@ function DataSheet() {
   const GisSystemStatic = useRecoilValue(gisSystemStaticState);
   const setZoomTrigger = useSetRecoilState(zoomTriggerState);
   const [polylineVisible, setPolylineVisible] = useRecoilState(polylineLayerVisibleState); // Zustand für Polylines
+  const [bereicheVisible, setBereicheVisible] = useState(false); // NEU: Bereiche-Status
   useEffect(() => {
     // LocalStorage Werte laden
     const storedPoiVisible = localStorage.getItem("poiVisible");
@@ -113,6 +114,12 @@ function DataSheet() {
     localStorage.setItem("polylineVisible", checked); // Store Polyline visibility in localStorage
   };
   //---------------------------
+  const handleBereicheCheckboxChange = (event) => {
+    if (editMode) return;
+    const { checked } = event.target;
+    setBereicheVisible(checked);
+    localStorage.setItem("bereicheVisible", checked);
+  };
 
   //---------------------------
   return (
@@ -163,6 +170,13 @@ function DataSheet() {
               Kabelstrecken
             </label>
           </div>
+          {/* Bereiche */}
+          <div className="flex items-center">
+            <input type="checkbox" checked={bereicheVisible} onChange={handleBereicheCheckboxChange} id="bereiche-checkbox" disabled={editMode} />
+            <label htmlFor="bereiche-checkbox" className="text-sm ml-2">
+              Bereiche
+            </label>
+          </div>
         </div>
       </div>
     </div>