geonetwork-ui 2.8.0-dev.398701d7f → 2.8.0-dev.5186798f7

package/src/libs/feature/record/src/lib/data-view-web-component/data-view-web-component.component.ts

@@ -3,6 +3,7 @@ import {
   Component,
   Inject,
   Input,
+  Optional,
 } from '@angular/core'
 import { Configuration } from '../../../../../../libs/data-access/gn4/src'
 import { MdViewFacade } from '../state'
@@ -10,7 +11,7 @@ import { BehaviorSubject, combineLatest, map } from 'rxjs'
 import { CopyTextButtonComponent } from '../../../../../../libs/ui/inputs/src'
 import { CommonModule } from '@angular/common'
 import { TranslatePipe } from '@ngx-translate/core'
-import { GEONETWORK_UI_TAG_NAME } from '../../../../../../libs/util/shared/src'
+import { GEONETWORK_UI_TAG_NAME, PROXY_PATH } from '../../../../../../libs/util/shared/src'
 
 @Component({
   selector: 'gn-ui-data-view-web-component',
@@ -42,7 +43,12 @@ export class DataViewWebComponentComponent {
           api-url="${new URL(
             this.config.basePath,
             window.location.origin
-          ).toString()}"
+          ).toString()}"${
+            this.proxyPath
+              ? `
+          proxy-path="${this.proxyPath}"`
+              : ''
+          }
           dataset-id="${metadata.uniqueIdentifier}"
           aggregation="${aggregation}"
           x-property="${xProperty}"
@@ -65,7 +71,12 @@ export class DataViewWebComponentComponent {
           api-url="${new URL(
             this.config.basePath,
             window.location.origin
-          ).toString()}"
+          ).toString()}"${
+            this.proxyPath
+              ? `
+          proxy-path="${this.proxyPath}"`
+              : ''
+          }
           dataset-id="${metadata.uniqueIdentifier}"
           primary-color="#0f4395"
           secondary-color="#8bc832"
@@ -82,7 +93,12 @@ export class DataViewWebComponentComponent {
         api-url="${new URL(
           this.config.basePath,
           window.location.origin
-        ).toString()}"
+        ).toString()}"${
+          this.proxyPath
+            ? `
+        proxy-path="${this.proxyPath}"`
+            : ''
+        }
         dataset-id="${metadata.uniqueIdentifier}"
         primary-color="#0f4395"
         secondary-color="#8bc832"
@@ -97,6 +113,9 @@ export class DataViewWebComponentComponent {
 
   constructor(
     @Inject(Configuration) private config: Configuration,
+    @Optional()
+    @Inject(PROXY_PATH)
+    private proxyPath: string,
     private facade: MdViewFacade
   ) {}
 }

package/src/libs/feature/record/src/lib/map-view/map-view.component.ts

