geonetwork-ui 2.11.0-dev.e430b2fe8 → 2.11.0-dev.f5ee66b24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/fesm2022/geonetwork-ui.mjs +782 -356
  2. package/fesm2022/geonetwork-ui.mjs.map +1 -1
  3. package/index.d.ts +199 -76
  4. package/index.d.ts.map +1 -1
  5. package/package.json +2 -1
  6. package/src/libs/api/repository/src/lib/gn4/elasticsearch/elasticsearch.service.ts +107 -34
  7. package/src/libs/common/domain/src/lib/model/search/filter.model.ts +20 -1
  8. package/src/libs/feature/map/src/index.ts +0 -1
  9. package/src/libs/feature/map/src/lib/add-layer-from-file/add-layer-from-file.component.html +1 -0
  10. package/src/libs/feature/map/src/lib/feature-map.module.ts +1 -8
  11. package/src/libs/feature/notifications/src/lib/notifications.service.ts +6 -4
  12. package/src/libs/feature/router/src/lib/default/state/query-params.utils.ts +1 -1
  13. package/src/libs/feature/search/src/index.ts +2 -0
  14. package/src/libs/feature/search/src/lib/filter-dropdown/filter-dropdown.component.html +12 -4
  15. package/src/libs/feature/search/src/lib/filter-dropdown/filter-dropdown.component.ts +58 -19
  16. package/src/libs/feature/{map/src/lib → search/src/lib/geocoding}/geocoding.service.ts +5 -1
  17. package/src/libs/feature/search/src/lib/location-search/location-search.component.html +8 -0
  18. package/src/libs/feature/search/src/lib/location-search/location-search.component.ts +40 -0
  19. package/src/libs/feature/search/src/lib/search-filters-summary-item/search-filters-summary-item.component.ts +18 -8
  20. package/src/libs/feature/search/src/lib/utils/service/fields.service.ts +9 -1
  21. package/src/libs/feature/search/src/lib/utils/service/fields.ts +61 -2
  22. package/src/libs/ui/elements/src/lib/service-capabilities/service-capabilities.component.ts +2 -1
  23. package/src/libs/ui/inputs/src/index.ts +2 -0
  24. package/src/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.html +10 -1
  25. package/src/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts +8 -0
  26. package/src/libs/ui/inputs/src/lib/date-adapter.providers.ts +30 -0
  27. package/src/libs/ui/inputs/src/lib/date-picker/date-picker.component.ts +3 -24
  28. package/src/libs/ui/inputs/src/lib/date-range-dropdown/date-range-dropdown.component.css +37 -3
  29. package/src/libs/ui/inputs/src/lib/date-range-dropdown/date-range-dropdown.component.html +135 -16
  30. package/src/libs/ui/inputs/src/lib/date-range-dropdown/date-range-dropdown.component.ts +166 -29
  31. package/src/libs/ui/inputs/src/lib/date-range-picker/date-range-picker.component.ts +3 -7
  32. package/src/libs/ui/inputs/src/lib/drag-and-drop-file-input/drag-and-drop-file-input.component.css +1 -0
  33. package/src/libs/ui/inputs/src/lib/drag-and-drop-file-input/drag-and-drop-file-input.component.html +20 -7
  34. package/src/libs/ui/inputs/src/lib/drag-and-drop-file-input/drag-and-drop-file-input.component.ts +46 -5
  35. package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.component.html +7 -4
  36. package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.component.ts +12 -9
  37. package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.model.ts +2 -2
  38. package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.html +111 -0
  39. package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.ts +215 -0
  40. package/src/libs/ui/map/src/lib/components/map-container/map-container.component.ts +2 -0
  41. package/src/libs/util/app-config/src/lib/app-config.ts +3 -0
  42. package/src/libs/util/app-config/src/lib/model.ts +1 -0
  43. package/src/libs/util/shared/src/index.ts +1 -0
  44. package/src/libs/util/shared/src/lib/autofocus.directive.ts +26 -0
  45. package/src/libs/util/shared/src/lib/links/link-utils.ts +19 -10
  46. package/src/libs/util/shared/src/lib/services/date.service.ts +3 -3
  47. package/src/libs/util/shared/src/lib/utils/file.ts +15 -0
  48. package/src/libs/util/shared/src/lib/utils/geojson.ts +8 -0
  49. package/src/libs/util/shared/src/lib/utils/index.ts +1 -0
  50. package/tailwind.base.css +5 -0
  51. package/translations/de.json +16 -3
  52. package/translations/en.json +15 -2
  53. package/translations/es.json +14 -1
  54. package/translations/fr.json +16 -3
  55. package/translations/it.json +14 -1
  56. package/translations/nl.json +14 -1
  57. package/translations/pt.json +14 -1
  58. package/translations/sk.json +14 -1
  59. package/src/libs/feature/map/src/lib/geocoding/geocoding.component.html +0 -41
  60. package/src/libs/feature/map/src/lib/geocoding/geocoding.component.ts +0 -112
  61. /package/src/libs/{feature/map/src/lib/geocoding/geocoding.component.css → ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.css} +0 -0
