geonetwork-ui 2.4.0-dev.344a92f2 → 2.4.0-dev.3b6b95eb

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-online-resources/form-field-online-resources.component.ts

@@ -0,0 +1,241 @@
+import { CommonModule } from '@angular/common'
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  TemplateRef,
+  ViewChild,
+} from '@angular/core'
+import { MatDialog } from '@angular/material/dialog'
+import { marker } from '@biesbjerg/ngx-translate-extract-marker'
+import {
+  DatasetDownloadDistribution,
+  DatasetServiceDistribution,
+  OnlineResource,
+  ServiceEndpoint,
+} from '../../../../../../../../../libs/common/domain/src/lib/model/record'
+import { PlatformServiceInterface } from '../../../../../../../../../libs/common/domain/src/lib/platform.service.interface'
+import { NotificationsService } from '../../../../../../../../../libs/feature/notifications/src'
+import {
+  FileInputComponent,
+  SwitchToggleComponent,
+  SwitchToggleOption,
+  TextAreaComponent,
+  TextInputComponent,
+  UrlInputComponent,
+} from '../../../../../../../../../libs/ui/inputs/src'
+import {
+  ModalDialogComponent,
+  SortableListComponent,
+} from '../../../../../../../../../libs/ui/layout/src'
+import { TranslateModule, TranslateService } from '@ngx-translate/core'
+import { Subscription } from 'rxjs'
+import { MAX_UPLOAD_SIZE_MB } from '../../../../fields.config'
+import { OnlineResourceCardComponent } from '../../../online-resource-card/online-resource-card.component'
+import { OnlineServiceResourceInputComponent } from '../../../online-service-resource-input/online-service-resource-input.component'
+
+type OnlineNotLinkResource =
+  | DatasetDownloadDistribution
+  | DatasetServiceDistribution
+  | ServiceEndpoint
+
+@Component({
+  selector: 'gn-ui-form-field-online-resources',
+  templateUrl: './form-field-online-resources.component.html',
+  styleUrls: ['./form-field-online-resources.component.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [
+    CommonModule,
+    SwitchToggleComponent,
+    FileInputComponent,
+    OnlineServiceResourceInputComponent,
+    UrlInputComponent,
+    SortableListComponent,
+    OnlineResourceCardComponent,
+    TextInputComponent,
+    TextAreaComponent,
+    TranslateModule,
+  ],
+})
+export class FormFieldOnlineResourcesComponent {
+  @Input() metadataUuid: string
+  @Input() set value(onlineResources: Array<OnlineResource>) {
+    this.allResources = onlineResources
+    this.notLinkResources = onlineResources.filter(
+      (res): res is OnlineNotLinkResource => res.type !== 'link'
+    )
+  }
+  @Output() valueChange: EventEmitter<Array<OnlineResource>> =
+    new EventEmitter()
+
+  @ViewChild('dialogTemplate') dialogTemplate: TemplateRef<OnlineResource>
+
+  typeOptions: SwitchToggleOption[] = [
+    {
+      label: marker('editor.record.form.field.onlineResource.toggle.dataset'),
+      value: 'download',
+      checked: true,
+    },
+    {
+      label: marker('editor.record.form.field.onlineResource.toggle.service'),
+      value: 'service',
+      checked: false,
+    },
+  ]
+  selectedType: 'download' | 'service' = 'download'
+
+  private allResources: OnlineResource[] = []
+  notLinkResources: OnlineNotLinkResource[] = []
+  uploadProgress = undefined
+  uploadSubscription: Subscription = null
+  newService = {
+    type: 'service',
+    accessServiceProtocol: 'ogcFeatures',
+    identifierInService: '',
+  } as Omit<DatasetServiceDistribution, 'url'>
+
+  protected MAX_UPLOAD_SIZE_MB = MAX_UPLOAD_SIZE_MB
+
+  constructor(
+    private notificationsService: NotificationsService,
+    private translateService: TranslateService,
+    private platformService: PlatformServiceInterface,
+    private cd: ChangeDetectorRef,
+    private dialog: MatDialog
+  ) {}
+
+  onSelectedTypeChange(selectedType: unknown) {
+    this.selectedType = selectedType as 'download' | 'service'
+  }
+
+  handleFileChange(file: File) {
+    this.uploadProgress = 0
+    this.uploadSubscription = this.platformService
+      .attachFileToRecord(this.metadataUuid, file)
+      .subscribe({
+        next: (event) => {
+          if (event.type === 'progress') {
+            this.uploadProgress = event.progress
+            this.cd.detectChanges()
+          } else if (event.type === 'success') {
+            this.uploadProgress = undefined
+            this.cd.detectChanges()
+            const newResource: DatasetDownloadDistribution = {
+              type: 'download',
+              url: new URL(event.attachment.url),
+              name: event.attachment.fileName,
+              sizeBytes: event.sizeBytes, // WARNING: this is the only time that sizeBytes is set
+            }
+            this.valueChange.emit([...this.allResources, newResource])
+          }
+        },
+        error: (error: Error) => this.handleError(error),
+      })
+  }
+
+  handleUploadCancel() {
+    if (this.uploadSubscription) {
+      this.uploadProgress = undefined
+      this.uploadSubscription.unsubscribe()
+    }
+  }
+
+  handleDownloadUrlChange(url: string) {
+    try {
+      const name = url.split('/').pop()
+      const newLink: DatasetDownloadDistribution = {
+        type: 'download',
+        url: new URL(url),
+        name,
+      }
+      this.valueChange.emit([...this.allResources, newLink])
+    } catch (e) {
+      this.handleError(e as Error)
+    }
+  }
+
+  handleServiceUrlChange(url: string) {
+    this.valueChange.emit([
+      ...this.allResources,
+      {
+        ...this.newService,
+        url: new URL(url),
+      },
+    ])
+  }
+
+  handleServiceModify(
+    oldService: DatasetServiceDistribution,
+    newService: DatasetServiceDistribution
+  ) {
+    oldService.accessServiceProtocol = newService.accessServiceProtocol
+    oldService.identifierInService = newService.identifierInService
+    oldService.url = newService.url
+  }
+
+  handleResourcesChange(items: unknown[]) {
+    const notLinks = items as OnlineNotLinkResource[]
+    const newResources = [
+      ...this.allResources.filter((r) => r.type === 'link'),
+      ...notLinks,
+    ]
+    this.valueChange.emit(newResources)
+  }
+
+  handleResourceModify(resource: OnlineNotLinkResource, index: number) {
+    this.openEditDialog(resource, index)
+  }
+
+  private handleError(error: Error) {
+    this.uploadProgress = undefined
+    this.notificationsService.showNotification({
+      type: 'error',
+      title: this.translateService.instant(
+        'editor.record.onlineResourceError.title'
+      ),
+      text: `${this.translateService.instant(
+        'editor.record.onlineResourceError.body'
+      )} ${error.message}`,
+      closeMessage: this.translateService.instant(
+        'editor.record.onlineResourceError.closeMessage'
+      ),
+    })
+  }
+
+  private openEditDialog(resource: OnlineNotLinkResource, index: number) {
+    const resourceCopy = {
+      ...resource,
+    }
+    this.dialog
+      .open(ModalDialogComponent, {
+        width: '800px',
+        data: {
+          title: this.translateService.instant(
+            'editor.record.form.field.onlineResource.dialogTitle'
+          ),
+          body: this.dialogTemplate,
+          bodyContext: resourceCopy,
+          confirmText: this.translateService.instant(
+            'editor.record.form.field.onlineResource.confirm'
+          ),
+          cancelText: this.translateService.instant(
+            'editor.record.form.field.onlineResource.cancel'
+          ),
+        },
+      })
+      .afterClosed()
+      .subscribe((confirmed: boolean) => {
+        if (!confirmed) return
+        const newNotLinks = [...this.notLinkResources]
+        newNotLinks.splice(index, 1, resourceCopy)
+        this.valueChange.emit([
+          ...this.allResources.filter((r) => r.type === 'link'),
+          ...newNotLinks,
+        ])
+      })
+  }
+}

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-overviews/form-field-overviews.component.ts

