@geowiki/map 0.16.9-dev.8 → 0.16.9

package/dist/index.js

@@ -166,8 +166,7 @@ function getAdjPixel(y, x, selectedValue, array2dMatrix) {
   while (pixelsToCheck.length > 0) {
     const [xTiff, yTiff] = pixelsToCheck.pop();
     var key = xTiff + "_" + yTiff;
-    if (checkedPixels.has(key))
-      continue;
+    if (checkedPixels.has(key)) continue;
     checkedPixels.add(key);
     if (array2dMatrix[yTiff][xTiff] === selectedValue) {
       sameValPixels.push([yTiff, xTiff]);
@@ -195,8 +194,7 @@ function pointInsidePolygon(xTiff, yTiff, vs) {
     var xi = vs[i].xTiff, yi = vs[i].yTiff;
     var xj = vs[j].xTiff, yj = vs[j].yTiff;
     var intersect = yi > yTiff !== yj > yTiff && xTiff < (xj - xi) * (yTiff - yi) / (yj - yi) + xi;
-    if (intersect)
-      inside = !inside;
+    if (intersect) inside = !inside;
   }
   return inside;
 }
@@ -305,8 +303,8 @@ var init_canvas = __esm({
       ctx == null ? void 0 : ctx.putImageData(imageData, 0, 0);
       return canvas;
     };
-    getCanvasDataFromImageArray = (rasterItem, location, bounds, ndviImageCanvasContext, selectedBand) => __async(void 0, null, function* () {
-      var _a, _b;
+    getCanvasDataFromImageArray = (rasterItem, location, bounds, ndviImageCanvasContext, selectedBand) => __async(null, null, function* () {
+      var _a;
       try {
         var tiffWidth = rasterItem.width;
         var tiffHeight = rasterItem.height;
@@ -319,10 +317,9 @@ var init_canvas = __esm({
         );
         let selectedValue = raster[xTiff + yTiff * tiffWidth];
         var rgb = null;
-        if (((_a = rasterItem.name) == null ? void 0 : _a.toLowerCase().includes("ndvi")) && ((_b = rasterItem.name) == null ? void 0 : _b.toLowerCase().includes("perc")))
+        if ((_a = rasterItem.name) == null ? void 0 : _a.toLowerCase().includes("ndvi"))
           rgb = yield getNDVIValueForPixel(ndviImageCanvasContext, xTiff, yTiff);
-        else
-          rgb = null;
+        else rgb = null;
         return [
           selectedValue,
           rgb !== null && rgb !== void 0 ? {
@@ -365,12 +362,11 @@ var init_canvas = __esm({
         rasterItem.buffer = [...asset.buffer];
         rasterItem.uri = [...asset.uri];
         rasterItem.buffer[selectedBand] = new Uint32Array(assetBuffer);
-        if (Array.isArray(rasterItem.uri))
-          rasterItem.uri[selectedBand] = uri;
+        if (Array.isArray(rasterItem.uri)) rasterItem.uri[selectedBand] = uri;
       }
       return rasterItem;
     };
-    getEmptyPreviewRasterItem = (id, length, width, height, labels, isAnnualAnnotation, selectedBand, metadata) => __async(void 0, null, function* () {
+    getEmptyPreviewRasterItem = (id, length, width, height, labels, isAnnualAnnotation, selectedBand, metadata) => __async(null, null, function* () {
       var { newArray, canvas } = yield getEmptyPreviewRasterItemForInsert(
         length,
         width,
@@ -395,12 +391,12 @@ var init_canvas = __esm({
       }
       return rasterItem;
     });
-    getEmptyPreviewRasterItemForInsert = (length, width, height, labels) => __async(void 0, null, function* () {
+    getEmptyPreviewRasterItemForInsert = (length, width, height, labels) => __async(null, null, function* () {
       const newArray = new Uint32Array(length).fill(0);
       const canvas = grayScaleArrayToCanvas(newArray, width, height, labels);
       return { newArray, canvas };
     });
-    updatePreviewRasterFrom = (fromRasterItem, toPreviewRasterItem, isAnnualAnnotation) => __async(void 0, null, function* () {
+    updatePreviewRasterFrom = (fromRasterItem, toPreviewRasterItem, isAnnualAnnotation) => __async(null, null, function* () {
       var _a, _b, _c;
       if (!fromRasterItem) {
         return toPreviewRasterItem;
@@ -426,7 +422,7 @@ var init_canvas = __esm({
       }
       return toPreviewRasterItem;
     });
-    getRasterItemsNoColorMap = (arrayBuffer, labels) => __async(void 0, null, function* () {
+    getRasterItemsNoColorMap = (arrayBuffer, labels) => __async(null, null, function* () {
       const tiff = yield (0, import_geotiff.fromArrayBuffer)(arrayBuffer);
       const image = yield tiff.getImage();
       const pool = new import_geotiff.Pool();
@@ -450,7 +446,7 @@ var init_canvas = __esm({
       pool.destroy();
       return { width, height, rasterItems };
     });
-    getRasterItems = (arrayBuffer, projectType) => __async(void 0, null, function* () {
+    getRasterItems = (arrayBuffer, projectType) => __async(null, null, function* () {
       const tiff = yield (0, import_geotiff.fromArrayBuffer)(arrayBuffer);
       const image = yield tiff.getImage();
       const pool = new import_geotiff.Pool();
@@ -490,7 +486,7 @@ var init_canvas = __esm({
       pool.destroy();
       return { rasters, width, height, rasterItems };
     });
-    getAssetItemsForLocationAssets = (assets, labels) => __async(void 0, null, function* () {
+    getAssetItemsForLocationAssets = (assets, labels) => __async(null, null, function* () {
       var rasterItems = [];
       for (var i = 0; i < (assets == null ? void 0 : assets.length); i++) {
         const item = assets[i];
@@ -513,7 +509,7 @@ var init_canvas = __esm({
       }
       return rasterItems;
     });
-    getRasterAssetItemsForLocationComposite = (assets) => __async(void 0, null, function* () {
+    getRasterAssetItemsForLocationComposite = (assets) => __async(null, null, function* () {
       var rasterItems = [];
       for (var i = 0; i < (assets == null ? void 0 : assets.length); i++) {
         const item = assets[i];
@@ -534,7 +530,7 @@ var init_canvas = __esm({
       }
       return rasterItems;
     });
-    copyAllRasterSegments = (rasterItem, previewRasterItem, selectedValue, labelValue, labels) => __async(void 0, null, function* () {
+    copyAllRasterSegments = (rasterItem, previewRasterItem, selectedValue, labelValue, labels) => __async(null, null, function* () {
       var newBuffer = overwriteArrayBufferWithSelectedValue(
         rasterItem.buffer,
         previewRasterItem.buffer,
@@ -603,7 +599,7 @@ var init_canvas = __esm({
         return destRasterItem;
       }
     };
-    paintRasterSegment = (sourceRasterItem, destRasterItem, locations, bounds, labelValue, labels, paintType, selectedBand, isAnnualAnnotation) => __async(void 0, null, function* () {
+    paintRasterSegment = (sourceRasterItem, destRasterItem, locations, bounds, labelValue, labels, paintType, selectedBand, isAnnualAnnotation) => __async(null, null, function* () {
       var tiffWidth = sourceRasterItem.width;
       var tiffHeight = sourceRasterItem.height;
       var annotatedRaster = isAnnualAnnotation ? destRasterItem.buffer : destRasterItem.buffer[selectedBand];
@@ -720,7 +716,7 @@ var init_canvas = __esm({
       destRasterItem.name = "My Annotation";
       return destRasterItem;
     });
-    getActiveLearningAnnotation = (assetHref, projectType) => __async(void 0, null, function* () {
+    getActiveLearningAnnotation = (assetHref, projectType) => __async(null, null, function* () {
       const res = yield fetch(assetHref);
       const buffer = yield res.arrayBuffer();
       const rItems = yield getRasterItems(buffer, projectType);
@@ -737,7 +733,7 @@ var init_canvas = __esm({
       };
       return assetItem;
     });
-    createImageDataForNDVI = (asset) => __async(void 0, null, function* () {
+    createImageDataForNDVI = (asset) => __async(null, null, function* () {
       var canvas = document.createElement("canvas");
       var context = canvas.getContext("2d");
       var image = new Image();
@@ -747,7 +743,7 @@ var init_canvas = __esm({
       context == null ? void 0 : context.drawImage(image, 0, 0, canvas.width, canvas.height);
       return context;
     });
-    getNDVIValueForPixel = (ndviImageCanvasContext, x, y) => __async(void 0, null, function* () {
+    getNDVIValueForPixel = (ndviImageCanvasContext, x, y) => __async(null, null, function* () {
       var context = ndviImageCanvasContext;
       var data = context == null ? void 0 : context.getImageData(x, y, 1, 1).data;
       return data;
@@ -961,8 +957,7 @@ function getRasterAssetItemsForLocationAssets(assets) {
       if (Array.isArray((_a = rItem.result) == null ? void 0 : _a.base64)) {
         bufferData = (_b = rItem.result) == null ? void 0 : _b.base64.map((x) => {
           var _a2, _b2;
-          if (((_a2 = rItem.result) == null ? void 0 : _a2.arrayType) == "uint8")
-            return Buffer.from(x, "base64");
+          if (((_a2 = rItem.result) == null ? void 0 : _a2.arrayType) == "uint8") return Buffer.from(x, "base64");
           else if (((_b2 = rItem.result) == null ? void 0 : _b2.arrayType) == "uint32") {
             const buffer2 = Buffer.from(x, "base64");
             return new Uint32Array(
@@ -1043,16 +1038,14 @@ function ClearAnnotation(annotatedRasterAsset, isAnnualAnnotation, selectedBand,
       selectedBand,
       annotationRasterAsset.metadata
     );
-    if (isAnnualAnnotation)
-      return { annotationRaster, pastValues };
+    if (isAnnualAnnotation) return { annotationRaster, pastValues };
     else {
       var multiBandAnnotation = annotatedRasterAsset;
       if (multiBandAnnotation == null ? void 0 : multiBandAnnotation.buffer[selectedBand]) {
         multiBandAnnotation.buffer[selectedBand] = annotationRaster.buffer[selectedBand];
         multiBandAnnotation.uri[selectedBand] = annotationRaster.uri[selectedBand];
         return { multiBandAnnotation, undefined: void 0 };
-      } else
-        return { annotatedRasterAsset: void 0, undefined: void 0 };
+      } else return { annotatedRasterAsset: void 0, undefined: void 0 };
     }
   });
 }
@@ -1086,8 +1079,7 @@ function createTask(locationId, projectId, referenceDate) {
         currentTask: res.task,
         annotation_dates: yield getAnnotationDates(res == null ? void 0 : res.task)
       };
-    } else
-      return { location: null, currentTask: null, annotation_dates: null };
+    } else return { location: null, currentTask: null, annotation_dates: null };
   });
 }
 function getTask(taskId) {
@@ -1115,8 +1107,7 @@ function getTask(taskId) {
         annotation_dates: yield getAnnotationDates(res == null ? void 0 : res.task),
         location: locData
       };
-    } else
-      return { currentTask: null, annotation_dates: null, location: null };
+    } else return { currentTask: null, annotation_dates: null, location: null };
   });
 }
 function getActiveLearningAnnotationAsset(assetHref, labels, projectDetail) {
@@ -1168,8 +1159,7 @@ function insertEmptyBufferForSingleBand(length, width, height, selectedBand, ann
       annotatedAsset.buffer[selectedBand] = newArray;
       annotatedAsset.uri[selectedBand] = canvas.toDataURL();
       return annotatedAsset;
-    } else
-      return null;
+    } else return null;
   });
 }
 function getTaskChangeDetails(taskId) {
@@ -1183,10 +1173,8 @@ function getTaskGeometryDetail(taskId) {
   });
 }
 function getCentroid(geometry, has_area_of_interest, geometry_aoi, is_segment, geometry_segment) {
-  if (has_area_of_interest)
-    return geometry_aoi;
-  if (is_segment)
-    return geometry_segment;
+  if (has_area_of_interest) return geometry_aoi;
+  if (is_segment) return geometry_segment;
   return geometry;
 }
 function showAnnotation(savedAnnotations, submittedAnnotations, annotatedRasterAsset) {
@@ -1270,7 +1258,10 @@ var init_evoland = __esm({
       isAnnualAnnotation: true,
       selectedBand: void 0,
       taskGeometry: null,
-      task_for_review: false
+      task_for_review: false,
+      s2_tile_url: null,
+      landsat_tile_url: null,
+      selectedBaseLayer: null
     };
     useEvolandStore = (0, import_zustand.create)()((set) => ({
       clickPoint: null,
@@ -1323,10 +1314,13 @@ var init_evoland = __esm({
       selectedBand: void 0,
       taskGeometry: null,
       task_for_review: false,
+      s2_tile_url: null,
+      landsat_tile_url: null,
+      selectedBaseLayer: null,
       setSelectedRasterAsset: (selectedRaster) => {
         var _a;
         set({ selectedRasterAsset: selectedRaster });
-        if ((selectedRaster == null ? void 0 : selectedRaster.type) == "SEGMENTATION_MASK" /* SegmentationMask */ && ((_a = selectedRaster == null ? void 0 : selectedRaster.name) == null ? void 0 : _a.toLowerCase().includes("ndvi perc"))) {
+        if ((selectedRaster == null ? void 0 : selectedRaster.type) == "SEGMENTATION_MASK" /* SegmentationMask */ && ((_a = selectedRaster == null ? void 0 : selectedRaster.name) == null ? void 0 : _a.toLowerCase().includes("ndvi"))) {
           createImageDataForNDVI(selectedRaster).then((res) => {
             set({ ndviImageCanvasContext: res });
           });
@@ -1334,9 +1328,9 @@ var init_evoland = __esm({
       },
       setAnnotationUndoRedo: (annotationUndoRedo, annotatedRasterAsset) => set({ annotationUndoRedo, annotatedRasterAsset }),
       setSelectedCompositeRasterAsset: (selectedRaster) => {
-        var _a, _b;
+        var _a;
         set({ selectedCompositeRasterAsset: selectedRaster });
-        if ((selectedRaster == null ? void 0 : selectedRaster.type) == "COMPOSITE" /* Composite */ && selectedRaster.isInteractive && ((_a = selectedRaster == null ? void 0 : selectedRaster.name) == null ? void 0 : _a.toLowerCase().includes("ndvi")) && ((_b = selectedRaster == null ? void 0 : selectedRaster.name) == null ? void 0 : _b.toLowerCase().includes("perc"))) {
+        if ((selectedRaster == null ? void 0 : selectedRaster.type) == "COMPOSITE" /* Composite */ && selectedRaster.isInteractive && ((_a = selectedRaster == null ? void 0 : selectedRaster.name) == null ? void 0 : _a.toLowerCase().includes("ndvi"))) {
           createImageDataForNDVI(selectedRaster).then((res) => {
             set({ ndviImageCanvasContext: res });
           });
@@ -1347,7 +1341,7 @@ var init_evoland = __esm({
       setRecenterLocation: () => set({ recenterLocation: false }),
       setTimerReset: (timerreset) => set({ timerReset: timerreset }),
       setAnnotationTime: (annotationtime) => set({ annotationTime: annotationtime }),
-      onLocationSelected: (point3) => __async(void 0, null, function* () {
+      onLocationSelected: (point3) => __async(null, null, function* () {
         var data = yield import_evoland_api_proxy2.LocationService.getPolygonUtmlocationLonLonLatLatWidthWidthHeightHeightGet(
           point3.lng,
           point3.lat,
@@ -1373,10 +1367,10 @@ var init_evoland = __esm({
           location: locData
         });
       }),
-      onRecenterLocation: () => __async(void 0, null, function* () {
+      onRecenterLocation: () => __async(null, null, function* () {
         return set({ recenterLocation: true });
       }),
-      getLocationAssets: (locationId, projectId, type, taskId) => __async(void 0, null, function* () {
+      getLocationAssets: (locationId, projectId, type, taskId) => __async(null, null, function* () {
         var _a, _b;
         const state = useEvolandStore.getState();
         var {
@@ -1499,12 +1493,16 @@ var init_evoland = __esm({
         }
         return [];
       }),
-      getLocationDetails: (locationId, projectId, user, taskId, isAdmin) => __async(void 0, null, function* () {
+      getLocationDetails: (locationId, projectId, user, taskId, isAdmin) => __async(null, null, function* () {
         var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
         var state = useEvolandStore.getState();
         var { referenceDate, reference_dates, sessionTimeOut, projectDetail, task_for_review } = state;
-        if (!referenceDate)
+        if (!referenceDate) {
           referenceDate = projectDetail.project_reference_date.toString();
+          set({
+            referenceDate
+          });
+        }
         var annotationDates = null;
         var locationreq = {
           location_id: locationId,
@@ -1588,7 +1586,7 @@ var init_evoland = __esm({
           }
         }
       }),
-      getNextLocationDetails: (projectId) => __async(void 0, null, function* () {
+      getNextLocationDetails: (projectId) => __async(null, null, function* () {
         var _a, _b, _c;
         set({ isLoading: true });
         var state = useEvolandStore.getState();
@@ -1657,7 +1655,7 @@ var init_evoland = __esm({
       setOpacity: (opacity) => set({ opacity }),
       setCompositeOpacity: (opacity) => set({ compositeOpacity: opacity }),
       setAnnotationOpacity: (opacity) => set({ annotationOpacity: opacity }),
-      addLabel: (loc, bounds, label) => __async(void 0, null, function* () {
+      addLabel: (loc, bounds, label) => __async(null, null, function* () {
         var _a;
         set({ isLoading: true });
         var store = useEvolandStore.getState();
@@ -1717,14 +1715,14 @@ var init_evoland = __esm({
       setShowTimeSeries: (value) => set({ showTimeSeries: value }),
       reset: () => set(initialState),
       setSelectedColorLabel: (label) => set({ selectedColorLabel: label }),
-      getLegendsDetails: (array) => __async(void 0, null, function* () {
+      getLegendsDetails: (array) => __async(null, null, function* () {
         var store = useEvolandStore.getState();
         var legends = yield getLegends(array, store.labels);
         set({
           legends
         });
       }),
-      getLocationMetaData: (locationId, projectId, taskId) => __async(void 0, null, function* () {
+      getLocationMetaData: (locationId, projectId, taskId) => __async(null, null, function* () {
         var _a, _b;
         set({ isLoading: true });
         var state = useEvolandStore.getState();
@@ -1750,7 +1748,7 @@ var init_evoland = __esm({
             set({ sessionTimeOut: true, isLoading: false });
         }
       }),
-      getLabels: (projectId) => __async(void 0, null, function* () {
+      getLabels: (projectId) => __async(null, null, function* () {
         var state = useEvolandStore.getState();
         if (state.labels) {
           return state.labels;
@@ -1772,10 +1770,10 @@ var init_evoland = __esm({
         });
         return allLabels;
       }),
-      setBrushThickness: (value) => __async(void 0, null, function* () {
+      setBrushThickness: (value) => __async(null, null, function* () {
         return set({ brushThickness: value });
       }),
-      getProjectDetail: (projectId) => __async(void 0, null, function* () {
+      getProjectDetail: (projectId) => __async(null, null, function* () {
         set({ isLoading: true });
         const projectInfo = yield import_evoland_api_proxy2.ProjectService.projectDetailProjectdetailProjectIdProjectIdGet(
           projectId
@@ -1786,12 +1784,12 @@ var init_evoland = __esm({
           isAnnualAnnotation: (projectInfo == null ? void 0 : projectInfo.project_type) == "ANNUALLY" /* ANNUALLY */ ? true : false
         });
       }),
-      getTaskEvents: (taskId) => __async(void 0, null, function* () {
+      getTaskEvents: (taskId) => __async(null, null, function* () {
         set({ isLoading: true });
         const taskevents = yield import_evoland_api_proxy2.TaskService.getTaskEventsTaskeventsTaskIdTaskIdGet(taskId);
         set({ isLoading: false, taskEvents: taskevents });
       }),
-      getTaskAnnotation: (submittedAnnotationAsset, assetType) => __async(void 0, null, function* () {
+      getTaskAnnotation: (submittedAnnotationAsset, assetType) => __async(null, null, function* () {
         var _a, _b, _c;
         if (submittedAnnotationAsset != null && submittedAnnotationAsset.length > 0) {
           const state = useEvolandStore.getState();
@@ -1841,7 +1839,7 @@ var init_evoland = __esm({
       setCurrentPosition: (position) => set({ currentPosition: position }),
       setSessionTimeOut: (hasTimeOut) => set({ sessionTimeOut: hasTimeOut }),
       setLatestTaskAnnotation: (locationTask) => set({ latestTaskAnnotation: locationTask }),
-      getTaskReferenceDates: (projectId, locatioId, asset_type, setSelected) => __async(void 0, null, function* () {
+      getTaskReferenceDates: (projectId, locatioId, asset_type, setSelected) => __async(null, null, function* () {
         const state = useEvolandStore.getState();
         const { annotation_dates, reference_dates, selectedReferenceDate } = state;
         var task_ref_dates = yield getRefDates(projectId, locatioId, asset_type);
@@ -1857,7 +1855,7 @@ var init_evoland = __esm({
             });
         }
       }),
-      setSelectedReferenceDate: (currentReferenceDate) => __async(void 0, null, function* () {
+      setSelectedReferenceDate: (currentReferenceDate) => __async(null, null, function* () {
         const state = useEvolandStore.getState();
         const { selectedReferenceDate, reference_dates } = state;
         if (currentReferenceDate !== selectedReferenceDate)
@@ -1866,53 +1864,62 @@ var init_evoland = __esm({
             selectedBand: reference_dates == null ? void 0 : reference_dates.indexOf(currentReferenceDate)
           });
       }),
-      setUpdateAsset: (updateAssets) => __async(void 0, null, function* () {
+      setUpdateAsset: (updateAssets) => __async(null, null, function* () {
         return set({ updateAssets });
       }),
-      setComment: (comment) => __async(void 0, null, function* () {
+      setComment: (comment) => __async(null, null, function* () {
         return set({ comment });
       }),
-      setAnnualAnnotation: (val) => __async(void 0, null, function* () {
+      setAnnualAnnotation: (val) => __async(null, null, function* () {
         return set({ isAnnualAnnotation: val });
       }),
-      setSelectedBand: (bandIndex) => __async(void 0, null, function* () {
+      setSelectedBand: (bandIndex) => __async(null, null, function* () {
         return set({ selectedBand: bandIndex });
       }),
-      setAnnotationDates: (annotationDates) => __async(void 0, null, function* () {
+      setAnnotationDates: (annotationDates) => __async(null, null, function* () {
         return set({ annotation_dates: annotationDates });
       }),
-      setSavedAnnotations: (savedAnnotation) => __async(void 0, null, function* () {
+      setSavedAnnotations: (savedAnnotation) => __async(null, null, function* () {
         return set({ savedAnnotations: savedAnnotation });
       }),
-      setLabelList: (labels) => __async(void 0, null, function* () {
+      setLabelList: (labels) => __async(null, null, function* () {
         return set({ labelList: labels });
       }),
-      setLocation: (loc) => __async(void 0, null, function* () {
+      setLocation: (loc) => __async(null, null, function* () {
         return set({ location: loc });
       }),
-      setCurrentTask: (task) => __async(void 0, null, function* () {
+      setCurrentTask: (task) => __async(null, null, function* () {
         return set({ currentTask: task });
       }),
-      setTimeSeriesTypes: (types) => __async(void 0, null, function* () {
+      setTimeSeriesTypes: (types) => __async(null, null, function* () {
         return set({ timeSeriesTypes: types });
       }),
-      setTimeSeriesAssets: (assets) => __async(void 0, null, function* () {
+      setTimeSeriesAssets: (assets) => __async(null, null, function* () {
         return set({ timeSeriesAssets: assets });
       }),
-      setActiveLearningAnnotations: (active_learning) => __async(void 0, null, function* () {
+      setActiveLearningAnnotations: (active_learning) => __async(null, null, function* () {
         return set({ activeLearningAnnotations: active_learning });
       }),
-      setSubmittedAnnotations: (submit_annotation) => __async(void 0, null, function* () {
+      setSubmittedAnnotations: (submit_annotation) => __async(null, null, function* () {
         return set({ submittedAnnotations: submit_annotation });
       }),
-      setAnnotatedRasterAsset: (annotated_raster) => __async(void 0, null, function* () {
+      setAnnotatedRasterAsset: (annotated_raster) => __async(null, null, function* () {
         return set({ annotatedRasterAsset: annotated_raster });
       }),
-      setTaskGeometry: (task_geometry) => __async(void 0, null, function* () {
+      setTaskGeometry: (task_geometry) => __async(null, null, function* () {
         return set({ taskGeometry: task_geometry });
       }),
       setTaskForReview(taskForReview) {
         set({ task_for_review: taskForReview });
+      },
+      setS2TileUrl(url) {
+        set({ s2_tile_url: url });
+      },
+      setLandsatTileUrl(url) {
+        set({ landsat_tile_url: url });
+      },
+      setSelectedBaseLayer(baseLayer) {
+        set({ selectedBaseLayer: baseLayer });
       }
     }));
     evoland_default = useEvolandStore;
@@ -2039,8 +2046,7 @@ var init_TiffImage = __esm({
                         } else if (localcomment !== void 0 && (localcomment == null ? void 0 : localcomment.includes("#" + x))) {
                           localcomment = localcomment.replace(" #" + x, "");
                           this.className = "rounded-xl flex inline-flex text-secondary p-1 text-sm";
-                        } else
-                          localcomment = "#" + x + " ";
+                        } else localcomment = "#" + x + " ";
                         if (evolandStore.comment !== void 0 && evolandStore.comment !== null && !((_a5 = evolandStore.comment) == null ? void 0 : _a5.includes("#" + x)))
                           evolandStore.setComment(
                             evolandStore.comment + localcomment
@@ -2049,8 +2055,7 @@ var init_TiffImage = __esm({
                           evolandStore.setComment(
                             evolandStore.comment.replace(" #" + x, "")
                           );
-                        else
-                          evolandStore.setComment(localcomment);
+                        else evolandStore.setComment(localcomment);
                       });
                       container.appendChild(content);
                     }
@@ -2091,7 +2096,7 @@ var init_TiffImage = __esm({
             bubblingMouseEvents: false,
             className: "border-2 border-blue-600"
           }).bringToFront();
-          imageOverlay3.on("mouseover", (e) => __async(void 0, null, function* () {
+          imageOverlay3.on("mouseover", (e) => __async(null, null, function* () {
             var _a3, _b2;
             if (isBrush()) {
               tooltip2 = L.tooltip({ offset: L.point(20, 0), opacity: 0.6 }).setContent(
@@ -2113,21 +2118,20 @@ var init_TiffImage = __esm({
               ).setLatLng(e.latlng).addTo(map);
             }
           }));
-          imageOverlay3.on("mousemove", (e) => __async(void 0, null, function* () {
+          imageOverlay3.on("mousemove", (e) => __async(null, null, function* () {
             evolandStore.setNDVIRGBValues(ndvi);
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
             if (isDrawing) {
               handleMouseMove(e);
             }
           }));
-          imageOverlay3.on("mouseout", () => __async(void 0, null, function* () {
+          imageOverlay3.on("mouseout", () => __async(null, null, function* () {
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
           }));
-          imageOverlay3.on("click", (e) => __async(void 0, null, function* () {
+          imageOverlay3.on("click", (e) => __async(null, null, function* () {
             var _a3, _b2, _c2;
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
-            if (((_a3 = evolandStore.selectedRasterAsset) == null ? void 0 : _a3.type) == "CHANGE_SEGMENTATION_MASK" /* ChangeSegmentationMask */)
-              return;
+            if (((_a3 = evolandStore.selectedRasterAsset) == null ? void 0 : _a3.type) == "CHANGE_SEGMENTATION_MASK" /* ChangeSegmentationMask */) return;
             if (evolandStore.selectedColorLabel == null && evolandStore.selectedToolType !== 6 /* ClearSegmentWithPolygon */) {
               alert("Please select label");
               return;
@@ -2174,25 +2178,23 @@ var init_TiffImage = __esm({
             opacity: 0.8,
             lineCap: "round"
           }).addTo(map);
-          polyLine.on("click", () => __async(void 0, null, function* () {
+          polyLine.on("click", () => __async(null, null, function* () {
             stopPaint();
           }));
-          polyLine.on("mouseover", (e) => __async(void 0, null, function* () {
+          polyLine.on("mouseover", (e) => __async(null, null, function* () {
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
             tooltip2 = L.tooltip({ offset: L.point(20, 0), opacity: 0.6 }).setContent("Click to Stop").setLatLng(e.latlng).addTo(map);
           }));
-          polyLine.on("mousemove", () => __async(void 0, null, function* () {
+          polyLine.on("mousemove", () => __async(null, null, function* () {
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
           }));
-          polyLine.on("mouseout", () => __async(void 0, null, function* () {
+          polyLine.on("mouseout", () => __async(null, null, function* () {
             tooltip2 == null ? void 0 : tooltip2.removeFrom(map);
           }));
         }
         return () => {
-          if (imageOverlay3)
-            map.removeLayer(imageOverlay3);
-          if (tagsPopUp)
-            map.removeLayer(tagsPopUp);
+          if (imageOverlay3) map.removeLayer(imageOverlay3);
+          if (tagsPopUp) map.removeLayer(tagsPopUp);
           if (rectangle3 && evolandStore.isAnnualAnnotation)
             map.removeLayer(rectangle3);
           if (polyLine !== void 0) {
@@ -2299,7 +2301,7 @@ var init_ReadOnlyTiffImage = __esm({
             bubblingMouseEvents: false,
             className: "border-2 border-blue-600"
           }).bringToBack();
-          imageOverlay3.on("mouseover", (e) => __async(void 0, null, function* () {
+          imageOverlay3.on("mouseover", (e) => __async(null, null, function* () {
             var data = yield getCanvasDataFromImageArray(
               props.raster,
               e.latlng,
@@ -2309,7 +2311,7 @@ var init_ReadOnlyTiffImage = __esm({
             );
             setNDVI(data[1]);
           }));
-          imageOverlay3.on("mousemove", () => __async(void 0, null, function* () {
+          imageOverlay3.on("mousemove", () => __async(null, null, function* () {
             evolandStore.setNDVIRGBValues(ndvi);
           }));
           imageOverlay3.addTo(map);
@@ -2327,12 +2329,9 @@ var init_ReadOnlyTiffImage = __esm({
           }).addTo(map);
         }
         return () => {
-          if (imageOverlay3)
-            map.removeLayer(imageOverlay3);
-          if (rectangle3 && showRectangleAtCenter)
-            map.removeLayer(rectangle3);
-          if (props.polygonBounds)
-            map.removeLayer(polygon_segment);
+          if (imageOverlay3) map.removeLayer(imageOverlay3);
+          if (rectangle3 && showRectangleAtCenter) map.removeLayer(rectangle3);
+          if (props.polygonBounds) map.removeLayer(polygon_segment);
         };
       }, [props, map, showRectangleAtCenter]);
       return null;
@@ -2619,8 +2618,7 @@ var init_EvolandContainer = __esm({
     import_jsx_runtime4 = require("react/jsx-runtime");
     EvolandContainer = ({ sessionStatus }) => {
       const evolandStore = useEvolandStore();
-      if (sessionStatus === "unauthenticated")
-        return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ui.AuthenticationFailure, {});
+      if (sessionStatus === "unauthenticated") return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_ui.AuthenticationFailure, {});
       return evolandStore.location && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(EvoLandGeometry, {});
     };
   }
@@ -2838,8 +2836,7 @@ var init_MapUtils = __esm({
     };
     excludedProperties = /* @__PURE__ */ new Set(["bbox", "geometry", "type"]);
     formatValue = (value) => {
-      if (value === null || value === void 0)
-        return "";
+      if (value === null || value === void 0) return "";
       if (typeof value === "number") {
         return value.toLocaleString();
       }
@@ -3026,8 +3023,7 @@ var init_BetterWMS = __esm({
        * Builds the URL for the GetFeatureInfo WMS request
        */
       getFeatureInfoUrl(latlng) {
-        if (!this.currentMap)
-          return null;
+        if (!this.currentMap) return null;
         const point3 = this.currentMap.latLngToContainerPoint(latlng);
         const size = this.currentMap.getSize();
         const wmsParams = this.wmsParams;
@@ -3096,8 +3092,7 @@ var init_BetterWMS = __esm({
           return;
         }
         this.geoJsonLayer.addData(content);
-        if (!this.currentMap)
-          return;
+        if (!this.currentMap) return;
         if (this.currentPopup) {
           this.currentMap.closePopup(this.currentPopup);
         }
@@ -3114,8 +3109,7 @@ var init_BetterWMS = __esm({
        * Show loading popup
        */
       showLoading(latlng) {
-        if (!this.currentMap || this.loading || !this.canShowLoading)
-          return;
+        if (!this.currentMap || this.loading || !this.canShowLoading) return;
         this.loading = true;
         this.currentPopup = import_leaflet4.default.popup(this.popupOptions).setLatLng(latlng).setContent(this.loadingContent).openOn(this.currentMap);
       }
@@ -3126,8 +3120,7 @@ var init_BetterWMS = __esm({
         return __async(this, null, function* () {
           var _a, _b, _c;
           const url = this.getFeatureInfoUrl(event.latlng);
-          if (!url)
-            return;
+          if (!url) return;
           try {
             this.showLoading(event.latlng);
             const data = yield this.fetchWithRetry(url);
@@ -3196,7 +3189,7 @@ function getPropsAndEvents(props) {
 }
 function createMarkerClusterGroup(props, context) {
   const { clusterProps, clusterEvents } = getPropsAndEvents(props);
-  const markerClusterGroup = new L7.MarkerClusterGroup(clusterProps);
+  const markerClusterGroup = new import_leaflet5.default.MarkerClusterGroup(clusterProps);
   Object.entries(clusterEvents).forEach(([eventAsProp, callback]) => {
     const clusterEvent = `cluster${eventAsProp.substring(2).toLowerCase()}`;
     markerClusterGroup.on(clusterEvent, callback);
@@ -3206,17 +3199,17 @@ function createMarkerClusterGroup(props, context) {
     (0, import_core4.extendContext)(context, { layerContainer: markerClusterGroup })
   );
 }
-var import_core4, L7, import_leaflet5, updateMarkerCluster, MarkerClusterGroup2;
+var import_core4, import_leaflet5, import_leaflet6, updateMarkerCluster, MarkerClusterGroup;
 var init_MarkerClusterGroup = __esm({
   "src/Components/MarkerClusterGroup.tsx"() {
     "use strict";
     "use client";
     import_core4 = require("@react-leaflet/core");
-    L7 = __toESM(require("leaflet"));
-    import_leaflet5 = require("leaflet.markercluster");
+    import_leaflet5 = __toESM(require("leaflet"));
+    import_leaflet6 = require("leaflet.markercluster");
     updateMarkerCluster = () => {
     };
-    MarkerClusterGroup2 = (0, import_core4.createPathComponent)(
+    MarkerClusterGroup = (0, import_core4.createPathComponent)(
       createMarkerClusterGroup,
       updateMarkerCluster
     );
@@ -3336,8 +3329,7 @@ var init_FarmerClusterPopup = __esm({
     import_jsx_runtime8 = require("react/jsx-runtime");
     FarmerClusterPopup = ({ properties }) => {
       const fileUrl = (0, import_core7.useFileUrl)();
-      if (!properties)
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: "No properties found" });
+      if (!properties) return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: "No properties found" });
       const name = properties["name"];
       const description = properties["description"];
       const url = "/cluster/view/" + properties["id"];
@@ -3405,8 +3397,7 @@ var init_IfbnSitePopup = __esm({
     import_core9 = require("@geowiki/core");
     import_jsx_runtime10 = require("react/jsx-runtime");
     SiteInformation = ({ data }) => {
-      if (!data)
-        return null;
+      if (!data) return null;
       const baseDocUrl = "https://raw.githubusercontent.com/iiasa/static/refs/heads/main/geotrees/docs/biomass_processing_protocol/";
       return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "space-y-6", children: [
         /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "space-y-4", children: [
@@ -3581,8 +3572,7 @@ var init_IfbnSitePopup = __esm({
       const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
       const [imageError, setImageError] = (0, import_react6.useState)(false);
       const { status: sessionStatus, data: session } = (0, import_core8.useSession)();
-      if (!properties)
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { children: "No properties found" });
+      if (!properties) return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { children: "No properties found" });
       const plotId = properties["Plot_ID"];
       const subPlotId = properties["SubPlot_Id"];
       const network = properties["Network"];
@@ -3591,7 +3581,7 @@ var init_IfbnSitePopup = __esm({
       const fallbackUrl = "https://cms.main.geo-wiki.org/geotrees/media/cocoa.png";
       const baseImageUrl = "https://raw.githubusercontent.com/iiasa/static/refs/heads/main/geotrees/sites/";
       const imageUrl = `${baseImageUrl}${plotId}.jpg?raw=true`;
-      const fetchSiteData = () => __async(void 0, null, function* () {
+      const fetchSiteData = () => __async(null, null, function* () {
         setIsLoading(true);
         try {
           const response = yield fetch(
@@ -3602,8 +3592,7 @@ var init_IfbnSitePopup = __esm({
               }
             }
           );
-          if (!response.ok)
-            throw new Error("Failed to fetch data");
+          if (!response.ok) throw new Error("Failed to fetch data");
           const data = yield response.json();
           setSiteData(data);
         } catch (error) {
@@ -3683,16 +3672,14 @@ var init_IfbnPlotPopup = __esm({
       const [error, setError] = (0, import_react7.useState)(null);
       const API_URL = process.env.NEXT_PUBLIC_GEO_TREE_API_URL;
       (0, import_react7.useEffect)(() => {
-        const fetchApiData = () => __async(void 0, null, function* () {
-          if (!(properties == null ? void 0 : properties.id))
-            return;
+        const fetchApiData = () => __async(null, null, function* () {
+          if (!(properties == null ? void 0 : properties.id)) return;
           setIsLoading(true);
           try {
             const response = yield fetch(
               `${API_URL}/api/plots/by-plot-id/${properties.plot_id}`
             );
-            if (!response.ok)
-              throw new Error("Failed to fetch data");
+            if (!response.ok) throw new Error("Failed to fetch data");
             const data = yield response.json();
             console.log("API Response:", data);
             setApiData(data);
@@ -3848,14 +3835,14 @@ var init_GeoJsonLayerPopup = __esm({
 });
 
 // src/Components/GeoJsonLayer.tsx
-var import_react_query, import_react_leaflet6, import_leaflet6, ReactDOMServer, import_ui6, import_server2, import_MapPinIcon, import_react8, turf2, import_ui7, import_jsx_runtime13, getIcon, createIcon, createClusterIcon, GeoJsonLayer;
+var import_react_query, import_react_leaflet6, import_leaflet7, ReactDOMServer, import_ui6, import_server2, import_MapPinIcon, import_react8, turf2, import_ui7, import_jsx_runtime13, getIcon, createIcon, createClusterIcon, GeoJsonLayer;
 var init_GeoJsonLayer = __esm({
   "src/Components/GeoJsonLayer.tsx"() {
     "use strict";
     "use client";
     import_react_query = require("@tanstack/react-query");
     import_react_leaflet6 = require("react-leaflet");
-    import_leaflet6 = __toESM(require("leaflet"));
+    import_leaflet7 = __toESM(require("leaflet"));
     ReactDOMServer = __toESM(require("react-dom/server"));
     import_ui6 = require("@geowiki/ui");
     init_MarkerClusterGroup();
@@ -3876,7 +3863,7 @@ var init_GeoJsonLayer = __esm({
     };
     createIcon = (color, name) => {
       const background = color || "MediumSeaGreen";
-      return new import_leaflet6.default.DivIcon({
+      return new import_leaflet7.default.DivIcon({
         iconSize: [40, 40],
         html: `${getIcon(background, name)}`,
         className: "custom-div-icon"
@@ -3893,14 +3880,11 @@ var init_GeoJsonLayer = __esm({
         markers.forEach((marker2) => {
           var _a, _b, _c;
           const status = ((_c = (_b = (_a = marker2.feature) == null ? void 0 : _a.properties) == null ? void 0 : _b.Status) == null ? void 0 : _c.trim().toLowerCase()) || "default";
-          if (status === "ongoing")
-            statusCount.ongoing++;
-          else if (status === "auxiliary")
-            statusCount.auxiliary++;
-          else
-            statusCount.default++;
+          if (status === "ongoing") statusCount.ongoing++;
+          else if (status === "auxiliary") statusCount.auxiliary++;
+          else statusCount.default++;
         });
-        return import_leaflet6.default.divIcon({
+        return import_leaflet7.default.divIcon({
           html: `<div style=
         "background-color: ${color};
          width: 36px;
@@ -3924,7 +3908,7 @@ var init_GeoJsonLayer = __esm({
       ({ layer }) => {
         const { isLoading, error, data } = (0, import_react_query.useQuery)({
           queryKey: ["geoJson", layer.id],
-          queryFn: () => __async(void 0, null, function* () {
+          queryFn: () => __async(null, null, function* () {
             const res = yield fetch(layer.url);
             return yield res.json();
           })
@@ -3957,7 +3941,7 @@ var init_GeoJsonLayer = __esm({
             });
             if (feature.geometry.type !== "Point") {
               var center4 = turf2.center(feature);
-              var marker2 = import_leaflet6.default.marker(
+              var marker2 = import_leaflet7.default.marker(
                 [center4.geometry.coordinates[1], center4.geometry.coordinates[0]],
                 {
                   icon: layerIcon
@@ -3974,8 +3958,7 @@ var init_GeoJsonLayer = __esm({
           [layerIcon]
         );
         const processedData = (0, import_react8.useMemo)(() => {
-          if (!(data == null ? void 0 : data.features))
-            return data;
+          if (!(data == null ? void 0 : data.features)) return data;
           const processed = __spreadValues({}, data);
           processed.features = data.features.map((feature) => {
             var _a;
@@ -4001,12 +3984,10 @@ var init_GeoJsonLayer = __esm({
           }),
           [layer.id]
         );
-        if (error)
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children: "error" });
-        if (isLoading)
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_ui6.LoaderFull, {});
+        if (error) return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children: "error" });
+        if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_ui6.LoaderFull, {});
         return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-          MarkerClusterGroup2,
+          MarkerClusterGroup,
           {
             ref,
             iconCreateFunction: clusterIconFunction,
@@ -4033,7 +4014,7 @@ function getIcon2(color) {
   const MyIcon = import_MapPinIcon2.default;
   return (0, import_server3.renderToString)(/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MyIcon, { height: 40, width: 40, color }));
 }
-var import_ui8, import_react_query2, import_react9, import_react_leaflet7, turf3, import_leaflet7, import_MapPinIcon2, import_server3, import_jsx_runtime14, createDotIcon, icon, createClusterIcon2, IfbnPlotLayer;
+var import_ui8, import_react_query2, import_react9, import_react_leaflet7, turf3, import_leaflet8, import_MapPinIcon2, import_server3, import_jsx_runtime14, createDotIcon, icon, createClusterIcon2, IfbnPlotLayer;
 var init_IfbnPlotLayer = __esm({
   "src/Components/Ifbn/IfbnPlotLayer.tsx"() {
     "use strict";
@@ -4043,13 +4024,13 @@ var init_IfbnPlotLayer = __esm({
     import_react_leaflet7 = require("react-leaflet");
     init_MarkerClusterGroup();
     turf3 = __toESM(require("@turf/turf"));
-    import_leaflet7 = __toESM(require("leaflet"));
+    import_leaflet8 = __toESM(require("leaflet"));
     init_IfbnSitePopup();
     import_MapPinIcon2 = __toESM(require("@heroicons/react/24/solid/MapPinIcon"));
     import_server3 = require("react-dom/server");
     import_jsx_runtime14 = require("react/jsx-runtime");
     createDotIcon = (color) => {
-      return new import_leaflet7.default.DivIcon({
+      return new import_leaflet8.default.DivIcon({
         html: `<span style="
       background-color: ${color};
       width: 10px;
@@ -4065,7 +4046,7 @@ var init_IfbnPlotLayer = __esm({
     };
     icon = (color) => {
       const background = color || "MediumSeaGreen";
-      return new import_leaflet7.default.DivIcon({
+      return new import_leaflet8.default.DivIcon({
         iconSize: [40, 40],
         iconAnchor: [28, 15],
         html: `<i>${getIcon2(background)}</i>`,
@@ -4082,12 +4063,9 @@ var init_IfbnPlotLayer = __esm({
       markers.forEach((marker2) => {
         var _a, _b, _c;
         const status = ((_c = (_b = (_a = marker2.feature) == null ? void 0 : _a.properties) == null ? void 0 : _b.Status) == null ? void 0 : _c.trim().toLowerCase()) || "default";
-        if (status === "ongoing")
-          statusCount.ongoing++;
-        else if (status === "auxiliary")
-          statusCount.auxiliary++;
-        else
-          statusCount.default++;
+        if (status === "ongoing") statusCount.ongoing++;
+        else if (status === "auxiliary") statusCount.auxiliary++;
+        else statusCount.default++;
       });
       let clusterColor = "#2E7D32";
       if (statusCount.ongoing > statusCount.auxiliary && statusCount.ongoing > statusCount.default) {
@@ -4095,7 +4073,7 @@ var init_IfbnPlotLayer = __esm({
       } else if (statusCount.auxiliary > statusCount.ongoing && statusCount.auxiliary > statusCount.default) {
         clusterColor = "red";
       }
-      return new import_leaflet7.default.DivIcon({
+      return new import_leaflet8.default.DivIcon({
         html: `<div style="
       background-color: ${clusterColor};
       color: white;
@@ -4110,7 +4088,7 @@ var init_IfbnPlotLayer = __esm({
       font-weight: bold;
     ">${cluster.getChildCount()}</div>`,
         className: "custom-cluster-icon",
-        iconSize: import_leaflet7.default.point(32, 32)
+        iconSize: import_leaflet8.default.point(32, 32)
       });
     };
     IfbnPlotLayer = ({
@@ -4136,7 +4114,7 @@ var init_IfbnPlotLayer = __esm({
       });
       const { isLoading, error, data } = (0, import_react_query2.useQuery)({
         queryKey: ["IfbnPlotLayer", layer.id],
-        queryFn: () => __async(void 0, null, function* () {
+        queryFn: () => __async(null, null, function* () {
           const res = yield fetch(`${layer.url}`);
           return yield res.json();
         })
@@ -4145,8 +4123,7 @@ var init_IfbnPlotLayer = __esm({
         return currentZoom <= hideMarkersAboveZoom;
       };
       (0, import_react9.useEffect)(() => {
-        if (!markerClusterGroupRef.current)
-          return;
+        if (!markerClusterGroupRef.current) return;
         if (shouldShowMarkers()) {
           markersRef.current.forEach((marker2) => {
             var _a, _b;
@@ -4170,7 +4147,7 @@ var init_IfbnPlotLayer = __esm({
         return zoom >= 16 ? 0 : 80;
       };
       (0, import_react9.useEffect)(() => {
-        markerClusterGroupRef.current = import_leaflet7.default.markerClusterGroup({
+        markerClusterGroupRef.current = import_leaflet8.default.markerClusterGroup({
           maxClusterRadius: (zoom) => getClusterRadius(zoom),
           disableClusteringAtZoom: 16,
           spiderfyOnMaxZoom: false,
@@ -4214,7 +4191,7 @@ var init_IfbnPlotLayer = __esm({
             }
           }
           var center4 = turf3.center(feature);
-          var marker2 = import_leaflet7.default.marker(
+          var marker2 = import_leaflet8.default.marker(
             [center4.geometry.coordinates[1], center4.geometry.coordinates[0]],
             {
               icon: createDotIcon(color)
@@ -4234,12 +4211,10 @@ var init_IfbnPlotLayer = __esm({
         setSelectedFeature({ feature, latlng });
       };
       const ref = (0, import_react9.useRef)(null);
-      if (error)
-        return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: "error" });
-      if (isLoading)
-        return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_ui8.LoaderFull, {});
+      if (error) return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children: "error" });
+      if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_ui8.LoaderFull, {});
       return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
-        MarkerClusterGroup2,
+        MarkerClusterGroup,
         {
           ref,
           chunkedLoading: true,
@@ -4494,8 +4469,7 @@ var init_customLayers = __esm({
       createLayerFromTemplate: (templateId, customData) => {
         var _a, _b;
         const template = get().getTemplate(templateId);
-        if (!template)
-          return null;
+        if (!template) return null;
         const newLayer = {
           id: (0, import_uuid.v4)(),
           isCustom: true,
@@ -4862,16 +4836,11 @@ function getColumnStats(data, columnName) {
   let type;
   if (uniqueTypes.size === 1) {
     const singleType = types[0];
-    if (singleType === "string")
-      type = "string";
-    else if (singleType === "number")
-      type = "number";
-    else if (singleType === "boolean")
-      type = "boolean";
-    else if (singleType === "object")
-      type = "date";
-    else
-      type = "mixed";
+    if (singleType === "string") type = "string";
+    else if (singleType === "number") type = "number";
+    else if (singleType === "boolean") type = "boolean";
+    else if (singleType === "object") type = "date";
+    else type = "mixed";
   } else {
     type = "mixed";
   }
@@ -4896,21 +4865,15 @@ var init_GoogleSheetsPopup = __esm({
       properties
     }) => {
       const isEmpty = (value) => {
-        if (value === null || value === void 0)
-          return true;
-        if (typeof value === "string")
-          return value.trim() === "";
-        if (typeof value === "number")
-          return isNaN(value);
-        if (Array.isArray(value))
-          return value.length === 0;
-        if (typeof value === "object")
-          return Object.keys(value).length === 0;
+        if (value === null || value === void 0) return true;
+        if (typeof value === "string") return value.trim() === "";
+        if (typeof value === "number") return isNaN(value);
+        if (Array.isArray(value)) return value.length === 0;
+        if (typeof value === "object") return Object.keys(value).length === 0;
         return false;
       };
       const isUrl2 = (value) => {
-        if (typeof value !== "string")
-          return false;
+        if (typeof value !== "string") return false;
         const trimmedValue = value.trim();
         const urlPatterns = [
           /^https?:\/\//i,
@@ -5353,8 +5316,7 @@ function analyzeColumn(rows, columnName) {
   };
 }
 function getLegendColumns(rows, excludeCoordinateColumns = []) {
-  if (rows.length === 0)
-    return [];
+  if (rows.length === 0) return [];
   const headers = Object.keys(rows[0]);
   const legendColumns = [];
   for (const header of headers) {
@@ -5551,7 +5513,7 @@ function useGenericCache({
   const isCached = cache.has(cacheKey);
   const queryOptions = {
     queryKey: [cacheKey.type, cacheKey.id, cacheKey.subId, cacheKey.version],
-    queryFn: () => __async(this, null, function* () {
+    queryFn: () => __async(null, null, function* () {
       const cachedData = cache.get(cacheKey);
       if (cachedData) {
         console.log(
@@ -5690,8 +5652,7 @@ var init_GenericCache = __esm({
       getFromStorage(key) {
         try {
           const stored = localStorage.getItem(key);
-          if (!stored)
-            return null;
+          if (!stored) return null;
           const entry = JSON.parse(stored);
           if (this.isValid(entry)) {
             this.hitCount++;
@@ -5995,7 +5956,7 @@ function useGoogleSheetsData({
     subId: sheetConfig.sheetId,
     version: "1.0.0"
   } : null;
-  const fetchData = () => __async(this, null, function* () {
+  const fetchData = () => __async(null, null, function* () {
     if (!sheetConfig) {
       throw new Error("Invalid Google Sheets configuration");
     }
@@ -6047,13 +6008,13 @@ var init_useGoogleSheetsData = __esm({
 });
 
 // src/Components/GoogleSheetsLayer.tsx
-var import_react_leaflet8, import_leaflet8, ReactDOMServer2, import_ui9, import_react10, turf4, import_lucide_react2, import_jsx_runtime19, RANDOM_COLORS, getRandomColor, createCircleIcon, createPinIcon, icon2, createClusterIcon3, getMarkerConfig, GoogleSheetsLayer;
+var import_react_leaflet8, import_leaflet9, ReactDOMServer2, import_ui9, import_react10, turf4, import_lucide_react2, import_jsx_runtime19, RANDOM_COLORS, getRandomColor, createCircleIcon, createPinIcon, icon2, createClusterIcon3, getMarkerConfig, GoogleSheetsLayer;
 var init_GoogleSheetsLayer = __esm({
   "src/Components/GoogleSheetsLayer.tsx"() {
     "use strict";
     "use client";
     import_react_leaflet8 = require("react-leaflet");
-    import_leaflet8 = __toESM(require("leaflet"));
+    import_leaflet9 = __toESM(require("leaflet"));
     ReactDOMServer2 = __toESM(require("react-dom/server"));
     import_ui9 = require("@geowiki/ui");
     init_MarkerClusterGroup();
@@ -6102,7 +6063,7 @@ var init_GoogleSheetsLayer = __esm({
       const index = Math.abs(hash) % RANDOM_COLORS.length;
       return RANDOM_COLORS[index];
     };
-    createCircleIcon = (color) => import_leaflet8.default.divIcon({
+    createCircleIcon = (color) => import_leaflet9.default.divIcon({
       html: `<div style="background-color: ${color}; width: 20px; height: 20px; border-radius: 50%; box-shadow: 0 2px 4px rgba(0,0,0,0.3);"></div>`,
       className: "custom-div-icon",
       iconSize: [20, 20],
@@ -6113,7 +6074,7 @@ var init_GoogleSheetsLayer = __esm({
       const iconHtml = ReactDOMServer2.renderToString(
         /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(IconComponent, { size: 40, color, strokeWidth: 2 })
       );
-      return import_leaflet8.default.divIcon({
+      return import_leaflet9.default.divIcon({
         html: iconHtml,
         className: "custom-pin-icon",
         iconSize: [40, 40],
@@ -6129,7 +6090,7 @@ var init_GoogleSheetsLayer = __esm({
     createClusterIcon3 = () => (cluster) => {
       const count = cluster.getChildCount();
       const size = count < 10 ? "small" : count < 100 ? "medium" : "large";
-      return import_leaflet8.default.divIcon({
+      return import_leaflet9.default.divIcon({
         html: `<div style="background-color: #ff6b35; color: white; border-radius: 50%; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 4px rgba(0,0,0,0.3); width: 100%; height: 100%; min-width: 100%; min-height: 100%;">${count}</div>`,
         className: "google-sheets-cluster-icon",
         iconSize: size === "small" ? [30, 30] : size === "medium" ? [45, 45] : [60, 60]
@@ -6197,7 +6158,7 @@ var init_GoogleSheetsLayer = __esm({
     }) => {
       var _a;
       const ref = (0, import_react10.useRef)(null);
-      const markerClusterGroup = import_leaflet8.default.markerClusterGroup();
+      const markerClusterGroup = import_leaflet9.default.markerClusterGroup();
       const { updateLayer } = mapLayers_default();
       const legendConfigUpdated = (0, import_react10.useRef)(false);
       const [forceUpdate, setForceUpdate] = (0, import_react10.useState)(0);
@@ -6273,7 +6234,7 @@ var init_GoogleSheetsLayer = __esm({
         });
         if (feature.geometry.type !== "Point") {
           var center4 = turf4.center(feature);
-          var marker2 = import_leaflet8.default.marker(
+          var marker2 = import_leaflet9.default.marker(
             [center4.geometry.coordinates[1], center4.geometry.coordinates[0]],
             {
               icon: icon2(markerConfig.color, markerConfig.icon)
@@ -6289,8 +6250,7 @@ var init_GoogleSheetsLayer = __esm({
       };
       const processedData = (0, import_react10.useMemo)(() => {
         var _a2;
-        if (!data)
-          return null;
+        if (!data) return null;
         return __spreadProps(__spreadValues({}, data), {
           features: (_a2 = data.features) == null ? void 0 : _a2.map((feature) => {
             var _a3;
@@ -6473,7 +6433,7 @@ var init_GoogleSheetsLayer = __esm({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MarkerClusterGroup2, { ref, iconCreateFunction: createClusterIcon3(), children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MarkerClusterGroup, { ref, iconCreateFunction: createClusterIcon3(), children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           import_react_leaflet8.GeoJSON,
           {
             data: processedData,
@@ -6494,7 +6454,7 @@ var init_GoogleSheetsLayer = __esm({
 });
 
 // src/Components/CustomLayerRenderer.tsx
-var import_react11, import_react_leaflet9, import_leaflet9, import_jsx_runtime20, createMarkerIcon, createClusterIcon4, createPopupContent, GeoJSONRenderer, MarkerRenderer, MarkerClusterRenderer, WMSRenderer, TileRenderer, GoogleSheetsRenderer, CustomLayerRenderer, CustomLayerList;
+var import_react11, import_react_leaflet9, import_leaflet10, import_jsx_runtime20, createMarkerIcon, createClusterIcon4, createPopupContent, GeoJSONRenderer, MarkerRenderer, MarkerClusterRenderer, WMSRenderer, TileRenderer, GoogleSheetsRenderer, CustomLayerRenderer, CustomLayerList;
 var init_CustomLayerRenderer = __esm({
   "src/Components/CustomLayerRenderer.tsx"() {
     "use strict";
@@ -6502,7 +6462,7 @@ var init_CustomLayerRenderer = __esm({
     import_react_leaflet9 = require("react-leaflet");
     init_customLayers();
     init_statusMapping();
-    import_leaflet9 = __toESM(require("leaflet"));
+    import_leaflet10 = __toESM(require("leaflet"));
     init_GoogleSheetsLayer();
     init_MarkerClusterGroup();
     import_jsx_runtime20 = require("react/jsx-runtime");
@@ -6535,7 +6495,7 @@ var init_CustomLayerRenderer = __esm({
       />
     </svg>
   `;
-      return import_leaflet9.default.divIcon({
+      return import_leaflet10.default.divIcon({
         html: iconHtml,
         className: "geotrees-marker-icon",
         iconSize: [size, size],
@@ -6546,7 +6506,7 @@ var init_CustomLayerRenderer = __esm({
       const count = cluster.getChildCount();
       const size = count < 10 ? "small" : count < 100 ? "medium" : "large";
       const iconSize = size === "small" ? [30, 30] : size === "medium" ? [40, 40] : [50, 50];
-      return import_leaflet9.default.divIcon({
+      return import_leaflet10.default.divIcon({
         html: `<div style="background-color: #22c55e; color: white; border-radius: 50%; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 4px rgba(0,0,0,0.3); width: 100%; height: 100%; min-width: 100%; min-height: 100%;">${count}</div>`,
         className: "geotrees-cluster-icon",
         iconSize
@@ -6709,7 +6669,7 @@ var init_CustomLayerRenderer = __esm({
           return null;
         }
         return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-          MarkerClusterGroup2,
+          MarkerClusterGroup,
           {
             chunkedLoading: true,
             maxClusterRadius: 60,
@@ -7038,10 +6998,9 @@ var init_RasterPreview = __esm({
         },
         { scopes: ["evoland"] }
       );
-      const onSubmit = (taskStatus) => __async(void 0, null, function* () {
+      const onSubmit = (taskStatus) => __async(null, null, function* () {
         var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v2, _w2;
-        if (disableSubmit)
-          return;
+        if (disableSubmit) return;
         setDisableSubmit(true);
         var bufferData = null;
         var { data: savedAnnotationBuffer, indexArr: savedAnnotationIndexArr } = evolandStore.savedAnnotations && evolandStore.isAnnualAnnotation ? { data: evolandStore.savedAnnotations.buffer, indexArr: 0 } : evolandStore.savedAnnotations ? flatten(evolandStore.savedAnnotations.buffer) : { data: void 0, indexArr: 0 };
@@ -7098,8 +7057,7 @@ var init_RasterPreview = __esm({
               if (_props.userRole === "admin") {
                 if (tasks == null ? void 0 : tasks.task)
                   window.location.href = `/map?projectId=${projectId}&locationId=${(_v2 = tasks == null ? void 0 : tasks.task) == null ? void 0 : _v2.location_id}&taskId=${(_w2 = tasks == null ? void 0 : tasks.task) == null ? void 0 : _w2.task_id}${evolandStore.task_for_review ? "&review=true" : ""}`;
-                else
-                  alert("No more tasks to review");
+                else alert("No more tasks to review");
               }
               var res = yield evolandStore.getNextLocationDetails(
                 parseInt(projectId)
@@ -7123,8 +7081,7 @@ var init_RasterPreview = __esm({
         }
       });
       const arrayEqual = (a, b) => {
-        if (a.length !== b.length)
-          return false;
+        if (a.length !== b.length) return false;
         return Buffer.compare(Buffer.from(a.buffer), Buffer.from(b.buffer)) === 0;
       };
       const flatten = (input, refArr) => {
@@ -7148,15 +7105,14 @@ var init_RasterPreview = __esm({
             }
           }
         }
-        if (indexArr.length == 0)
-          result = emptyAnnotation;
+        if (indexArr.length == 0) result = emptyAnnotation;
         return { data: new Uint32Array(result), indexArr };
       };
       function isBase64Zeros(base64String) {
         const trimmed = base64String.replace(/=+$/, "");
         return /^A+$/.test(trimmed);
       }
-      const onSave = () => __async(void 0, null, function* () {
+      const onSave = () => __async(null, null, function* () {
         var _a2, _b2;
         var bufferData = null;
         const { data, indexArr } = evolandStore.isAnnualAnnotation ? { data: evolandStore.annotatedRasterAsset.buffer, indexArr: 0 } : flatten(
@@ -7204,8 +7160,7 @@ var init_RasterPreview = __esm({
                 setSubmitNotificationMessage(
                   "Annotation has been SAVED successfully"
                 );
-              else
-                setSubmitNotificationMessage("Please try again");
+              else setSubmitNotificationMessage("Please try again");
               setSubmitNotification(true);
             }
           } catch (err) {
@@ -7214,7 +7169,7 @@ var init_RasterPreview = __esm({
           }
         }
       });
-      const ClearPreview = () => __async(void 0, null, function* () {
+      const ClearPreview = () => __async(null, null, function* () {
         const { annotationRaster, pastValues } = yield ClearAnnotation(
           evolandStore.annotatedRasterAsset,
           evolandStore.isAnnualAnnotation,
@@ -7277,16 +7232,14 @@ var init_RasterPreview = __esm({
           )] : newValue == null ? void 0 : newValue.buffer[0] : newValue == null ? void 0 : newValue.buffer
         );
       };
-      if (layerStore.layerOpacity == 0)
-        layerStore.setLayerOpacity(0.4);
+      if (layerStore.layerOpacity == 0) layerStore.setLayerOpacity(0.4);
       if (!goToNextTask && evolandStore.location !== null && evolandStore.location.locationId !== searchParams.get("locationId")) {
         if (status == import_core13.TaskStatus.ACCEPTED || status == import_core13.TaskStatus.DISCARDED || status == import_core13.TaskStatus.TO_FIX) {
           setGoToNextTask(true);
           if (_props.userRole === "admin")
             if (tasks == null ? void 0 : tasks.task)
               window.location.href = `/map?projectId=${projectId}&locationId=${(_a = tasks == null ? void 0 : tasks.task) == null ? void 0 : _a.location_id}&taskId=${(_b = tasks == null ? void 0 : tasks.task) == null ? void 0 : _b.task_id}${evolandStore.task_for_review ? "&review=true" : ""}`;
-            else
-              alert("No more tasks to review");
+            else alert("No more tasks to review");
         } else
           window.location.href = `/map?projectId=${projectId}&locationId=${(_c = evolandStore.location) == null ? void 0 : _c.locationId}&taskId=${(_d = evolandStore.location) == null ? void 0 : _d.task[0].task_id}`;
       }
@@ -7335,10 +7288,8 @@ var init_RasterPreview = __esm({
                 parseInt(projectId),
                 evolandStore.referenceDate
               ).then(({ location, currentTask, annotation_dates }) => {
-                if (location)
-                  evolandStore.setLocation(location);
-                if (currentTask)
-                  evolandStore.setCurrentTask(currentTask);
+                if (location) evolandStore.setLocation(location);
+                if (currentTask) evolandStore.setCurrentTask(currentTask);
                 evolandStore.setAnnotationDates(annotation_dates);
               });
             },
@@ -7374,8 +7325,7 @@ var init_RasterPreview = __esm({
                           evolandStore.setComment(
                             evolandStore.comment.replace(" #" + x, "")
                           );
-                        else
-                          evolandStore.setComment("#" + x + " ");
+                        else evolandStore.setComment("#" + x + " ");
                       },
                       children: [
                         "#",
@@ -7641,7 +7591,7 @@ var init_Annotation = __esm({
         labelId: 0
       });
       const [currentLabelItem, setCurrentLabelItem] = (0, import_react16.useState)();
-      const OnSubmitActiveLearning = () => __async(void 0, null, function* () {
+      const OnSubmitActiveLearning = () => __async(null, null, function* () {
         var _a2, _b2;
         setActiveLearningLoading(true);
         var bufferData = null;
@@ -8736,8 +8686,7 @@ var init_ViewAssets = __esm({
     import_jsx_runtime31 = require("react/jsx-runtime");
     assetsByYear = (assets) => assets == null ? void 0 : assets.reduce((acc, item) => {
       const year = new Date(item.reference_date).getFullYear();
-      if (!acc[year])
-        acc[year] = [];
+      if (!acc[year]) acc[year] = [];
       acc[year].push(item);
       return acc;
     }, {});
@@ -8760,6 +8709,7 @@ var init_ViewAssets = __esm({
       const [compositesTab, setCompositesTab] = (0, import_react18.useState)(
         props.defaultAssetView == "COMPOSITE" /* Composite */ ? true : false
       );
+      const [fetchComposite, setFetchComposite] = (0, import_react18.useState)(false);
       const [masks, setMasks] = (0, import_react18.useState)(
         evolandStore.maskAsset !== null ? evolandStore.maskAsset : []
       );
@@ -8854,14 +8804,10 @@ var init_ViewAssets = __esm({
       );
       if (props.taskId !== void 0 && IsTaskAnnotationLoading)
         return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_ui13.LoaderFull, {});
-      if (maskTab && (masks == null ? void 0 : masks.length) == 0)
-        setMasks(evolandStore.maskAsset);
-      if (changeMaskTab && (changeMasks == null ? void 0 : changeMasks.length) == 0)
-        checkChangeMasksAndLoad();
-      if (compositesTab && composites.length == 0)
-        checkCompositesAndLoad();
-      if (annotationTab)
-        checkAnnotationsAndLoad();
+      if (maskTab && (masks == null ? void 0 : masks.length) == 0) setMasks(evolandStore.maskAsset);
+      if (changeMaskTab && (changeMasks == null ? void 0 : changeMasks.length) == 0) checkChangeMasksAndLoad();
+      if (compositesTab && composites.length == 0) checkCompositesAndLoad();
+      if (annotationTab) checkAnnotationsAndLoad();
       function checkMasksAndLoad() {
         if ((masks == null ? void 0 : masks.length) === 0 && !evolandStore.maskAsset) {
           evolandStore.getLocationAssets(
@@ -8872,8 +8818,7 @@ var init_ViewAssets = __esm({
           ).then((res) => {
             setMasks(res);
           });
-        } else if (masks.length == 0)
-          setMasks(evolandStore.maskAsset);
+        } else if (masks.length == 0) setMasks(evolandStore.maskAsset);
       }
       function checkChangeMasksAndLoad() {
         if ((changeMasks == null ? void 0 : changeMasks.length) === 0 && !evolandStore.changeMaskAsset) {
@@ -8889,7 +8834,8 @@ var init_ViewAssets = __esm({
           setChangeMasks(evolandStore.changeMaskAsset);
       }
       function checkCompositesAndLoad() {
-        if ((composites == null ? void 0 : composites.length) === 0 && !evolandStore.compositeAsset) {
+        if ((composites == null ? void 0 : composites.length) === 0 && !evolandStore.compositeAsset && !fetchComposite) {
+          setFetchComposite(true);
           evolandStore.getLocationAssets(
             props.locationId,
             props.projectId,
@@ -8897,6 +8843,7 @@ var init_ViewAssets = __esm({
             props.taskId
           ).then((res) => {
             setComposites(assetsByYear(res));
+            setFetchComposite(false);
           });
         }
       }
@@ -8919,8 +8866,7 @@ var init_ViewAssets = __esm({
       }
       if (props.taskId !== void 0 && IsTaskAnnotationLoading)
         return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_ui13.LoaderFull, {});
-      if (maskTab && ((masks == null ? void 0 : masks.length) == 0 || masks == null))
-        setMaskTab(false);
+      if (maskTab && ((masks == null ? void 0 : masks.length) == 0 || masks == null)) setMaskTab(false);
       return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { children: [
         /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
           "div",
@@ -9273,7 +9219,7 @@ var init_ViewAssets = __esm({
                       asset.id + index
                     );
                   }) })
-                ] }))
+                ] }, year))
               }
             )
           ] })
@@ -9482,8 +9428,7 @@ var init_SearchAnnotation = __esm({
               localStorage.setItem("toDate", toDate);
               if (tasks == null ? void 0 : tasks.exists)
                 window.location.href = `/map?projectId=${tasks == null ? void 0 : tasks.task.project_id}&locationId=${tasks == null ? void 0 : tasks.task.location_id}&taskId=${tasks == null ? void 0 : tasks.task.task_id}${props.taskForReview ? "&review=true" : ""}`;
-              else
-                alert("No data for search parameters");
+              else alert("No data for search parameters");
             },
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
@@ -9824,14 +9769,11 @@ var init_EvolandLeftSideBar = __esm({
       }
       if (evolandStore.projectDetail) {
         if (((_m = (_l = evolandStore.projectDetail) == null ? void 0 : _l.meta_data) == null ? void 0 : _m.default_asset_view) == "SEGMENTATION_MASK" /* SegmentationMask */) {
-          if ((masks == null ? void 0 : masks.length) === 0)
-            return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
+          if ((masks == null ? void 0 : masks.length) === 0) return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
         } else if (((_o = (_n = evolandStore.projectDetail) == null ? void 0 : _n.meta_data) == null ? void 0 : _o.default_asset_view) == "COMPOSITE" /* Composite */) {
-          if ((composites == null ? void 0 : composites.length) === 0)
-            return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
+          if ((composites == null ? void 0 : composites.length) === 0) return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
         }
-      } else
-        return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
+      } else return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_ui15.LoaderFull, {});
       return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
         "div",
         {
@@ -9998,8 +9940,7 @@ var init_EvolandLeftSideBar = __esm({
                     canDelete = confirm(
                       (review ? "This is a targeted review task. " : "") + "Are you sure you want to delete this task?"
                     );
-                    if (canDelete)
-                      setDeleteTask(true);
+                    if (canDelete) setDeleteTask(true);
                   },
                   children: [
                     /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
@@ -10041,8 +9982,7 @@ var init_EvolandLeftSideBar = __esm({
                                 evolandStore.setAnnotationDates(annotation_dates);
                                 if (currentTask)
                                   evolandStore.setCurrentTask(currentTask);
-                                if (location)
-                                  evolandStore.setLocation(location);
+                                if (location) evolandStore.setLocation(location);
                                 if (props.userRole === "admin")
                                   window.location.href = "/map?projectId=" + projectId + "&locationId=" + (currentTask == null ? void 0 : currentTask.location_id) + "&taskId=" + (currentTask == null ? void 0 : currentTask.task_id) + (evolandStore.task_for_review ? "&review=true" : "");
                               }
@@ -10234,10 +10174,9 @@ var init_Questions = __esm({
         userUserAlias: !localStorage.getItem("searchUser") ? null : localStorage.getItem("searchUser"),
         locationLocationId: null
       });
-      const onSubmit = (taskStatus) => __async(void 0, null, function* () {
+      const onSubmit = (taskStatus) => __async(null, null, function* () {
         var _a2, _b2, _c2, _d2, _e2;
-        if (disableSubmit)
-          return;
+        if (disableSubmit) return;
         setDisableSubmit(true);
         setStatus(taskStatus[0]);
         if (evolandStore.currentTask) {
@@ -10269,8 +10208,7 @@ var init_Questions = __esm({
               if (props.userRole === "admin") {
                 if (tasks == null ? void 0 : tasks.task)
                   window.location.href = `/map?projectId=${projectId}&locationId=${(_d2 = tasks == null ? void 0 : tasks.task) == null ? void 0 : _d2.location_id}&taskId=${(_e2 = tasks == null ? void 0 : tasks.task) == null ? void 0 : _e2.task_id}${evolandStore.task_for_review ? "&review=true" : ""}`;
-                else
-                  alert("No more tasks to review");
+                else alert("No more tasks to review");
               }
               var res = yield evolandStore.getNextLocationDetails(
                 parseInt(projectId)
@@ -10293,7 +10231,7 @@ var init_Questions = __esm({
           setSubmitNotificationMessage("");
         }
       });
-      const onSave = () => __async(void 0, null, function* () {
+      const onSave = () => __async(null, null, function* () {
         if (evolandStore.currentTask) {
           const saveQuestionnaireReq = {
             task_id: evolandStore.currentTask.task_id,
@@ -10312,8 +10250,7 @@ var init_Questions = __esm({
                 setSubmitNotificationMessage(
                   "Questionnaire has been SAVED successfully"
                 );
-              else
-                setSubmitNotificationMessage("Please try again");
+              else setSubmitNotificationMessage("Please try again");
               setSubmitNotification(true);
             }
           } catch (err) {
@@ -10346,8 +10283,7 @@ var init_Questions = __esm({
                 "<" + key + ">",
                 "" + (label == null ? void 0 : label.labelName)
               );
-            } else
-              y.text = y.text.replace("<" + key + ">", "" + value);
+            } else y.text = y.text.replace("<" + key + ">", "" + value);
           });
         });
       }
@@ -10393,15 +10329,14 @@ var init_Questions = __esm({
           if (props.userRole === "admin")
             if (tasks == null ? void 0 : tasks.task)
               window.location.href = `/map?projectId=${projectId}&locationId=${(_c = tasks == null ? void 0 : tasks.task) == null ? void 0 : _c.location_id}&taskId=${(_d = tasks == null ? void 0 : tasks.task) == null ? void 0 : _d.task_id}${evolandStore.task_for_review ? "&review=true" : ""}`;
-            else
-              alert("No more tasks to review");
+            else alert("No more tasks to review");
         } else
           window.location.href = `/map?projectId=${projectId}&locationId=${(_e = evolandStore.location) == null ? void 0 : _e.locationId}&taskId=${(_f = evolandStore.location) == null ? void 0 : _f.task[0].task_id}`;
       }
       if (IsQuestionnaireLoading || IsTaskAnswerLoading || !((_g = evolandStore.location) == null ? void 0 : _g.result))
         return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_ui16.LoaderFull, {});
       return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { children: context && (context == null ? void 0 : context.map((x) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "m-5 w-full", children: x.text }))) }),
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { children: context && (context == null ? void 0 : context.map((x) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "m-5 w-full", children: x.text }, x.id))) }),
         /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           "div",
           {
@@ -10443,8 +10378,8 @@ var init_Questions = __esm({
                       }
                     ),
                     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_ui16.Label, { htmlFor: "r1", children: y.text })
-                  ] })) })
-                ] }) });
+                  ] }, y.id)) })
+                ] }) }, x.id);
               })),
               singleChoice && userAnswers.length > 0 && ((_i = singleChoice == null ? void 0 : singleChoice.filter(
                 (ques) => userAnswers == null ? void 0 : userAnswers.some(
@@ -10474,8 +10409,8 @@ var init_Questions = __esm({
                       }
                     ),
                     /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_ui16.Label, { htmlFor: "r1", children: y.text })
-                  ] })) })
-                ] }) });
+                  ] }, y.id)) })
+                ] }) }, x.id);
               }))
             ] })
           }
@@ -10509,8 +10444,7 @@ var init_Questions = __esm({
                           evolandStore.setComment(
                             evolandStore.comment.replace(" #" + x, "")
                           );
-                        else
-                          evolandStore.setComment("#" + x + " ");
+                        else evolandStore.setComment("#" + x + " ");
                       },
                       children: [
                         "#",
@@ -10543,8 +10477,7 @@ var init_Questions = __esm({
                       onClick: () => {
                         if (import_core24.TaskState[x[0]] !== import_core24.TaskState.SKIPPED && import_core24.TaskState[x[0]] !== import_core24.TaskState.DISCARDED && import_core24.TaskState[x[0]] !== import_core24.TaskState.USER_DISCARDED && userAnswers.length !== requiredUserAnswers)
                           alert("Please provide all answers");
-                        else
-                          onSubmit(x);
+                        else onSubmit(x);
                       },
                       children: import_core24.TaskState[x[0]]
                     }
@@ -10601,7 +10534,7 @@ var init_TimeSeries = __esm({
           const bbox4 = [bounds[1], bounds[0], bounds[3], bounds[2]];
           const years = changeYears != null ? changeYears : taskChangeYears;
           if (years) {
-            years.map((year) => __async(this, null, function* () {
+            years.map((year) => __async(null, null, function* () {
               yield getTimeseries(
                 year + "-01-01",
                 year + "-12-31",
@@ -10636,8 +10569,7 @@ var init_TimeSeries = __esm({
               })
             }
           );
-          if (!appendImages)
-            setDetailedImgUrls((yield response.json()).images);
+          if (!appendImages) setDetailedImgUrls((yield response.json()).images);
           else {
             response.json().then((res) => {
               setDetailedImgUrls((prevUrls) => [...prevUrls, ...res.images]);
@@ -10681,18 +10613,15 @@ var init_TimeSeries = __esm({
                       return 1;
                     else if (x.substring(x.split("_")[0].length, x.length) < y.substring(y.split("_")[0].length, y.length))
                       return -1;
-                    else
-                      return 0;
+                    else return 0;
                   }).map((x, index) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
                     "button",
                     {
                       className: currentTab === index ? "pl-1 pr-5 border-gray-300 text-white" : "pl-1 pr-5 border-gray-300 bg-gray-200",
                       onClick: () => {
                         setDetailedImgUrls([]);
-                        if (x.includes("RGB"))
-                          fetchImages("TRUE_COLOR" /* RGB */);
-                        else if (x.includes("FCC"))
-                          fetchImages("COLOR_INFRARED" /* FCC */);
+                        if (x.includes("RGB")) fetchImages("TRUE_COLOR" /* RGB */);
+                        else if (x.includes("FCC")) fetchImages("COLOR_INFRARED" /* FCC */);
                         setCurrentTab(index);
                       },
                       children: x.substring(x.split("_")[0].length + 1, x.length)
@@ -10702,7 +10631,7 @@ var init_TimeSeries = __esm({
                   !evolandStore.isAnnualAnnotation && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
                     "button",
                     {
-                      className: currentTab === -1 ? "pl-1 pr-5 border-gray-300 text-white" : "pl-1 pr-5 border-gray-300 bg-primary text-white",
+                      className: currentTab === -1 ? "pl-1 pr-5 border-gray-300 text-white" : "pl-1 pr-5 border-gray-300 bg-white text-black",
                       onClick: () => setCurrentTab(-1),
                       children: "View Annotations"
                     }
@@ -10710,7 +10639,7 @@ var init_TimeSeries = __esm({
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "overflow-x-scroll", children: taskChangeYears == null ? void 0 : taskChangeYears.map((year) => {
+            currentTab !== -1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "overflow-x-scroll", children: taskChangeYears == null ? void 0 : taskChangeYears.map((year) => {
               var _a;
               return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
                 /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "w-full pt-4", children: year }),
@@ -10720,31 +10649,43 @@ var init_TimeSeries = __esm({
                     var _a2;
                     return (_a2 = x.minDate) == null ? void 0 : _a2.includes(year);
                   })) == null ? void 0 : _a.map((x, index) => {
-                    var _a2, _b;
+                    var _a2, _b, _c;
+                    let selected_ref_date = new Date(evolandStore.selectedReferenceDate);
+                    let current_date = new Date(x.date);
+                    let selected_date;
+                    if (selected_ref_date.getMonth() == current_date.getMonth())
+                      selected_date = (_a2 = evolandStore.reference_dates) == null ? void 0 : _a2.find((date) => new Date(date).getMonth() + 1 == new Date(x.date).getMonth() + 1);
                     return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
                       /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
                         "img",
                         {
-                          className: "text-xs w-32 border-y border-x hover:border-blue-500 hover:border-2 hover:cursor-pointer pl-1 pr-1 pb-1" + (((_a2 = evolandStore.selectedCompositeRasterAsset) == null ? void 0 : _a2.id) == x.id || !evolandStore.isAnnualAnnotation && evolandStore.selectedReferenceDate == x.date ? " border-2 border-red-500" : ""),
+                          className: "text-xs w-32 border-y border-x hover:border-blue-500 hover:border-2 hover:cursor-pointer pl-1 pr-1 pb-1" + (((_b = evolandStore.selectedCompositeRasterAsset) == null ? void 0 : _b.id) == x.id || !evolandStore.isAnnualAnnotation && evolandStore.selectedReferenceDate == selected_date ? " border-2 border-red-500" : ""),
                           src: x.imgUrl,
                           alt: x.date,
                           onClick: () => {
-                            var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+                            var _a3, _b2, _c2, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
                             evolandStore.getLegendsDetails(
                               !evolandStore.isAnnualAnnotation ? evolandStore.reference_dates && evolandStore.selectedReferenceDate ? (_b2 = evolandStore.annotatedRasterAsset) == null ? void 0 : _b2.buffer[(_a3 = evolandStore.reference_dates) == null ? void 0 : _a3.indexOf(
                                 x.date
-                              )] : (_c = evolandStore.annotatedRasterAsset) == null ? void 0 : _c.buffer[0] : (_d = evolandStore.annotatedRasterAsset) == null ? void 0 : _d.buffer
+                              )] : (_c2 = evolandStore.annotatedRasterAsset) == null ? void 0 : _c2.buffer[0] : (_d = evolandStore.annotatedRasterAsset) == null ? void 0 : _d.buffer
                             );
                             if (evolandStore.reference_dates.length > 1) {
-                              evolandStore.setSelectedReferenceDate(x.date);
+                              let selected_date2;
+                              if (!((_e = evolandStore.reference_dates) == null ? void 0 : _e.find((date) => date == x.date))) {
+                                selected_date2 = (_f = evolandStore.reference_dates) == null ? void 0 : _f.find((date) => new Date(date).getMonth() + 1 == new Date(x.date).getMonth() + 1);
+                                evolandStore.setSelectedReferenceDate(selected_date2);
+                              } else {
+                                evolandStore.setSelectedReferenceDate(x.date);
+                                selected_date2 = x.date;
+                              }
                               evolandStore.setUpdateAsset(true);
                               insertEmptyBufferForSingleBand(
-                                (_h = evolandStore.reference_dates && evolandStore.selectedReferenceDate ? (_f = evolandStore.annotatedRasterAsset) == null ? void 0 : _f.buffer[(_e = evolandStore.reference_dates) == null ? void 0 : _e.indexOf(
+                                (_j = evolandStore.reference_dates && evolandStore.selectedReferenceDate ? (_h = evolandStore.annotatedRasterAsset) == null ? void 0 : _h.buffer[(_g = evolandStore.reference_dates) == null ? void 0 : _g.indexOf(
                                   evolandStore.selectedReferenceDate
-                                )] : (_g = evolandStore.annotatedRasterAsset) == null ? void 0 : _g.buffer[0]) == null ? void 0 : _h.length,
-                                (_i = evolandStore.annotatedRasterAsset) == null ? void 0 : _i.width,
-                                (_j = evolandStore.annotatedRasterAsset) == null ? void 0 : _j.height,
-                                (_k = evolandStore.reference_dates) == null ? void 0 : _k.indexOf(x.date),
+                                )] : (_i = evolandStore.annotatedRasterAsset) == null ? void 0 : _i.buffer[0]) == null ? void 0 : _j.length,
+                                (_k = evolandStore.annotatedRasterAsset) == null ? void 0 : _k.width,
+                                (_l = evolandStore.annotatedRasterAsset) == null ? void 0 : _l.height,
+                                (_m = evolandStore.reference_dates) == null ? void 0 : _m.indexOf(selected_date2),
                                 evolandStore.annotatedRasterAsset,
                                 evolandStore.labels,
                                 evolandStore.isAnnualAnnotation
@@ -10777,7 +10718,7 @@ var init_TimeSeries = __esm({
                       /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
                         "div",
                         {
-                          className: "pl-8 text-xs w-32 text-white " + (((_b = evolandStore.selectedCompositeRasterAsset) == null ? void 0 : _b.id) == x.id || !evolandStore.isAnnualAnnotation && evolandStore.selectedReferenceDate == x.date ? "bg-red-400" : ""),
+                          className: "pl-8 text-xs w-32 text-white " + (((_c = evolandStore.selectedCompositeRasterAsset) == null ? void 0 : _c.id) == x.id || !evolandStore.isAnnualAnnotation && evolandStore.selectedReferenceDate == selected_date ? "bg-red-400" : ""),
                           children: x.date
                         }
                       )
@@ -10786,7 +10727,7 @@ var init_TimeSeries = __esm({
                 ] })
               ] });
             }) }),
-            currentTab == -1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "overflow-x-scroll flex flex-row", children: [
+            currentTab == -1 && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "overflow-x-scroll flex flex-row pt-4", children: [
               !evolandStore.annotatedRasterAsset && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { children: "No annotation" }),
               evolandStore.annotatedRasterAsset && evolandStore.annotation_dates && evolandStore.annotation_dates.map(
                 (annotationDate, index) => {
@@ -10879,8 +10820,7 @@ var init_OverlayLayer = __esm({
               if (e.target.value !== "0") {
                 layerStore.setSelectedLayer(e.target.value);
                 setShowLayerOpacity(true);
-                if (layerStore.layerOpacity == 0)
-                  layerStore.setLayerOpacity(0.4);
+                if (layerStore.layerOpacity == 0) layerStore.setLayerOpacity(0.4);
               } else {
                 setShowLayerOpacity(false);
                 layerStore.setSelectedLayer("");
@@ -10912,16 +10852,17 @@ var GeoWikiMap_exports = {};
 __export(GeoWikiMap_exports, {
   GeoWikiMap: () => GeoWikiMap
 });
-var import_react60, import_react_leaflet28, import_leaflet22, import_dist, import_core44, import_ui43, import_core45, import_react_hotkeys_hook3, import_jsx_runtime77, GeoWikiMapComponent, GeoWikiMap;
+var import_react60, import_react_leaflet28, import_leaflet23, import_dist, import_core44, import_leaflet24, import_ui43, import_core45, import_react_hotkeys_hook3, import_jsx_runtime77, GeoWikiMapComponent, GeoWikiMap;
 var init_GeoWikiMap = __esm({
   "src/Components/Map/GeoWikiMap.tsx"() {
     "use strict";
     "use client";
     import_react60 = require("react");
     import_react_leaflet28 = require("react-leaflet");
-    import_leaflet22 = require("leaflet/dist/leaflet.css");
+    import_leaflet23 = require("leaflet/dist/leaflet.css");
     import_dist = require("@bopen/leaflet-area-selection/dist/index.css");
     import_core44 = require("@geowiki/core");
+    import_leaflet24 = require("leaflet");
     init_EvolandContainer();
     init_EvolandLeftSideBar();
     init_Annotation();
@@ -10944,7 +10885,7 @@ var init_GeoWikiMap = __esm({
     import_jsx_runtime77 = require("react/jsx-runtime");
     GeoWikiMapComponent = ({ mapSettings, session }) => {
       var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
-      const mapRef = (0, import_react60.useRef)();
+      const mapRef = (0, import_react60.useRef)(void 0);
       const router = (0, import_core45.useRouter)();
       var projectId = router.query.projectId;
       var locationId = router.query.locationId;
@@ -11051,7 +10992,7 @@ var init_GeoWikiMap = __esm({
                     children: "Guide"
                   }
                 ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_react_leaflet28.LayersControl, { position: "topright", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_react_leaflet28.LayersControl, { position: "topright", children: [
                   /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_react_leaflet28.LayersControl.BaseLayer, { name: "Esri World imagery", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                     import_react_leaflet28.TileLayer,
                     {
@@ -11086,27 +11027,33 @@ var init_GeoWikiMap = __esm({
                       maxZoom: 21
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_ui43.RequireFeature, { feature: "GeoWiki.EvoLand", children: wmsLayerNames == null ? void 0 : wmsLayerNames.layers.map((layer) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
-                    import_react_leaflet28.LayersControl.Overlay,
-                    {
-                      checked: layer.layerName == layerStore.selectedLayer,
-                      name: layer.layerName,
-                      children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
-                        CustomWMSTileLayer,
-                        {
-                          transparent: true,
-                          zIndex: 100,
-                          layers: layer.layerName,
-                          attribution: "GeoWiki",
-                          format: "image/png",
-                          url: "https://services.terrascope.be/wms/v2",
-                          opacity: layer.opacity == void 0 ? layerStore.layerOpacity : layer.opacity
-                        }
-                      )
-                    },
-                    layer.layerName
-                  )) })
-                ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_ui43.RequireFeature, { feature: "GeoWiki.EvoLand", children: wmsLayerNames == null ? void 0 : wmsLayerNames.layers.map((layer) => {
+                    const len = layer.layerDescription.split(" ").length;
+                    const year = layer.layerDescription.split(" ")[len - 1];
+                    return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+                      import_react_leaflet28.LayersControl.Overlay,
+                      {
+                        checked: layer.layerName == layerStore.selectedLayer,
+                        name: layer.layerName,
+                        children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+                          CustomWMSTileLayer,
+                          {
+                            transparent: true,
+                            zIndex: 100,
+                            layers: layer.layerName,
+                            attribution: "GeoWiki",
+                            format: "image/png",
+                            version: "1.3.0",
+                            crs: import_leaflet24.CRS.EPSG3857,
+                            url: `https://titiler.terrascope.be/wms?time=${year}-01-01`,
+                            opacity: layer.opacity == void 0 ? layerStore.layerOpacity : layer.opacity
+                          }
+                        )
+                      },
+                      layer.layerName
+                    );
+                  }) })
+                ] }) }),
                 /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(import_react_leaflet28.LayerGroup, { children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(LayerStoreList, {}) }),
                 /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(import_ui43.RequireFeature, { feature: "GeoWiki.EvoLand", children: [
                   /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(EvolandContainer, { sessionStatus: session.status }),
@@ -11123,7 +11070,7 @@ var init_GeoWikiMap = __esm({
                             viewBox: "0 0 24 24",
                             xmlns: "http://www.w3.org/2000/svg",
                             fill: "#000000",
-                            className: "w-7 h-7 bg-white mb-2 hover:cursor-pointer",
+                            className: "w-7 h-7 bg-white mb-2 hover:cursor-pointer rounded-md p-1",
                             onClick: () => {
                               evolandStore.setShowTimeSeries(
                                 !evolandStore.showTimeSeries
@@ -11156,7 +11103,7 @@ var init_GeoWikiMap = __esm({
                               viewBox: "0 0 24 24",
                               strokeWidth: "1.5",
                               stroke: "currentColor",
-                              className: "w-7 h-7 mb-2 bg-white hover:cursor-pointer",
+                              className: "w-7 h-7 mb-2 bg-white hover:cursor-pointer rounded-md",
                               children: [
                                 /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
                                   "path",
@@ -11194,7 +11141,7 @@ var init_GeoWikiMap = __esm({
                             viewBox: "0 0 24 24",
                             strokeWidth: "1.5",
                             stroke: "currentColor",
-                            className: "w-7 h-7 bg-white hover:cursor-pointer",
+                            className: "w-7 h-7 bg-white hover:cursor-pointer rounded-md",
                             onClick: () => {
                               evolandStore.onRecenterLocation();
                             },
@@ -11331,8 +11278,8 @@ var init_GeoWikiMap = __esm({
 });
 
 // src/index.tsx
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   Annotation: () => Annotation,
   BasfMap: () => BasfMap,
   BasicMap: () => BasicMap,
@@ -11357,7 +11304,7 @@ __export(src_exports, {
   MapEvents: () => MapEvents,
   MapLibre: () => MapLibre,
   MapSidebar: () => MapSidebar,
-  MarkerClusterGroup: () => MarkerClusterGroup2,
+  MarkerClusterGroup: () => MarkerClusterGroup,
   OverlayLayer: () => OverlayLayer,
   PointSelection: () => PointSelection,
   Questions: () => Questions,
@@ -11374,7 +11321,7 @@ __export(src_exports, {
   useMapLayerStore: () => useMapLayerStore,
   useMapStore: () => useMapStore
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 init_GenericControl();
 init_EvoLandGeometry();
 init_PointSelection();
@@ -11555,7 +11502,7 @@ init_evoland();
 init_EvoLandRasterType();
 
 // src/Components/Map/BasicMap.tsx
-var import_leaflet10 = require("leaflet/dist/leaflet.css");
+var import_leaflet11 = require("leaflet/dist/leaflet.css");
 var import_react36 = require("react");
 var import_react_leaflet15 = require("react-leaflet");
 var import_core33 = require("@geowiki/core");
@@ -11592,10 +11539,8 @@ var BingLayer = class extends L13.TileLayer {
     for (let i = z4; i > 0; i--) {
       let digit = 0;
       const mask = 1 << i - 1;
-      if ((x & mask) !== 0)
-        digit += 1;
-      if ((y & mask) !== 0)
-        digit += 2;
+      if ((x & mask) !== 0) digit += 1;
+      if ((y & mask) !== 0) digit += 2;
       quad = quad + digit;
     }
     return quad;
@@ -11609,8 +11554,7 @@ var BingLayer = class extends L13.TileLayer {
   }
   loadMetadata() {
     var _a;
-    if (this.metaRequested)
-      return;
+    if (this.metaRequested) return;
     this.metaRequested = true;
     const _this = this;
     const cbid = "_bing_metadata_" + L13.Util.stamp(this);
@@ -11618,8 +11562,7 @@ var BingLayer = class extends L13.TileLayer {
       var _a2;
       window[cbid] = void 0;
       const e = document.getElementById(cbid);
-      if (e)
-        (_a2 = e.parentNode) == null ? void 0 : _a2.removeChild(e);
+      if (e) (_a2 = e.parentNode) == null ? void 0 : _a2.removeChild(e);
       if (meta.errorDetails) {
         console.log(meta.errorDetails);
         return;
@@ -11663,8 +11606,7 @@ var BingLayer = class extends L13.TileLayer {
     this._update();
   }
   _update() {
-    if (this._url === null || !this._map)
-      return;
+    if (this._url === null || !this._map) return;
     this._update_attribution();
     super._update();
   }
@@ -11827,8 +11769,7 @@ var useMapControlStore = (0, import_zustand6.create)((set) => ({
   })),
   toggleControlOpen: (id) => set((state) => {
     const targetControl = state.controls.find((c) => c.id === id);
-    if (!targetControl)
-      return state;
+    if (!targetControl) return state;
     const targetPosition = targetControl.position;
     const shouldOpenTarget = !targetControl.isOpen;
     const updatedControls = state.controls.map((control) => {
@@ -12016,7 +11957,7 @@ var import_jsx_runtime42 = require("react/jsx-runtime");
 var constructLegendUrl = (baseUrl, layer, format, style) => {
   return `${baseUrl}?REQUEST=GetLegendGraphic&VERSION=1.0.0&FORMAT=${format}&LAYER=${layer}&STYLE=${style}&legend_options=dpi:150`;
 };
-var fetchLegendData = (baseUrl, layerName, format, style) => __async(void 0, null, function* () {
+var fetchLegendData = (baseUrl, layerName, format, style) => __async(null, null, function* () {
   const legendGraphicUrl = constructLegendUrl(
     baseUrl,
     layerName,
@@ -12817,10 +12758,8 @@ var LayerSwitcher = (0, import_react27.memo)(() => {
     },
     [openHoverCardId]
   );
-  if (error)
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { children: "Error loading map layers" });
-  if (isLoading)
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { children: "Loading layers..." });
+  if (error) return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { children: "Error loading map layers" });
+  if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { children: "Loading layers..." });
   const mapMenus = parseMapMenuItems(mapMenuItems);
   const hasRegularLayers = (mapMenus == null ? void 0 : mapMenus.length) > 0;
   const hasCustomLayers = customLayers.length > 0;
@@ -12834,6 +12773,7 @@ var LayerSwitcher = (0, import_react27.memo)(() => {
         /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
           import_react30.Disclosure,
           {
+            as: "div",
             "data-component": menu.title,
             defaultOpen: mapMenus.length === 1,
             children: ({ open }) => {
@@ -13291,8 +13231,7 @@ var MapControlContainer = (0, import_react35.memo)(() => {
   }, [controls]);
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_ui24.TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_jsx_runtime50.Fragment, { children: Object.entries(POSITION_CLASSES2).map(([position, className]) => {
     const positionControls = controlsByPosition[position] || [];
-    if (positionControls.length === 0)
-      return null;
+    if (positionControls.length === 0) return null;
     return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
       PositionGroup,
       {
@@ -13319,8 +13258,7 @@ var BasicMap = () => {
     ((_f = (_e = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _e.Longitude) == null ? void 0 : _f.Text) || 16.3738
   ];
   (0, import_core33.useRenderInfo)("BasicMap");
-  if (isSettingsLoading)
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_ui25.LoaderFull, {});
+  if (isSettingsLoading) return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_ui25.LoaderFull, {});
   return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
     import_react_leaflet15.MapContainer,
     {
@@ -13349,7 +13287,7 @@ var BasicMap = () => {
 };
 
 // src/Components/Map/BasfMap.tsx
-var import_leaflet14 = require("leaflet/dist/leaflet.css");
+var import_leaflet15 = require("leaflet/dist/leaflet.css");
 var import_react46 = require("react");
 var import_react_leaflet19 = require("react-leaflet");
 var import_useMapSettings2 = __toESM(require("@geowiki/core/src/hooks/useMapSettings"));
@@ -13389,8 +13327,7 @@ var useSelectedPixelStore = (0, import_zustand7.default)((set) => ({
     set((state) => {
       var _a;
       const feat = (_a = geoJson.features[0]) == null ? void 0 : _a.id;
-      if (!feat)
-        return state;
+      if (!feat) return state;
       const existing = state.data.some(
         (item) => item.features[0].id === geoJson.features[0].id
       );
@@ -13477,7 +13414,7 @@ init_map();
 // src/Components/Basf/SelectedPixelsLayer.tsx
 var import_react38 = require("react");
 var import_react_leaflet16 = require("react-leaflet");
-var import_leaflet11 = __toESM(require("leaflet"));
+var import_leaflet12 = __toESM(require("leaflet"));
 var SelectedPixelsLayer = () => {
   const { data } = useSelectedPixelStore();
   const layerRef = (0, import_react38.useRef)(null);
@@ -13485,13 +13422,13 @@ var SelectedPixelsLayer = () => {
   const prevDataRef = (0, import_react38.useRef)(data);
   (0, import_react38.useEffect)(() => {
     if (!layerRef.current) {
-      layerRef.current = import_leaflet11.default.layerGroup().addTo(map);
+      layerRef.current = import_leaflet12.default.layerGroup().addTo(map);
     }
     if (prevDataRef.current !== data) {
       layerRef.current.clearLayers();
       data.forEach((geoJson) => {
         var _a;
-        const layer = import_leaflet11.default.geoJSON(geoJson, {
+        const layer = import_leaflet12.default.geoJSON(geoJson, {
           style: () => ({
             color: "red",
             weight: 2,
@@ -14056,7 +13993,7 @@ var BasfSelect = () => {
     [selectedItems]
   );
   const onSubmit = (0, import_react43.useCallback)(
-    (data) => __async(void 0, null, function* () {
+    (data) => __async(null, null, function* () {
       setIsSubmitting(true);
       try {
         if (checkIfItemExists(data)) {
@@ -14156,8 +14093,8 @@ var import_ui32 = require("@geowiki/ui");
 // src/Components/Controls/MeasureControl.tsx
 var import_react44 = require("react");
 var import_react_leaflet17 = require("react-leaflet");
-var import_leaflet12 = __toESM(require("leaflet"));
-var import_leaflet13 = require("leaflet.polylinemeasure");
+var import_leaflet13 = __toESM(require("leaflet"));
+var import_leaflet14 = require("leaflet.polylinemeasure");
 var import_ui31 = require("@geowiki/ui");
 var import_core38 = require("@geowiki/core");
 var import_jsx_runtime60 = require("react/jsx-runtime");
@@ -14166,9 +14103,8 @@ function PolylineMeasureControl() {
   const controlRef = (0, import_react44.useRef)(null);
   const [active, setActive] = (0, import_react44.useState)(false);
   (0, import_react44.useEffect)(() => {
-    if (!map)
-      return;
-    controlRef.current = import_leaflet12.default.control.polylineMeasure({
+    if (!map) return;
+    controlRef.current = import_leaflet13.default.control.polylineMeasure({
       position: "topright",
       unit: "metres",
       showBearings: true,
@@ -14188,8 +14124,7 @@ function PolylineMeasureControl() {
     };
   }, [map]);
   const togglePolylineMeasure = () => {
-    if (!controlRef.current)
-      return;
+    if (!controlRef.current) return;
     if (!controlRef.current._measureControl) {
       console.warn("Measurement control not properly initialized");
       return;
@@ -14205,8 +14140,7 @@ function PolylineMeasureControl() {
     }
   };
   const clearMeasurements = () => {
-    if (!controlRef.current)
-      return;
+    if (!controlRef.current) return;
     controlRef.current._clearAllMeasurements();
     import_core38.trackMapEvent.measurementTool("clear");
   };
@@ -14315,8 +14249,7 @@ var BasfMapComponent = (_a) => {
     Number((_i = (_h = (_g = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _g.Longitude) == null ? void 0 : _h.Text) != null ? _i : 16.3738)
   ];
   const steps = (_k = (_j = mapSettings == null ? void 0 : mapSettings.MapSettings) == null ? void 0 : _j.TourSteps) == null ? void 0 : _k.Text;
-  if (isSettingsLoading)
-    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_ui33.LoaderFull, {});
+  if (isSettingsLoading) return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_ui33.LoaderFull, {});
   return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_jsx_runtime62.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(
     import_react_leaflet19.MapContainer,
     __spreadProps(__spreadValues({
@@ -14344,7 +14277,7 @@ var BasfMap = (0, import_react46.memo)(BasfMapComponent);
 BasfMap.displayName = "BasfMap";
 
 // src/Components/Map/GeoTreesMap.tsx
-var import_leaflet16 = require("leaflet/dist/leaflet.css");
+var import_leaflet17 = require("leaflet/dist/leaflet.css");
 var import_react_leaflet23 = require("react-leaflet");
 
 // src/Components/Map/GeoTreesControlList.tsx
@@ -14386,7 +14319,7 @@ var GeoTreesDownloadContent = () => {
     }
   }, [session, setValue]);
   (0, import_react47.useEffect)(() => {
-    const fetchCountries = () => __async(void 0, null, function* () {
+    const fetchCountries = () => __async(null, null, function* () {
       try {
         const response = yield fetch(
           `${baseUrl}/api/plots/get-available-countries`,
@@ -14402,7 +14335,7 @@ var GeoTreesDownloadContent = () => {
         console.error("Error fetching countries:", error);
       }
     });
-    const fetchVersions = () => __async(void 0, null, function* () {
+    const fetchVersions = () => __async(null, null, function* () {
       try {
         const response = yield fetch(
           `${baseUrl}/api/plots/available-versions`,
@@ -14656,8 +14589,7 @@ var ScaleControl3 = ({
   const [scale, setScale] = (0, import_react48.useState)("");
   (0, import_react48.useEffect)(() => {
     const updateScale = () => {
-      if (!map)
-        return;
+      if (!map) return;
       const center4 = map.getCenter();
       const zoom = map.getZoom();
       const metersPerPixel = 156543.03392 * Math.cos(center4.lat * Math.PI / 180) / Math.pow(2, zoom);
@@ -14673,8 +14605,7 @@ var ScaleControl3 = ({
       map.off("moveend", updateScale);
     };
   }, [map]);
-  if (!scale)
-    return null;
+  if (!scale) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
     "div",
     {
@@ -14769,7 +14700,7 @@ var import_react52 = require("react");
 var import_react50 = require("react");
 var import_react_leaflet22 = require("react-leaflet");
 init_MarkerClusterGroup();
-var import_leaflet15 = __toESM(require("leaflet"));
+var import_leaflet16 = __toESM(require("leaflet"));
 init_mapLayers();
 init_customLayers();
 var import_MapPinIcon3 = __toESM(require("@heroicons/react/24/solid/MapPinIcon"));
@@ -14792,7 +14723,7 @@ var createTreeIcon = (color = "#22c55e") => {
   const iconHtml = (0, import_server5.renderToString)(
     /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_MapPinIcon3.default, { height: 24, width: 24, color })
   );
-  return new import_leaflet15.default.DivIcon({
+  return new import_leaflet16.default.DivIcon({
     html: `<div style="
       display: flex;
       align-items: center;
@@ -14816,7 +14747,7 @@ var createClusterIcon5 = (cluster) => {
     size = 48;
     fontSize = 16;
   }
-  return new import_leaflet15.default.DivIcon({
+  return new import_leaflet16.default.DivIcon({
     html: `<div style="
       background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
       color: white;
@@ -14834,7 +14765,7 @@ var createClusterIcon5 = (cluster) => {
       text-shadow: 0 1px 2px rgba(0,0,0,0.5);
     ">${childCount}</div>`,
     className: "custom-tree-cluster-icon",
-    iconSize: import_leaflet15.default.point(size, size)
+    iconSize: import_leaflet16.default.point(size, size)
   });
 };
 var TreeMarkerPopup = ({
@@ -15043,7 +14974,7 @@ var GeoTreesCustomLayerComponent = () => {
   );
   return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_jsx_runtime66.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-      MarkerClusterGroup2,
+      MarkerClusterGroup,
       {
         chunkedLoading: true,
         maxClusterRadius: 60,
@@ -15273,7 +15204,7 @@ var GeoTreesExternalLayer = (0, import_react51.forwardRef)(
     const externalUrl = `${API_URL}/api/external/google-sheet-geojson`;
     const { isLoading, error, data } = (0, import_react_query5.useQuery)({
       queryKey: ["geoTreesExternal", externalUrl],
-      queryFn: () => __async(void 0, null, function* () {
+      queryFn: () => __async(null, null, function* () {
         if (!API_URL) {
           throw new Error("NEXT_PUBLIC_GEO_TREE_API_URL is not configured");
         }
@@ -15305,8 +15236,7 @@ var GeoTreesExternalLayer = (0, import_react51.forwardRef)(
     );
     const addGeoTreesLayer = (0, import_react51.useCallback)(() => {
       var _a2;
-      if (!data)
-        return;
+      if (!data) return;
       const layerId = "geotrees-external-layer";
       if (hasLayerBeenAdded(layerId) || existingLayer || hasAddedLayer.current) {
         console.warn("GEO-TREES BRM layer already exists, skipping addition", {
@@ -15319,8 +15249,7 @@ var GeoTreesExternalLayer = (0, import_react51.forwardRef)(
       const filteredFeatures = ((_a2 = data.features) == null ? void 0 : _a2.filter((feature) => {
         var _a3;
         const status = (_a3 = feature.properties) == null ? void 0 : _a3.Status;
-        if (!status)
-          return true;
+        if (!status) return true;
         const statusKey = getStatusFromRaw(status);
         return statusKey ? statusFilter[statusKey] : true;
       })) || [];
@@ -15388,12 +15317,9 @@ var GeoTreesExternalLayer = (0, import_react51.forwardRef)(
         addGeoTreesLayer();
       }
     }, [data, autoAdd, existingLayer, addGeoTreesLayer, hasLayerBeenAdded]);
-    if (error)
-      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ErrorDisplay, { error });
-    if (isLoading)
-      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(LoadingDisplay, {});
-    if (!((_a = data == null ? void 0 : data.features) == null ? void 0 : _a.length))
-      return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(EmptyStateDisplay, {});
+    if (error) return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ErrorDisplay, { error });
+    if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(LoadingDisplay, {});
+    if (!((_a = data == null ? void 0 : data.features) == null ? void 0 : _a.length)) return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(EmptyStateDisplay, {});
     return null;
   }
 );
@@ -15444,8 +15370,7 @@ var GeoTreesMap = () => {
       "Error loading map settings: ",
       error.message
     ] }) });
-  if (isSettingsLoading)
-    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_ui35.LoaderFull, { showInCenter: false });
+  if (isSettingsLoading) return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_ui35.LoaderFull, { showInCenter: false });
   const zoom = (_c = (_b = (_a = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _a.Zoom) == null ? void 0 : _b.Value) != null ? _c : 12;
   const center4 = [
     (_f = (_e = (_d = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _d.Latitude) == null ? void 0 : _e.Text) != null ? _f : 48.2082,
@@ -15455,7 +15380,7 @@ var GeoTreesMap = () => {
 };
 
 // src/Components/Canopy/CanopyMap.tsx
-var import_leaflet21 = require("leaflet/dist/leaflet.css");
+var import_leaflet22 = require("leaflet/dist/leaflet.css");
 var import_react58 = require("react");
 var import_react_leaflet27 = require("react-leaflet");
 var import_core41 = require("@geowiki/core");
@@ -15471,7 +15396,7 @@ var import_react_leaflet26 = require("react-leaflet");
 // src/Components/Map/GenericAreaSelect.tsx
 var import_react53 = require("react");
 var import_react_leaflet24 = require("react-leaflet");
-var import_leaflet17 = require("leaflet");
+var import_leaflet18 = require("leaflet");
 
 // src/store/AreaSelectStore.ts
 var import_zustand8 = require("zustand");
@@ -15506,11 +15431,10 @@ var useAreaSelect = ({
   const rectangleRef = (0, import_react53.useRef)(null);
   (0, import_react53.useEffect)(() => {
     var _a;
-    if (!map.selectArea)
-      return;
+    if (!map.selectArea) return;
     (_a = map.selectArea) == null ? void 0 : _a.setControlKey(false);
     if (!rectangleRef.current) {
-      rectangleRef.current = new import_leaflet17.Rectangle(
+      rectangleRef.current = new import_leaflet18.Rectangle(
         [
           [0, 0],
           [0, 0]
@@ -15520,8 +15444,7 @@ var useAreaSelect = ({
     }
     const handleAreaSelected = (e) => {
       var _a2, _b, _c;
-      if (!e.bounds)
-        return;
+      if (!e.bounds) return;
       const boundsString = e.bounds.toBBoxString();
       if (onAreaSelected) {
         onAreaSelected(boundsString);
@@ -15589,14 +15512,13 @@ var useAreaSelect = ({
 var import_react54 = require("react");
 var import_lucide_react5 = require("lucide-react");
 var import_ui36 = require("@geowiki/ui");
-var import_leaflet18 = __toESM(require("leaflet"));
+var import_leaflet19 = __toESM(require("leaflet"));
 var import_jsx_runtime70 = require("react/jsx-runtime");
 var CanopyAtlasDownload = () => {
   const [format, setFormat] = (0, import_react54.useState)("shape-zip");
   const { bbox: bbox4 } = useAreaSelectStore();
-  const handleDownload = () => __async(void 0, null, function* () {
-    if (!bbox4)
-      return;
+  const handleDownload = () => __async(null, null, function* () {
+    if (!bbox4) return;
     const params = {
       request: "GetFeature",
       service: "WFS",
@@ -15608,11 +15530,10 @@ var CanopyAtlasDownload = () => {
       maxFeatures: 1e3
     };
     const baseUrl = "https://geoserver.iiasa.ac.at/geoserver/canopyatlas/ows";
-    const wfsUrl = baseUrl + import_leaflet18.default.Util.getParamString(params, baseUrl, true);
+    const wfsUrl = baseUrl + import_leaflet19.default.Util.getParamString(params, baseUrl, true);
     try {
       const response = yield fetch(wfsUrl);
-      if (!response.ok)
-        throw new Error("Download failed");
+      if (!response.ok) throw new Error("Download failed");
       const blob = yield response.blob();
       const url = window.URL.createObjectURL(blob);
       const a = document.createElement("a");
@@ -15662,7 +15583,7 @@ var CanopyAtlasDownload = () => {
 var import_react55 = require("react");
 var import_ui37 = require("@geowiki/ui");
 var import_lucide_react6 = require("lucide-react");
-var import_leaflet19 = __toESM(require("leaflet"));
+var import_leaflet20 = __toESM(require("leaflet"));
 var import_ui38 = require("@geowiki/ui");
 var import_react_hook_form5 = require("react-hook-form");
 var z2 = __toESM(require("zod"));
@@ -15786,20 +15707,15 @@ var CanopyFilter = (0, import_react55.memo)(({ onFilterChange }) => {
     localStorage.setItem(STORAGE_KEY, JSON.stringify(updatedFilters));
     onFilterChange(updatedFilters);
   };
-  const handleDownload = () => __async(void 0, null, function* () {
+  const handleDownload = () => __async(null, null, function* () {
     const cqlFilters = [];
-    if (filters.biome)
-      cqlFilters.push(`biome='${filters.biome}'`);
-    if (filters.realm)
-      cqlFilters.push(`realm='${filters.realm}'`);
-    if (filters.access)
-      cqlFilters.push(`access='${filters.access}'`);
+    if (filters.biome) cqlFilters.push(`biome='${filters.biome}'`);
+    if (filters.realm) cqlFilters.push(`realm='${filters.realm}'`);
+    if (filters.access) cqlFilters.push(`access='${filters.access}'`);
     if (filters.idunique)
       cqlFilters.push(`IDunique LIKE '%${filters.idunique}%'`);
-    if (filters.minyear)
-      cqlFilters.push(`minyear>=${filters.minyear}`);
-    if (filters.maxyear)
-      cqlFilters.push(`minyear<=${filters.maxyear}`);
+    if (filters.minyear) cqlFilters.push(`minyear>=${filters.minyear}`);
+    if (filters.maxyear) cqlFilters.push(`minyear<=${filters.maxyear}`);
     const params = __spreadValues({
       request: "GetFeature",
       service: "WFS",
@@ -15810,11 +15726,10 @@ var CanopyFilter = (0, import_react55.memo)(({ onFilterChange }) => {
       maxFeatures: 1e3
     }, cqlFilters.length > 0 && { CQL_FILTER: cqlFilters.join(" AND ") });
     const baseUrl = "https://geoserver.iiasa.ac.at/geoserver/canopyatlas/ows";
-    const wfsUrl = baseUrl + import_leaflet19.default.Util.getParamString(params, baseUrl, true);
+    const wfsUrl = baseUrl + import_leaflet20.default.Util.getParamString(params, baseUrl, true);
     try {
       const response = yield fetch(wfsUrl);
-      if (!response.ok)
-        throw new Error("Download failed");
+      if (!response.ok) throw new Error("Download failed");
       const blob = yield response.blob();
       const url = window.URL.createObjectURL(blob);
       const a = document.createElement("a");
@@ -16039,7 +15954,7 @@ var import_react56 = require("react");
 var import_react_leaflet25 = require("react-leaflet");
 var import_react_query6 = require("@tanstack/react-query");
 var turf7 = __toESM(require("@turf/turf"));
-var import_leaflet20 = __toESM(require("leaflet"));
+var import_leaflet21 = __toESM(require("leaflet"));
 init_MarkerClusterGroup();
 var import_server7 = __toESM(require("react-dom/server"));
 init_map();
@@ -16050,10 +15965,8 @@ var constructCqlFilter = (filterParams) => {
     return "";
   }
   let _a = filterParams || {}, { minyear, maxyear } = _a, rest = __objRest(_a, ["minyear", "maxyear"]);
-  if (Array.isArray(minyear))
-    minyear = minyear[0];
-  if (Array.isArray(maxyear))
-    maxyear = maxyear[0];
+  if (Array.isArray(minyear)) minyear = minyear[0];
+  if (Array.isArray(maxyear)) maxyear = maxyear[0];
   const cqlExpressions = [];
   if (minyear && maxyear) {
     cqlExpressions.push(
@@ -16100,7 +16013,7 @@ var defaultIcon = (() => {
   const iconSvg = import_server7.default.renderToString(
     /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_lucide_react7.MapPin, { size: 41, color: "#2196F3", strokeWidth: 2, fill: "#ffffff" })
   );
-  return new import_leaflet20.default.DivIcon({
+  return new import_leaflet21.default.DivIcon({
     html: iconSvg,
     className: "wfs-layer-marker-icon",
     iconSize: [41, 41],
@@ -16160,16 +16073,14 @@ var formatPropertyValue = (value, propertyName) => {
   return value.toString();
 };
 var createDefaultPopupContent = (feature, propertyNames) => {
-  if (!feature.properties)
-    return "";
+  if (!feature.properties) return "";
   const propertiesToShow = (propertyNames == null ? void 0 : propertyNames.length) ? propertyNames : DEFAULT_POPUP_PROPERTIES;
   const properties = Object.entries(feature.properties).filter(([key]) => propertiesToShow.includes(key)).sort((a, b) => {
     const indexA = propertiesToShow.indexOf(a[0]);
     const indexB = propertiesToShow.indexOf(b[0]);
     return indexA - indexB;
   });
-  if (properties.length === 0)
-    return "";
+  if (properties.length === 0) return "";
   return `
     <div class="leaflet-popup-content-wrapper" style="background-color: #fff; padding: 0; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.15);">
       <div style="width: 100%; overflow-y: auto;">
@@ -16240,7 +16151,7 @@ var openDatabase = () => {
     };
   });
 };
-var storeInIndexedDB = (key, data) => __async(void 0, null, function* () {
+var storeInIndexedDB = (key, data) => __async(null, null, function* () {
   try {
     const db = yield openDatabase();
     const transaction = db.transaction(STORE_NAME, "readwrite");
@@ -16259,7 +16170,7 @@ var storeInIndexedDB = (key, data) => __async(void 0, null, function* () {
     console.warn("Failed to store data in IndexedDB:", e);
   }
 });
-var getFromIndexedDB = (key) => __async(void 0, null, function* () {
+var getFromIndexedDB = (key) => __async(null, null, function* () {
   try {
     const db = yield openDatabase();
     const transaction = db.transaction(STORE_NAME, "readonly");
@@ -16281,7 +16192,7 @@ var getFromIndexedDB = (key) => __async(void 0, null, function* () {
     return null;
   }
 });
-var cleanupIndexedDB = () => __async(void 0, null, function* () {
+var cleanupIndexedDB = () => __async(null, null, function* () {
   try {
     const db = yield openDatabase();
     const transaction = db.transaction(STORE_NAME, "readwrite");
@@ -16331,8 +16242,7 @@ var WfsLayer = ({
     }
   });
   const stableFilterParams = (0, import_react56.useMemo)(() => {
-    if (!filterParams)
-      return null;
+    if (!filterParams) return null;
     return JSON.stringify(filterParams);
   }, [filterParams]);
   const queryKey = (0, import_react56.useMemo)(() => {
@@ -16354,7 +16264,7 @@ var WfsLayer = ({
   }, [url, layerName, filterParams, useServerFiltering]);
   const { data: geoJsonData, error } = (0, import_react_query6.useQuery)({
     queryKey,
-    queryFn: () => __async(void 0, null, function* () {
+    queryFn: () => __async(null, null, function* () {
       mapStore.setIsLoading(true);
       const wfsUrl = constructWfsUrl();
       const storageKey = `wfs-data-${queryKey.join("-")}`;
@@ -16419,8 +16329,7 @@ var WfsLayer = ({
   const getFeatureStyle = (0, import_react56.useCallback)(
     (feature) => {
       var _a2;
-      if (!feature)
-        return defaultStyle;
+      if (!feature) return defaultStyle;
       const featureId = ((_a2 = feature.id) == null ? void 0 : _a2.toString()) || JSON.stringify(feature.properties);
       return featureId === selectedFeatureId ? highlightStyle : defaultStyle;
     },
@@ -16431,8 +16340,7 @@ var WfsLayer = ({
       var _a2;
       const featureId = ((_a2 = feature.id) == null ? void 0 : _a2.toString()) || JSON.stringify(feature.properties);
       layerRef.current[featureId] = layer;
-      if (!popupOptions || !feature.properties)
-        return;
+      if (!popupOptions || !feature.properties) return;
       let popupContent;
       if (popupOptions.renderContent) {
         popupContent = popupOptions.renderContent(feature);
@@ -16444,7 +16352,7 @@ var WfsLayer = ({
       }
       const content = typeof popupContent === "string" ? popupContent : import_server7.default.renderToString(popupContent);
       if (popupContent) {
-        const popup = import_leaflet20.default.popup(__spreadValues(__spreadValues({}, DEFAULT_POPUP_OPTIONS), popupOptions.popupOptions || {}));
+        const popup = import_leaflet21.default.popup(__spreadValues(__spreadValues({}, DEFAULT_POPUP_OPTIONS), popupOptions.popupOptions || {}));
         popup.on("add", () => {
           setSelectedFeatureId(featureId);
         });
@@ -16477,8 +16385,7 @@ var WfsLayer = ({
     []
   );
   const filteredGeoJson = (0, import_react56.useMemo)(() => {
-    if (!geoJsonData)
-      return null;
+    if (!geoJsonData) return null;
     if (useServerFiltering || !filterParams || Object.keys(filterParams).length === 0) {
       return geoJsonData;
     }
@@ -16531,7 +16438,7 @@ var WfsLayer = ({
       },
       layerKey
     ),
-    showMarkers && shouldRenderMarkers && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(MarkerClusterGroup2, __spreadProps(__spreadValues({}, clusterOptions), { children: filteredGeoJson.features.map(
+    showMarkers && shouldRenderMarkers && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(MarkerClusterGroup, __spreadProps(__spreadValues({}, clusterOptions), { children: filteredGeoJson.features.map(
       (feature, index) => {
         var _a2;
         const coordinates = getFeaturePoint(feature);
@@ -16715,15 +16622,14 @@ var import_jsx_runtime74 = require("react/jsx-runtime");
 var CanopyMap = () => {
   var _a, _b, _c, _d, _e, _f;
   const { data: mapSettings, isLoading: isSettingsLoading } = (0, import_useMapSettings4.default)();
-  const mapRef = (0, import_react58.useRef)();
+  const mapRef = (0, import_react58.useRef)(void 0);
   const zoom = ((_b = (_a = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _a.Zoom) == null ? void 0 : _b.Value) || 5;
   const center4 = [
     ((_d = (_c = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _c.Latitude) == null ? void 0 : _d.Text) || 48.2082,
     ((_f = (_e = mapSettings == null ? void 0 : mapSettings.LocationPart) == null ? void 0 : _e.Longitude) == null ? void 0 : _f.Text) || 16.3738
   ];
   (0, import_core41.useRenderInfo)("BasicMap");
-  if (isSettingsLoading)
-    return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_ui41.LoaderFull, { showInCenter: false });
+  if (isSettingsLoading) return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_ui41.LoaderFull, { showInCenter: false });
   return /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_jsx_runtime74.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
     import_react_leaflet27.MapContainer,
     {
@@ -16847,7 +16753,7 @@ var BasfLeftPanel = () => {
     [selectedItems]
   );
   const onSubmit = (0, import_react59.useCallback)(
-    (data) => __async(void 0, null, function* () {
+    (data) => __async(null, null, function* () {
       setIsSubmitting(true);
       try {
         if (checkIfItemExists(data)) {
@@ -16953,8 +16859,7 @@ var WaybackTimelineMap = (props) => {
     return null;
   }
   (0, import_react61.useEffect)(() => {
-    if (props.mapping)
-      setWAYBACK_SNAPSHOTS(props.mapping);
+    if (props.mapping) setWAYBACK_SNAPSHOTS(props.mapping);
   }, [props.mapping]);
   const west = parseFloat(searchParams.get("xmin"));
   const south = parseFloat(searchParams.get("ymin"));
@@ -17037,6 +16942,7 @@ var WaybackTimelineMap = (props) => {
 var import_react66 = require("react");
 var import_react67 = require("react");
 var import_maplibre_gl = __toESM(require("maplibre-gl"));
+var import_maplibre_gl2 = require("maplibre-gl/dist/maplibre-gl.css");
 var import_MapPinIcon4 = __toESM(require("@heroicons/react/24/solid/MapPinIcon"));
 var import_server8 = require("react-dom/server");
 
@@ -17352,7 +17258,7 @@ var LayerItem2 = (0, import_react62.memo)(
   }
 );
 LayerItem2.displayName = "LayerItem";
-var LayerSwitcher2 = (0, import_react62.memo)(({ mapMenuItems, customLayers }) => {
+var LayerSwitcher2 = (0, import_react62.memo)((({ mapMenuItems, customLayers }) => {
   const store = useMapLayerStore2();
   const [openHoverCardId, setOpenHoverCardId] = (0, import_react62.useState)(null);
   (0, import_react62.useEffect)(() => {
@@ -17383,6 +17289,7 @@ var LayerSwitcher2 = (0, import_react62.memo)(({ mapMenuItems, customLayers }) =
         /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
           import_react65.Disclosure,
           {
+            as: "div",
             "data-component": menu.title,
             defaultOpen: mapMenuItems.length === 1,
             children: ({ open }) => {
@@ -17408,8 +17315,7 @@ var LayerSwitcher2 = (0, import_react62.memo)(({ mapMenuItems, customLayers }) =
                       ) !== -1,
                       onToggle: () => {
                         handleToggle(layer);
-                        if (layer.ontoggle)
-                          layer.ontoggle();
+                        if (layer.ontoggle) layer.ontoggle();
                       },
                       openHoverCardId,
                       onInfoClick: handleInfoClick
@@ -17465,30 +17371,25 @@ var LayerSwitcher2 = (0, import_react62.memo)(({ mapMenuItems, customLayers }) =
       ] })
     ] }, menu.id);
   }) });
-});
+}));
 LayerSwitcher2.displayName = "LayerSwitcher";
 
 // src/Components/Generic/Map/MapControlToolbar.tsx
 var Popover7 = __toESM(require("@radix-ui/react-popover"));
 var import_ui45 = require("@geowiki/ui");
 
-// ../../node_modules/clsx/dist/clsx.m.js
+// ../../node_modules/clsx/dist/clsx.mjs
 function r(e) {
   var t, f, n = "";
-  if ("string" == typeof e || "number" == typeof e)
-    n += e;
-  else if ("object" == typeof e)
-    if (Array.isArray(e))
-      for (t = 0; t < e.length; t++)
-        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
-    else
-      for (t in e)
-        e[t] && (n && (n += " "), n += t);
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
   return n;
 }
 function clsx() {
-  for (var e, t, f = 0, n = ""; f < arguments.length; )
-    (e = arguments[f++]) && (t = r(e)) && (n && (n += " "), n += t);
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
   return n;
 }
 
@@ -17869,7 +17770,7 @@ var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
 var fractionRegex = /^\d+\/\d+$/;
 var stringLengths = /* @__PURE__ */ new Set(["px", "full", "screen"]);
 var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
-var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))/;
+var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
 var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
 function isLength(value) {
   return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value) || isArbitraryLength(value);
@@ -17969,8 +17870,11 @@ function getDefaultConfig() {
   var getOverflow = function getOverflow2() {
     return ["auto", "hidden", "clip", "visible", "scroll"];
   };
-  var getSpacingWithAuto = function getSpacingWithAuto2() {
-    return ["auto", spacing];
+  var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary2() {
+    return ["auto", isArbitraryValue, spacing];
+  };
+  var getSpacingWithArbitrary = function getSpacingWithArbitrary2() {
+    return [isArbitraryValue, spacing];
   };
   var getLengthWithEmpty = function getLengthWithEmpty2() {
     return ["", isLength];
@@ -18007,29 +17911,29 @@ function getDefaultConfig() {
     theme: {
       colors: [isAny],
       spacing: [isLength],
-      blur: ["none", "", isTshirtSize, isArbitraryLength],
+      blur: ["none", "", isTshirtSize, isArbitraryValue],
       brightness: getNumber(),
       borderColor: [colors],
-      borderRadius: ["none", "", "full", isTshirtSize, isArbitraryLength],
-      borderSpacing: [spacing],
+      borderRadius: ["none", "", "full", isTshirtSize, isArbitraryValue],
+      borderSpacing: getSpacingWithArbitrary(),
       borderWidth: getLengthWithEmpty(),
       contrast: getNumber(),
       grayscale: getZeroAndEmpty(),
       hueRotate: getNumberAndArbitrary(),
       invert: getZeroAndEmpty(),
-      gap: [spacing],
+      gap: getSpacingWithArbitrary(),
       gradientColorStops: [colors],
       gradientColorStopPositions: [isPercent, isArbitraryLength],
-      inset: getSpacingWithAuto(),
-      margin: getSpacingWithAuto(),
+      inset: getSpacingWithAutoAndArbitrary(),
+      margin: getSpacingWithAutoAndArbitrary(),
       opacity: getNumber(),
-      padding: [spacing],
+      padding: getSpacingWithArbitrary(),
       saturate: getNumber(),
       scale: getNumber(),
       sepia: getZeroAndEmpty(),
       skew: getNumberAndArbitrary(),
-      space: [spacing],
-      translate: [spacing]
+      space: getSpacingWithArbitrary(),
+      translate: getSpacingWithArbitrary()
     },
     classGroups: {
       // Layout
@@ -18253,7 +18157,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/flex-basis
        */
       basis: [{
-        basis: [spacing]
+        basis: getSpacingWithAutoAndArbitrary()
       }],
       /**
        * Flex Direction
@@ -18310,7 +18214,7 @@ function getDefaultConfig() {
        */
       "col-start-end": [{
         col: ["auto", {
-          span: [isInteger]
+          span: ["full", isInteger]
         }, isArbitraryValue]
       }],
       /**
@@ -18619,14 +18523,14 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/width
        */
       w: [{
-        w: ["auto", "min", "max", "fit", spacing]
+        w: ["auto", "min", "max", "fit", isArbitraryValue, spacing]
       }],
       /**
        * Min-Width
        * @see https://tailwindcss.com/docs/min-width
        */
       "min-w": [{
-        "min-w": ["min", "max", "fit", isLength]
+        "min-w": ["min", "max", "fit", isArbitraryValue, isLength]
       }],
       /**
        * Max-Width
@@ -18635,28 +18539,28 @@ function getDefaultConfig() {
       "max-w": [{
         "max-w": ["0", "none", "full", "min", "max", "fit", "prose", {
           screen: [isTshirtSize]
-        }, isTshirtSize, isArbitraryLength]
+        }, isTshirtSize, isArbitraryValue]
       }],
       /**
        * Height
        * @see https://tailwindcss.com/docs/height
        */
       h: [{
-        h: [spacing, "auto", "min", "max", "fit"]
+        h: [isArbitraryValue, spacing, "auto", "min", "max", "fit"]
       }],
       /**
        * Min-Height
        * @see https://tailwindcss.com/docs/min-height
        */
       "min-h": [{
-        "min-h": ["min", "max", "fit", isLength]
+        "min-h": ["min", "max", "fit", isArbitraryValue, isLength]
       }],
       /**
        * Max-Height
        * @see https://tailwindcss.com/docs/max-height
        */
       "max-h": [{
-        "max-h": [spacing, "min", "max", "fit"]
+        "max-h": [isArbitraryValue, spacing, "min", "max", "fit"]
       }],
       // Typography
       /**
@@ -18725,7 +18629,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/letter-spacing
        */
       tracking: [{
-        tracking: ["tighter", "tight", "normal", "wide", "wider", "widest", isArbitraryLength]
+        tracking: ["tighter", "tight", "normal", "wide", "wider", "widest", isArbitraryValue]
       }],
       /**
        * Line Clamp
@@ -18739,7 +18643,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/line-height
        */
       leading: [{
-        leading: ["none", "tight", "snug", "normal", "relaxed", "loose", isLength]
+        leading: ["none", "tight", "snug", "normal", "relaxed", "loose", isArbitraryValue, isLength]
       }],
       /**
        * List Style Image
@@ -18822,7 +18726,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": ["auto", isLength]
+        "underline-offset": ["auto", isArbitraryValue, isLength]
       }],
       /**
        * Text Decoration Color
@@ -18846,14 +18750,14 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/text-indent
        */
       indent: [{
-        indent: [spacing]
+        indent: getSpacingWithArbitrary()
       }],
       /**
        * Vertical Alignment
        * @see https://tailwindcss.com/docs/vertical-align
        */
       "vertical-align": [{
-        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", isArbitraryLength]
+        align: ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", isArbitraryValue]
       }],
       /**
        * Whitespace
@@ -19283,7 +19187,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [isLength]
+        "outline-offset": [isArbitraryValue, isLength]
       }],
       /**
        * Outline Width
@@ -19362,7 +19266,7 @@ function getDefaultConfig() {
         opacity: [opacity]
       }],
       /**
-       * Mix Beldn Mode
+       * Mix Blend Mode
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
@@ -19721,126 +19625,126 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-m": [{
-        "scroll-m": [spacing]
+        "scroll-m": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin X
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mx": [{
-        "scroll-mx": [spacing]
+        "scroll-mx": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Y
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-my": [{
-        "scroll-my": [spacing]
+        "scroll-my": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Start
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ms": [{
-        "scroll-ms": [spacing]
+        "scroll-ms": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin End
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-me": [{
-        "scroll-me": [spacing]
+        "scroll-me": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Top
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mt": [{
-        "scroll-mt": [spacing]
+        "scroll-mt": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Right
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mr": [{
-        "scroll-mr": [spacing]
+        "scroll-mr": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Bottom
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-mb": [{
-        "scroll-mb": [spacing]
+        "scroll-mb": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Margin Left
        * @see https://tailwindcss.com/docs/scroll-margin
        */
       "scroll-ml": [{
-        "scroll-ml": [spacing]
+        "scroll-ml": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-p": [{
-        "scroll-p": [spacing]
+        "scroll-p": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding X
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-px": [{
-        "scroll-px": [spacing]
+        "scroll-px": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Y
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-py": [{
-        "scroll-py": [spacing]
+        "scroll-py": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Start
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-ps": [{
-        "scroll-ps": [spacing]
+        "scroll-ps": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding End
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pe": [{
-        "scroll-pe": [spacing]
+        "scroll-pe": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Top
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pt": [{
-        "scroll-pt": [spacing]
+        "scroll-pt": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Right
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pr": [{
-        "scroll-pr": [spacing]
+        "scroll-pr": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Bottom
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pb": [{
-        "scroll-pb": [spacing]
+        "scroll-pb": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Padding Left
        * @see https://tailwindcss.com/docs/scroll-padding
        */
       "scroll-pl": [{
-        "scroll-pl": [spacing]
+        "scroll-pl": getSpacingWithArbitrary()
       }],
       /**
        * Scroll Snap Align
@@ -20097,13 +20001,14 @@ MapControlToolbar.displayName = "MapControlToolbar";
 // src/Components/Map/MapLibre.tsx
 var import_ui46 = require("@geowiki/ui");
 var import_jsx_runtime81 = require("react/jsx-runtime");
-var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapControls, sourceData }, ref) => {
+var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapControls, sourceData, show_popup, popup }, ref) => {
   const mapContainer = ref;
   const mapRef = (0, import_react66.useRef)(null);
+  const [isMapReady, setIsMapReady] = (0, import_react66.useState)(false);
+  const hasSatelliteLayer = baseLayers == null ? void 0 : baseLayers.find((layer) => layer.layer_type == "satellite");
   const changeMapProjection = () => {
     var _a;
-    if (!mapRef.current)
-      return;
+    if (!mapRef.current) return;
     const map = mapRef.current;
     const currentProjection = (_a = map.getProjection()) == null ? void 0 : _a.type;
     const newProjection = currentProjection === "mercator" ? "globe" : "mercator";
@@ -20112,29 +20017,30 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
     });
   };
   const zoomIn = () => {
-    if (!mapRef.current)
-      return;
+    if (!mapRef.current) return;
     const map = mapRef.current;
     map.zoomIn();
+    return map.getBounds();
   };
   const zoomOut = () => {
-    if (!mapRef.current)
-      return;
+    if (!mapRef.current) return;
     const map = mapRef.current;
     map.zoomOut();
+    return map.getBounds();
   };
-  function getLayersByPattern(map, pattern) {
-    return map.getStyle().layers.filter((layer) => pattern.test(layer.id)).map((layer) => layer.id);
+  function getLayersByPattern(pattern) {
+    if (!mapRef.current) return;
+    const map = mapRef.current;
+    return map == null ? void 0 : map.getStyle().layers.filter((layer) => pattern.test(layer.id)).map((layer) => layer.id);
   }
   const handleToggle = (layerId) => {
-    if (!mapRef.current)
-      return;
+    if (!mapRef.current) return;
     const map = mapRef.current;
-    const layers = getLayersByPattern(map, new RegExp(layerId));
-    layers.forEach((id) => {
-      const visibility = map.getLayoutProperty(id, "visibility");
+    const layers = getLayersByPattern(new RegExp(layerId));
+    layers == null ? void 0 : layers.forEach((id) => {
+      const visibility = map == null ? void 0 : map.getLayoutProperty(id, "visibility");
       const newVisibility = visibility === "none" ? "visible" : "none";
-      map.setLayoutProperty(id, "visibility", newVisibility);
+      map == null ? void 0 : map.setLayoutProperty(id, "visibility", newVisibility);
     });
   };
   const buildControls = (controls) => {
@@ -20157,7 +20063,11 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
             {
               id: "zoomIn",
               icon: import_ui46.PlusIcon,
-              onClick: zoomIn,
+              onClick: () => {
+                var _a;
+                const bounds = zoomIn();
+                (_a = c.get_bounds) == null ? void 0 : _a.call(c, bounds);
+              },
               position: "topright",
               isOpen: true,
               isDisplayOnly: false,
@@ -20167,7 +20077,11 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
             {
               id: "zoomOut",
               icon: import_ui46.MinusIcon,
-              onClick: zoomOut,
+              onClick: () => {
+                var _a;
+                const bounds = zoomOut();
+                (_a = c.get_bounds) == null ? void 0 : _a.call(c, bounds);
+              },
               position: "topright",
               isOpen: true,
               isDisplayOnly: false,
@@ -20196,6 +20110,7 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
               }
             ),
             position: "topleft",
+            title: "OVERLAY MAPS",
             isOpen: false,
             isDisplayOnly: false,
             popoverDirection: "right",
@@ -20206,8 +20121,39 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
       }
     }).flat();
   };
+  const buildBaseLayers = (baselayers) => {
+    return baselayers.map((c) => {
+      switch (c.layer_type) {
+        case "satellite":
+          return {
+            name: "satellite",
+            type: "raster",
+            url: "https://tiles.maps.eox.at/wmts/1.0.0/s2cloudless-2020_3857/default/g/{z}/{y}/{x}.jpg",
+            tileSize: 256,
+            layer_type: "satellite"
+          };
+        case "terrainSource":
+          return {
+            name: "terrainSource",
+            type: "raster-dem",
+            url: "https://tiles.mapterhorn.com/tilejson.json",
+            tileSize: 256,
+            layer_type: "terrainSource"
+          };
+        case "hillshade":
+          return {
+            name: "hillshadeSource",
+            type: "raster-dem",
+            url: "https://tiles.mapterhorn.com/tilejson.json",
+            tileSize: 256,
+            layer_type: "hillshade"
+          };
+        default:
+          return null;
+      }
+    }).flat();
+  };
   const [mapControl, setMapControl] = (0, import_react66.useState)(() => buildControls(mapControls));
-  console.log(mapControl);
   const toggleControl = (id) => {
     setMapControl((prevControls) => prevControls.map((control) => {
       if (control.id === id) {
@@ -20216,82 +20162,81 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
       return control;
     }));
   };
-  (0, import_react66.useEffect)(() => {
-    if (typeof mapContainer === "function")
-      return;
-    if (!(mapContainer == null ? void 0 : mapContainer.current))
-      return;
-    if (!sourceData)
-      return;
-    const map = new import_maplibre_gl.default.Map({
-      container: mapContainer == null ? void 0 : mapContainer.current,
-      style: {
-        version: 8,
-        sources: {
-          osm: {
-            type: "raster",
-            tiles: ["https://a.tile.openstreetmap.org/{z}/{x}/{y}.png"],
-            tileSize: 256,
-            attribution: "&copy; OpenStreetMap Contributors",
-            maxzoom: 19
-          }
-        },
-        layers: [
-          {
-            id: "osm",
-            type: "raster",
-            source: "osm"
-          }
-        ],
-        sky: {}
-      },
-      center: [16.3713, 48.2081],
-      zoom: 3,
-      minZoom: 1.5,
-      renderWorldCopies: false,
-      canvasContextAttributes: { antialias: true }
-    });
-    mapRef.current = map;
-    map.scrollZoom.disable();
-    mapRef.current.getContainer().addEventListener("mouseenter", () => map.scrollZoom.enable());
-    mapRef.current.getContainer().addEventListener("mouseleave", () => map.scrollZoom.disable());
-    function loadSvgImage() {
-      return __async(this, null, function* () {
-        let svgText = (0, import_server8.renderToStaticMarkup)(
-          /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(import_MapPinIcon4.default, { className: "w-6 h-6" })
-        );
-        svgText = svgText.replace('fill="currentColor"', 'fill="#06b6d4"');
-        const img = new Image();
-        img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svgText);
-        img.width = 35;
-        img.height = 35;
-        yield img.decode();
-        return img;
-      });
+  const loadSvgImage = (color) => __async(null, null, function* () {
+    let svgText = (0, import_server8.renderToStaticMarkup)(
+      /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(import_MapPinIcon4.default, { className: "w-6 h-6" })
+    );
+    svgText = svgText.replace('fill="currentColor"', `fill="${color}"`);
+    const img = new Image();
+    img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svgText);
+    img.width = 35;
+    img.height = 35;
+    yield img.decode();
+    return img;
+  });
+  const updatePinImage = (source) => __async(null, null, function* () {
+    const map = mapRef.current;
+    if (!map) return;
+    const img = yield loadSvgImage(source.style.pin_color);
+    const imgName = `${source.name}-pin`;
+    if (map.hasImage(imgName)) map.removeImage(imgName);
+    map.addImage(imgName, img);
+  });
+  const updateClusterColors = (source) => {
+    const map = mapRef.current;
+    if (!map) return;
+    const layerId = `${source.name}-cluster-circles`;
+    if (!map.getLayer(layerId)) return;
+    const current = map.getPaintProperty(layerId, "circle-color");
+    if (current !== source.style.cluster_color) {
+      map.setPaintProperty(layerId, "circle-color", source.style.cluster_color);
+      map.setPaintProperty(layerId, "circle-stroke-color", source.style.cluster_stroke_color);
     }
-    map.on("load", () => __async(void 0, null, function* () {
-      changeMapProjection();
-      baseLayers == null ? void 0 : baseLayers.forEach((layer) => {
-        map.addSource(layer.name, {
-          type: layer.type,
-          url: layer.url,
-          tileSize: layer.tileSize
-        });
-        if (layer.layer_type == "terrainSource")
-          map.setTerrain({
-            source: "terrainSource",
-            exaggeration: 1
-          });
-        if (layer.layer_type == "hillshade")
-          map.addLayer({
-            id: layer.name,
-            type: layer.layer_type,
-            source: layer.name,
-            paint: { "hillshade-shadow-color": "#473B24" },
-            layout: { visibility: "visible" }
-          });
-      });
-      sourceData == null ? void 0 : sourceData.forEach((source) => __async(void 0, null, function* () {
+  };
+  const loadBaseLayers = () => {
+    const map = mapRef.current;
+    if (!map || !baseLayers || baseLayers.length === 0) return;
+    const base_layers = buildBaseLayers(baseLayers);
+    base_layers == null ? void 0 : base_layers.forEach((layer) => {
+      if (!map.getLayer(layer.name)) {
+        if (!map.getSource(layer == null ? void 0 : layer.name)) {
+          if ((layer == null ? void 0 : layer.layer_type) == "satellite") {
+            map == null ? void 0 : map.addSource(layer == null ? void 0 : layer.name, {
+              type: layer == null ? void 0 : layer.type,
+              tiles: [layer == null ? void 0 : layer.url],
+              tileSize: layer == null ? void 0 : layer.tileSize
+            });
+            map == null ? void 0 : map.addLayer({ id: layer == null ? void 0 : layer.name, type: layer == null ? void 0 : layer.type, source: layer == null ? void 0 : layer.name });
+          } else
+            map == null ? void 0 : map.addSource(layer == null ? void 0 : layer.name, {
+              type: layer == null ? void 0 : layer.type,
+              url: layer == null ? void 0 : layer.url,
+              tileSize: layer == null ? void 0 : layer.tileSize
+            });
+          if ((layer == null ? void 0 : layer.layer_type) == "terrainSource")
+            map == null ? void 0 : map.setTerrain({
+              source: "terrainSource",
+              exaggeration: 1
+            });
+          if ((layer == null ? void 0 : layer.layer_type) == "hillshade")
+            map == null ? void 0 : map.addLayer({
+              id: layer == null ? void 0 : layer.name,
+              type: layer == null ? void 0 : layer.layer_type,
+              source: layer == null ? void 0 : layer.name,
+              paint: { "hillshade-shadow-color": "#473B24" },
+              layout: { visibility: "visible" }
+            });
+        }
+      }
+    });
+  };
+  const loadSourceData = () => __async(null, null, function* () {
+    var _a, _b, _c, _d;
+    const map = mapRef.current;
+    if (!map || (sourceData == null ? void 0 : sourceData.length) == 0) return;
+    for (const source of sourceData) {
+      const existing_data = map.getSource(source.name);
+      if (!existing_data) {
         if (source.is_cluster) {
           map.addSource(source.name, {
             type: source.type,
@@ -20300,22 +20245,26 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
             clusterMaxZoom: 10,
             clusterRadius: 50
           });
-        }
+        } else
+          map.addSource(source.name, {
+            type: source.type,
+            data: source.data
+          });
         if (source.show_cluster_count) {
-          map.addLayer({
+          map == null ? void 0 : map.addLayer({
             id: `${source.name}-cluster-circles`,
             type: "circle",
             source: source.name,
             filter: ["has", "point_count"],
             paint: {
-              "circle-color": source.style.cluster_color,
+              "circle-color": (_a = source.style) == null ? void 0 : _a.cluster_color,
               "circle-opacity": 1,
               "circle-radius": 20,
               "circle-stroke-width": 4,
-              "circle-stroke-color": source.style.cluster_stroke_color
+              "circle-stroke-color": (_b = source.style) == null ? void 0 : _b.cluster_stroke_color
             }
           });
-          map.addLayer({
+          map == null ? void 0 : map.addLayer({
             id: `${source.name}-cluster-count`,
             type: "symbol",
             source: source.name,
@@ -20329,36 +20278,220 @@ var MapLibre = (0, import_react67.forwardRef)(({ baseLayers, customLayers, mapCo
               "text-color": "#f7f2f2"
             }
           });
-          if (!map.hasImage("pin")) {
-            const img = yield loadSvgImage();
-            map.addImage("pin", img);
+          if (!(map == null ? void 0 : map.hasImage(`${source.name}-pin`))) {
+            const img = yield loadSvgImage(source.style.pin_color);
+            map == null ? void 0 : map.addImage(`${source.name}-pin`, img);
           }
-          map.addLayer({
-            id: source.name + "-count",
+          map == null ? void 0 : map.addLayer({
+            id: `${source.name}-pins`,
             type: "symbol",
             source: source.name,
             filter: ["!", ["has", "point_count"]],
             layout: {
-              "icon-image": "pin",
+              "icon-image": `${source.name}-pin`,
+              "icon-size": 1,
+              "icon-allow-overlap": true,
+              "icon-anchor": "bottom"
+            }
+          });
+        } else if (source.custom_cluster) {
+          map == null ? void 0 : map.addLayer({
+            id: `${source.name}-cluster-circles`,
+            type: "circle",
+            source: source.name,
+            filter: ["!=", ["get", "count"], null],
+            paint: {
+              "circle-color": (_c = source.style) == null ? void 0 : _c.cluster_color,
+              "circle-opacity": 1,
+              "circle-radius": 20,
+              "circle-stroke-width": 4,
+              "circle-stroke-color": (_d = source.style) == null ? void 0 : _d.cluster_stroke_color
+            }
+          });
+          map == null ? void 0 : map.addLayer({
+            id: `${source.name}-cluster-count`,
+            type: "symbol",
+            source: source.name,
+            filter: ["!=", ["get", "count"], null],
+            layout: {
+              "text-field": "{count}",
+              "text-font": ["Open Sans Bold"],
+              "text-size": 14
+            },
+            paint: {
+              "text-color": "#f7f2f2"
+            }
+          });
+          if (!(map == null ? void 0 : map.hasImage(`${source.name}-pin`))) {
+            const img = yield loadSvgImage(source.style.pin_color);
+            map == null ? void 0 : map.addImage(`${source.name}-pin`, img);
+          }
+          map == null ? void 0 : map.addLayer({
+            id: source.name + "-pins",
+            type: "symbol",
+            source: source.name,
+            filter: ["==", ["get", "count"], null],
+            layout: {
+              "icon-image": `${source.name}-pin`,
               "icon-size": 1,
               "icon-allow-overlap": true,
               "icon-anchor": "bottom"
             }
           });
         }
-      }));
+      } else {
+        existing_data.setData(source.data);
+        updateClusterColors(source);
+        updatePinImage(source);
+      }
+    }
+  });
+  (0, import_react66.useEffect)(() => {
+    if (typeof mapContainer === "function") return;
+    if (!(mapContainer == null ? void 0 : mapContainer.current)) return;
+    const map = new import_maplibre_gl.default.Map({
+      container: mapContainer == null ? void 0 : mapContainer.current,
+      style: {
+        version: 8,
+        sources: {
+          osm: {
+            type: "raster",
+            tiles: ["https://a.tile.openstreetmap.org/{z}/{x}/{y}.png"],
+            tileSize: 256,
+            attribution: "&copy; OpenStreetMap Contributors",
+            maxzoom: 19
+          }
+        },
+        layers: [
+          {
+            id: "osm",
+            type: "raster",
+            source: "osm"
+          }
+        ],
+        sky: {}
+      },
+      center: [16.3713, 48.2081],
+      zoom: 3,
+      minZoom: 1.5,
+      renderWorldCopies: false,
+      canvasContextAttributes: { antialias: true }
+    });
+    mapRef.current = map;
+    map.scrollZoom.disable();
+    mapRef.current.getContainer().addEventListener("mouseenter", () => map.scrollZoom.enable());
+    mapRef.current.getContainer().addEventListener("mouseleave", () => map.scrollZoom.disable());
+    map.on("load", () => __async(null, null, function* () {
+      changeMapProjection();
+      setIsMapReady(true);
     }));
     return () => {
       map.remove();
+      mapRef.current = null;
+    };
+  }, []);
+  (0, import_react66.useEffect)(() => {
+    const map = mapRef.current;
+    if (!map || !isMapReady) return;
+    const init = () => {
+      loadBaseLayers();
+    };
+    const zoom = () => {
+      const bounds = map.getBounds();
+      mapControls == null ? void 0 : mapControls.forEach((control) => {
+        var _a;
+        if (control.get_bounds)
+          (_a = control.get_bounds) == null ? void 0 : _a.call(control, bounds);
+      });
+    };
+    if (map.isStyleLoaded()) {
+      init();
+      map.on("zoomend", zoom);
+      map.on("moveend", zoom);
+    } else map.once("load", () => {
+      init();
+      map.on("zoomend", zoom);
+      map.on("moveend", zoom);
+    });
+    return () => {
+      map.off("zoomend", zoom);
+      map.off("moveend", zoom);
     };
-  }, [sourceData, mapControls]);
-  if (!sourceData)
-    return;
-  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "relative", style: { width: "100%", height: "100vh" }, children: [
+  }, [mapControls, baseLayers, isMapReady]);
+  (0, import_react66.useEffect)(() => {
+    var _a;
+    const map = mapRef.current;
+    if (!map || !(sourceData == null ? void 0 : sourceData.length)) return;
+    const satelliteLayerLoaded = hasSatelliteLayer !== void 0 ? map.getLayer("satellite") !== void 0 ? true : false : true;
+    map.on("sourcedata", function onData(e) {
+      if (e.sourceId === "satellite" && e.isSourceLoaded) {
+        map.off("sourcedata", onData);
+        loadSourceData();
+      }
+    });
+    if (map.isStyleLoaded() && satelliteLayerLoaded) {
+      loadSourceData();
+    } else {
+      const handler = () => {
+        if (satelliteLayerLoaded) loadSourceData();
+      };
+      map.once("load", handler);
+      return () => {
+        map.off("load", handler);
+      };
+    }
+    if (show_popup && customLayers) {
+      const layerId = ((_a = customLayers[0]) == null ? void 0 : _a.layerName) + "-pins";
+      const onMouseEnter = () => {
+        map.getCanvas().style.cursor = "pointer";
+      };
+      const onMouseLeave = () => {
+        map.getCanvas().style.cursor = "";
+      };
+      const onLayerClick = (e) => {
+        var _a2, _b, _c, _d;
+        if (e.features) {
+          const properties = (_a2 = e.features[0]) == null ? void 0 : _a2.properties;
+          const coordinates = (_c = (_b = e.features[0]) == null ? void 0 : _b.geometry) == null ? void 0 : _c.coordinates.slice();
+          const description = `
+                <a class="popup-link text-primary text-xs hover:cursor-pointer">${(_d = e.features[0]) == null ? void 0 : _d.properties.description}</a>
+                `;
+          const popup_element = new import_maplibre_gl.default.Popup().setLngLat([coordinates[0], coordinates[1]]).setHTML(description).addTo(map);
+          setTimeout(() => {
+            const link = popup_element.getElement().querySelector(".popup-link");
+            if (link && popup && popup.click) {
+              link.onclick = (ev) => {
+                ev.preventDefault();
+                popup.click(properties);
+              };
+            }
+          }, 0);
+        }
+      };
+      map.on("mouseenter", layerId, onMouseEnter);
+      map.on("mouseleave", layerId, onMouseLeave);
+      map.on("click", layerId, onLayerClick);
+      return () => {
+        map.off("mouseenter", layerId, onMouseEnter);
+        map.off("mouseleave", layerId, onMouseLeave);
+        map.off("click", layerId, onLayerClick);
+      };
+    }
+  }, [sourceData, customLayers, show_popup, popup, isMapReady]);
+  (0, import_react66.useEffect)(() => {
+    const map = mapRef.current;
+    if (!map || !(sourceData == null ? void 0 : sourceData.length)) return;
+    sourceData.forEach((source) => {
+      const source_layer = map.getSource(source.name);
+      if (source_layer) source_layer.setData(source.data);
+    });
+  }, [sourceData]);
+  return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "relative", style: { width: "100%", height: "100%" }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { ref: mapContainer, className: "w-full h-full" }),
     /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(MapControlToolbar, { controls: mapControl, onToggleControl: (id) => toggleControl(id) })
   ] });
 });
+MapLibre.displayName = "MapLibre";
 
 // src/features/components/GeoWikiMapContainer.tsx
 var import_react68 = require("react");
@@ -20484,9 +20617,9 @@ init_MarkerClusterGroup();
 
 // src/Components/LocationMarker.tsx
 var import_react_leaflet30 = require("react-leaflet");
-var import_leaflet23 = require("leaflet");
+var import_leaflet25 = require("leaflet");
 var import_jsx_runtime84 = require("react/jsx-runtime");
-var ICON = (0, import_leaflet23.icon)({
+var ICON = (0, import_leaflet25.icon)({
   iconUrl: "/assets/img/marker-icon.png",
   iconSize: [25, 35]
 });