@eeacms/volto-arcgis-block 0.1.352 → 0.1.353

package/CHANGELOG.md

@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [0.1.353](https://github.com/eea/volto-arcgis-block/compare/0.1.352...0.1.353) - 15 April 2025
+
+#### :hammer_and_wrench: Others
+
+- CLMS-286928 (bug): linter error fixed. [Unai Bolivar - [`d7afc23`](https://github.com/eea/volto-arcgis-block/commit/d7afc238ad25575b7e4857bb8ef6f693b3f1f736)]
+- CLMS-286928 (bug): Fixed issues pertaining user upload wms services for logged in users [Unai Bolivar - [`49eaf4c`](https://github.com/eea/volto-arcgis-block/commit/49eaf4cfa94fdd406709cd50b50aafd18a13f25e)]
 ### [0.1.352](https://github.com/eea/volto-arcgis-block/compare/0.1.351...0.1.352) - 11 April 2025
 
 #### :hammer_and_wrench: Others
@@ -187,7 +193,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :house: Internal changes
 
-- chore: [JENKINSFILE] remove unused code [valentinab25 - [`c62af37`](https://github.com/eea/volto-arcgis-block/commit/c62af37e5c81f7b6b1d204de8a724499d00420d9)]
 
 #### :house: Documentation changes
 
@@ -506,13 +511,10 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - CLMS-2916 (bug): Map Viewer / Products and Datasets tab / Layer - The information icon links to localhost in demo environment [Unai Bolivar - [`eda000a`](https://github.com/eea/volto-arcgis-block/commit/eda000a72278ab073033e520b868ded75dcc2904)]
-- test: [JENKINS] fix jest config, fail with logs on coverage [valentinab25 - [`8a0855d`](https://github.com/eea/volto-arcgis-block/commit/8a0855dfe47ec58a596ae0ec360ba8f8d075e991)]
-- test: [JENKINS] fix jest config, fail with logs on coverage [valentinab25 - [`3cfe9be`](https://github.com/eea/volto-arcgis-block/commit/3cfe9be4c6d4ace0ef83b452ebdd5b06025123aa)]
 ### [0.1.245](https://github.com/eea/volto-arcgis-block/compare/0.1.244...0.1.245) - 4 January 2024
 
 #### :hammer_and_wrench: Others
 
-- test: [JENKINS] fix jest config, fail with logs on coverage [valentinab25 - [`a93b081`](https://github.com/eea/volto-arcgis-block/commit/a93b0819eaa765c92bc25cf195f7a43fcd1dddbd)]
 ### [0.1.244](https://github.com/eea/volto-arcgis-block/compare/0.1.243...0.1.244) - 19 December 2023
 
 ### [0.1.243](https://github.com/eea/volto-arcgis-block/compare/0.1.242...0.1.243) - 15 December 2023
@@ -552,7 +554,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :hammer_and_wrench: Others
 
-- test: [JENKINS] Use java17 for sonarqube scanner [valentinab25 - [`f45d4bf`](https://github.com/eea/volto-arcgis-block/commit/f45d4bf42061d13d9c18554bef692cb40b3a6fb7)]
 ### [0.1.235](https://github.com/eea/volto-arcgis-block/compare/0.1.234...0.1.235) - 16 November 2023
 
 ### [0.1.234](https://github.com/eea/volto-arcgis-block/compare/0.1.233...0.1.234) - 15 November 2023
@@ -1626,13 +1627,10 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - Merge pull request #148 from eea/develop [KCarpinteroBM - [`24266fb`](https://github.com/eea/volto-arcgis-block/commit/24266fb3a0c1662d22ae0529dc1d5a25c711cf97)]
-- Revert "[JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967" [Mikel Larreategi - [`f751f69`](https://github.com/eea/volto-arcgis-block/commit/f751f69f652f0340ae55af6a4dab89d6bdc80906)]
 - Revert "Revert "Mapviewer menu and map viewer options persistence"" [Mikel Larreategi - [`ad6e440`](https://github.com/eea/volto-arcgis-block/commit/ad6e440cdc160cffb1e86e1b26e501dbe648476c)]
 - Revert "code coverage removal" [Mikel Larreategi - [`376f2d1`](https://github.com/eea/volto-arcgis-block/commit/376f2d1cd6e4e5110b3b63d5114af1bcfebe094b)]
 - Revert "Update cypress.json" [Mikel Larreategi - [`43d01a0`](https://github.com/eea/volto-arcgis-block/commit/43d01a0a95a58ef5215c6cbf18223ca30a11b9cc)]
 - Revert "Update cypress.json" [Mikel Larreategi - [`054c4ae`](https://github.com/eea/volto-arcgis-block/commit/054c4ae1767e1f26e6ec7e96a0e26a9711f29f04)]
-- Revert "revert [JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967" [Mikel Larreategi - [`64ab56e`](https://github.com/eea/volto-arcgis-block/commit/64ab56e0f1f8dddc26f26039509a028e34653e64)]
-- revert [JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967 [Mikel Larreategi - [`85ee194`](https://github.com/eea/volto-arcgis-block/commit/85ee1941e029df2b7dc910bf75231c75ffeca8c2)]
 - Update cypress.json [KCarpinteroBM - [`be285ff`](https://github.com/eea/volto-arcgis-block/commit/be285fff0c53e06a0180d5318cce81195eabcf80)]
 - Update cypress.json [KCarpinteroBM - [`a7f2118`](https://github.com/eea/volto-arcgis-block/commit/a7f2118acb7b048b4cef85aa9663c2244a1c9ca0)]
 - linting fix [KCarpinteroBM - [`27e969a`](https://github.com/eea/volto-arcgis-block/commit/27e969a7a411fd4646e0e742ce846efc0d79703e)]
@@ -1692,7 +1690,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - UX improvements [rodriama - [`151dc4b`](https://github.com/eea/volto-arcgis-block/commit/151dc4b02d0a73fdd66de9d594620ac0fa5f1dbf)]
 - deleted failing tests [KCarpinteroBM - [`ddaa9e6`](https://github.com/eea/volto-arcgis-block/commit/ddaa9e6f06db6960a4c214d3be2420c48b26715d)]
 - cleaning unnecessary files [KCarpinteroBM - [`2c02199`](https://github.com/eea/volto-arcgis-block/commit/2c021990912beb02b603a1de89aecd62e0063769)]
-- Reverting to Automated release 0.1.39 [KCarpinteroBM - [`fb9f317`](https://github.com/eea/volto-arcgis-block/commit/fb9f3176ccdea18fceb329eaac13ced0566ee648)]
 - commands added [KCarpinteroBM - [`049e60b`](https://github.com/eea/volto-arcgis-block/commit/049e60b7d124d1c05abd0b2775b510795f4ed59f)]
 - Mapviewer testing implementation [KCarpinteroBM - [`0103002`](https://github.com/eea/volto-arcgis-block/commit/0103002869eea108e16e3b5ff2e77a725dcc7c4b)]
 ### [0.1.39](https://github.com/eea/volto-arcgis-block/compare/0.1.38...0.1.39) - 24 March 2022
@@ -1712,7 +1709,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - ESLint fix [rodriama - [`75dae9b`](https://github.com/eea/volto-arcgis-block/commit/75dae9b5bba18ab6d9624f6c99714b4bd2179003)]
 - Remove section title [rodriama - [`ece860e`](https://github.com/eea/volto-arcgis-block/commit/ece860eae3519c7e611abac16e8d53c9a9408b34)]
 - Es-Lint [manuelmartinezbilbomatica - [`39d8d11`](https://github.com/eea/volto-arcgis-block/commit/39d8d11b9096fd603df8510c119d2e12817415d6)]
-- Add Sonarqube tag using clms-frontend addons list [EEA Jenkins - [`bf9f683`](https://github.com/eea/volto-arcgis-block/commit/bf9f683dd35a9edb4cfd9111affcb8f8edbeae89)]
 - FEAT: Parser Time implemented [manuelmartinezbilbomatica - [`689c99e`](https://github.com/eea/volto-arcgis-block/commit/689c99e55221fee6c7c7fafc4ab95ae7a646d3dd)]
 ### [0.1.38](https://github.com/eea/volto-arcgis-block/compare/0.1.37...0.1.38) - 18 March 2022
 
@@ -1807,7 +1803,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - ESLint fix [rodriama - [`5fd3772`](https://github.com/eea/volto-arcgis-block/commit/5fd3772f197a3a380067962a5638dbf901a4624e)]
 - Pixel info [rodriama - [`1ccef39`](https://github.com/eea/volto-arcgis-block/commit/1ccef39a9adcc3ee94655c77a5a166b613600a08)]
 - NUTS bug fix [rodriama - [`37fe7f3`](https://github.com/eea/volto-arcgis-block/commit/37fe7f3fad2c005e3b7c234b3b0564d5df92fa8c)]
-- Add Sonarqube tag using freshwater-frontend addons list [EEA Jenkins - [`ea5af8b`](https://github.com/eea/volto-arcgis-block/commit/ea5af8b02a5f2ee25b9b0be67cf3792bbbe84ed7)]
 ### [0.1.23](https://github.com/eea/volto-arcgis-block/compare/0.1.22...0.1.23) - 17 December 2021
 
 #### :hammer_and_wrench: Others
@@ -2052,7 +2047,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Trying to delay ArcGIS modules load [gonzalezsd - [`ff16985`](https://github.com/eea/volto-arcgis-block/commit/ff169858e42d30bfcacc423ffc27762bb9ef05a4)]
 - Run bootstrap to fix files [valentinab25 - [`236893f`](https://github.com/eea/volto-arcgis-block/commit/236893f03314eb638b7667f81b1f91491a98ee17)]
 - fix git_name [valentinab25 - [`c7806c3`](https://github.com/eea/volto-arcgis-block/commit/c7806c312964425dc23e5d4c6973de8b81ddaeac)]
-- Add Sonarqube tag using frontend addons list [EEA Jenkins - [`e3afb51`](https://github.com/eea/volto-arcgis-block/commit/e3afb515dda459ee03e2b5d4b56465d2d4ad1503)]
 - Trying to change imports [gonzalezsd - [`d83d7e2`](https://github.com/eea/volto-arcgis-block/commit/d83d7e2f68da4b2a284735847f93c0763a7e13b6)]
 - default design [bipoza - [`88fbe0b`](https://github.com/eea/volto-arcgis-block/commit/88fbe0b2bc73e732e2993324a567f53902e85506)]
 - cleanup of unused code [bipoza - [`b167677`](https://github.com/eea/volto-arcgis-block/commit/b1676771f637f056cad50cb0bc186f2ea79e8517)]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-arcgis-block",
-  "version": "0.1.352",
+  "version": "0.1.353",
   "description": "volto-arcgis-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: CodeSyntax",

package/src/components/MapViewer/MenuWidget.jsx

@@ -2035,15 +2035,25 @@ class MenuWidget extends React.Component {
       layerId = title.toUpperCase().replace(/ /g, '_');
       const constructedSublayers = resourceLayer.sublayers?.items?.map(
         (sublayer) => {
-          const { index, name, title, legendUrl, featureInfoUrl } = sublayer;
+          const {
+            index,
+            name,
+            title,
+            legendUrl,
+            featureInfoUrl,
+            queryable,
+            popupEnabled,
+            visible,
+            legendEnabled,
+          } = sublayer;
           return {
             index,
             name,
             title,
-            popupEnabled: true,
-            queryable: true,
-            visible: true,
-            legendEnabled: true,
+            popupEnabled,
+            queryable,
+            visible,
+            legendEnabled,
             legendUrl: legendUrl
               ? legendUrl
               : viewService + legendRequest + name,
@@ -2202,7 +2212,9 @@ class MenuWidget extends React.Component {
         const newWmsUserServiceLayers = prevState.wmsUserServiceLayers.filter(
           (layer) => layer.LayerId !== elemId,
         );
-        this.saveUserServicesToStorage(newWmsUserServiceLayers);
+        if (this.userID && this.userID !== null) {
+          this.saveUserServicesToStorage(newWmsUserServiceLayers);
+        }
         return { wmsUserServiceLayers: newWmsUserServiceLayers };
       }
       return null;
@@ -2214,6 +2226,11 @@ class MenuWidget extends React.Component {
 
     try {
       const layersToSave = layers.map((layer) => {
+        // First, see if this layer exists in previous saved services to retain checked state
+        const checkedLayers =
+          JSON.parse(sessionStorage.getItem('checkedLayers')) || [];
+        const isChecked = checkedLayers.includes(layer.LayerId);
+
         // Create a simplified object for storage
         return {
           url: layer.url,
@@ -2234,6 +2251,9 @@ class MenuWidget extends React.Component {
           })),
           ViewService: layer.ViewService,
           LayerId: layer.LayerId,
+          visibility: layer.visible !== false,
+          opacity: layer.opacity || 1,
+          checked: isChecked || layer.checked || false,
         };
       });
 
@@ -2246,6 +2266,7 @@ class MenuWidget extends React.Component {
 
   async loadUserServicesFromStorage() {
     if (this.userID != null) {
+      sessionStorage.clear();
       try {
         const savedServices = JSON.parse(
           localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
@@ -2258,6 +2279,20 @@ class MenuWidget extends React.Component {
               try {
                 // Create a new WMSLayer with the saved properties
                 const newLayer = new WMSLayer(serviceData);
+
+                // Set visibility property based on saved value
+                newLayer.visible = serviceData.visibility !== false;
+
+                // Remember the original checked state and visibility
+                newLayer.checked = serviceData.checked;
+
+                // Initialize visibleLayers for this layer
+                if (!this.visibleLayers) this.visibleLayers = {};
+                this.visibleLayers[serviceData.LayerId] =
+                  serviceData.visibility !== false
+                    ? ['fas', 'eye']
+                    : ['fas', 'eye-slash'];
+
                 // Add to this.layers
                 this.layers[serviceData.LayerId] = newLayer;
                 return newLayer;
@@ -2271,27 +2306,87 @@ class MenuWidget extends React.Component {
           const validLayers = recreatedLayers.filter((layer) => layer !== null);
 
           // Update state with recreated layers
-          this.setState({ wmsUserServiceLayers: validLayers });
-          // Get checked layers from session storage
-          // const checkedLayers =
-          // JSON.parse(sessionStorage.getItem('checkedLayers')) || [];
-
-          // For each valid layer that was previously checked, make it visible
-          validLayers.forEach((layer) => {
-            // if (checkedLayers.includes(layer.LayerId)) {
-            const node = document.getElementById(layer.LayerId);
-            if (node) {
-              layer.visible === true
-                ? (node.checked = true)
-                : (node.checked = false);
-              this.toggleLayer(node);
-            }
+          this.setState({ wmsUserServiceLayers: validLayers }, () => {
+            // For each layer, update the checkbox state based on localStorage
+            setTimeout(() => {
+              validLayers.forEach((layer) => {
+                const node = document.getElementById(layer.LayerId);
+                if (node) {
+                  // Check the checkbox if it was saved as checked
+                  if (layer.checked === true) {
+                    // First add to checkedLayers in sessionStorage if not already there
+                    const checkedLayers =
+                      JSON.parse(sessionStorage.getItem('checkedLayers')) || [];
+
+                    if (!checkedLayers.includes(layer.LayerId)) {
+                      checkedLayers.unshift(layer.LayerId);
+                      sessionStorage.setItem(
+                        'checkedLayers',
+                        JSON.stringify(checkedLayers),
+                      );
+                      window.dispatchEvent(new Event('storage'));
+                    }
+
+                    // Then check the checkbox and call toggleLayer with a flag to preserve visibility
+                    node.checked = true;
+
+                    // Custom addition to toggleLayer to bypass visibility override
+                    this.toggleLayerWithoutVisibilityReset(node);
+                  }
+                }
+              });
+            }, 100);
           });
         }
       } catch (error) {}
     }
   }
 
+  toggleLayerWithoutVisibilityReset(elem) {
+    // Copy most of toggleLayer behavior but don't set this.visibleLayers[elem.id]
+    if (this.layers[elem.id] === undefined) return;
+    if (!this.visibleLayers) this.visibleLayers = {};
+    if (!this.timeLayers) this.timeLayers = {};
+
+    // Add the layer to the map
+    this.layers[elem.id].visible = this.visibleLayers[elem.id][1] === 'eye';
+    this.map.add(this.layers[elem.id]);
+
+    // Continue with other toggleLayer operations
+    this.timeLayers[elem.id] = ['far', 'clock'];
+
+    // Add to active layers
+    this.activeLayersJSON[elem.id] = this.addActiveLayer(
+      elem,
+      Object.keys(this.activeLayersJSON).length,
+    );
+
+    this.saveCheckedLayer(elem.id);
+
+    // Reorder layers
+    let nuts = this.map.layers.items.find((layer) => layer.title === 'nuts');
+    if (nuts) {
+      this.map.reorder(nuts, this.map.layers.items.length + 1);
+    }
+
+    this.layersReorder();
+    this.checkInfoWidget();
+
+    // Toggle custom legend
+    if (
+      this.layers[elem.id].ViewService?.toLowerCase().includes('wmts') ||
+      this.layers[elem.id].ViewService?.toLowerCase().endsWith('file')
+    ) {
+      this.toggleCustomLegendItem(this.layers[elem.id]);
+    }
+
+    if (!this.props.download && this.props.hotspotData) {
+      this.activeLayersToHotspotData(elem.id);
+    }
+
+    this.renderHotspot();
+  }
+
   /**
    * Method to show/hide a layer. Update checkboxes from dataset and products
    * @param {*} elem Is the checkbox
@@ -4033,22 +4128,28 @@ class MenuWidget extends React.Component {
     let layerOpacities = JSON.parse(sessionStorage.getItem('layerOpacities'));
     if (layerOpacities === null) {
       layerOpacities = {};
-      layerOpacities[layer] = value;
-      sessionStorage.setItem('layerOpacities', JSON.stringify(layerOpacities));
-    } else {
-      layerOpacities[layer] = value;
-      sessionStorage.setItem('layerOpacities', JSON.stringify(layerOpacities));
     }
-    let savedServices = JSON.parse(
+    layerOpacities[layer] = value;
+    sessionStorage.setItem('layerOpacities', JSON.stringify(layerOpacities));
+
+    // Save to localStorage for user service layers
+    const savedServices = JSON.parse(
       localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
     );
-    if (savedServices === null) {
-      return;
-    } else {
-      for (const service of Object.values(savedServices)) {
+
+    if (savedServices && Array.isArray(savedServices)) {
+      let servicesUpdated = false;
+
+      // Update opacity for matching layer in user services
+      savedServices.forEach((service) => {
         if (service.LayerId === layer) {
           service.opacity = value;
+          servicesUpdated = true;
         }
+      });
+
+      // Only save if we made changes
+      if (servicesUpdated) {
         localStorage.setItem(
           USER_SERVICES_KEY + '_' + this.userID,
           JSON.stringify(savedServices),
@@ -4065,43 +4166,44 @@ class MenuWidget extends React.Component {
   loadOpacity() {
     let layerOpacities =
       JSON.parse(sessionStorage.getItem('layerOpacities')) || {};
+
+    // Load from localStorage for user service layers
     const savedUserServices = JSON.parse(
       localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
     );
-    if (savedUserServices) {
-      Object.values(savedUserServices).forEach((service) => {
-        let layer = service.LayerId;
-        let value = service.opacity;
-        // Check if the layer is already in layerOpacities
-        if (layerOpacities[layer] === undefined) {
-          //add to layerOpacties
-          layerOpacities[layer] = value;
-          // if (this.layers[service]) {
-          //   // set map
-          //   this.layers[service].opacity = value;
-          //   // set slider
-          //   let nodeValue = `.active-layer[layer-id="${layer}"] .active-layer-opacity`;
-          //   let node = document.querySelector(nodeValue);
-          //   if (node) {
-          //     node.dataset.opacity = value * 100;
-          //   }
-          // }
+
+    // Import opacity values from user services if not already in session storage
+    if (savedUserServices && Array.isArray(savedUserServices)) {
+      savedUserServices.forEach((service) => {
+        const layerId = service.LayerId;
+        const opacity = service.opacity;
+
+        // If this layer's opacity isn't in session storage yet, add it
+        if (
+          layerId &&
+          opacity !== undefined &&
+          layerOpacities[layerId] === undefined
+        ) {
+          layerOpacities[layerId] = opacity;
         }
       });
     }
-    if (layerOpacities) {
-      for (const layer in layerOpacities) {
-        if (this.layers[layer]) {
-          let value = layerOpacities[layer];
-          // set map
-          this.layers[layer].opacity = value;
-          // set slider
-          let node = document.querySelector(
-            '.active-layer[layer-id="' + layer + '"] .active-layer-opacity',
-          );
-          if (node) {
-            node.dataset.opacity = value * 100;
-          }
+    //save layerOpacities to sessionStorage
+    sessionStorage.setItem('layerOpacities', JSON.stringify(layerOpacities));
+    // Apply opacity values to layers and UI
+    for (const layerId in layerOpacities) {
+      if (this.layers[layerId]) {
+        const value = layerOpacities[layerId];
+
+        // Set opacity on the map layer
+        this.layers[layerId].opacity = value;
+
+        // Update UI opacity slider
+        const node = document.querySelector(
+          `.active-layer[layer-id="${layerId}"] .active-layer-opacity`,
+        );
+        if (node) {
+          node.dataset.opacity = value * 100;
         }
       }
     }
@@ -4287,7 +4389,13 @@ class MenuWidget extends React.Component {
     }
     this.setLegendOpacity();
     this.loadOpacity();
-    this.loadVisibility();
+    if (
+      prevProps.hotspotData !== this.props.hotspotData ||
+      !this._visibilityInitialized
+    ) {
+      this.loadVisibility();
+      this._visibilityInitialized = true;
+    }
   }
 
   /**
@@ -4295,6 +4403,34 @@ class MenuWidget extends React.Component {
    */
   saveVisibility() {
     if (this.props.download) return;
+
+    // Get services from localStorage - it's an array of objects
+    const savedServices = JSON.parse(
+      localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
+    );
+
+    if (savedServices && Array.isArray(savedServices)) {
+      let servicesUpdated = false;
+
+      // Update visibility state for each service in the array
+      savedServices.forEach((service) => {
+        const layerId = service.LayerId;
+        if (layerId && this.visibleLayers[layerId]) {
+          // Update visibility based on eye icon state
+          service.visibility =
+            this.visibleLayers[layerId][1] === 'eye' ? true : false;
+          servicesUpdated = true;
+        }
+      });
+
+      // Only save if we made changes
+      if (servicesUpdated) {
+        localStorage.setItem(
+          USER_SERVICES_KEY + '_' + this.userID,
+          JSON.stringify(savedServices),
+        );
+      }
+    }
     sessionStorage.setItem('visibleLayers', JSON.stringify(this.visibleLayers));
   }
 
@@ -4304,6 +4440,8 @@ class MenuWidget extends React.Component {
   loadVisibility() {
     if (this.props.download) return;
 
+    let hasChanges = false;
+
     // Load visibility settings from sessionStorage
     let vl = JSON.parse(sessionStorage.getItem('visibleLayers'));
     if (vl) {
@@ -4317,44 +4455,52 @@ class MenuWidget extends React.Component {
       localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
     );
 
-    if (savedUserServices) {
-      Object.values(savedUserServices).forEach((service) => {
-        let layerId = service.LayerId;
-        let visibility = service.visibility;
-        // Only add visibility from localStorage if not already in sessionStorage
-        if (this.visibleLayers[layerId] === undefined) {
-          if (visibility) {
-            this.visibleLayers[layerId] = ['fas', 'eye'];
-          } else {
-            this.visibleLayers[layerId] = ['fas', 'eye-slash'];
-          }
+    if (savedUserServices && Array.isArray(savedUserServices)) {
+      savedUserServices.forEach((service) => {
+        const layerId = service.LayerId;
+        // Check if visibility is explicitly defined (could be true, false, or undefined)
+        if (
+          layerId &&
+          this.visibleLayers[layerId] === undefined &&
+          service.visibility !== undefined
+        ) {
+          // Set visible icon based on saved visibility boolean value
+          this.visibleLayers[layerId] =
+            service.visibility === true ? ['fas', 'eye'] : ['fas', 'eye-slash'];
+          hasChanges = true;
         }
       });
     }
-
-    // Apply visibility settings to layers
+    //add this.visibleLayers to session storage
+    sessionStorage.setItem('visibleLayers', JSON.stringify(this.visibleLayers));
     for (const key in this.visibleLayers) {
       if (this.layers[key]) {
-        if (this.visibleLayers[key][1] === 'eye') {
-          this.layers[key].visible = true;
-        } else {
-          this.layers[key].visible = false;
-        }
+        // Set layer visibility based on eye/eye-slash
+        const shouldBeVisible = this.visibleLayers[key][1] === 'eye';
+        this.layers[key].visible = shouldBeVisible;
 
+        // Update the active layer UI if it exists
         let elem = document.getElementById(key);
         if (elem && this.activeLayersJSON[key]) {
+          // Get the current order of the active layer
           let order = this.activeLayersJSON[key].props['layer-order'];
-          // add active layer to DOM
+
+          // Force recreate the active layer component with the correct visibility state
           this.activeLayersJSON[key] = this.addActiveLayer(elem, order);
-          // reorder layers
+
+          // Update related UI
           this.layersReorder();
-          // show/hide info widget
           this.checkInfoWidget();
-          // update
-          this.setState({});
+          this.toggleCustomLegendItem(this.layers[key]);
+          hasChanges = true;
         }
       }
     }
+
+    // Only update state once if there were changes
+    if (hasChanges) {
+      this.setState({});
+    }
   }
 
   /**
@@ -4393,6 +4539,8 @@ class MenuWidget extends React.Component {
    */
   saveCheckedLayer(layer) {
     if (this.props.download) return;
+
+    // Update sessionStorage as before
     let checkedLayers = JSON.parse(sessionStorage.getItem('checkedLayers'));
     if (checkedLayers === null) {
       checkedLayers = [layer];
@@ -4404,6 +4552,31 @@ class MenuWidget extends React.Component {
       sessionStorage.setItem('checkedLayers', JSON.stringify(checkedLayers));
     }
     window.dispatchEvent(new Event('storage'));
+
+    // Also update localStorage for user service layers
+    const savedServices = JSON.parse(
+      localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
+    );
+
+    if (savedServices && Array.isArray(savedServices)) {
+      let servicesUpdated = false;
+
+      // Update checked state for matching layer in user services
+      savedServices.forEach((service) => {
+        if (service.LayerId === layer) {
+          service.checked = true;
+          servicesUpdated = true;
+        }
+      });
+
+      // Only save if we made changes
+      if (servicesUpdated) {
+        localStorage.setItem(
+          USER_SERVICES_KEY + '_' + this.userID,
+          JSON.stringify(savedServices),
+        );
+      }
+    }
   }
 
   /**
@@ -4442,6 +4615,31 @@ class MenuWidget extends React.Component {
         sessionStorage.setItem('visibleLayers', JSON.stringify(visibleLayers));
       }
     }
+
+    // Also update localStorage for user service layers
+    const savedServices = JSON.parse(
+      localStorage.getItem(USER_SERVICES_KEY + '_' + this.userID),
+    );
+
+    if (savedServices && Array.isArray(savedServices)) {
+      let servicesUpdated = false;
+
+      // Update checked state for matching layer in user services
+      savedServices.forEach((service) => {
+        if (service.LayerId === layer) {
+          service.checked = false;
+          servicesUpdated = true;
+        }
+      });
+
+      // Only save if we made changes
+      if (servicesUpdated) {
+        localStorage.setItem(
+          USER_SERVICES_KEY + '_' + this.userID,
+          JSON.stringify(savedServices),
+        );
+      }
+    }
   }
 
   deleteFilteredLayer(layer) {

package/src/components/MapViewer/UploadWidget.jsx

@@ -128,20 +128,37 @@ class UploadWidget extends React.Component {
     this.setState({ wmsServiceUrl: event.target.value });
   };
 
-  handleUploadService = () => {
+  handleUploadService = async () => {
     const { wmsServiceUrl } = this.state;
+    try {
+      // Use a CORS proxy or add mode: 'no-cors' if you just need to check if service exists
+      let urlResult = await fetch(wmsServiceUrl, {
+        method: 'GET',
+        mode: 'cors', // You might need to change this to 'no-cors' if proxy isn't available
+      });
 
+      // Check if service is valid and properly responds
+      if (!urlResult || !urlResult.ok) {
+        this.errorPopup();
+        this.setState({ wmsServiceUrl: '' });
+        return;
+      }
+    } catch (error) {
+      this.errorPopup();
+      this.setState({ wmsServiceUrl: '' });
+      return;
+    }
+    // If service is valid and is a WMS service
     if (
       wmsServiceUrl &&
       wmsServiceUrl.trim() !== '' &&
       wmsServiceUrl.toLowerCase().includes('wms')
     ) {
       this.uploadUrlServiceHandler(wmsServiceUrl);
-      this.setState({
-        wmsServiceUrl: '',
-      });
+      this.setState({ wmsServiceUrl: '' });
     } else {
       this.errorPopup();
+      this.setState({ wmsServiceUrl: '' });
     }
   };