@@ -114,6 +114,7 @@ export class MapViewComponent implements AfterViewInit {
   _styleFromConfig = null
 
   linkMap: Map<string, DatasetOnlineResource> = new Map()
+  // FIXME the map view component should not need a selectedView
   @Input() set selectedView(value: string) {
     this.selectedView$.next(value)
   }

package/src/libs/feature/record/src/lib/stac-view/stac-view.component.css

@@ -0,0 +1,3 @@
+:host {
+  --gn-ui-button-padding: 7px 8px;
+}

package/src/libs/feature/record/src/lib/stac-view/stac-view.component.html

@@ -0,0 +1,68 @@
+<div class="mt-6 bg-white border border-gray-300 overflow-hidden rounded-lg">
+  <div
+    class="w-full min-h-[366px] flex md:flex-row flex-col border-b border-gray-300"
+  >
+    <div class="md:w-1/2 w-full flex-1 flex flex-col">
+      <gn-ui-date-range-inputs
+        [temporalExtent]="currentTemporalExtent$ | async"
+        (temporalExtentChange)="onTemporalExtentChange($event)"
+      ></gn-ui-date-range-inputs>
+
+      <div class="mt-auto mb-8 mx-8" *ngIf="isFilterModified">
+        <gn-ui-button
+          id="reset-filters-button"
+          type="light"
+          (buttonClick)="onResetFilters()"
+        >
+          <span translate>stac.filter.reset</span>
+          <ng-icon name="matDeleteOutline" class="ml-2"></ng-icon>
+        </gn-ui-button>
+      </div>
+    </div>
+
+    <div class="md:w-1/2 w-full min-h-[280px] flex items-center justify-center">
+      <span>Map...</span>
+    </div>
+  </div>
+  <div
+    class="relative mx-5 my-[30px] min-h-[274px] flex items-center justify-center flex-col"
+  >
+    <!-- Keep grid outside ngIf to keep items$ observable alive -->
+    <gn-ui-stac-items-result-grid
+      [items]="items$ | async"
+    ></gn-ui-stac-items-result-grid>
+    <div
+      *ngIf="(items$ | async)?.length > 0; else noResultsOrError"
+      class="mt-[20px] mx-auto flex justify-center"
+    >
+      <gn-ui-previous-next-buttons
+        [listComponent]="this"
+        [displayLabels]="true"
+      ></gn-ui-previous-next-buttons>
+    </div>
+    <ng-template #noResultsOrError>
+      <gn-ui-popup-alert
+        *ngIf="error"
+        type="warning"
+        icon="matErrorOutlineOutline"
+        class="absolute left-0 top-0 w-full block"
+      >
+        <span translate>{{ error }}</span>
+      </gn-ui-popup-alert>
+      <div
+        *ngIf="!error"
+        class="flex items-center justify-center flex-col h-full gap-[10px]"
+      >
+        <h2 class="text-center text-xl" translate>stac.results.noResults</h2>
+        <gn-ui-button
+          id="no-results-button"
+          type="secondary"
+          (buttonClick)="onResetFilters()"
+        >
+          <span translate>stac.filter.reset</span>
+          <ng-icon name="matDeleteOutline" class="ml-2"></ng-icon>
+        </gn-ui-button>
+      </div>
+    </ng-template>
+  </div>
+</div>

package/src/libs/feature/record/src/lib/stac-view/stac-view.component.ts

@@ -0,0 +1,190 @@
+import { CommonModule } from '@angular/common'
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'
+import {
+  DatasetRecord,
+  DatasetTemporalExtent,
+} from '../../../../../../libs/common/domain/src/lib/model/record'
+import { StacItemsResultGridComponent } from '../../../../../../libs/ui/elements/src'
+import {
+  ButtonComponent,
+  DateRangeInputsComponent,
+} from '../../../../../../libs/ui/inputs/src'
+import { NgIconComponent, provideIcons } from '@ng-icons/core'
+import { matDeleteOutline } from '@ng-icons/material-icons/outline'
+import { TranslateDirective, TranslateService } from '@ngx-translate/core'
+import { DataService } from '../../../../../../libs/feature/dataviz/src'
+import {
+  BehaviorSubject,
+  catchError,
+  combineLatest,
+  debounceTime,
+  from,
+  map,
+  Observable,
+  of,
+  switchMap,
+  take,
+  tap,
+} from 'rxjs'
+import { GetCollectionItemsOptions, StacItem } from '@camptocamp/ogc-client'
+import { MdViewFacade } from '../state'
+import { PreviousNextButtonsComponent } from '../../../../../../libs/ui/layout/src'
+import { FetchError } from '../../../../../../libs/util/data-fetcher/src'
+import { PopupAlertComponent } from '../../../../../../libs/ui/widgets/src'
+
+const STAC_ITEMS_PER_PAGE = 12
+const DEBOUNCE_TIME_MS = 500
+
+@Component({
+  selector: 'gn-ui-stac-view',
+  templateUrl: './stac-view.component.html',
+  styleUrls: ['./stac-view.component.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [
+    CommonModule,
+    NgIconComponent,
+    TranslateDirective,
+    StacItemsResultGridComponent,
+    DateRangeInputsComponent,
+    PreviousNextButtonsComponent,
+    PopupAlertComponent,
+    ButtonComponent,
+  ],
+  viewProviders: [provideIcons({ matDeleteOutline })],
+})
+export class StacViewComponent implements OnInit {
+  isFilterModified = false
+  error = null
+
+  initialTemporalExtent: DatasetTemporalExtent | null = null
+  currentTemporalExtent$ = new BehaviorSubject<DatasetTemporalExtent | null>(
+    null
+  )
+
+  initialPageUrl: string
+  previousPageUrl: string
+  nextPageUrl: string
+  currentPageUrl$ = new BehaviorSubject<string | null>(null)
+
+  items$: Observable<StacItem[]> = combineLatest([
+    this.currentPageUrl$,
+    this.currentTemporalExtent$,
+  ]).pipe(
+    debounceTime(DEBOUNCE_TIME_MS),
+    switchMap(([currentPageUrl, temporalExtent]) => {
+      this.error = null
+      const options: GetCollectionItemsOptions = {
+        limit: STAC_ITEMS_PER_PAGE,
+      }
+      if (temporalExtent && (temporalExtent.start || temporalExtent.end)) {
+        options.datetime = {
+          ...(temporalExtent.start && { start: temporalExtent.start }),
+          ...(temporalExtent.end && { end: temporalExtent.end }),
+        }
+      }
+      return from(
+        this.dataService.getItemsFromStacApi(currentPageUrl, options)
+      ).pipe(
+        tap((stacDocument) => {
+          this.previousPageUrl =
+            stacDocument.links.find((link) => link.rel === 'previous')?.href ||
+            null
+          this.nextPageUrl =
+            stacDocument.links.find((link) => link.rel === 'next')?.href || null
+        }),
+        map((stacDocument) => stacDocument.features),
+        catchError((err) => {
+          this.handleError(err)
+          return of([])
+        })
+      )
+    })
+  )
+
+  constructor(
+    private dataService: DataService,
+    private metadataViewFacade: MdViewFacade,
+    private translateService: TranslateService
+  ) {}
+
+  ngOnInit() {
+    this.metadataViewFacade.metadata$
+      .pipe(
+        take(1),
+        map((metadata) => {
+          const temporalExtents =
+            metadata?.kind === 'dataset'
+              ? (metadata as DatasetRecord).temporalExtents
+              : []
+
+          return temporalExtents.length > 0
+            ? temporalExtents[0]
+            : ({
+                start: null,
+                end: null,
+              } as DatasetTemporalExtent)
+        })
+      )
+      .subscribe((extent) => {
+        this.initialTemporalExtent = extent
+        this.currentTemporalExtent$.next(extent)
+      })
+
+    this.metadataViewFacade.stacLinks$
+      .pipe(
+        take(1),
+        map((links) => (links && links.length > 0 ? links[0] : null))
+      )
+      .subscribe((link) => {
+        if (link) {
+          this.initialPageUrl = link.url.href
+          this.currentPageUrl$.next(link.url.href)
+        }
+      })
+  }
+
+  onTemporalExtentChange(extent: DatasetTemporalExtent | null) {
+    this.currentTemporalExtent$.next(extent)
+    // make sure to use url without pagination token when temporal filter changes
+    this.currentPageUrl$.next(this.initialPageUrl)
+    this.isFilterModified = true
+  }
+
+  onResetFilters() {
+    this.currentTemporalExtent$.next(this.initialTemporalExtent)
+    this.isFilterModified = false
+  }
+
+  handleError(error: FetchError | Error | string) {
+    if (error instanceof FetchError) {
+      this.error = this.translateService.instant(
+        `dataset.error.${error.type}`,
+        {
+          info: error.info,
+        }
+      )
+      console.warn(error.message)
+    } else if (error instanceof Error) {
+      this.error = this.translateService.instant(error.message)
+      console.warn(error.stack || error)
+    } else {
+      this.error = this.translateService.instant(error)
+      console.warn(error)
+    }
+  }
+
+  // Paginable API
+  get isFirstPage() {
+    return this.previousPageUrl == null
+  }
+  get isLastPage() {
+    return this.nextPageUrl == null
+  }
+  goToNextPage() {
+    this.currentPageUrl$.next(this.nextPageUrl)
+  }
+  goToPrevPage() {
+    this.currentPageUrl$.next(this.previousPageUrl)
+  }
+}

package/src/libs/feature/record/src/lib/state/mdview.facade.ts

@@ -20,7 +20,7 @@ import {
 } from '../../../../../../libs/common/domain/src/lib/model/record'
 import { AvatarServiceInterface } from '../../../../../../libs/api/repository/src'
 import { OgcApiRecord } from '@camptocamp/ogc-client'
-import { from, of, Observable } from 'rxjs'
+import { from, of } from 'rxjs'
 import { DataService } from '../../../../../../libs/feature/dataviz/src'
 
 @Injectable()
@@ -89,6 +89,25 @@ export class MdViewFacade {
     shareReplay(1)
   )
 
+  resourceDoi$ = this.metadata$.pipe(
+    map((record) => {
+      if (!record?.resourceIdentifiers?.length) return null
+      const doiIdentifier = record.resourceIdentifiers.find(
+        (id) =>
+          id.codeSpace?.toLowerCase().includes('doi.org') ||
+          id.code.startsWith('10.')
+      )
+
+      if (!doiIdentifier) return null
+
+      return {
+        code: doiIdentifier.code,
+        url: doiIdentifier.url ? doiIdentifier.url : null,
+      }
+    }),
+    shareReplay(1)
+  )
+
   apiLinks$ = this.allLinks$.pipe(
     map((links) =>
       links.filter((link) => this.linkClassifier.hasUsage(link, LinkUsage.API))
@@ -105,6 +124,16 @@ export class MdViewFacade {
     shareReplay(1)
   )
 
+  stacLinks$ = this.allLinks$.pipe(
+    map((links) =>
+      links.filter(
+        (link) =>
+          link.type === 'service' && link.accessServiceProtocol === 'stac'
+      )
+    ),
+    shareReplay(1)
+  )
+
   downloadLinks$ = this.allLinks$.pipe(
     map((links) =>
       links.filter((link) =>

package/src/libs/feature/router/src/lib/default/router.service.ts

@@ -8,6 +8,10 @@ import {
 } from '.'
 import { Router, Routes } from '@angular/router'
 import { ROUTER_CONFIG, RouterConfigModel } from './router.config'
+import {
+  SortByEnum,
+  SortByField,
+} from '../../../../../../libs/common/domain/src/lib/model/search'
 
 @Injectable({
   providedIn: 'root',
@@ -58,4 +62,8 @@ export class RouterService {
   getOrganizationPageRoute(): string {
     return ROUTER_ROUTE_ORGANIZATION
   }
+
+  getDefaultSort(): SortByField {
+    return SortByEnum.RESOURCE_DATES
+  }
 }

package/src/libs/feature/router/src/lib/default/state/router.effects.ts

@@ -9,10 +9,7 @@ import {
   SetFilters,
   SetSortBy,
 } from '../../../../../../../libs/feature/search/src'
-import {
-  FieldFilters,
-  SortByEnum,
-} from '../../../../../../../libs/common/domain/src/lib/model/search'
+import { FieldFilters } from '../../../../../../../libs/common/domain/src/lib/model/search'
 import { Actions, createEffect, ofType } from '@ngrx/effects'
 import { navigation } from '@ngrx/router-store/data-persistence'
 import { of, pairwise, startWith } from 'rxjs'
@@ -22,6 +19,7 @@ import { RouterFacade } from './router.facade'
 import { ROUTE_PARAMS } from '../constants'
 import { sortByFromString } from '../../../../../../../libs/util/shared/src'
 import { ROUTER_CONFIG, RouterConfigModel } from '../router.config'
+import { RouterService } from '../router.service'
 
 @Injectable()
 export class RouterEffects {
@@ -31,7 +29,8 @@ export class RouterEffects {
     private _location: Location,
     private facade: RouterFacade,
     @Inject(ROUTER_CONFIG) private routerConfig: RouterConfigModel,
-    private fieldsService: FieldsService
+    private fieldsService: FieldsService,
+    private routerService: RouterService
   ) {}
 
   navigate$ = createEffect(
@@ -61,7 +60,7 @@ export class RouterEffects {
         let sortBy =
           ROUTE_PARAMS.SORT in newParams
             ? sortByFromString(newParams[ROUTE_PARAMS.SORT])
-            : SortByEnum.CHANGE_DATE
+            : this.routerService.getDefaultSort()
         let pageNumber =
           ROUTE_PARAMS.PAGE in newParams
             ? parseInt(newParams[ROUTE_PARAMS.PAGE])
@@ -70,7 +69,7 @@ export class RouterEffects {
           const oldSort =
             ROUTE_PARAMS.SORT in oldParams
               ? sortByFromString(oldParams[ROUTE_PARAMS.SORT])
-              : SortByEnum.CHANGE_DATE
+              : this.routerService.getDefaultSort()
           if (JSON.stringify(sortBy) === JSON.stringify(oldSort)) {
             sortBy = null
           }

package/src/libs/feature/search/src/lib/constants.ts

@@ -11,7 +11,6 @@ export const FIELDS_SUMMARY: FieldName[] = [
   'resourceAbstractObject',
   'overview',
   'logo',
-  'codelist_status_text',
   'link',
   'linkProtocol',
   'contactForResource*.organisation*',

package/src/libs/feature/search/src/lib/sort-by/sort-by.component.ts

@@ -13,7 +13,7 @@ import { TranslatePipe } from '@ngx-translate/core'
 
 interface SortChoice {
   label: string
-  value: string
+  value: SortByField
 }
 
 @Component({
@@ -27,24 +27,20 @@ export class SortByComponent implements OnInit {
   choices: SortChoice[] = [
     {
       label: marker('results.sortBy.relevancy'),
-      value: SortByEnum.RELEVANCY.join(','),
+      value: SortByEnum.RELEVANCY,
     },
     {
       label: marker('results.sortBy.dateStamp'),
-      value: SortByEnum.CREATE_DATE.join(','),
-    },
-    {
-      label: marker('results.sortBy.changeDate'),
-      value: SortByEnum.CHANGE_DATE.join(','),
+      value: SortByEnum.RESOURCE_DATES,
     },
     {
       label: marker('results.sortBy.popularity'),
-      value: SortByEnum.POPULARITY.join(','),
+      value: SortByEnum.POPULARITY,
     },
   ]
   currentSortBy$ = this.facade.sortBy$.pipe(
     filter((sortBy) => !!sortBy),
-    map((sortBy) => sortBy.join(','))
+    map((sortBy) => sortBy)
   )
 
   constructor(
@@ -56,12 +52,12 @@ export class SortByComponent implements OnInit {
     if (this.isQualitySortable) {
       this.choices.push({
         label: marker('results.sortBy.qualityScore'),
-        value: SortByEnum.QUALITY_SCORE.join(','),
+        value: SortByEnum.QUALITY_SCORE,
       })
     }
   }
 
-  changeSortBy(criteriaAsString: string) {
-    this.searchService.setSortBy(criteriaAsString.split(',') as SortByField)
+  changeSortBy(criteria: SortByField): void {
+    this.searchService.setSortBy(criteria)
   }
 }

package/src/libs/ui/elements/src/index.ts

@@ -14,6 +14,7 @@ export * from './lib/markdown-editor/markdown-editor.component'
 export * from './lib/markdown-parser/markdown-parser.component'
 export * from './lib/metadata-catalog/metadata-catalog.component'
 export * from './lib/metadata-contact/metadata-contact.component'
+export * from './lib/metadata-doi/metadata-doi.component'
 export * from './lib/metadata-info/metadata-info.component'
 export * from './lib/metadata-quality-item/metadata-quality-item.component'
 export * from './lib/metadata-quality/metadata-quality.component'
@@ -26,3 +27,4 @@ export * from './lib/application-banner/application-banner.component'
 export * from './lib/internal-link-card/internal-link-card.component'
 export * from './lib/service-capabilities/service-capabilities.component'
 export * from './lib/record-feature-catalog/feature-catalog-list/feature-catalog-list.component'
+export * from './lib/stac-items-result-grid/stac-items-result-grid.component'

package/src/libs/ui/elements/src/lib/error/error.component.html

@@ -1,5 +1,9 @@
 <div
-  class="p-[1.7em] bg-red-50 text-red-800 text-[1.5em] text-center rounded-lg"
+  class="p-[1.7em] text-[1.5em] text-center rounded-lg"
+  [ngClass]="{
+    'bg-red-50 text-red-800': type !== types.DATASET_HAS_NO_LINK,
+    'bg-gray-100 text-black': type === types.DATASET_HAS_NO_LINK,
+  }"
 >
   <div
     *ngIf="type === types.COULD_NOT_REACH_API"

package/src/libs/ui/elements/src/lib/external-link-card/external-link-card.component.html

@@ -1,15 +1,48 @@
-<a
-  [href]="link.url"
-  target="_blank"
-  class="group flex flex-row justify-between card-shadow cursor-pointer rounded overflow-hidden"
-  [ngClass]="cardClass"
-  [title]="title"
->
+<ng-container *ngIf="isDatabase; else clickableLink">
+  <div [ngClass]="cardClass" [title]="title">
+    <ng-container *ngTemplateOutlet="cardContent"></ng-container>
+    <div
+      class="flex min-w-[32px]"
+      [ngClass]="size === 'S' ? 'items-end' : 'items-center'"
+    >
+      <div
+        class="gn-ui-card-icon"
+        [title]="'record.metadata.link.postgis.tooltip' | translate"
+      >
+        <ng-icon
+          class="inline-block card-icon align-middle"
+          name="iconoirDatabase"
+        ></ng-icon>
+      </div>
+    </div>
+  </div>
+</ng-container>
+
+<ng-template #clickableLink>
+  <a [href]="link.url" target="_blank" [ngClass]="cardClass" [title]="title">
+    <ng-container *ngTemplateOutlet="cardContent"></ng-container>
+    <div
+      class="flex min-w-[32px]"
+      [ngClass]="size === 'S' ? 'items-end' : 'items-center'"
+    >
+      <div class="gn-ui-card-icon">
+        <ng-icon
+          class="inline-block card-icon align-middle"
+          name="matOpenInNew"
+        ></ng-icon>
+      </div>
+    </div>
+  </a>
+</ng-template>
+<ng-template #cardContent>
   <div class="flex flex-col justify-between flex-1 min-w-0">
     <div class="gn-ui-card-title">
       {{ link.description || link.name }}
     </div>
     <div class="gn-ui-card-detail">
+      <ng-container *ngIf="isDatabase">
+        {{ 'record.metadata.link.postgis.table' | translate }}
+      </ng-container>
       {{ link.name }}
     </div>
     <p *ngIf="!link.name && !link.description" class="gn-ui-card-title">
@@ -20,21 +53,9 @@
         class="inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded transition-opacity opacity-70 group-hover:opacity-100"
         [style.background-color]="getLinkColor(link)"
         data-cy="download-format"
-        >{{
-          getLinkFormat(link) || ('downloads.format.unknown' | translate)
-        }}</span
       >
+        {{ getLinkFormat(link) || ('downloads.format.unknown' | translate) }}
+      </span>
     </div>
   </div>
-  <div
-    class="flex min-w-[32px]"
-    [ngClass]="size === 'S' ? 'items-end' : 'items-center'"
-  >
-    <div class="gn-ui-card-icon">
-      <ng-icon
-        class="inline-block card-icon align-middle"
-        name="matOpenInNew"
-      ></ng-icon>
-    </div>
-  </div>
-</a>
+</ng-template>

package/src/libs/ui/elements/src/lib/external-link-card/external-link-card.component.ts

@@ -7,6 +7,7 @@ import {
   provideNgIconsConfig,
 } from '@ng-icons/core'
 import { matOpenInNew } from '@ng-icons/material-icons/baseline'
+import { iconoirDatabase } from '@ng-icons/iconoir'
 import { getBadgeColor, getFileFormat } from '../../../../../../libs/util/shared/src'
 import { TranslatePipe } from '@ngx-translate/core'
 
@@ -21,6 +22,7 @@ type CardSize = 'L' | 'M' | 'S' | 'XS'
   providers: [
     provideIcons({
       matOpenInNew,
+      iconoirDatabase,
     }),
     provideNgIconsConfig({ size: '1.5em' }),
   ],
@@ -37,7 +39,7 @@ export class ExternalLinkCardComponent {
 
   @Input() set size(value: CardSize) {
     this._size = value
-    this.cardClass = this.sizeClassMap[value]
+    this.cardClass = `group flex flex-row justify-between card-shadow rounded overflow-hidden ${this.sizeClassMap[value]}`
   }
   get size(): CardSize {
     return this._size
@@ -51,11 +53,18 @@ export class ExternalLinkCardComponent {
     return this.link.name || this.link.description || ''
   }
 
-  getLinkFormat(link: any) {
+  get isDatabase(): boolean {
+    return (
+      this.link.type === 'service' &&
+      this.link.accessServiceProtocol === 'postgis'
+    )
+  }
+
+  getLinkFormat(link: DatasetOnlineResource): string {
     return getFileFormat(link)
   }
 
-  getLinkColor(link: any) {
+  getLinkColor(link: DatasetOnlineResource): string {
     return getBadgeColor(getFileFormat(link))
   }
 }