@@ -34,7 +34,12 @@ import {
34
34
  LanguageCode,
35
35
  } from '../../../../../../../libs/common/domain/src/lib/model/record'
36
36
  import { TranslateService } from '@ngx-translate/core'
37
- import { getGeometryBoundingBox } from '../../../../../../../libs/util/shared/src'
37
+ import {
38
+ bboxToPolygon,
39
+ BoundingBox,
40
+ getGeometryBoundingBox,
41
+ isBoundingBox,
42
+ } from '../../../../../../../libs/util/shared/src'
38
43
  import { getLength as getGeodesicLength } from 'ol/sphere.js'
39
44
  import { LineString } from 'ol/geom.js'
40
45
 
@@ -49,7 +54,10 @@ export class ElasticsearchService {
49
54
 
50
55
  // runtime fields are computed using a Painless script
51
56
  // see: https://www.elastic.co/guide/en/elasticsearch/reference/current/runtime-mapping-fields.html
52
- private runtimeFields: Record<string, string> = {}
57
+ private runtimeFields: Record<
58
+ string,
59
+ { script: string; type: 'keyword' | 'date' }
60
+ > = {}
53
61
 
54
62
  // we're using getters in case the defined languages change over time
55
63
  private get metadataLang(): LanguageCode {
@@ -91,8 +99,8 @@ export class ElasticsearchService {
91
99
  const addMapping = (fieldName: string) => {
92
100
  if (!payload.runtime_mappings) payload.runtime_mappings = {}
93
101
  payload.runtime_mappings[fieldName] = {
94
- type: 'keyword',
95
- script: this.runtimeFields[fieldName],
102
+ type: this.runtimeFields[fieldName].type,
103
+ script: this.runtimeFields[fieldName].script,
96
104
  }
97
105
  }
98
106
  const lookForField = (node: unknown) => {
@@ -113,6 +121,14 @@ export class ElasticsearchService {
113
121
  ) {
114
122
  addMapping(runtimeField)
115
123
  }
124
+ if (
125
+ runtimeField in node &&
126
+ typeof node[runtimeField] === 'object' &&
127
+ node[runtimeField] !== null &&
128
+ ('gte' in node[runtimeField] || 'lte' in node[runtimeField])
129
+ ) {
130
+ addMapping(runtimeField)
131
+ }
116
132
  if (
117
133
  'query' in node &&
118
134
  typeof node.query === 'string' &&
@@ -131,8 +147,12 @@ export class ElasticsearchService {
131
147
  return payload
132
148
  }
133
149
 
134
- registerRuntimeField(fieldName: string, expression: string) {
135
- this.runtimeFields[fieldName] = expression
150
+ registerRuntimeField(
151
+ fieldName: string,
152
+ expression: string,
153
+ type: 'keyword' | 'date' = 'keyword'
154
+ ) {
155
+ this.runtimeFields[fieldName] = { script: expression, type }
136
156
  }
137
157
 
138
158
  getMetadataByIdsPayload(uuids: string[]): EsSearchParams {
@@ -264,8 +284,55 @@ export class ElasticsearchService {
264
284
  return this.metadataLang === 'current'
265
285
  }
266
286
 
267
- private filtersToQuery(
287
+ private findSpatialFilterExtent(
268
288
  filters: FieldFilters | FiltersAggregationParams | string
289
+ ): BoundingBox | undefined {
290
+ if (typeof filters === 'string') {
291
+ return undefined
292
+ }
293
+ return Object.values(filters).find(isBoundingBox)
294
+ }
295
+
296
+ // if a field registered min/max runtime fields, its dates form an interval
297
+ // the record matches if that interval intersects the filter range
298
+ private buildDateRangeQuery(searchField: string, dateRange: DateRange) {
299
+ const minField = `${searchField}Min`
300
+ const maxField = `${searchField}Max`
301
+ if (minField in this.runtimeFields && maxField in this.runtimeFields) {
302
+ const filter = [
303
+ dateRange.start && {
304
+ range: {
305
+ [maxField]: {
306
+ gte: formatDate(dateRange.start),
307
+ format: 'yyyy-MM-dd',
308
+ },
309
+ },
310
+ },
311
+ dateRange.end && {
312
+ range: {
313
+ [minField]: {
314
+ lte: formatDate(dateRange.end),
315
+ format: 'yyyy-MM-dd',
316
+ },
317
+ },
318
+ },
319
+ ].filter(Boolean)
320
+ return { bool: { filter } }
321
+ }
322
+ return {
323
+ range: {
324
+ [searchField]: {
325
+ ...(dateRange.start && { gte: formatDate(dateRange.start) }),
326
+ ...(dateRange.end && { lte: formatDate(dateRange.end) }),
327
+ format: 'yyyy-MM-dd',
328
+ },
329
+ },
330
+ }
331
+ }
332
+
333
+ private filtersToQuery(
334
+ filters: FieldFilters | FiltersAggregationParams | string,
335
+ spatialFilterExtent = this.findSpatialFilterExtent(filters)
269
336
  ): FilterQuery {
270
337
  const addQuote = (key: string) => (/^\/.+\/$/.test(key) ? key : `"${key}"`)
271
338
  const makeQuery = (filter: FieldFilter): string => {
@@ -286,7 +353,9 @@ export class ElasticsearchService {
286
353
  ? filters
287
354
  : Object.keys(filters)
288
355
  .filter((fieldname) => fieldname !== 'gn-ui-crossFieldFilter')
356
+ .filter((fieldname) => !isBoundingBox(filters[fieldname]))
289
357
  .filter((fieldname) => !isDateRange(filters[fieldname]))
358
+ .filter((fieldname) => !Array.isArray(filters[fieldname]))
290
359
  .filter(
291
360
  (fieldname) =>
292
361
  filters[fieldname] &&
@@ -299,37 +368,33 @@ export class ElasticsearchService {
299
368
  if (filters['gn-ui-crossFieldFilter']) {
300
369
  queryString = `${queryString} AND (${filters['gn-ui-crossFieldFilter']})`
301
370
  }
302
- const queryRange = Object.entries(filters)
303
- .filter(([, value]) => isDateRange(value))
304
- .map(([searchField, dateRange]) => {
305
- return {
306
- searchField,
307
- dateRange,
308
- } as {
309
- searchField: string
310
- dateRange: DateRange
311
- }
312
- })[0]
371
+ const queryRanges = Object.entries(filters).filter(([, value]) =>
372
+ isDateRange(value)
373
+ ) as [string, DateRange][]
313
374
  const queryParts = [
314
375
  queryString && {
315
376
  query_string: {
316
377
  query: queryString,
317
378
  },
318
379
  },
319
- queryRange &&
320
- queryRange.dateRange && {
321
- range: {
322
- [queryRange.searchField]: {
323
- ...(queryRange.dateRange.start && {
324
- gte: formatDate(queryRange.dateRange.start),
325
- }),
326
- ...(queryRange.dateRange.end && {
327
- lte: formatDate(queryRange.dateRange.end),
328
- }),
329
- format: 'yyyy-MM-dd',
380
+ ...queryRanges.map(([searchField, dateRange]) =>
381
+ this.buildDateRangeQuery(searchField, dateRange)
382
+ ),
383
+ spatialFilterExtent && {
384
+ geo_shape: {
385
+ geom: {
386
+ shape: {
387
+ type: 'envelope',
388
+ // spatialFilterExtent is [minX, minY, maxX, maxY]; envelope coordinates are [top-left, bottom-right]
389
+ coordinates: [
390
+ [spatialFilterExtent[0], spatialFilterExtent[3]],
391
+ [spatialFilterExtent[2], spatialFilterExtent[1]],
392
+ ],
330
393
  },
394
+ relation: 'intersects',
331
395
  },
332
396
  },
397
+ },
333
398
  ].filter(Boolean)
334
399
  return queryParts.length > 0 ? (queryParts as FilterQuery) : undefined
335
400
  }
@@ -368,7 +433,12 @@ export class ElasticsearchService {
368
433
  },
369
434
  })
370
435
  }
371
- const queryFilters = this.filtersToQuery(fieldSearchFilters)
436
+ // a spatial extent filter takes precedence over the preference geometry for boosting
437
+ const spatialFilterExtent = this.findSpatialFilterExtent(fieldSearchFilters)
438
+ const queryFilters = this.filtersToQuery(
439
+ fieldSearchFilters,
440
+ spatialFilterExtent
441
+ )
372
442
  if (queryFilters) {
373
443
  filter.push(...queryFilters)
374
444
  }
@@ -379,7 +449,10 @@ export class ElasticsearchService {
379
449
  },
380
450
  })
381
451
  }
382
- if (geometry) {
452
+ const boostGeometry = spatialFilterExtent
453
+ ? bboxToPolygon(spatialFilterExtent)
454
+ : geometry
455
+ if (boostGeometry) {
383
456
  // boosts applied using the filter geometry:
384
457
  // * records completely within the geometry receive a boost of 5
385
458
  // * records intersecting the geometry receive a boost of 2
@@ -389,7 +462,7 @@ export class ElasticsearchService {
389
462
  {
390
463
  geo_shape: {
391
464
  geom: {
392
- shape: geometry,
465
+ shape: boostGeometry,
393
466
  relation: 'within',
394
467
  },
395
468
  boost: 5.0,
@@ -398,7 +471,7 @@ export class ElasticsearchService {
398
471
  {
399
472
  geo_shape: {
400
473
  geom: {
401
- shape: geometry,
474
+ shape: boostGeometry,
402
475
  relation: 'intersects',
403
476
  },
404
477
  boost: 2.0,
@@ -409,7 +482,7 @@ export class ElasticsearchService {
409
482
  // this will boost the results variably depending on their distance from the given geometry
410
483
  // note: this takes into account the `location` field of a record; this is generally the center of all spatial extents
411
484
  // combined, and thus the actual size/coverage of the record spatial extent isn't relevant here
412
- const bbox = getGeometryBoundingBox(geometry)
485
+ const bbox = getGeometryBoundingBox(boostGeometry)
413
486
  const center = [(bbox[0] + bbox[2]) / 2, (bbox[1] + bbox[3]) / 2]
414
487
  const northToCenter = new LineString([
415
488
  [center[0], bbox[3]],
@@ -6,11 +6,15 @@ export type FieldFilterByRange = {
6
6
  start?: Date
7
7
  end?: Date
8
8
  }
9
+ // matches util/shared's BoundingBox; duplicated here to avoid a circular
10
+ // dependency (util/shared already depends on common/domain)
11
+ export type FieldFilterByBoundingBox = [number, number, number, number]
9
12
 
10
13
  export type FieldFilter =
11
14
  | FieldFilterByExpression
12
15
  | FieldFilterByValues
13
16
  | FieldFilterByRange
17
+ | FieldFilterByBoundingBox
14
18
  export type FieldFilters = Record<FieldName, FieldFilter>
15
19
 
16
20
  export type QueryString = {
@@ -19,4 +23,19 @@ export type QueryString = {
19
23
  export type QueryRange = {
20
24
  range: Record<string, { format: string; gte: string; lte: string }>
21
25
  }
22
- export type FilterQuery = Array<QueryString | QueryRange>
26
+ export type QueryGeoShape = {
27
+ geo_shape: {
28
+ geom: {
29
+ shape: { type: string; coordinates: number[][] }
30
+ relation: string
31
+ }
32
+ }
33
+ }
34
+ export type QueryBool = {
35
+ bool: {
36
+ filter: QueryRange[]
37
+ }
38
+ }
39
+ export type FilterQuery = Array<
40
+ QueryString | QueryRange | QueryGeoShape | QueryBool
41
+ >
@@ -10,4 +10,3 @@ export * from './lib/style'
10
10
  export * from './lib/layers-panel/layers-panel.component'
11
11
  export * from './lib/add-layer-from-catalog/add-layer-from-catalog.component'
12
12
  export * from './lib/add-layer-from-catalog/add-layer-record-preview/add-layer-record-preview.component'
13
- export * from './lib/geocoding/geocoding.component'
@@ -5,6 +5,7 @@
5
5
  (fileChange)="handleFileChange($event)"
6
6
  [accept]="acceptedMimeType.join(',')"
7
7
  [placeholder]="'map.addFromFile.placeholder' | translate"
8
+ textClass="text-gray-900 pl-2 py-2"
8
9
  class="placeholder-grey"
9
10
  ></gn-ui-drag-and-drop-file-input>
10
11
  </div>
@@ -2,18 +2,11 @@ import { NgModule } from '@angular/core'
2
2
  import { StoreModule } from '@ngrx/store'
3
3
  import * as fromMap from './+state/map.reducer'
4
4
  import { MapFacade } from './+state/map.facade'
5
- import { GEOCODING_PROVIDER, GeocodingProvider } from './geocoding.service'
6
5
 
7
6
  @NgModule({
8
7
  imports: [
9
8
  StoreModule.forFeature(fromMap.MAP_FEATURE_KEY, fromMap.mapReducer),
10
9
  ],
11
- providers: [
12
- MapFacade,
13
- {
14
- provide: GEOCODING_PROVIDER,
15
- useValue: ['geonames', { maxRows: 5 }] as GeocodingProvider,
16
- },
17
- ],
10
+ providers: [MapFacade],
18
11
  })
19
12
  export class FeatureMapModule {}
@@ -18,10 +18,12 @@ export class NotificationsService {
18
18
  error && console.error(error)
19
19
  const id = Math.floor(Math.random() * 1000000)
20
20
  this.notifications$.next([...this.notifications$.value, { ...content, id }])
21
- if (typeof timeoutMs === 'undefined') return
22
- setTimeout(() => {
23
- this.removeNotificationById(id)
24
- }, timeoutMs)
21
+ if (typeof timeoutMs !== 'undefined') {
22
+ setTimeout(() => {
23
+ this.removeNotificationById(id)
24
+ }, timeoutMs)
25
+ }
26
+ return id
25
27
  }
26
28
 
27
29
  removeNotificationById(id: number) {
@@ -22,7 +22,7 @@ export function flattenQueryParams(
22
22
  const start = (flattened[key] as DateRange).start
23
23
  const end = (flattened[key] as DateRange).end
24
24
  flattened[key] = [
25
- `${start ? formatDate(start) : ''}..${formatDate(end) || ''}`,
25
+ `${start ? formatDate(start) : ''}..${end ? formatDate(end) : ''}`,
26
26
  ]
27
27
  }
28
28
  }
@@ -1,4 +1,6 @@
1
1
  export * from './lib/feature-search.module'
2
+ export * from './lib/geocoding/geocoding.service'
3
+ export * from './lib/location-search/location-search.component'
2
4
  export * from './lib/filter-geometry.token'
3
5
  export * from './lib/record-url.token'
4
6
  export * from './lib/state/actions'
@@ -1,11 +1,19 @@
1
1
  @if (fieldType === 'dateRange') {
2
2
  <gn-ui-date-range-dropdown
3
3
  [title]="title"
4
- [startDate]="(selectedDateRange$ | async)?.start"
5
- [endDate]="(selectedDateRange$ | async)?.end"
6
- (startDateChange)="onStartDateChange($event)"
7
- (endDateChange)="onEndDateChange($event)"
4
+ [dateRange]="(selectedDateRange$ | async) ?? {}"
5
+ (dateRangeChange)="onDateRangeChange($event)"
6
+ [attr.data-cy-field]="fieldName"
8
7
  ></gn-ui-date-range-dropdown>
8
+ } @else if (fieldType === 'spatialExtent') {
9
+ <gn-ui-spatial-extent-dropdown
10
+ [title]="title"
11
+ [initialBbox]="(selectedBoundingBox$ | async) ?? null"
12
+ [maxFileSizeMb]="spatialExtentMaxFileSize"
13
+ (bboxChange)="onBboxChange($event)"
14
+ (errorChange)="onSpatialExtentError($event)"
15
+ [attr.data-cy-field]="fieldName"
16
+ ></gn-ui-spatial-extent-dropdown>
9
17
  } @else {
10
18
  <gn-ui-dropdown-multiselect
11
19
  class="w-full"
@@ -9,6 +9,8 @@ import {
9
9
  Choice,
10
10
  DateRangeDropdownComponent,
11
11
  DropdownMultiselectComponent,
12
+ SpatialExtentDropdownComponent,
13
+ SpatialExtentDropdownError,
12
14
  } from '../../../../../../libs/ui/inputs/src'
13
15
  import { Observable, of, switchMap } from 'rxjs'
14
16
  import { catchError, filter, map, startWith } from 'rxjs/operators'
@@ -22,6 +24,10 @@ import {
22
24
  } from '../utils/service/fields'
23
25
  import { DateRange } from '../../../../../../libs/api/repository/src'
24
26
  import { CommonModule } from '@angular/common'
27
+ import { BoundingBox } from '../../../../../../libs/util/shared/src'
28
+ import { NotificationsService } from '../../../../../../libs/feature/notifications/src'
29
+ import { TranslateService } from '@ngx-translate/core'
30
+ import { getOptionalSearchConfig } from '../../../../../../libs/util/app-config/src'
25
31
 
26
32
  @Component({
27
33
  selector: 'gn-ui-filter-dropdown',
@@ -33,18 +39,23 @@ import { CommonModule } from '@angular/common'
33
39
  CommonModule,
34
40
  DateRangeDropdownComponent,
35
41
  DropdownMultiselectComponent,
42
+ SpatialExtentDropdownComponent,
36
43
  ],
37
44
  })
38
45
  export class FilterDropdownComponent implements OnInit {
39
46
  private searchFacade = inject(SearchFacade)
40
47
  private searchService = inject(SearchService)
41
48
  private fieldsService = inject(FieldsService)
49
+ private notificationsService = inject(NotificationsService)
50
+ private translateService = inject(TranslateService)
42
51
 
43
52
  @Input() fieldName: string
44
53
  @Input() title: string
45
54
 
55
+ spatialExtentMaxFileSize =
56
+ getOptionalSearchConfig()?.SPATIAL_EXTENT_MAX_FILE_SIZE
57
+
46
58
  fieldType: FieldType
47
- dateRange: DateRange
48
59
  choices$: Observable<Choice[]>
49
60
  selected$ = this.searchFacade.searchFilters$.pipe(
50
61
  switchMap((filters) =>
@@ -57,15 +68,54 @@ export class FilterDropdownComponent implements OnInit {
57
68
  ) as Observable<FieldValue[]>
58
69
 
59
70
  selectedDateRange$ = this.selected$.pipe(
60
- map((selectedDateRange) => selectedDateRange as DateRange)
71
+ map((selected) => (Array.isArray(selected) ? {} : (selected as DateRange)))
61
72
  ) as Observable<DateRange>
62
73
 
74
+ selectedBoundingBox$ = this.selected$.pipe(
75
+ map((selected) =>
76
+ Array.isArray(selected) && selected.length > 0
77
+ ? (selected as BoundingBox)
78
+ : null
79
+ )
80
+ ) as Observable<BoundingBox | null>
81
+
63
82
  onSelectedValues(values: unknown[]) {
64
83
  this.fieldsService
65
84
  .buildFiltersFromFieldValues({ [this.fieldName]: values as FieldValue[] })
66
85
  .subscribe((filters) => this.searchService.updateFilters(filters))
67
86
  }
68
87
 
88
+ private spatialExtentErrorNotificationId: number | null = null
89
+
90
+ onBboxChange(bbox: BoundingBox | null) {
91
+ this.fieldsService
92
+ .buildFiltersFromFieldValues({
93
+ [this.fieldName]: bbox,
94
+ })
95
+ .subscribe((filters) => this.searchService.updateFilters(filters))
96
+ this.clearSpatialExtentErrorNotification()
97
+ }
98
+
99
+ onSpatialExtentError(error: SpatialExtentDropdownError) {
100
+ this.clearSpatialExtentErrorNotification()
101
+ this.spatialExtentErrorNotificationId =
102
+ this.notificationsService.showNotification({
103
+ type: 'error',
104
+ title: this.translateService.instant(
105
+ 'search.filters.spatialExtent.error.title'
106
+ ),
107
+ text: this.translateService.instant(error.key, error.params),
108
+ })
109
+ }
110
+
111
+ private clearSpatialExtentErrorNotification() {
112
+ if (this.spatialExtentErrorNotificationId === null) return
113
+ this.notificationsService.removeNotificationById(
114
+ this.spatialExtentErrorNotificationId
115
+ )
116
+ this.spatialExtentErrorNotificationId = null
117
+ }
118
+
69
119
  ngOnInit() {
70
120
  this.fieldType = this.fieldsService.getFieldType(this.fieldName)
71
121
  this.choices$ = this.fieldsService.getAvailableValues(this.fieldName).pipe(
@@ -80,22 +130,11 @@ export class FilterDropdownComponent implements OnInit {
80
130
  )
81
131
  }
82
132
 
83
- onStartDateChange(start: Date) {
84
- if (!start) return
85
- this.dateRange = { ...this.dateRange, start }
86
- }
87
-
88
- onEndDateChange(end: Date) {
89
- if (!end) return
90
- this.dateRange = { ...this.dateRange, end }
91
- if (this.dateRange.start && this.dateRange.end) {
92
- this.fieldsService
93
- .buildFiltersFromFieldValues({
94
- [this.fieldName]: this.dateRange,
95
- })
96
- .subscribe((filters) => {
97
- return this.searchService.updateFilters(filters)
98
- })
99
- }
133
+ onDateRangeChange(dateRange: DateRange) {
134
+ this.fieldsService
135
+ .buildFiltersFromFieldValues({
136
+ [this.fieldName]: dateRange,
137
+ })
138
+ .subscribe((filters) => this.searchService.updateFilters(filters))
100
139
  }
101
140
  }
@@ -20,7 +20,11 @@ export type GeocodingProvider =
20
20
  | DataGouvFrGeocodingProvider
21
21
 
22
22
  export const GEOCODING_PROVIDER = new InjectionToken<GeocodingProvider>(
23
- 'geocoding-provider'
23
+ 'geocoding-provider',
24
+ {
25
+ providedIn: 'root',
26
+ factory: () => ['geonames', { maxRows: 5 }] as GeocodingProvider,
27
+ }
24
28
  )
25
29
 
26
30
  @Injectable({
@@ -0,0 +1,8 @@
1
+ <gn-ui-autocomplete
2
+ [action]="searchAction"
3
+ [displayWithFn]="displayWithFn"
4
+ [placeholder]="placeholder"
5
+ [displayWithTemplate]="displayWithTemplate"
6
+ (itemSelected)="handleItemSelected($event)"
7
+ >
8
+ </gn-ui-autocomplete>
@@ -0,0 +1,40 @@
1
+ import {
2
+ ChangeDetectionStrategy,
3
+ Component,
4
+ EventEmitter,
5
+ inject,
6
+ Input,
7
+ Output,
8
+ TemplateRef,
9
+ } from '@angular/core'
10
+ import { Observable } from 'rxjs'
11
+ import { GeocodingResult } from '@geospatial-sdk/geocoding'
12
+ import {
13
+ AutocompleteComponent,
14
+ AutocompleteItem,
15
+ } from '../../../../../../libs/ui/inputs/src'
16
+ import { GeocodingService } from '../geocoding/geocoding.service'
17
+
18
+ @Component({
19
+ selector: 'gn-ui-location-search',
20
+ templateUrl: './location-search.component.html',
21
+ changeDetection: ChangeDetectionStrategy.OnPush,
22
+ standalone: true,
23
+ imports: [AutocompleteComponent],
24
+ })
25
+ export class LocationSearchComponent {
26
+ private geocodingService = inject(GeocodingService)
27
+
28
+ @Input() placeholder = ''
29
+ @Input() displayWithTemplate?: TemplateRef<{ $implicit: GeocodingResult }>
30
+ @Output() resultSelected = new EventEmitter<GeocodingResult>()
31
+
32
+ displayWithFn = (item: AutocompleteItem) => (item as GeocodingResult).label
33
+
34
+ searchAction = (text: string): Observable<AutocompleteItem[]> =>
35
+ this.geocodingService.query(text)
36
+
37
+ handleItemSelected(item: AutocompleteItem) {
38
+ this.resultSelected.emit(item as GeocodingResult)
39
+ }
40
+ }
@@ -1,5 +1,5 @@
1
1
  import { Component, Input, OnInit, inject } from '@angular/core'
2
- import { CommonModule, DatePipe } from '@angular/common'
2
+ import { CommonModule } from '@angular/common'
3
3
  import {
4
4
  catchError,
5
5
  firstValueFrom,
@@ -15,11 +15,14 @@ import { FieldType, FieldValue } from '../utils/service/fields'
15
15
  import { SearchFacade } from '../state/search.facade'
16
16
  import { SearchService } from '../utils/service/search.service'
17
17
  import { FieldsService } from '../utils/service/fields.service'
18
- import { formatUserInfo } from '../../../../../../libs/util/shared/src'
18
+ import { DateService, formatUserInfo } from '../../../../../../libs/util/shared/src'
19
19
  import { marker } from '@biesbjerg/ngx-translate-extract-marker'
20
20
 
21
21
  marker('search.filters.summaryLabel.user')
22
22
  marker('search.filters.summaryLabel.changeDate')
23
+ marker('search.filters.summaryLabel.resourceCreationRevisionDate')
24
+
25
+ const OPEN_BOUND = '…'
23
26
 
24
27
  interface DisplayedValue {
25
28
  label: string
@@ -32,13 +35,12 @@ interface DisplayedValue {
32
35
  imports: [CommonModule, BadgeComponent],
33
36
  templateUrl: './search-filters-summary-item.component.html',
34
37
  styleUrls: ['./search-filters-summary-item.component.css'],
35
- providers: [DatePipe],
36
38
  })
37
39
  export class SearchFiltersSummaryItemComponent implements OnInit {
38
40
  private searchFacade = inject(SearchFacade)
39
41
  private searchService = inject(SearchService)
40
42
  private fieldsService = inject(FieldsService)
41
- private datePipe = inject(DatePipe)
43
+ private dateService = inject(DateService)
42
44
  private translate = inject(TranslateService)
43
45
 
44
46
  @Input() fieldName: string
@@ -82,12 +84,10 @@ export class SearchFiltersSummaryItemComponent implements OnInit {
82
84
  getReadableValues(fieldValues: FieldValue[] | DateRange[]): DisplayedValue[] {
83
85
  return fieldValues.map((value) => {
84
86
  if (this.fieldType === 'dateRange') {
87
+ const { start, end } = value as DateRange
85
88
  return {
86
89
  value,
87
- label: `${this.datePipe.transform(
88
- value.start,
89
- 'dd.MM.yyyy'
90
- )} - ${this.datePipe.transform(value.end, 'dd.MM.yyyy')}`,
90
+ label: `${this.formatBound(start)} - ${this.formatBound(end)}`,
91
91
  }
92
92
  } else if (this.fieldName === 'user') {
93
93
  return { value, label: formatUserInfo(value) }
@@ -97,6 +97,16 @@ export class SearchFiltersSummaryItemComponent implements OnInit {
97
97
  })
98
98
  }
99
99
 
100
+ private formatBound(date: Date | undefined): string {
101
+ return date
102
+ ? this.dateService.formatDate(date, {
103
+ day: '2-digit',
104
+ month: '2-digit',
105
+ year: 'numeric',
106
+ })
107
+ : OPEN_BOUND
108
+ }
109
+
100
110
  async removeFilterValue(fieldValue: FieldValue | DateRange) {
101
111
  const currentFieldValues: DisplayedValue[] = await firstValueFrom(
102
112
  this.fieldValues$
@@ -2,6 +2,7 @@ import { Injectable, Injector, inject } from '@angular/core'
2
2
  import {
3
3
  AbstractSearchField,
4
4
  AvailableServicesField,
5
+ BoundingBoxSearchField,
5
6
  DateRangeSearchField,
6
7
  FieldValue,
7
8
  FullTextSearchField,
@@ -10,6 +11,7 @@ import {
10
11
  MultilingualSearchField,
11
12
  OrganizationSearchField,
12
13
  OwnerSearchField,
14
+ ResourceCreationRevisionDateSearchField,
13
15
  ResourceTypeLegacyField,
14
16
  SimpleSearchField,
15
17
  TranslatedSearchField,
@@ -42,7 +44,8 @@ marker('search.filters.producerOrg')
42
44
  marker('search.filters.publisherOrg')
43
45
  marker('search.filters.user')
44
46
  marker('search.filters.changeDate')
45
-
47
+ marker('search.filters.resourceCreationRevisionDate')
48
+ marker('search.filters.spatialExtent')
46
49
  @Injectable({
47
50
  providedIn: 'root',
48
51
  })
@@ -94,7 +97,12 @@ export class FieldsService {
94
97
  ),
95
98
  user: new UserSearchField(this.injector),
96
99
  changeDate: new DateRangeSearchField('changeDate', this.injector, 'desc'),
100
+ resourceCreationRevisionDate: new ResourceCreationRevisionDateSearchField(
101
+ this.injector,
102
+ 'desc'
103
+ ),
97
104
  availableServices: new AvailableServicesField(this.injector),
105
+ spatialExtent: new BoundingBoxSearchField('spatialExtent', this.injector),
98
106
  } as Record<string, AbstractSearchField>
99
107
 
100
108
  get supportedFields() {