@kalisio/kdk 2.5.3 → 2.6.0

package/map/client/mixins/mixin.activity.js

@@ -1,17 +1,25 @@
+import config from 'config'
 import _ from 'lodash'
 import logger from 'loglevel'
-import config from 'config'
-import { Store } from '../../../core/client/index.js'
-import { filterContent, bindContent, listenToServiceEvents, unlistenToServiceEvents } from '../../../core/client/utils/index.js'
+import sift from 'sift'
+import { Store } from '../../../core/client/store.js'
+import { Events } from '../../../core/client/events.js'
+import { api } from '../../../core/client/api.js'
+import { isDataOperation } from '../../../core/client/utils/utils.services.js'
+import { bindContent, filterContent, listenToServiceEvents, unlistenToServiceEvents } from '../../../core/client/utils/index.js'
 import { Geolocation } from '../geolocation.js'
-import { setEngineJwt, getLayers, getCategories } from '../utils/utils.catalog.js'
+import { getCategories, getLayers, getLayersByCategory, getOrphanLayers, getSublegends, processTranslations, setEngineJwt } from '../utils/utils.catalog.js'
 import * as layers from '../utils/utils.layers.js'
 import { getCatalogProjectQuery } from '../utils/utils.project.js'
 
 export const activity = {
+  emits: [
+    'layer-filter-toggled'
+  ],
   data () {
     return {
       layerCategories: [],
+      orphanLayers: [],
       variables: [],
       engine: 'leaflet',
       engineReady: false,
@@ -84,16 +92,66 @@ export const activity = {
       if (context) categories = categories.concat(await getCategories({ context }))
       return categories
     },
+    async getCatalogSublegends () {
+      // We get sublegends coming from global catalog first if any
+      let sublegends = await getSublegends()
+      // Then we get categories coming from contextual catalog if any
+      const context = Store.get('context')
+      if (context) sublegends = sublegends.concat(await getSublegends({ context }))
+      return sublegends
+    },
     async addCatalogCategory (category) {
       this.layerCategories.push(category)
     },
+    // Retrieve layer categories from catalog 
     async refreshLayerCategories () {
       this.layerCategories.splice(0, this.layerCategories.length)
       const layerCategories = await this.getCatalogCategories()
       for (let i = 0; i < layerCategories.length; i++) {
         this.addCatalogCategory(layerCategories[i])
       }
+      await this.refreshOrphanLayers()
+      this.reorderLayers()
+    },
+    getOrphanLayerByName (name) {
+      return this.orphanLayers.find(l => l?.name === name)
+    },
+    isOrphanLayer (layer) {
+      return this.orphanLayers.some(l => l?.name === layer.name)
+    },
+    // To be overriden by apps to perform any operation (eg serialization) when the category order has been changed by the user
+    // By default perform layer ordering in the underlying engine
+    async updateCategoriesOrder (sourceCategoryId, targetCategoryId) {
+      this.reorderLayers()
+    },
+    // To be overriden by apps to perform any operation (eg serialization) when the layer order has been changed by the user in a category
+    // By default perform layer ordering in the underlying engine
+    // Data payload is like { layers } in order to ease direct update of the target category
+    async updateLayersOrder (sourceCategoryId, data, movedLayer) {
+      this.reorderLayers()
+    },
+    // To be overriden by apps to perform any operations (eg serialization) when the layer order has been changed by the user in the orphan layer list
+    // By default perform layer ordering in the underlying engine
+    async updateOrphanLayersOrder (orphanLayers, movedLayer) {
+      this.reorderLayers()
+    },
+    // Perform layer ordering in the underlying engine according to current order in categories and layer list
+    reorderLayers () {
+      if (typeof this.bringLayerToFront !== 'function') return
+      for (let i = this.layerCategories.length - 1; i >= 0; i--) {
+        const category = this.layerCategories[i]
+        if (!category?.layers) continue
+        for (let j = category.layers.length - 1; j >= 0; j--) {
+          const layer = category.layers[j]
+          this.bringLayerToFront(layer)
+        }
+      }
+      for (let i = this.orphanLayers.length - 1; i >= 0; i--) {
+        const layer = this.orphanLayers[i]
+        this.bringLayerToFront(layer.name)
+      }
     },
+    // Retrieve layers from catalog 
     async refreshLayers () {
       // Clear layers and variables
       this.clearLayers()
@@ -104,12 +162,19 @@ export const activity = {
       for (let i = 0; i < catalogLayers.length; i++) {
         await this.addCatalogLayer(catalogLayers[i])
       }
+      await this.refreshOrphanLayers()
       // We need at least an active background
       const hasVisibleBaseLayer = catalogLayers.find((layer) => (layer.type === 'BaseLayer') && layer.isVisible)
       if (!hasVisibleBaseLayer) {
         const baseLayer = catalogLayers.find((layer) => (layer.type === 'BaseLayer'))
         if (baseLayer) await this.showLayer(baseLayer.name)
       }
+      this.reorderLayers()
+    },
+    // Update orphan layers list (ie layers without any category) based on current loaded categories/layers
+    async refreshOrphanLayers () {
+      const layersByCategory = getLayersByCategory(this.layers, this.layerCategories)
+      this.orphanLayers = getOrphanLayers(this.layers, layersByCategory)
     },
     isInMemoryLayer: layers.isInMemoryLayer,
     isUserLayer: layers.isUserLayer,
@@ -127,35 +192,39 @@ export const activity = {
     setLayerCached: layers.setLayerCached,
     setLayerUncached: layers.setLayerUncached,
     isLayerEditable: layers.isLayerEditable,
+    isLayerFilterEditable: layers.isLayerFilterEditable,
     isLayerRemovable: layers.isLayerRemovable,
     isLayerStyleEditable: layers.isLayerStyleEditable,
     isLayerDataEditable: layers.isLayerDataEditable,
     canCreateLayer () {
-      return this.$can('create', 'catalog')
+      return api.can('create', 'catalog')
     },
     canUpdateLayer (layer) {
-      return layers.isInMemoryLayer(layer) || this.$can('update', 'catalog')
+      return layers.isInMemoryLayer(layer) || api.can('update', 'catalog')
     },
     canRemoveLayer (layer) {
-      return layers.isInMemoryLayer(layer) || this.$can('remove', 'catalog')
+      return layers.isInMemoryLayer(layer) || api.can('remove', 'catalog')
     },
     async resetLayer (layer) {
-      // Keep track of data as we will reset the layer
-      let geoJson
-      if (typeof this.toGeoJson === 'function') geoJson = await this.toGeoJson(layer.name)
-      // Reset layer with new setup but keep track of current visibility state
-      // as adding the layer back will restore default visibility state
+      // This requires to recreate the layer in the underlying engine with the new setup.
+      // So it's only necessary if the layer is already visible.
       const isVisible = this.isLayerVisible(layer.name)
-      await this.removeLayer(layer.name)
-      await this.addLayer(layer)
-      if (isVisible) await this.showLayer(layer.name)
-      if (geoJson && (typeof this.toGeoJson === 'function')) this.updateLayer(layer.name, geoJson)
+      if (isVisible) {
+        // Keep track of data as the reset will los it for in-memory layers
+        let geoJson
+        if (layers.isInMemoryLayer(layer) && (typeof this.toGeoJson === 'function')) geoJson = await this.toGeoJson(layer.name)
+        await this.hideLayer(layer.name)
+        await this.showLayer(layer.name)
+        if (geoJson) this.updateLayer(layer.name, geoJson)
+        // If min/max zoom configuration has changed we need to refresh this state as well
+        if (typeof this.updateLayerDisabled === 'function') this.updateLayerDisabled(layer)
+      }
     },
     configureLayerActions (layer) {
       let actions = _.get(this, 'activityOptions.layers.actions', [])
       // Apply filtering
       actions = filterContent(actions, _.get(this, 'activityOptions.layers.filter', {}))
-      
+
       // As context is different for each item we need to clone the global action configuration
       // otherwise context will always reference the last processed item
       actions = bindContent(_.cloneDeep(actions), this, ['dialog'])
@@ -179,7 +248,10 @@ export const activity = {
     async onTriggerLayerFilter (layer, filter) {
       // Can only apply to realtime layers as we need to force a data refresh
       // removeMissing seems needed for 3d
-      if (typeof this.updateLayer === 'function') await this.updateLayer(layer.name, null, { removeMissing: true})
+      if (typeof this.updateLayer === 'function') await this.updateLayer(layer.name, null, { removeMissing: true })
+
+      this.$emit('layer-filter-toggled', layer, filter)
+      this.$engineEvents.emit('layer-filter-toggled', layer, filter)
     },
     onZoomIn () {
       const center = this.getCenter()
@@ -192,6 +264,12 @@ export const activity = {
     onZoomToLayer (layer) {
       this.zoomToLayer(layer.name)
     },
+    onBringLayerToFront (layer) {
+      if (typeof this.bringLayerToFront === 'function') this.bringLayerToFront(layer.name)
+    },
+    onBringLayerToBack (layer) {
+      if (typeof this.bringLayerToBack === 'function') this.bringLayerToBack(layer.name)
+    },
     async onSaveLayer (layer) {
       // Stop any running edition
       if ((typeof this.isLayerEdited === 'function') && this.isLayerEdited(layer)) await this.stopEditLayer('accept')
@@ -205,16 +283,19 @@ export const activity = {
         createdLayer = await layers.saveLayer(layer)
       }
       // Add layer to current project ? Check if not coming from another planet first
-      if (this.project && (this.project.getPlanetApi() === this.$api)) {
+      if (this.project && (this.project.getPlanetApi() === api)) {
         this.project.layers.push({ _id: createdLayer._id })
-        await this.$api.getService('projects').patch(this.project._id, {
+        await api.getService('projects').patch(this.project._id, {
           layers: this.project.layers
         })
       }
       // Reset layer with new setup
       // It should be triggerred by real-time event
       // but as we might not always use sockets perform it anyway
-      if (createdLayer) await this.resetLayer(createdLayer)
+      if (createdLayer) {
+        layer._id = createdLayer._id
+        await this.resetLayer(createdLayer)
+      }
     },
     editLayerByName (name, editOptions = {}) {
       // this one is used through postRobot to trigger edition
@@ -243,6 +324,9 @@ export const activity = {
         await this.resetLayer(layer)
       }
     },
+    async onRemoveCategory (category) {
+      // virtual method
+    },
     async onRemoveLayer (layer) {
       // Stop any running edition
       if ((typeof this.isLayerEdited === 'function') && this.isLayerEdited(layer)) await this.stopEditLayer('reject')
@@ -253,6 +337,16 @@ export const activity = {
       }
       // Removing the layer should automatically update all projects
     },
+    async onAddOrphanLayer (layer) {
+      if (!this.isOrphanLayer(layer)) {
+        await this.refreshOrphanLayers()
+      }
+    },
+    onRemoveOrphanLayer (layer) {
+      if (this.isOrphanLayer(layer)) {
+        _.remove(this.orphanLayers, orphanLayer => layer._id ? orphanLayer._id === layer._id : orphanLayer.name === layer.name)
+      }
+    },
     onEngineReady (engine) {
       this.engine = engine
       this.engineReady = true
@@ -263,8 +357,8 @@ export const activity = {
     },
     listenToCatalogServiceEvents () {
       // Listen about changes in global/contextual catalog services
-      const globalCatalogService = this.$api.getService('catalog', 'global')
-      const catalogService = this.$api.getService('catalog')
+      const globalCatalogService = api.getService('catalog', 'global')
+      const catalogService = api.getService('catalog')
       this.globalCatalogListeners = listenToServiceEvents('catalog', {
         context: 'global', all: this.onCatalogUpdated, removed: (object) => this.onCatalogUpdated(object, 'removed')
       }, this.globalCatalogListeners)
@@ -321,36 +415,79 @@ export const activity = {
     finalize () {
       this.unlistenToCatalogServiceEvents()
     },
+    async refreshLayer (layer, event) {
+      // Updating a layer requires to remove/add it again to cover all use cases (eg style edition, etc.)
+      // Here we preferably find layer by ID as renaming could have occured from another client
+      let planetApi
+      if (layer && (typeof layer.getPlanetApi === 'function')) {
+        planetApi = layer.getPlanetApi()
+      }
+      if (layer) {
+        // Stop any running edition
+        if ((typeof this.isLayerEdited === 'function') && this.isLayerEdited(layer)) await this.stopEditLayer('reject')
+        // Check if available for current engine
+        if (layer[this.engine]) {
+          let name = layer.name
+          // We might have a patch event changing the name so that in this case we need to use the old one
+          // because layers are indexed by name in map activities
+          const previousLayer = this.getLayerById(layer._id)
+          if (previousLayer && (previousLayer.name !== name)) name = previousLayer.name
+          await this.removeLayer(name)
+        }
+      }
+      if (event !== 'removed') {
+        // Do we need to inject a token or restore planet API ?
+        if (planetApi) Object.assign(layer, { getPlanetApi: () => planetApi })
+        await setEngineJwt([layer], planetApi)
+        processTranslations(layer)
+        await this.addCatalogLayer(layer)
+      }
+    },
+    requestRefreshLayer (layer, event) {
+      // As this is used by realtime events we need to avoid reentrance in any case
+      // multiple events regarding the same layer come in at almost the same time.
+      // This is for instance the case when saving a layer as a created then patched event come in.
+      // So we need something similar to _.debounce() but for each possible layer argument.
+      // Otherwise when two events are almost received at the same time but target different layers only the last one will be considered.
+      // Realtime events only targets layer saved in DB so that they should always have a unique ID we can rely on
+      const layerId = layer._id
+      const refreshLayer = async () => {
+        const requests = this.pendingLayerRefresh[layerId]
+        delete this.pendingLayerRefresh[layerId]
+        for (let i = 0; i< requests.length; i++) {
+          const request = requests[i]
+          await this.refreshLayer(request.layer, request.event)
+        }
+      }
+      if (!this.pendingLayerRefresh) this.pendingLayerRefresh = {}
+      // If a refresh has already been requested push new event to operation queue
+      if (this.pendingLayerRefresh[layerId]) {
+        // The way a layer is updated requires to remove/add it again to cover all use cases (eg style edition, etc.).
+        // As a consequence create/patch/update operations results in the same operations, we can avoid multiple update by "merging"
+        const lastRequest = _.last(this.pendingLayerRefresh[layerId])
+        if (isDataOperation(lastRequest.event) !== isDataOperation(event)) {
+          this.pendingLayerRefresh[layerId].push({ event, layer })
+        } else {
+          // The last operation "wins" otherwise
+          this.pendingLayerRefresh[layerId].splice(-1, 1, { event, layer })
+        }
+      } else {
+        this.pendingLayerRefresh[layerId] = [{ event, layer }]
+        setTimeout(refreshLayer, 500)
+      }
+    },
     async onCatalogUpdated (object, event) {
       switch (object.type) {
         case 'Category':
           // In any case we rebuild categories
-          this.refreshLayerCategories()
+          await this.requestRefreshLayerCategories()
           break
         case 'Context':
         case 'Service':
           // Nothing to do
           break
         default: {
-          // Updating a layer requires to remove/add it again to cover all use cases
-          // (eg style edition, etc.)
-          // Here we find layer by ID as renaming could have occured from another client
-          const layer = this.getLayerById(object._id)
-          let planetApi
-          if (layer && (typeof layer.getPlanetApi === 'function')) {
-            planetApi = layer.getPlanetApi()
-          }
-          if (layer) {
-            // Stop any running edition
-            if ((typeof this.isLayerEdited === 'function') && this.isLayerEdited(layer)) await this.stopEditLayer('reject')
-            await this.removeCatalogLayer(layer)
-          }
-          if (event !== 'removed') {
-            // Do we need to inject a token or restore planet API ?
-            if (planetApi) Object.assign(object, { getPlanetApi: () => planetApi })
-            await setEngineJwt([object], planetApi)
-            await this.addCatalogLayer(object)
-          }
+          await this.requestRefreshLayer(object, event)
           break
         }
       }
@@ -369,22 +506,31 @@ export const activity = {
     this.$engineEvents.on('map-ready', this.onEngineReady)
     this.$engineEvents.on('globe-ready', this.onEngineReady)
     this.$engineEvents.on('layer-added', this.configureLayerActions)
+    this.$engineEvents.on('layer-added', this.onAddOrphanLayer)
+    this.$engineEvents.on('layer-removed', this.onRemoveOrphanLayer)
+    // As we'd like to manage layer ordering we force to refresh it
+    // because by default Leaflet will put new elements at the end of the DOM child list.
+    this.$engineEvents.on('layer-shown', this.reorderLayers)
   },
   mounted () {
+    this.requestRefreshLayerCategories = _.debounce(this.refreshLayerCategories, 200)
     // Target online/offline service depending on status
-    this.$events.on('navigator-disconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.on('navigator-reconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.on('websocket-disconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.on('websocket-reconnected', this.resetCatalogServiceEventsListeners)
+    Events.on('navigator-disconnected', this.resetCatalogServiceEventsListeners)
+    Events.on('navigator-reconnected', this.resetCatalogServiceEventsListeners)
+    Events.on('websocket-disconnected', this.resetCatalogServiceEventsListeners)
+    Events.on('websocket-reconnected', this.resetCatalogServiceEventsListeners)
   },
   beforeUnmount () {
     this.$engineEvents.off('map-ready', this.onEngineReady)
     this.$engineEvents.off('globe-ready', this.onEngineReady)
     this.$engineEvents.off('layer-added', this.configureLayerActions)
-    this.$events.off('navigator-disconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.off('navigator-reconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.off('websocket-disconnected', this.resetCatalogServiceEventsListeners)
-    this.$events.off('websocket-reconnected', this.resetCatalogServiceEventsListeners)
+    this.$engineEvents.off('layer-added', this.onAddOrphanLayer)
+    this.$engineEvents.off('layer-removed', this.onRemoveOrphanLayer)
+    this.$engineEvents.off('layer-shown', this.reorderLayers)
+    Events.off('navigator-disconnected', this.resetCatalogServiceEventsListeners)
+    Events.off('navigator-reconnected', this.resetCatalogServiceEventsListeners)
+    Events.off('websocket-disconnected', this.resetCatalogServiceEventsListeners)
+    Events.off('websocket-reconnected', this.resetCatalogServiceEventsListeners)
     this.finalize()
   }
 }

package/map/client/mixins/mixin.context.js

@@ -1,7 +1,7 @@
 import _ from 'lodash'
 import moment from 'moment'
 import sift from 'sift'
-import { utils as kCoreUtils, Time, Store, LocalStorage } from '../../../core/client/index.js'
+import { api, utils as kCoreUtils, Time, Store, Events, LocalStorage } from '../../../core/client/index.js'
 import { isTerrainLayer } from '../utils/utils.layers.js'
 
 export const context = {
@@ -15,7 +15,7 @@ export const context = {
       if (_.has(this, `activityOptions.restore.${context}`)) {
         if (!_.get(this, `activityOptions.restore.${context}`)) return false
       }
-      return this.$store.get(`restore.${context}`)
+      return Store.get(`restore.${context}`)
     },
     getRouteContext (context) {
       switch (context) {
@@ -103,7 +103,7 @@ export const context = {
       if (asQuery) Object.assign(route.query, parameters)
       else Object.assign(route.params, parameters)
       // We catch as replacing with similar params raises a duplicate navigation error
-      this.$router.replace(route).catch(_ => {})
+      if (this.$router) this.$router.replace(route).catch(_ => {})
     },
     async setContextParameters (context, targetParameters) {
       switch (context) {
@@ -185,7 +185,7 @@ export const context = {
             // Check for a home context if not already retrieved
             // Use undefined here to check for a first try as if we find none we set it to null
             if (_.isUndefined(this.homeContext)) {
-              const response = await this.$api.getService('catalog').find({ query: { type: 'Context', isDefault: true } })
+              const response = await api.getService('catalog').find({ query: { type: 'Context', isDefault: true } })
               this.homeContext = (response.data.length > 0 ? response.data[0] : null)
             }
             if (this.homeContext) targetParameters = this.homeContext
@@ -233,16 +233,16 @@ export const context = {
       if (hasLayers) {
         Object.assign(context, this.getContextParameters('layers'))
       }
-      context = await this.$api.getService('catalog').create(context)
+      context = await api.getService('catalog').create(context)
       return context
     },
     async loadContext (context) {
       // If not context object retrieve it from catalog first
       if (typeof context === 'string') {
         if (kCoreUtils.isObjectID(context)) {
-          context = await this.$api.getService('catalog').get(context)
+          context = await api.getService('catalog').get(context)
         } else {
-          const response = await this.$api.getService('catalog').find({ query: { type: 'Context', name: context } })
+          const response = await api.getService('catalog').find({ query: { type: 'Context', name: context } })
           context = (response.data.length > 0 ? response.data[0] : null)
         }
       }
@@ -260,11 +260,11 @@ export const context = {
   },
   mounted () {
     // Whenever restore settings are updated, update view as well
-    this.$events.on('restore-view-changed', this.updateViewSettings)
-    this.$events.on('restore-layers-changed', this.updateLayersSettings)
+    Events.on('restore-view-changed', this.updateViewSettings)
+    Events.on('restore-layers-changed', this.updateLayersSettings)
   },
   beforeUnmount () {
-    this.$events.off('restore-view-changed', this.updateViewSettings)
-    this.$events.off('restore-layers-changed', this.updateLayersSettings)
+    Events.off('restore-view-changed', this.updateViewSettings)
+    Events.off('restore-layers-changed', this.updateLayersSettings)
   }
 }

package/map/client/mixins/mixin.feature-service.js

@@ -1,6 +1,8 @@
 import _ from 'lodash'
 import sift from 'sift'
 import logger from 'loglevel'
+import { Events } from '../../../core/client/events.js'
+import { api } from '../../../core/client/api.js'
 import { listenToServiceEvents, unlistenToServiceEvents } from '../../../core/client/utils/index.js'
 import * as features from '../utils/utils.features.js'
 import * as layers from '../utils/utils.layers.js'
@@ -128,7 +130,7 @@ export const featureService = {
   },
   created () {
     // Extend timeout for large write operations
-    this.$api.getService('features').timeout = 60 * 60 * 1000 // 1h should be sufficient since we also have size limits
+    api.getService('features').timeout = 60 * 60 * 1000 // 1h should be sufficient since we also have size limits
   },
   mounted () {
     // Here we need to listen to service events for all realtime layers
@@ -137,19 +139,19 @@ export const featureService = {
     this.$engineEvents.on('layer-added', this.listenToFeaturesServiceEventsForLayer)
     this.$engineEvents.on('layer-removed', this.unlistenToFeaturesServiceEventsForLayer)
     // Target online/offline service depending on status
-    this.$events.on('navigator-disconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.on('navigator-reconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.on('websocket-disconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.on('websocket-reconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.on('navigator-disconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.on('navigator-reconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.on('websocket-disconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.on('websocket-reconnected', this.listenToFeaturesServiceEventsForLayers)
   },
   beforeUnmount () {
     // Remove all listeners
     this.unlistenToFeaturesServiceEventsForLayers()
     this.$engineEvents.off('layer-added', this.listenToFeaturesServiceEventsForLayer)
     this.$engineEvents.off('layer-removed', this.unlistenToFeaturesServiceEventsForLayer)
-    this.$events.off('navigator-disconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.off('navigator-reconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.off('websocket-disconnected', this.listenToFeaturesServiceEventsForLayers)
-    this.$events.off('websocket-reconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.off('navigator-disconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.off('navigator-reconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.off('websocket-disconnected', this.listenToFeaturesServiceEventsForLayers)
+    Events.off('websocket-reconnected', this.listenToFeaturesServiceEventsForLayers)
   }
 }

package/map/client/mixins/mixin.weacast.js

@@ -1,5 +1,7 @@
 import _ from 'lodash'
 import logger from 'loglevel'
+import { Events } from '../../../core/client/events.js'
+import { api } from '../../../core/client/api.js'
 import { getForecastForLocation, getForecastProbe, getForecastForFeature } from '../utils/utils.weacast.js'
 
 export const weacast = {
@@ -16,7 +18,7 @@ export const weacast = {
   methods: {
     getWeacastApi () {
       // As we usually proxy weacast service we use our API unless another client has been specified by override
-      return this.$api
+      return api
     },
     async setupWeacast () {
       try {
@@ -119,11 +121,11 @@ export const weacast = {
     }
   },
   created () {
-    this.$events.on('time-current-time-changed', this.onCurrentForecastTimeChanged)
+    Events.on('time-current-time-changed', this.onCurrentForecastTimeChanged)
     this.$engineEvents.on('selected-level-changed', this.onWeacastSelectedLevelChanged)
   },
   beforeUnmount () {
-    this.$events.off('time-current-time-changed', this.onCurrentForecastTimeChanged)
+    Events.off('time-current-time-changed', this.onCurrentForecastTimeChanged)
     this.$engineEvents.off('selected-level-changed', this.onWeacastSelectedLevelChanged)
   }
 }

package/map/client/readers/reader.geojson.js

@@ -1,6 +1,6 @@
 import logger from 'loglevel'
 import _ from 'lodash'
-import geojsonhint from '@mapbox/geojsonhint'
+//import geojsonhint from '@mapbox/geojsonhint'
 import { i18n } from '../../../core/client/i18n.js'
 
 export const GEOJSONReader = {
@@ -38,6 +38,7 @@ export const GEOJSONReader = {
           }
         }
         // lint the geosjon file
+        /*
         const messages = geojsonhint.hint(content, options)
         // filter the message according the level to find the errors
         const errors = _.filter(messages, message => {
@@ -48,6 +49,7 @@ export const GEOJSONReader = {
           reject(new Error(i18n.t('errors.INVALID_GEOJSON_FILE', { file: file.name }), { errors }))
           return
         }
+        */
         // the geosjon file is correct
         resolve(content)
       }

package/map/client/utils/utils.capture.js

@@ -4,7 +4,7 @@ import config from 'config'
 import moment from 'moment'
 import { i18n, Events, Store, api, Layout } from '../../../core/client/index.js'
 import * as composables from '../../../core/client/composables/index.js'
-import { base64Encode, getAppLocale } from '../../../core/client/utils/index.js'
+import { base64Encode, getLocale } from '../../../core/client/utils/index.js'
 import { exportFile, Notify } from 'quasar'
 import { image } from '@pdfme/schemas'
 import { generate } from '@pdfme/generator'
@@ -54,7 +54,7 @@ export async function capture (values) {
         layout: getLayout(values),
         time: dateArray[index],
         basePath: _.has(values, 'basePath') ? values.basePath : '/#/home/',
-        lang: getAppLocale()
+        lang: getLocale()
       })
       const response = await fetch(endpoint, options)
       if (response.ok) {
@@ -105,7 +105,7 @@ function headerFooterComponent (text, position) {
   return { content: [{ component: _.get(config, `capture.${position}.component`, 'KCaptureTextArea'), text, position }], visible: true }
 }
 function northComponent (position) {
-  const northSticky = Layout.findSticky('north-sticky')
+  const northSticky = Layout.findSticky('north-arrow-sticky')
   return { content: [{ ...northSticky, position, offset: [0, 5], visible: true }] }
 }
 function legendComponent () {

package/map/client/utils/utils.catalog.js

@@ -1,7 +1,7 @@
 import _ from 'lodash'
 import sift from 'sift'
+import { api, i18n, Store } from '../../../core/client/index.js'
 import { buildUrl } from '../../../core/common/index.js'
-import { i18n, api, Store } from '../../../core/client/index.js'
 
 // Helper to set a JWT as query param in a target URL
 export function setUrlJwt (item, path, baseUrl, jwtField, jwt) {
@@ -61,7 +61,7 @@ export async function setEngineJwt (layers, planetApi) {
 }
 
 export function getLayersByCategory (layers, categories) {
-  const categorizedLayers = _.clone(layers)
+  const categorizedLayers = _.clone(Array.isArray(layers) ? layers : _.values(layers))
   const layersByCategory = {}
   _.forEach(categories, category => {
     // Built-in categories use filtering while user-defined ones use layers list
@@ -77,18 +77,22 @@ export function getLayersByCategory (layers, categories) {
     layersByCategory[category.name] = _.orderBy(layersByCategory[category.name],
       [(layer) => _.get(layer, _.get(category, 'options.orderBy', '_id'))],
       [_.get(category, 'options.order', 'asc')])
+
+    if (layers.length > 0 && category?.layers) {
+      layersByCategory[category.name] = category.layers.map(layerName => layers.find(l => l.name === layerName))
+    }
   })
   return layersByCategory
 }
 
 export function getOrphanLayers (layers, layersByCategory) {
-  const categories = _.flatten(_.values(layersByCategory))
-  const orphanLayers = _.difference(layers, categories)
+  const layersFromCategories = _.flatten(_.values(layersByCategory))
+  const orphanLayers = _.difference(Array.isArray(layers) ? layers : _.values(layers), layersFromCategories)
   // Order by
   return _.orderBy(orphanLayers, [(layer) => _.get(layer, '_id')], ['asc'])
 }
 
-function processTranslations (item) {
+export function processTranslations (item) {
   if (item.i18n) i18n.registerTranslation(item.i18n)
   if (!_.has(item, 'label')) item.label = i18n.tie(item.name)
   if (_.has(item, 'description')) item.description = i18n.tie(item.description)