Merge pull request #1118 from geoadmin/feat-pb-623-sync-layer-selecte…

…d-feature

PB-623: sync features when layers are updated

src/modules/infobox/components/FeatureList.vue

@@ -64,7 +64,7 @@ function getLayerName(layerId) {
         .map(
             (layer) => layer.layers?.find((subLayer) => subLayer.id === layerId)?.name ?? layer.name
         )
-        .reduce((previousValue, currentValue) => previousValue ?? currentValue)
+        .reduce((previousValue, currentValue) => previousValue ?? currentValue, null)
 }
 
 function loadMoreResultForLayer(layerId) {

src/store/index.js

@@ -31,6 +31,7 @@ import reprojectSelectedFeaturesOnProjectionChangePlugin from '@/store/plugins/r
 import screenSizeManagementPlugin from '@/store/plugins/screen-size-management.plugin'
 import syncCameraLonLatZoom from '@/store/plugins/sync-camera-lonlatzoom'
 import topicChangeManagementPlugin from '@/store/plugins/topic-change-management.plugin'
+import updateSelectedFeaturesPlugin from '@/store/plugins/update-selected-features.plugin'
 
 const store = createStore({
     // Do not run strict mode on production has it has performance cost
@@ -52,6 +53,7 @@ const store = createStore({
         loadKmlDataAndMetadata,
         loadGpxDataAndMetadata,
         loadCOGExtent,
+        updateSelectedFeaturesPlugin,
     ],
     modules: {
         app,

src/store/modules/features.store.js

@@ -118,7 +118,9 @@ export const runIdentify = (config) => {
                 })
                 // filtering out duplicates
                 resolve(
-                    allFeatures.filter((feature, index) => allFeatures.indexOf(feature) === index)
+                    Array.from(
+                        new Map(allFeatures.map((feature) => [feature.id, feature])).values()
+                    )
                 )
             })
             .catch((error) => {

src/store/plugins/update-selected-features.plugin.js

@@ -0,0 +1,56 @@
+const dispatcher = { dispatcher: 'update-selected-features.plugin' }
+
+/** @param store */
+const updateSelectedFeaturesPlugin = (store) => {
+    store.subscribe((mutation) => {
+        if (
+            ![
+                'setLayerYear',
+                'toggleLayerVisibility',
+                'addLayer',
+                'removeLayerByIndex',
+                'removeLayersById',
+                'clearLayers',
+            ].includes(mutation.type)
+        ) {
+            return
+        }
+        const selectedFeatures = store.getters.selectedFeatures
+        const clickInfo = store.state.map.clickInfo
+        // when clicked on the map and no feature is selected we don't want to re run the identify features
+        if (!clickInfo || (clickInfo.coordinate.length === 2 && selectedFeatures.length === 0)) {
+            return
+        }
+        let updateFeatures = true // for 'setLayerYear', 'addLayer', 'clearLayers', 'removeLayerByIndex' we always update
+        let layerId
+        // if selected features do not have id of removed layer dont update features
+        if (['toggleLayerVisibility'].includes(mutation.type)) {
+            const layer = store.state.layers.activeLayers.at(mutation.payload.index)
+            if (layer?.visible) {
+                updateFeatures = true // for toggleLayerVisibility we always update if layer has gone from invisible to visible
+                // if the layer went from visible to invisible we need to check if there are selected features from this layer
+            } else {
+                layerId = layer?.id
+            }
+        }
+        // if selected features do not have id of removed layer dont update features
+        if (['removeLayersById'].includes(mutation.type)) {
+            layerId = mutation.payload.layerId
+        }
+
+        if (layerId) {
+            updateFeatures = selectedFeatures.some((feature) => feature.layer.id === layerId)
+        }
+
+        if (updateFeatures) {
+            store.dispatch('identifyFeatureAt', {
+                layers: store.getters.visibleLayers.filter((layer) => layer.hasTooltip),
+                vectorFeatures: clickInfo.features,
+                coordinate: clickInfo.coordinate,
+                ...dispatcher,
+            })
+        }
+    })
+}
+
+export default updateSelectedFeaturesPlugin

tests/cypress/tests-e2e/featureSelection.cy.js

@@ -385,6 +385,18 @@ describe('Testing the feature selection', () => {
 
             cy.get('@loadMore').should('not.exist')
 
+            cy.log(
+                'verify that the feature selection is cleared for the layer when the layer is toggled off'
+            )
+            cy.openMenuIfMobile()
+            cy.get(`[data-cy^="button-toggle-visibility-layer-${'test.wms.layer'}-0"]`).click()
+            cy.closeMenuIfMobile()
+            cy.get('[data-cy="highlighted-features"]')
+                .as('highlightedFeatures')
+                .should('be.visible')
+            cy.get('@highlightedFeatures').find('[data-cy="feature-item"]').should('have.length', 1)
+            cy.wait('@routeChange')
+
             cy.log(
                 'sending a single feature as response, checking that the "Load more" button is not added'
             )
@@ -423,7 +435,7 @@ describe('Testing the feature selection', () => {
             cy.wait('@emptyIdentify')
             cy.get('@highlightedFeatures').should('not.exist')
 
-            cy.get('@routeChange.all').should('have.length', 5)
+            cy.get('@routeChange.all').should('have.length', 6)
             cy.get('@layers.all').should('have.length', 1)
             cy.get('@topics.all').should('have.length', 1)
             cy.get('@topic-ech.all').should('have.length', 1)