geonetwork-ui 2.4.0-dev.d000fb89 → 2.4.0-dev.d3529f01

package/src/libs/feature/editor/src/lib/fields.config.ts

@@ -4,6 +4,7 @@ import {
   EditorField,
   EditorSection,
 } from './models/editor-config.model'
+import { Keyword } from '../../../../../libs/common/domain/src/lib/model/record'
 
 /**
  * This file contains the configuration of the fields that will be displayed in the editor.
@@ -44,6 +45,7 @@ export const RECORD_RESOURCE_UPDATED_FIELD: EditorField = {
   formFieldConfig: {
     labelKey: marker('editor.record.form.field.resourceUpdated'),
   },
+  gridColumnSpan: 1,
 }
 
 export const RECORD_UPDATED_FIELD: EditorField = {
@@ -53,14 +55,15 @@ export const RECORD_UPDATED_FIELD: EditorField = {
     locked: true,
   },
   onSaveProcess: '${dateNow()}',
+  gridColumnSpan: 1,
 }
 
 export const RECORD_UPDATE_FREQUENCY_FIELD: EditorField = {
   model: 'updateFrequency',
-  formFieldConfig: {
-    labelKey: marker('editor.record.form.field.updateFrequency'),
-  },
+  formFieldConfig: {},
 }
+// keeping track of the label to not lose existing translation
+marker('editor.record.form.field.updateFrequency')
 
 export const RECORD_TEMPORAL_EXTENTS_FIELD: EditorField = {
   model: 'temporalExtents',
@@ -90,6 +93,13 @@ export const CONTACTS_FOR_RESOURCE_FIELD: EditorField = {
   },
 }
 
+export const CONTACTS: EditorField = {
+  model: 'contacts',
+  formFieldConfig: {
+    labelKey: '',
+  },
+}
+
 export const RECORD_GRAPHICAL_OVERVIEW_FIELD: EditorField = {
   model: 'overviews',
   formFieldConfig: {
@@ -104,6 +114,14 @@ export const RECORD_SPATIAL_EXTENTS_FIELD: EditorField = {
   },
 }
 
+export const RECORD_ONLINE_LINK_RESOURCES: EditorField = {
+  model: 'onlineResources',
+  modelSpecifier: 'onlineResourceType:link',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.onlineLinkResources'),
+  },
+}
+
 /************************************************************
  ***************          SECTIONS          *****************
  ************************************************************
@@ -149,7 +167,7 @@ export const ASSOCIATED_RESOURCES_SECTION: EditorSection = {
 export const ANNEXES_SECTION: EditorSection = {
   labelKey: marker('editor.record.form.section.annexes.label'),
   hidden: false,
-  fields: [],
+  fields: [RECORD_ONLINE_LINK_RESOURCES],
 }
 
 export const CLASSIFICATION_SECTION: EditorSection = {
@@ -180,7 +198,7 @@ export const DATA_POINT_OF_CONTACT_SECTION: EditorSection = {
     'editor.record.form.section.dataPointOfContact.description'
   ),
   hidden: false,
-  fields: [],
+  fields: [CONTACTS],
 }
 
 /************************************************************
@@ -210,7 +228,7 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
 }
 
 /************************************************************
- ***************           LICENSES            *****************
+ ***************           LICENSES            **************
  ************************************************************
  */
 export const OPEN_DATA_LICENSES: string[] = [
@@ -220,3 +238,24 @@ export const OPEN_DATA_LICENSES: string[] = [
   'odc-by',
   'pddl',
 ]
+
+export const MAX_UPLOAD_SIZE_MB = 10
+/************************************************************
+ ***************        SPATIAL SCOPE            ************
+ ************************************************************
+ */
+
+export const SPATIAL_SCOPES: Keyword[] = [
+  {
+    key: 'http://inspire.ec.europa.eu/metadata-codelist/SpatialScope/national',
+    label: 'National',
+    description: '',
+    type: 'theme',
+  },
+  {
+    key: 'http://inspire.ec.europa.eu/metadata-codelist/SpatialScope/regional',
+    label: 'Regional',
+    description: '',
+    type: 'theme',
+  },
+]

package/src/libs/feature/editor/src/lib/models/editor-config.model.ts

@@ -16,12 +16,24 @@ export interface FormFieldConfig {
   invalidHintKey?: string
 }
 
+// Specifiers let us use specific components
+// This is used for instance to target only certain online resources in a field
+type OnlineLinkResourceSpecifier = `onlineResourceType:link`
+type DatasetDistributionsSpecifier = `onlineResourceType:!link`
+export type FieldModelSpecifier =
+  | OnlineLinkResourceSpecifier
+  | DatasetDistributionsSpecifier
+
 export interface EditorField {
   // configuration of the form field used as presentation
   formFieldConfig: FormFieldConfig
 
   // name of the target field in the record; will not change the record directly if not defined
   model?: CatalogRecordKeys
+  modelSpecifier?: FieldModelSpecifier
+
+  // grid column span; if unspecified, full width will be used
+  gridColumnSpan?: number
 
   // a hidden field won't show but can still be used to modify the record
   // FIXME: currently this is redundant with an absence of formFieldConfig but necessary for clarity

package/src/libs/feature/editor/src/lib/services/editor.service.ts

@@ -15,6 +15,7 @@ export class EditorService {
   // returns the record as it was when saved, alongside its source
   saveRecord(
     record: CatalogRecord,
+    recordSource: string,
     fieldsConfig: EditorConfig,
     generateNewUniqueIdentifier = false
   ): Observable<[CatalogRecord, string]> {
@@ -40,7 +41,7 @@ export class EditorService {
       savedRecord.uniqueIdentifier = null
     }
 
-    return this.recordsRepository.saveRecord(savedRecord).pipe(
+    return this.recordsRepository.saveRecord(savedRecord, recordSource).pipe(
       switchMap((uniqueIdentifier) =>
         this.recordsRepository.openRecordForEdition(uniqueIdentifier)
       ),
@@ -54,9 +55,12 @@ export class EditorService {
 
   // emits and completes once saving is done
   // note: onSave processes are not run for drafts
-  saveRecordAsDraft(record: CatalogRecord): Observable<void> {
+  saveRecordAsDraft(
+    record: CatalogRecord,
+    recordSource: string
+  ): Observable<void> {
     return this.recordsRepository
-      .saveRecordAsDraft(record)
+      .saveRecordAsDraft(record, recordSource)
       .pipe(map(() => undefined))
   }
 

package/src/libs/feature/map/src/index.ts

@@ -1,20 +1,13 @@
 export * from './lib/+state/map.facade'
-export * from './lib/+state/map.models'
 export * from './lib/+state/map.selectors'
 export * from './lib/+state/map.reducer'
 export * from './lib/+state/map.actions'
 export * from './lib/feature-map.module'
-export * from './lib/manager/map-manager.service'
-export * from './lib/manager/map-instance.directive'
-export * from './lib/feature-info/feature-info.service'
-export * from './lib/map-context/map-context.model'
-export * from './lib/map-context/map-context.service'
-export * from './lib/map-context/component/map-context.component'
+export * from './lib/map-state-container/map-state-container.component'
 export * from './lib/constant'
 export * from './lib/utils'
 export * from './lib/style'
 export * from './lib/layers-panel/layers-panel.component'
 export * from './lib/add-layer-from-catalog/add-layer-from-catalog.component'
 export * from './lib/add-layer-from-catalog/add-layer-record-preview/add-layer-record-preview.component'
-export * from './lib/map-container/map-container.component'
 export * from './lib/geocoding/geocoding.component'

package/src/libs/feature/map/src/lib/+state/map.actions.ts

@@ -1,32 +1,17 @@
 import { createAction, props } from '@ngrx/store'
-import { MapLayer } from './map.models'
+import { MapContext } from '@geospatial-sdk/core'
+import type { Feature } from 'geojson'
 
-export const addLayer = createAction(
-  '[Map] Add Layer',
-  props<{ layer: MapLayer; atIndex?: number }>()
+export const setContext = createAction(
+  '[Map] Set Context',
+  props<{ context: MapContext }>()
 )
 
-export const removeLayer = createAction(
-  '[Map] Remove Layer',
-  props<{ index: number }>()
+export const setSelectedFeatures = createAction(
+  '[Map] Set Selected Features',
+  props<{ selectedFeatures: Feature[] }>()
 )
 
-export const updateLayer = createAction(
-  '[Map] Update Layer',
-  props<{ updatedLayer: MapLayer; index: number }>()
-)
-
-export const changeLayerOrder = createAction(
-  '[Map] Change Layer Order',
-  props<{ currentIndex: number; newIndex: number }>()
-)
-
-export const setLayerError = createAction(
-  '[Map] Set Layer Error',
-  props<{ index: number; error: string }>()
-)
-
-export const clearLayerError = createAction(
-  '[Map] Clear Layer Error',
-  props<{ index: number }>()
+export const clearSelectedFeatures = createAction(
+  '[Map] Clear Selected Features'
 )

package/src/libs/feature/map/src/lib/+state/map.facade.ts

@@ -1,30 +1,26 @@
 import { Injectable } from '@angular/core'
 import { select, Store } from '@ngrx/store'
 import * as MapSelectors from './map.selectors'
-import { MapLayer } from './map.models'
 import * as MapActions from './map.actions'
+import { MapContext } from '@geospatial-sdk/core'
+import { Feature } from 'geojson'
 
 @Injectable()
 export class MapFacade {
-  layers$ = this.store.pipe(select(MapSelectors.getMapLayers))
+  context$ = this.store.pipe(select(MapSelectors.getMapContext))
+  selectedFeatures$ = this.store.pipe(select(MapSelectors.getSelectedFeatures))
 
   constructor(private readonly store: Store) {}
 
-  /**
-   * Use the initialization action to perform one
-   * or more tasks in your Effects.
-   */
-  init() {
-    // placeholder
+  applyContext(context: MapContext) {
+    this.store.dispatch(MapActions.setContext({ context }))
   }
 
-  addLayer(layer: MapLayer) {
-    this.store.dispatch(MapActions.addLayer({ layer }))
+  selectFeatures(selectedFeatures: Feature[]) {
+    this.store.dispatch(MapActions.setSelectedFeatures({ selectedFeatures }))
   }
-  addLayerAtIndex(layer: MapLayer, index: number) {
-    this.store.dispatch(MapActions.addLayer({ layer, atIndex: index }))
-  }
-  removeLayer(index: number) {
-    this.store.dispatch(MapActions.removeLayer({ index }))
+
+  clearFeatureSelection() {
+    this.store.dispatch(MapActions.clearSelectedFeatures())
   }
 }

package/src/libs/feature/map/src/lib/+state/map.reducer.ts

@@ -1,12 +1,13 @@
 import { Action, createReducer, on } from '@ngrx/store'
-
 import * as MapActions from './map.actions'
-import { MapLayerWithInfo } from './map.models'
+import { MapContext } from '@geospatial-sdk/core'
+import { Feature } from 'geojson'
 
 export const MAP_FEATURE_KEY = 'map'
 
 export interface MapState {
-  layers: MapLayerWithInfo[]
+  context: MapContext
+  selectedFeatures: Feature[]
 }
 
 export interface MapPartialState {
@@ -14,68 +15,30 @@ export interface MapPartialState {
 }
 
 export const initialMapState: MapState = {
-  layers: [],
+  context: { layers: [], view: null },
+  selectedFeatures: [],
 }
 
 const reducer = createReducer(
   initialMapState,
-  on(MapActions.addLayer, (state, action) => {
-    const layers: MapLayerWithInfo[] = [...state.layers]
-    const layerWithInfo = { ...action.layer, loading: false, error: null }
-    if (!('atIndex' in action)) layers.push(layerWithInfo)
-    else layers.splice(action.atIndex, 0, layerWithInfo)
+  on(MapActions.setContext, (state, { context }) => {
     return {
       ...state,
-      layers,
+      context,
     }
   }),
-  on(MapActions.updateLayer, (state, action) => ({
-    ...state,
-    layers: state.layers.map((layer, index) =>
-      index === action.index
-        ? {
-            ...action.updatedLayer,
-            loading: false,
-            error: null,
-          }
-        : layer
-    ),
-  })),
-  on(MapActions.removeLayer, (state, action) => ({
-    ...state,
-    layers: state.layers.filter((layer, index) => index !== action.index),
-  })),
-  on(MapActions.changeLayerOrder, (state, action) => {
-    const layers: MapLayerWithInfo[] = [...state.layers]
-    const moved = layers.splice(action.currentIndex, 1)[0]
-    layers.splice(action.newIndex, 0, moved)
+  on(MapActions.setSelectedFeatures, (state, { selectedFeatures }) => {
     return {
       ...state,
-      layers,
+      selectedFeatures,
     }
   }),
-  on(MapActions.setLayerError, (state, action) => ({
-    ...state,
-    layers: state.layers.map((layer, index) =>
-      index === action.index
-        ? {
-            ...layer,
-            error: action.error,
-          }
-        : layer
-    ),
-  })),
-  on(MapActions.clearLayerError, (state, action) => ({
-    ...state,
-    layers: state.layers.map((layer, index) =>
-      index === action.index
-        ? {
-            ...layer,
-            error: null,
-          }
-        : layer
-    ),
-  }))
+  on(MapActions.clearSelectedFeatures, (state) => {
+    return {
+      ...state,
+      selectedFeatures: [],
+    }
+  })
 )
 
 export function mapReducer(state: MapState | undefined, action: Action) {

package/src/libs/feature/map/src/lib/+state/map.selectors.ts

@@ -4,7 +4,12 @@ import { MAP_FEATURE_KEY, MapState } from './map.reducer'
 // Lookup the 'Map' feature state managed by NgRx
 export const getMapState = createFeatureSelector<MapState>(MAP_FEATURE_KEY)
 
-export const getMapLayers = createSelector(
+export const getMapContext = createSelector(
   getMapState,
-  (state: MapState) => state.layers
+  (state: MapState) => state.context
+)
+
+export const getSelectedFeatures = createSelector(
+  getMapState,
+  (state: MapState) => state.selectedFeatures
 )

package/src/libs/feature/map/src/lib/add-layer-from-catalog/add-layer-record-preview/add-layer-record-preview.component.ts

@@ -5,17 +5,13 @@ import {
   LinkClassifierService,
   LinkUsage,
 } from '../../../../../../../libs/util/shared/src'
-import { Observable, of, throwError } from 'rxjs'
-import { MapUtilsService } from '../../utils'
+import { firstValueFrom, Observable, of, throwError } from 'rxjs'
 import { MapFacade } from '../../+state/map.facade'
 import {
-  MapContextLayerModel,
-  MapContextLayerTypeEnum,
-} from '../../map-context/map-context.model'
-import {
-  DatasetDistribution,
+  DatasetOnlineResource,
   DatasetRecord,
 } from '../../../../../../../libs/common/domain/src/lib/model/record'
+import { MapContextLayer } from '@geospatial-sdk/core'
 import { ThumbnailComponent } from '../../../../../../../libs/ui/elements/src'
 import { ButtonComponent } from '../../../../../../../libs/ui/inputs/src'
 import { CommonModule } from '@angular/common'
@@ -29,29 +25,30 @@ import { CommonModule } from '@angular/common'
   imports: [ThumbnailComponent, ButtonComponent, CommonModule],
 })
 export class AddLayerRecordPreviewComponent extends RecordPreviewComponent {
-  get mapLinks(): DatasetDistribution[] {
-    return (this.record as DatasetRecord).distributions.filter((link) =>
+  get mapLinks(): DatasetOnlineResource[] {
+    return (this.record as DatasetRecord).onlineResources.filter((link) =>
       this.linkClassifier.hasUsage(link, LinkUsage.MAP_API)
-    ) as DatasetDistribution[]
+    ) as DatasetOnlineResource[]
   }
 
   constructor(
     protected elementRef: ElementRef,
     private linkClassifier: LinkClassifierService,
-    private mapFacade: MapFacade,
-    private mapUtils: MapUtilsService
+    private mapFacade: MapFacade
   ) {
     super(elementRef)
   }
 
-  async handleLinkClick(link: DatasetDistribution) {
-    const layer = await this.getLayerFromLink(link).toPromise()
-    this.mapFacade.addLayer({ ...layer, title: this.record.title })
+  async handleLinkClick(link: DatasetOnlineResource) {
+    const layer = await firstValueFrom(this.getLayerFromLink(link))
+    const context = await firstValueFrom(this.mapFacade.context$)
+    this.mapFacade.applyContext({
+      ...context,
+      layers: [...context.layers, { ...layer, label: this.record.title }],
+    })
   }
 
-  getLayerFromLink(
-    link: DatasetDistribution
-  ): Observable<MapContextLayerModel> {
+  getLayerFromLink(link: DatasetOnlineResource): Observable<MapContextLayer> {
     if (link.type !== 'service')
       return throwError(
         () => 'map layer could not be built for this distribution'
@@ -59,20 +56,20 @@ export class AddLayerRecordPreviewComponent extends RecordPreviewComponent {
     if (link.accessServiceProtocol === 'wms') {
       return of({
         url: link.url.toString(),
-        type: MapContextLayerTypeEnum.WMS,
+        type: 'wms',
         name: link.name,
       })
     } else if (link.accessServiceProtocol === 'wmts') {
       return of({
         url: link.url.toString(),
-        type: MapContextLayerTypeEnum.WMTS,
+        type: 'wmts',
         name: link.name,
       })
     }
     return throwError(() => 'protocol not supported')
   }
 
-  getLinkLabel(link: DatasetDistribution) {
+  getLinkLabel(link: DatasetOnlineResource) {
     return getLinkLabel(link)
   }
 }

package/src/libs/feature/map/src/lib/add-layer-from-file/add-layer-from-file.component.ts

@@ -1,6 +1,7 @@
 import { ChangeDetectorRef, Component } from '@angular/core'
-import { MapContextLayerModel } from '../map-context/map-context.model'
 import { MapFacade } from '../+state/map.facade'
+import { MapContextLayerGeojson } from '@geospatial-sdk/core'
+import { firstValueFrom } from 'rxjs'
 import { UiInputsModule } from '../../../../../../libs/ui/inputs/src'
 import { TranslateModule } from '@ngx-translate/core'
 import { CommonModule } from '@angular/common'
@@ -65,25 +66,30 @@ export class AddLayerFromFileComponent {
   }
 
   private addGeoJsonLayer(file: File) {
-    return new Promise<void>((resolve, reject) => {
+    return new Promise((resolve, reject) => {
       try {
         const reader = new FileReader()
         reader.onload = () => {
-          const result = reader.result as string
-          const title = file.name.split('.').slice(0, -1).join('.')
-          const layerToAdd: MapContextLayerModel = {
-            type: 'geojson',
-            data: result,
-          }
-          this.mapFacade.addLayer({ ...layerToAdd, title: title })
-          this.displayMessage('File successfully added to map', 'success')
-          resolve()
+          resolve(reader.result as string)
         }
         reader.onerror = reject
         reader.readAsText(file)
       } catch (error) {
         reject(error)
       }
+    }).then(async (result: string) => {
+      const context = await firstValueFrom(this.mapFacade.context$)
+      const title = file.name.split('.').slice(0, -1).join('.')
+      const layerToAdd: MapContextLayerGeojson = {
+        type: 'geojson',
+        data: result,
+        label: title,
+      }
+      this.mapFacade.applyContext({
+        ...context,
+        layers: [...context.layers, layerToAdd],
+      })
+      this.displayMessage('File successfully added to map', 'success')
     })
   }
 

package/src/libs/feature/map/src/lib/add-layer-from-ogc-api/add-layer-from-ogc-api.component.ts

@@ -8,10 +8,6 @@ import {
 } from '@angular/core'
 import { OgcApiEndpoint } from '@camptocamp/ogc-client'
 import { debounceTime, Subject } from 'rxjs'
-import {
-  MapContextLayerModel,
-  MapContextLayerTypeEnum,
-} from '../map-context/map-context.model'
 import { TranslateModule } from '@ngx-translate/core'
 import {
   DropdownChoice,
@@ -19,7 +15,7 @@ import {
   UiInputsModule,
 } from '../../../../../../libs/ui/inputs/src'
 import { CommonModule } from '@angular/common'
-import { MapLayer } from '../+state/map.models'
+import { MapContextLayer, MapContextLayerOgcApi } from '@geospatial-sdk/core'
 
 @Component({
   selector: 'gn-ui-add-layer-from-ogc-api',
@@ -30,7 +26,7 @@ import { MapLayer } from '../+state/map.models'
 })
 export class AddLayerFromOgcApiComponent implements OnInit {
   @Input() ogcUrl: string
-  @Output() layerAdded = new EventEmitter<MapLayer>()
+  @Output() layerAdded = new EventEmitter<MapContextLayer>()
 
   urlChange = new Subject<string>()
   loading = false
@@ -112,24 +108,27 @@ export class AddLayerFromOgcApiComponent implements OnInit {
     try {
       const ogcEndpoint = await new OgcApiEndpoint(this.ogcUrl)
       let layerUrl: string
+      let useTiles: MapContextLayerOgcApi['useTiles']
 
       if (layerType === 'vectorTiles') {
         layerUrl = await ogcEndpoint.getVectorTilesetUrl(layer)
+        useTiles = 'vector'
       } else if (layerType === 'mapTiles') {
         layerUrl = await ogcEndpoint.getMapTilesetUrl(layer)
+        useTiles = 'map'
       } else {
         layerUrl = await ogcEndpoint.getCollectionItemsUrl(layer, {
           outputFormat: 'json',
         })
       }
 
-      const layerToAdd: MapContextLayerModel = {
-        name: layer,
+      this.layerAdded.emit({
         url: layerUrl,
-        type: MapContextLayerTypeEnum.OGCAPI,
-        layerType: layerType,
-      }
-      this.layerAdded.emit({ ...layerToAdd, title: layer })
+        type: 'ogcapi',
+        collection: layer,
+        ...(useTiles && { useTiles }),
+        label: layer,
+      })
     } catch (error) {
       const err = error as Error
       console.error('Error adding layer:', err.message)

package/src/libs/feature/map/src/lib/add-layer-from-wfs/add-layer-from-wfs.component.ts

@@ -1,12 +1,9 @@
 import { ChangeDetectorRef, Component, OnInit } from '@angular/core'
 import { WfsEndpoint, WfsFeatureTypeBrief } from '@camptocamp/ogc-client'
-import { Subject } from 'rxjs'
-import {
-  MapContextLayerModel,
-  MapContextLayerTypeEnum,
-} from '../map-context/map-context.model'
+import { firstValueFrom, Subject } from 'rxjs'
 import { MapFacade } from '../+state/map.facade'
 import { debounceTime } from 'rxjs/operators'
+import { MapContextLayer } from '@geospatial-sdk/core'
 import { ButtonComponent, TextInputComponent } from '../../../../../../libs/ui/inputs/src'
 import { TranslateModule } from '@ngx-translate/core'
 import { CommonModule } from '@angular/common'
@@ -58,12 +55,17 @@ export class AddLayerFromWfsComponent implements OnInit {
     }
   }
 
-  addLayer(layer: WfsFeatureTypeBrief) {
-    const layerToAdd: MapContextLayerModel = {
-      name: layer.name,
+  async addLayer(layer: WfsFeatureTypeBrief) {
+    const context = await firstValueFrom(this.mapFacade.context$)
+    const layerToAdd: MapContextLayer = {
+      featureType: layer.name,
       url: this.wfsUrl.toString(),
-      type: MapContextLayerTypeEnum.WFS,
+      type: 'wfs',
+      label: layer.title,
     }
-    this.mapFacade.addLayer({ ...layerToAdd, title: layer.title })
+    this.mapFacade.applyContext({
+      ...context,
+      layers: [...context.layers, layerToAdd],
+    })
   }
 }

package/src/libs/feature/map/src/lib/add-layer-from-wms/add-layer-from-wms.component.ts

@@ -1,12 +1,9 @@
 import { ChangeDetectorRef, Component, OnInit } from '@angular/core'
 import { WmsEndpoint, WmsLayerSummary } from '@camptocamp/ogc-client'
 import { MapFacade } from '../+state/map.facade'
-import {
-  MapContextLayerModel,
-  MapContextLayerTypeEnum,
-} from '../map-context/map-context.model'
-import { Subject } from 'rxjs'
+import { firstValueFrom, Subject } from 'rxjs'
 import { debounceTime } from 'rxjs/operators'
+import { MapContextLayer } from '@geospatial-sdk/core'
 import { ButtonComponent, TextInputComponent } from '../../../../../../libs/ui/inputs/src'
 import { CommonModule } from '@angular/common'
 import { TranslateModule } from '@ngx-translate/core'
@@ -57,12 +54,17 @@ export class AddLayerFromWmsComponent implements OnInit {
     }
   }
 
-  addLayer(layer: WmsLayerSummary) {
-    const layerToAdd: MapContextLayerModel = {
+  async addLayer(layer: WmsLayerSummary) {
+    const context = await firstValueFrom(this.mapFacade.context$)
+    const layerToAdd: MapContextLayer = {
       name: layer.name,
       url: this.wmsUrl.toString(),
-      type: MapContextLayerTypeEnum.WMS,
+      type: 'wms',
+      label: layer.title,
     }
-    this.mapFacade.addLayer({ ...layerToAdd, title: layer.title })
+    this.mapFacade.applyContext({
+      ...context,
+      layers: [...context.layers, layerToAdd],
+    })
   }
 }

package/src/libs/feature/map/src/lib/constant/index.ts

@@ -1,2 +1 @@
-export * from './map-options'
 export * from './projections'