@@ -68,7 +68,7 @@ export class FormFieldOverviewsComponent {
             })
           }
         },
-        error: this.errorHandle,
+        error: (error: Error) => this.handleError(error),
       })
   }
 
@@ -87,7 +87,7 @@ export class FormFieldOverviewsComponent {
         description: filename,
       })
     } catch (e) {
-      this.errorHandle(e)
+      this.handleError(e as Error)
     }
   }
 
@@ -106,8 +106,9 @@ export class FormFieldOverviewsComponent {
     this.valueChange.emit(overView ? [overView] : [])
   }
 
-  private errorHandle = (error) => {
+  private handleError = (error: Error) => {
     this.uploadProgress = undefined
+    this.cd.markForCheck()
     this.notificationsService.showNotification({
       type: 'error',
       title: this.translateService.instant('editor.record.resourceError.title'),

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-update-frequency/form-field-update-frequency.component.ts

@@ -70,7 +70,7 @@ export class FormFieldUpdateFrequencyComponent implements OnInit {
   }
 
   get selectedFrequency(): string {
-    if (typeof this.value === 'string') return null
+    if (!this.value || typeof this.value === 'string') return null
     const { updatedTimes, per } = this.value
     return `${per}.${updatedTimes}`
   }

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html

@@ -25,6 +25,7 @@
       <div class="flex flex-row flex-start items-center gap-3 mb-[12px]">
         <span
           #titleInput
+          data-test="recordTitleInput"
           class="grow font-title text-3xl font-normal"
           [gnUiEditableLabel]="valueAsString"
           (editableLabelChanged)="valueChange.emit($event)"
@@ -114,6 +115,20 @@
         (valueChange)="valueChange.emit($event)"
       ></gn-ui-form-field-contacts-for-resource>
     </ng-container>
+    <ng-container *ngSwitchCase="'contacts'">
+      <gn-ui-form-field-contacts
+        [value]="valueAsIndividuals"
+        (valueChange)="valueChange.emit($event)"
+      ></gn-ui-form-field-contacts>
+    </ng-container>
+    <ng-container *ngSwitchCase="'onlineResources'">
+      <gn-ui-form-field-online-resources
+        *ngIf="modelSpecifier === 'onlineResourceType:!link'"
+        [metadataUuid]="uniqueIdentifier"
+        [value]="valueAsOnlineResources"
+        (valueChange)="valueChange.emit($event)"
+      ></gn-ui-form-field-online-resources>
+    </ng-container>
     <ng-container *ngSwitchCase="'onlineResources'">
       <gn-ui-form-field-online-link-resources
         *ngIf="modelSpecifier === 'onlineResourceType:link'"

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts

@@ -24,23 +24,25 @@ import { EditableLabelDirective } from '../../../../../../../../libs/ui/inputs/s
 import { FormFieldWrapperComponent } from '../../../../../../../../libs/ui/layout/src'
 import { TranslateModule } from '@ngx-translate/core'
 import {
-  FormFieldLicenseComponent,
   FormFieldDateUpdatedComponent,
+  FormFieldLicenseComponent,
   FormFieldTemporalExtentsComponent,
 } from '.'
 import { FieldModelSpecifier, FormFieldConfig } from '../../../models'
 import { FormFieldArrayComponent } from './form-field-array/form-field-array.component'
 import { FormFieldContactsForResourceComponent } from './form-field-contacts-for-resource/form-field-contacts-for-resource.component'
+import { FormFieldContactsComponent } from './form-field-contacts/form-field-contacts.component'
 import { FormFieldFileComponent } from './form-field-file/form-field-file.component'
 import { FormFieldKeywordsComponent } from './form-field-keywords/form-field-keywords.component'
 import { FormFieldObjectComponent } from './form-field-object/form-field-object.component'
+import { FormFieldOnlineLinkResourcesComponent } from './form-field-online-link-resources/form-field-online-link-resources.component'
+import { FormFieldOnlineResourcesComponent } from './form-field-online-resources/form-field-online-resources.component'
+import { FormFieldOpenDataComponent } from './form-field-open-data/form-field-open-data.component'
 import { FormFieldOverviewsComponent } from './form-field-overviews/form-field-overviews.component'
 import { FormFieldRichComponent } from './form-field-rich/form-field-rich.component'
 import { FormFieldSimpleComponent } from './form-field-simple/form-field-simple.component'
 import { FormFieldSpatialExtentComponent } from './form-field-spatial-extent/form-field-spatial-extent.component'
 import { FormFieldUpdateFrequencyComponent } from './form-field-update-frequency/form-field-update-frequency.component'
-import { FormFieldOpenDataComponent } from './form-field-open-data/form-field-open-data.component'
-import { FormFieldOnlineLinkResourcesComponent } from './form-field-online-link-resources/form-field-online-link-resources.component'
 
 @Component({
   selector: 'gn-ui-form-field',
@@ -69,7 +71,9 @@ import { FormFieldOnlineLinkResourcesComponent } from './form-field-online-link-
     FormFieldOverviewsComponent,
     FormFieldContactsForResourceComponent,
     FormFieldOpenDataComponent,
+    FormFieldOnlineResourcesComponent,
     FormFieldOnlineLinkResourcesComponent,
+    FormFieldContactsComponent,
   ],
 })
 export class FormFieldComponent {

package/src/libs/feature/editor/src/lib/components/wizard/wizard.component.html

@@ -1,9 +1,5 @@
-<div class="pl-5 pt-24 flex flex-1 flex-col justify-between">
-  <div
-    #wizardFields
-    class="flex-1 flex"
-    *ngFor="let config of configuration; let i = index"
-  >
+<div class="pl-5 pt-24 flex flex-1 flex-col justify-between" #wizardFields>
+  <div class="flex-1 flex" *ngFor="let config of configuration; let i = index">
     <gn-ui-wizard-field [wizardFieldConfig]="config"></gn-ui-wizard-field>
   </div>
 </div>

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

@@ -93,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: {
@@ -107,6 +114,14 @@ export const RECORD_SPATIAL_EXTENTS_FIELD: EditorField = {
   },
 }
 
+export const RECORD_ONLINE_RESOURCES: EditorField = {
+  model: 'onlineResources',
+  modelSpecifier: 'onlineResourceType:!link',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.onlineResources'),
+  },
+}
+
 export const RECORD_ONLINE_LINK_RESOURCES: EditorField = {
   model: 'onlineResources',
   modelSpecifier: 'onlineResourceType:link',
@@ -154,11 +169,12 @@ export const ASSOCIATED_RESOURCES_SECTION: EditorSection = {
     'editor.record.form.section.associatedResources.description'
   ),
   hidden: false,
-  fields: [],
+  fields: [RECORD_ONLINE_RESOURCES],
 }
 
 export const ANNEXES_SECTION: EditorSection = {
   labelKey: marker('editor.record.form.section.annexes.label'),
+  descriptionKey: marker('editor.record.form.section.annexes.description'),
   hidden: false,
   fields: [RECORD_ONLINE_LINK_RESOURCES],
 }
@@ -191,7 +207,7 @@ export const DATA_POINT_OF_CONTACT_SECTION: EditorSection = {
     'editor.record.form.section.dataPointOfContact.description'
   ),
   hidden: false,
-  fields: [],
+  fields: [CONTACTS],
 }
 
 /************************************************************

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
 )