geonetwork-ui 2.8.0-dev.0c9b29721 → 2.8.0-dev.27e1de86f

package/src/libs/ui/map/src/lib/components/map-container/map-container.component.ts

@@ -2,9 +2,11 @@ import {
   AfterViewInit,
   ChangeDetectionStrategy,
   Component,
+  DestroyRef,
   ElementRef,
   EventEmitter,
   Inject,
+  inject,
   Input,
   OnChanges,
   Output,
@@ -13,6 +15,7 @@ import {
 } from '@angular/core'
 import { fromEvent, merge, Observable, of, timer } from 'rxjs'
 import { delay, map, startWith, switchMap } from 'rxjs/operators'
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop'
 import { CommonModule } from '@angular/common'
 import { TranslateDirective } from '@ngx-translate/core'
 import {
@@ -24,10 +27,13 @@ import {
   FeaturesHoverEventType,
   MapClickEvent,
   MapClickEventType,
+  MapExtentChangeEvent,
+  MapExtentChangeEventType,
   MapContext,
   MapContextLayer,
   MapContextLayerXyz,
   MapContextView,
+  MapEventsByType,
   SourceLoadErrorEvent,
   SourceLoadErrorType,
 } from '@geospatial-sdk/core'
@@ -49,6 +55,7 @@ import {
   provideNgIconsConfig,
 } from '@ng-icons/core'
 import { matSwipeOutline } from '@ng-icons/material-icons/outline'
+import { transformExtent } from 'ol/proj'
 
 const DEFAULT_BASEMAP_LAYER: MapContextLayerXyz = {
   type: 'xyz',
@@ -61,6 +68,11 @@ const DEFAULT_VIEW: MapContextView = {
   zoom: 2,
 }
 
+interface MapViewConstraints {
+  maxZoom?: number
+  maxExtent?: Extent
+}
+
 @Component({
   selector: 'gn-ui-map-container',
   templateUrl: './map-container.component.html',
@@ -78,86 +90,151 @@ const DEFAULT_VIEW: MapContextView = {
 export class MapContainerComponent implements AfterViewInit, OnChanges {
   @Input() context: MapContext | null
 
-  // these events only get registered on the map if they are used
-  _featuresClick: EventEmitter<Feature[]>
+  @ViewChild('map') container: ElementRef
+
+  private olMap: OlMap
+  private olMapResolver: (value: OlMap) => void
+  private destroyRef: DestroyRef
+
+  displayMessage$: Observable<boolean>
+  openlayersMap = new Promise<OlMap>((resolve) => {
+    this.olMapResolver = resolve
+  })
+
+  // These events only get registered on the map if they are used
+  _featuresClick: EventEmitter<Feature[]> = null
+  _featuresHover: EventEmitter<Feature[]> = null
+  _mapClick: EventEmitter<[number, number]> = null
+  _extentChange: EventEmitter<Extent> = null
+  _sourceLoadError: EventEmitter<SourceLoadErrorEvent> = null
+  _resolvedExtentChange: EventEmitter<Extent> = null
+
   @Output() get featuresClick() {
     if (!this._featuresClick) {
-      this.openlayersMap.then((olMap) => {
-        listen(
-          olMap,
-          FeaturesClickEventType,
-          ({ features }: FeaturesClickEvent) =>
-            this._featuresClick.emit(features)
-        )
-      })
+      this.setupEventListener(
+        FeaturesClickEventType,
+        (event: FeaturesClickEvent) => {
+          this._featuresClick.emit(event.features)
+        }
+      )
       this._featuresClick = new EventEmitter<Feature[]>()
     }
     return this._featuresClick
   }
-  _featuresHover: EventEmitter<Feature[]>
+
   @Output() get featuresHover() {
     if (!this._featuresHover) {
-      this.openlayersMap.then((olMap) => {
-        listen(
-          olMap,
-          FeaturesHoverEventType,
-          ({ features }: FeaturesHoverEvent) =>
-            this._featuresHover.emit(features)
-        )
-      })
+      this.setupEventListener(
+        FeaturesHoverEventType,
+        (event: FeaturesHoverEvent) => {
+          this._featuresHover.emit(event.features)
+        }
+      )
       this._featuresHover = new EventEmitter<Feature[]>()
     }
     return this._featuresHover
   }
-  _mapClick: EventEmitter<[number, number]>
+
   @Output() get mapClick() {
     if (!this._mapClick) {
-      this.openlayersMap.then((olMap) => {
-        listen(olMap, MapClickEventType, ({ coordinate }: MapClickEvent) =>
-          this._mapClick.emit(coordinate)
-        )
+      this.setupEventListener(MapClickEventType, (event: MapClickEvent) => {
+        this._mapClick.emit(event.coordinate)
       })
       this._mapClick = new EventEmitter<[number, number]>()
     }
     return this._mapClick
   }
-  _sourceLoadError: EventEmitter<SourceLoadErrorEvent>
+
+  @Output() get extentChange() {
+    if (!this._extentChange) {
+      this.setupEventListener(
+        MapExtentChangeEventType,
+        (event: MapExtentChangeEvent) => {
+          this._extentChange.emit(event.extent as Extent)
+        }
+      )
+      this._extentChange = new EventEmitter<Extent>()
+    }
+    return this._extentChange
+  }
+
   @Output() get sourceLoadError() {
     if (!this._sourceLoadError) {
-      this.openlayersMap.then((olMap) => {
-        listen(olMap, SourceLoadErrorType, (error: SourceLoadErrorEvent) =>
-          this._sourceLoadError.emit(error)
-        )
-      })
+      this.setupEventListener(
+        SourceLoadErrorType,
+        (event: SourceLoadErrorEvent) => {
+          this._sourceLoadError.emit(event)
+        }
+      )
       this._sourceLoadError = new EventEmitter<SourceLoadErrorEvent>()
     }
     return this._sourceLoadError
   }
 
-  @ViewChild('map') container: ElementRef
-  displayMessage$: Observable<boolean>
-  olMap: OlMap
+  @Output() get resolvedExtentChange() {
+    if (!this._resolvedExtentChange) {
+      this._resolvedExtentChange = new EventEmitter<Extent>()
+    }
+    return this._resolvedExtentChange
+  }
 
   constructor(
     @Inject(DO_NOT_USE_DEFAULT_BASEMAP) private doNotUseDefaultBasemap: boolean,
     @Inject(BASEMAP_LAYERS) private basemapLayers: MapContextLayer[],
     @Inject(MAP_VIEW_CONSTRAINTS)
-    private mapViewConstraints: {
-      maxZoom?: number
-      maxExtent?: Extent
-    }
-  ) {}
+    private mapViewConstraints: MapViewConstraints
+  ) {
+    this.destroyRef = inject(DestroyRef)
+  }
 
-  private olMapResolver
-  openlayersMap = new Promise<OlMap>((resolve) => {
-    this.olMapResolver = resolve
-  })
+  calculateCurrentMapExtent(): Extent {
+    const extent = this.olMap.getView().calculateExtent(this.olMap.getSize())
+    const reprojectedExtent = transformExtent(
+      extent,
+      this.olMap.getView().getProjection(),
+      'EPSG:4326'
+    )
+
+    return reprojectedExtent as Extent
+  }
 
   async ngAfterViewInit() {
     this.olMap = await createMapFromContext(
       this.processContext(this.context),
       this.container.nativeElement
     )
+    if (this._resolvedExtentChange) {
+      this._resolvedExtentChange.emit(this.calculateCurrentMapExtent())
+    }
+
+    this.setupDisplayMessageObservable()
+    this.olMapResolver(this.olMap)
+  }
+
+  async ngOnChanges(changes: SimpleChanges) {
+    if ('context' in changes && !changes['context'].isFirstChange()) {
+      const diff = computeMapContextDiff(
+        this.processContext(changes['context'].currentValue),
+        this.processContext(changes['context'].previousValue)
+      )
+      await applyContextDiffToMap(this.olMap, diff)
+
+      if (this._resolvedExtentChange && diff.viewChanges) {
+        this._resolvedExtentChange.emit(this.calculateCurrentMapExtent())
+      }
+    }
+  }
+
+  private setupEventListener(
+    eventType: keyof MapEventsByType,
+    handler: (event: MapEventsByType[typeof eventType]) => void
+  ) {
+    this.openlayersMap.then((olMap: OlMap) => {
+      listen(olMap, eventType, handler)
+    })
+  }
+
+  private setupDisplayMessageObservable() {
     this.displayMessage$ = merge(
       fromEvent(this.olMap, 'mapmuted').pipe(map(() => true)),
       fromEvent(this.olMap, 'movestart').pipe(map(() => false)),
@@ -171,32 +248,25 @@ export class MapContainerComponent implements AfterViewInit, OnChanges {
               delay(400)
             )
           : of(false)
-      )
+      ),
+      takeUntilDestroyed(this.destroyRef)
     )
-    this.olMapResolver(this.olMap)
   }
 
-  async ngOnChanges(changes: SimpleChanges) {
-    if ('context' in changes && !changes['context'].isFirstChange()) {
-      const diff = computeMapContextDiff(
-        this.processContext(changes['context'].currentValue),
-        this.processContext(changes['context'].previousValue)
-      )
-      await applyContextDiffToMap(this.olMap, diff)
-    }
-  }
-
-  // This will apply basemap layers & view constraints
-  processContext(context: MapContext): MapContext {
+  private processContext(context: MapContext): MapContext {
     const processed = context
       ? { ...context, view: context.view ?? DEFAULT_VIEW }
       : { layers: [], view: DEFAULT_VIEW }
+
+    // Prepend with default basemap and basemap layers
     if (this.basemapLayers.length) {
       processed.layers = [...this.basemapLayers, ...processed.layers]
     }
     if (!this.doNotUseDefaultBasemap) {
       processed.layers = [DEFAULT_BASEMAP_LAYER, ...processed.layers]
     }
+
+    // Apply view constraints
     if (this.mapViewConstraints.maxZoom) {
       processed.view = {
         maxZoom: this.mapViewConstraints.maxZoom,
@@ -209,20 +279,29 @@ export class MapContainerComponent implements AfterViewInit, OnChanges {
         ...processed.view,
       }
     }
+
     if (
       processed.view &&
-      !('zoom' in processed.view) &&
-      !('center' in processed.view)
+      'zoom' in processed.view &&
+      'center' in processed.view
     ) {
-      if (this.mapViewConstraints.maxExtent) {
-        processed.view = {
-          extent: this.mapViewConstraints.maxExtent,
-          ...processed.view,
-        }
-      } else {
-        processed.view = { ...DEFAULT_VIEW, ...processed.view }
+      return processed
+    }
+
+    if (processed.view && 'extent' in processed.view) {
+      return processed
+    }
+
+    // Ensure valid view
+    if (this.mapViewConstraints.maxExtent) {
+      processed.view = {
+        extent: this.mapViewConstraints.maxExtent,
+        ...processed.view,
       }
+    } else {
+      processed.view = { ...DEFAULT_VIEW, ...processed.view }
     }
+
     return processed
   }
 }

package/src/libs/util/i18n/src/lib/date-locales.ts

@@ -0,0 +1,63 @@
+import { LanguageCode2 } from './language-codes'
+import {
+  ar,
+  az,
+  ca,
+  cs,
+  cy,
+  da,
+  de,
+  enUS,
+  es,
+  fi,
+  fr,
+  hy,
+  is,
+  it,
+  ka,
+  ko,
+  Locale,
+  nl,
+  nn,
+  pl,
+  pt,
+  ru,
+  sk,
+  sv,
+  tr,
+  uk,
+  zhCN,
+} from 'date-fns/locale'
+
+// all 2-char language codes should be listed here
+const locales: Record<LanguageCode2, Locale> = {
+  en: enUS,
+  nl: nl,
+  fr: fr,
+  de: de,
+  ko: ko,
+  es: es,
+  cs: cs,
+  ca: ca,
+  fi: fi,
+  is: is,
+  it: it,
+  pt: pt,
+  ru: ru,
+  zh: zhCN,
+  sk: sk,
+  ar: ar,
+  da: da,
+  no: nn,
+  pl: pl,
+  sv: sv,
+  tr: tr,
+  hy: hy,
+  az: az,
+  ka: ka,
+  uk: uk,
+  cy: cy,
+  rm: enUS, // locale is unavailable
+}
+
+export default locales

package/src/libs/util/shared/src/index.ts

@@ -4,3 +4,4 @@ export * from './lib/links'
 export * from './lib/image-fallback.directive'
 export * from './lib/gn-ui-version'
 export * from './lib/record'
+export * from './lib/humanize-date.directive'

package/src/libs/util/shared/src/lib/humanize-date.directive.ts

@@ -0,0 +1,35 @@
+import { Renderer2, Directive, ElementRef, Input, OnInit } from '@angular/core'
+import { DateService } from './services/date.service'
+
+@Directive({
+  selector: '[gnUiHumanizeDate]',
+  standalone: true,
+})
+export class GnUiHumanizeDateDirective implements OnInit {
+  @Input() gnUiHumanizeDate: Date | string
+
+  constructor(
+    private dateService: DateService,
+    private el: ElementRef,
+    private renderer: Renderer2
+  ) {}
+
+  async ngOnInit() {
+    await this.updateElement()
+  }
+
+  private async updateElement(): Promise<void> {
+    const dateValue = this.gnUiHumanizeDate
+
+    const fullDateTime = this.dateService.formatDateTime(dateValue)
+    const relativeDate =
+      await this.dateService.formatRelativeDateTime(dateValue)
+
+    this.renderer.setAttribute(this.el.nativeElement, 'title', fullDateTime)
+    this.renderer.setProperty(
+      this.el.nativeElement,
+      'textContent',
+      relativeDate
+    )
+  }
+}

package/src/libs/util/shared/src/lib/links/link-classifier.service.ts

@@ -39,6 +39,10 @@ export class LinkClassifierService {
             return [LinkUsage.API, LinkUsage.DOWNLOAD, LinkUsage.GEODATA]
           case 'GPFDL':
             return [LinkUsage.API]
+          case 'postgis':
+            return [LinkUsage.UNKNOWN]
+          case 'stac':
+            return [LinkUsage.API]
           default:
             return [LinkUsage.UNKNOWN]
         }

package/src/libs/util/shared/src/lib/links/link-utils.ts

@@ -150,6 +150,12 @@ export const FORMATS = {
     color: '#5A9E6F',
     mimeTypes: ['image/webp'],
   },
+  postgis: {
+    extensions: ['postgis'],
+    priority: 18,
+    color: '#336791',
+    mimeTypes: [],
+  },
 } as const
 
 export type FileFormat = keyof typeof FORMATS
@@ -195,6 +201,11 @@ export function getFileFormatFromServiceOutput(
 export function getFileFormat(
   link: DatasetOnlineResource | ServiceOnlineResource
 ): FileFormat {
+  if ('accessServiceProtocol' in link) {
+    if (link.accessServiceProtocol in FORMATS) {
+      return link.accessServiceProtocol as FileFormat
+    }
+  }
   if ('mimeType' in link) {
     const mimeTypeFormat = mimeTypeToFormat(link.mimeType)
     if (mimeTypeFormat !== null) {

package/src/libs/util/shared/src/lib/services/date.service.ts

@@ -1,10 +1,18 @@
 import { Injectable } from '@angular/core'
 import { TranslateService } from '@ngx-translate/core'
+import { type Locale } from 'date-fns/locale'
+import { formatDistance } from 'date-fns/formatDistance'
+
+const DEFAULT_LANGUAGE = 'en'
 
 @Injectable({
   providedIn: 'root',
 })
 export class DateService {
+  dateLocales = import('../../../../../../libs/util/i18n/src/lib/date-locales').then(
+    (obj) => obj.default
+  )
+
   constructor(private translateService: TranslateService) {}
 
   private getDateObject(date: Date | string): Date {
@@ -22,11 +30,17 @@ export class DateService {
     locale: string
     dateObj: Date
   } {
-    const locale = this.translateService.currentLang || 'en-US'
+    const locale = this.translateService.currentLang || DEFAULT_LANGUAGE
     const dateObj = this.getDateObject(date)
     return { locale, dateObj }
   }
 
+  private async getDateLocale(): Promise<Locale> {
+    const lang = this.translateService.currentLang || DEFAULT_LANGUAGE
+    const locales = await this.dateLocales
+    return locales[lang]
+  }
+
   formatDate(
     date: Date | string,
     options?: Intl.DateTimeFormatOptions
@@ -42,4 +56,16 @@ export class DateService {
     const { locale, dateObj } = this.getLocaleAndDate(date)
     return dateObj.toLocaleString(locale, options)
   }
+
+  async formatRelativeDateTime(date: Date | string): Promise<string> {
+    const dateObj = this.getDateObject(date)
+
+    const now = new Date()
+    const locale = await this.getDateLocale()
+
+    return formatDistance(dateObj, now, {
+      addSuffix: true,
+      locale: locale,
+    })
+  }
 }

package/src/libs/util/shared/src/lib/services/proxy.service.ts

@@ -1,4 +1,4 @@
-import { Inject, Injectable, InjectionToken, Optional } from '@angular/core'
+import { Injectable, InjectionToken, Injector } from '@angular/core'
 import { Location } from '@angular/common'
 
 export const PROXY_PATH = new InjectionToken<string>('proxyPath')
@@ -7,8 +7,12 @@ export const PROXY_PATH = new InjectionToken<string>('proxyPath')
   providedIn: 'root',
 })
 export class ProxyService {
+  private get proxyPath(): string | null {
+    return this.injector.get(PROXY_PATH, null)
+  }
+
   constructor(
-    @Optional() @Inject(PROXY_PATH) private proxyPath: string,
+    private injector: Injector,
     private location: Location
   ) {}
 

package/src/libs/util/shared/src/lib/utils/sort-by.ts

@@ -6,12 +6,15 @@ export function sortByToStrings(sortBy: SortByField): string[] {
 }
 
 export function sortByToString(sortBy: SortByField): string {
-  return sortByToStrings(sortBy)[0]
+  return sortByToStrings(sortBy).join(',')
 }
 
 export function sortByFromString(sortByString: string): SortByField {
-  return [
-    sortByString.startsWith('-') ? 'desc' : 'asc',
-    sortByString.startsWith('-') ? sortByString.substring(1) : sortByString,
-  ]
+  const fields = sortByString
+    .split(',')
+    .map((field) => [
+      field.startsWith('-') ? 'desc' : 'asc',
+      field.startsWith('-') ? field.substring(1) : field,
+    ]) as SortByField
+  return fields.length > 1 ? fields : (fields[0] as SortByField)
 }

package/translations/de.json

@@ -62,6 +62,9 @@
   "dataset.error.restrictedAccess": "",
   "dataset.error.unknown": "Die Daten können nicht angezeigt werden: \"{ info }\"",
   "dataset.error.unsupportedType": "Der folgende Inhaltstyp wird nicht unterstützt: \"{ info }\"",
+  "daterange.filter.from": "",
+  "daterange.filter.period": "",
+  "daterange.filter.to": "",
   "domain.contact.role.author": "",
   "domain.contact.role.collaborator": "",
   "domain.contact.role.contributor": "",
@@ -397,6 +400,7 @@
   "pagination.nextPage": "Nächste Seite",
   "pagination.page": "Seite",
   "pagination.pageOf": "von",
+  "pagination.previousPage": "Vorherige Seite",
   "record.action.delete": "Löschen",
   "record.action.download": "Herunterladen",
   "record.action.duplicate": "",
@@ -418,6 +422,8 @@
   "record.metadata.api.accessServiceProtocol.maplibre-style": "",
   "record.metadata.api.accessServiceProtocol.ogcFeatures": "",
   "record.metadata.api.accessServiceProtocol.other": "",
+  "record.metadata.api.accessServiceProtocol.postgis": "",
+  "record.metadata.api.accessServiceProtocol.stac": "",
   "record.metadata.api.accessServiceProtocol.tms": "",
   "record.metadata.api.accessServiceProtocol.wfs": "",
   "record.metadata.api.accessServiceProtocol.wms": "",
@@ -459,13 +465,16 @@
   "record.metadata.contact": "Kontakt",
   "record.metadata.creation": "Erstellungsdatum",
   "record.metadata.details": "Über die Daten",
+  "record.metadata.doi.copy": "",
+  "record.metadata.doi.open": "",
   "record.metadata.download": "Downloads",
   "record.metadata.feature.catalog": "",
   "record.metadata.formats": "Formate",
   "record.metadata.isGeographical": "Geographischer Datensatz",
   "record.metadata.keywords": "Stichworte",
   "record.metadata.languages": "Sprachen",
-  "record.metadata.lastUpdate": "Zuletzt aktualisiert am {date}",
+  "record.metadata.link.postgis.table": "",
+  "record.metadata.link.postgis.tooltip": "",
   "record.metadata.linked.datasets": "Verknüpfte Datensätze",
   "record.metadata.linked.records": "Verknüpfte Inhalte",
   "record.metadata.linked.reuses": "Verknüpfte Wiederverwendungen",
@@ -506,6 +515,9 @@
   "record.metadata.quality.updateFrequency.failed": "Aktualisierungsfrequenz nicht angegeben",
   "record.metadata.quality.updateFrequency.success": "Aktualisierungsfrequenz angegeben",
   "record.metadata.related": "Entdecken Sie den Katalog",
+  "record.metadata.resourceCreated": "Erstellt",
+  "record.metadata.resourcePublished": "Veröffentlicht",
+  "record.metadata.resourceUpdated": "Zuletzt aktualisiert",
   "record.metadata.ressources.and.links": "Ressourcen und Links",
   "record.metadata.sheet": "Weitere Informationen verfügbar unter:",
   "record.metadata.status": "Status",
@@ -518,8 +530,9 @@
   "record.metadata.title": "Titel",
   "record.metadata.topics": "Kategorien",
   "record.metadata.uniqueId": "Eindeutige Kennung",
+  "record.metadata.update": "Aktualisierungsdatum",
   "record.metadata.updateFrequency": "Aktualisierungsfrequenz der Daten",
-  "record.metadata.updatedOn": "Geändert am",
+  "record.metadata.updatedOn": "Informationen geändert",
   "record.metadata.usage": "Nutzung und Einschränkungen",
   "record.metadata.userFeedbacks": "",
   "record.metadata.userFeedbacks.anonymousUser": "",
@@ -534,6 +547,7 @@
   "record.tab.chart": "Diagramm",
   "record.tab.data": "Tabelle",
   "record.tab.map": "Karte",
+  "record.tab.stac": "",
   "record.was.created.time": "erstellte diesen Ressource {time}",
   "records": "Datensätze",
   "results.layout.selectOne": "Layout auswählen",
@@ -542,7 +556,6 @@
   "results.records.hits.found": "{hits, plural, =0{Keine Ressource entsprechen der angegebenen Suche.} one{1 Ressource gefunden.} other{{hits} Ressourcen gefunden.}}",
   "results.records.hits.selected": "{ amount } ausgewählt",
   "results.showMore": "Mehr Ergebnisse anzeigen...",
-  "results.sortBy.changeDate": "",
   "results.sortBy.dateStamp": "Neueste",
   "results.sortBy.popularity": "Beliebtheit",
   "results.sortBy.qualityScore": "Fertigstellungsanzeige",
@@ -626,6 +639,9 @@
   "service.metadata.spatialExtent": "",
   "share.tab.permalink": "Teilen",
   "share.tab.webComponent": "Integrieren",
+  "stac.filter.enable": "",
+  "stac.filter.reset": "",
+  "stac.results.noResults": "Ihre Suchfilter lieferten keine Ergebnisse",
   "table.loading.data": "Daten werden geladen...",
   "table.object.count": "Objekte in diesem Datensatz",
   "table.paginator.firstPage": "Erste Seite",