geonetwork-ui 2.9.0-dev.d504391c5 → 2.9.0-dev.ec873d387

package/src/libs/feature/record/src/lib/gpf-api-dl/gpf-api-dl.component.html

@@ -12,7 +12,7 @@
     </h2>
     <button
       (click)="resetUrl()"
-      class="bg-primary-opacity-50 inline-flex items-center justify-center px-4 py-2 text-white rounded hover:bg-primary transition"
+      class="bg-primary/50 inline-flex items-center justify-center px-4 py-2 text-white rounded hover:bg-primary transition"
       [attr.title]="'record.metadata.api.form.resetTooltip' | translate"
       [attr.aria-label]="'record.metadata.api.form.resetTooltip' | translate"
     >
@@ -97,7 +97,7 @@
         'px-4 py-2 text-white rounded transition ' +
         ((page$ | async) <= 1
           ? 'bg-gray-400 cursor-not-allowed  '
-          : 'bg-primary-opacity-50  hover:bg-primary')
+          : 'bg-primary/50  hover:bg-primary')
       "
       [attr.title]="'record.metadata.api.form.previousPageTooltip' | translate"
       [attr.aria-label]="
@@ -117,10 +117,10 @@
     <button
       (click)="moreResult()"
       [class]="
-        'bg-primary-opacity-50 px-4 py-2 text-white rounded transition ' +
+        'bg-primary/50 px-4 py-2 text-white rounded transition ' +
         ((page$ | async) >= (pageMax$ | async)
           ? 'bg-gray-400 cursor-not-allowed  '
-          : 'bg-primary-opacity-50  hover:bg-primary')
+          : 'bg-primary/50  hover:bg-primary')
       "
       [attr.title]="'record.metadata.api.form.nextPageTooltip' | translate"
       [attr.aria-label]="'record.metadata.api.form.nextPageTooltip' | translate"

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

@@ -13,24 +13,15 @@
       ></gn-ui-dropdown-selector>
     }
 
-    @if ((styleLinks$ | async)?.length > 0) {
-      <gn-ui-dropdown-selector
-        class="w-full md:flex-1 md:min-w-0"
-        extraBtnClass="font-sans font-bold"
-        [title]="'map.select.style' | translate"
-        [choices]="styleDropdownChoices$ | async"
-        [selected]="_styleFromConfig"
-        (selectValue)="selectStyleToDisplay($event)"
-      ></gn-ui-dropdown-selector>
-    } @else {
-      <gn-ui-dropdown-selector
-        class="w-full md:flex-1 md:min-w-0 text-gray-400"
-        extraBtnClass="font-sans font-bold text-gray-400"
-        [title]="'map.select.style' | translate"
-        [choices]="styleDropdownChoices$ | async"
-        [disabled]="true"
-      ></gn-ui-dropdown-selector>
-    }
+    <gn-ui-dropdown-selector
+      class="w-full md:flex-1 md:min-w-0"
+      extraBtnClass="font-sans font-bold"
+      [title]="'map.select.style' | translate"
+      [choices]="styleDropdownChoices$ | async"
+      [selected]="selectedStyleId$ | async"
+      [disabled]="(styleDropdownChoices$ | async)?.length <= 1"
+      (selectValue)="selectStyleToDisplay($event)"
+    ></gn-ui-dropdown-selector>
 
     <div class="self-end md:ml-2">
       <gn-ui-external-viewer-button

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

@@ -11,6 +11,7 @@ import {
 } from '@angular/core'
 import { MapUtilsService } from '../../../../../../libs/feature/map/src'
 import { getLinkId, getLinkLabel } from '../../../../../../libs/util/shared/src'
+import { WmsEndpoint, LayerStyle } from '@camptocamp/ogc-client'
 import {
   BehaviorSubject,
   combineLatest,
@@ -40,6 +41,7 @@ import {
   createViewFromLayer,
   MapContext,
   MapContextLayer,
+  MapContextLayerWms,
   SourceLoadErrorEvent,
 } from '@geospatial-sdk/core'
 import {
@@ -77,6 +79,7 @@ marker('map.dropdown.placeholder')
 marker('wfs.feature.limit')
 marker('dataset.error.restrictedAccess')
 marker('map.select.style')
+marker('map.style.default')
 
 @Component({
   selector: 'gn-ui-map-view',
@@ -231,6 +234,14 @@ export class MapViewComponent implements AfterViewInit {
     })
   )
 
+  isWmsStyleMode$ = this.selectedSourceLink$.pipe(
+    map(
+      (src) => src?.type === 'service' && src?.accessServiceProtocol === 'wms'
+    ),
+    distinctUntilChanged(),
+    shareReplay(1)
+  )
+
   styleLinks$ = this.selectedSourceLink$.pipe(
     switchMap((src) => {
       if (
@@ -262,6 +273,22 @@ export class MapViewComponent implements AfterViewInit {
           })
         )
       }
+      if (
+        src &&
+        src.type === 'service' &&
+        src.accessServiceProtocol === 'wms'
+      ) {
+        return from(new WmsEndpoint(src.url.toString()).isReady()).pipe(
+          map((endpoint) => {
+            const layer = endpoint.getLayerByName(src.name)
+            return layer?.styles || []
+          }),
+          catchError((error) => {
+            this.handleError(error)
+            return of([])
+          })
+        )
+      }
       return of([])
     }),
     tap((styles) => {
@@ -274,33 +301,57 @@ export class MapViewComponent implements AfterViewInit {
     shareReplay(1)
   )
 
-  styleDropdownChoices$ = this.styleLinks$.pipe(
-    map((links) =>
+  styleDropdownChoices$ = combineLatest([
+    this.styleLinks$,
+    this.isWmsStyleMode$,
+  ]).pipe(
+    map(([links, isWmsStyleMode]) =>
       links.length
         ? links.map((link, index) => ({
-            label: getLinkLabel(link),
+            label: isWmsStyleMode
+              ? (link as LayerStyle).title || (link as LayerStyle).name
+              : getLinkLabel(link as DatasetOnlineResource),
             value: index,
           }))
         : [
             {
-              label: '\u00A0\u00A0\u00A0\u00A0',
+              label: this.translateService.instant('map.style.default'),
               value: 0,
             },
           ]
     )
   )
 
+  selectedWmsStyleName$ = combineLatest([
+    this.styleLinks$,
+    this.isWmsStyleMode$,
+    this.selectedStyleId$.pipe(distinctUntilChanged()),
+  ]).pipe(
+    map(([styles, isWmsStyleMode, styleIdx]) =>
+      isWmsStyleMode && Array.isArray(styles)
+        ? (styles[styleIdx] as LayerStyle)?.name
+        : undefined
+    )
+  )
+
   selectedLink$ = combineLatest([
     this.selectedSourceLink$,
     this.styleLinks$,
     this.selectedStyleId$.pipe(distinctUntilChanged()),
+    this.isWmsStyleMode$,
   ]).pipe(
-    map(([src, styles, styleIdx]) => (styles.length ? styles[styleIdx] : src)),
+    map(([src, styles, styleIdx, isWmsStyleMode]) =>
+      !isWmsStyleMode && styles.length ? styles[styleIdx] : src
+    ),
     shareReplay(1)
   )
 
-  currentLayers$ = combineLatest([this.selectedLink$, this.excludeWfs$]).pipe(
-    switchMap(([link, excludeWfs]) => {
+  currentLayers$ = combineLatest([
+    this.selectedLink$,
+    this.excludeWfs$,
+    this.selectedWmsStyleName$,
+  ]).pipe(
+    switchMap(([link, excludeWfs, wmsStyleName]) => {
       if (!link) {
         return of([])
       }
@@ -315,6 +366,11 @@ export class MapViewComponent implements AfterViewInit {
         return of([])
       }
       return this.getLayerFromLink(link).pipe(
+        map((layer) =>
+          wmsStyleName && layer.type === 'wms'
+            ? { ...layer, style: wmsStyleName }
+            : layer
+        ),
         map((layer) => [layer]),
         catchError((e) => {
           this.handleError(e)
@@ -394,7 +450,7 @@ export class MapViewComponent implements AfterViewInit {
         url: link.url.toString(),
         type: 'wms',
         name: link.name,
-      })
+      } as MapContextLayerWms)
     } else if (
       link.type === 'service' &&
       link.accessServiceProtocol === 'tms'

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

@@ -164,7 +164,7 @@ export class MdViewFacade {
               link.accessServiceProtocol === 'ogcFeatures'
             ) {
               return from(
-                this.dataService.getItemsFromOgcApi(link.url.href)
+                this.dataService.getItemsFromOgcApi(link.url.href, 1)
               ).pipe(
                 map((collectionRecords: OgcApiRecord[]) => {
                   return collectionRecords &&

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

@@ -1,6 +1,5 @@
-import { ModuleWithProviders, NgModule, inject } from '@angular/core'
+import { inject, ModuleWithProviders, NgModule } from '@angular/core'
 import { RouteReuseStrategy } from '@angular/router'
-import { EffectsModule } from '@ngrx/effects'
 import {
   FullRouterStateSerializer,
   routerReducer,
@@ -11,8 +10,9 @@ import { ROUTER_STATE_KEY } from './constants'
 import { RouterService } from './router.service'
 import { SearchRouteReuseStrategy } from './SearchRouteReuseStrategy'
 import { RouterFacade } from './state/router.facade'
-import { RouterEffects } from './state/router.effects'
 import { ROUTER_CONFIG, RouterConfigModel } from './router.config'
+import { RouterEffects } from './state/router.effects'
+import { EffectsModule } from '@ngrx/effects'
 
 @NgModule({
   imports: [

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

@@ -1,10 +1,10 @@
-import { Injectable, inject } from '@angular/core'
+import { inject, Injectable } from '@angular/core'
 import {
   ROUTER_ROUTE_DATASET,
   ROUTER_ROUTE_ORGANIZATION,
+  ROUTER_ROUTE_REUSE,
   ROUTER_ROUTE_SEARCH,
   ROUTER_ROUTE_SERVICE,
-  ROUTER_ROUTE_REUSE,
 } from '.'
 import { Router, Routes } from '@angular/router'
 import { ROUTER_CONFIG, RouterConfigModel } from './router.config'

package/src/libs/feature/router/src/lib/default/services/router-search.service.ts

@@ -1,4 +1,4 @@
-import { Injectable, inject } from '@angular/core'
+import { inject, Injectable } from '@angular/core'
 import {
   FieldsService,
   SearchFacade,
@@ -6,6 +6,7 @@ import {
 } from '../../../../../../../libs/feature/search/src'
 import {
   FieldFilters,
+  SortByEnum,
   SortByField,
 } from '../../../../../../../libs/common/domain/src/lib/model/search'
 import { ROUTE_PARAMS, SearchRouteParams } from '../constants'
@@ -20,6 +21,7 @@ export class RouterSearchService implements SearchServiceI {
   private fieldsService = inject(FieldsService)
 
   setSortAndFilters(filters: FieldFilters, sortBy: SortByField) {
+    console.log('RouterSearchService - setSortAndFilters', { filters, sortBy })
     this.fieldsService
       .readFieldValuesFromFilters(filters)
       .subscribe((values) => {
@@ -31,10 +33,12 @@ export class RouterSearchService implements SearchServiceI {
   }
 
   async setFilters(newFilters: FieldFilters) {
-    const sortBy = await firstValueFrom(this.searchFacade.sortBy$)
+    let sortBy = await firstValueFrom(this.searchFacade.sortBy$)
     const fieldSearchParams = await firstValueFrom(
       this.fieldsService.readFieldValuesFromFilters(newFilters)
     )
+    // apply relevancy sort if a full text criteria is given
+    sortBy = newFilters['any'] ? SortByEnum.RELEVANCY : sortBy
     this.facade.setSearch({
       ...fieldSearchParams,
       [ROUTE_PARAMS.SORT]: sortBy ? sortByToString(sortBy) : undefined,
@@ -42,13 +46,21 @@ export class RouterSearchService implements SearchServiceI {
   }
 
   async updateFilters(newFilters: FieldFilters) {
+    console.log('RouterSearchService - updateFilters', newFilters)
     const currentFilters = await firstValueFrom(
       this.searchFacade.searchFilters$
     )
     const updatedFilters = { ...currentFilters, ...newFilters }
-    const newParams = await firstValueFrom(
+    let newParams = await firstValueFrom(
       this.fieldsService.readFieldValuesFromFilters(updatedFilters)
     )
+    if (newFilters['any']) {
+      newParams = {
+        ...newParams,
+        [ROUTE_PARAMS.SORT]: sortByToString(SortByEnum.RELEVANCY),
+      }
+    }
+    console.log('RouterSearchService - updateFilters - newParams', newParams)
     this.facade.updateSearch(newParams as SearchRouteParams)
   }
 

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

@@ -1,5 +1,5 @@
 import { Location } from '@angular/common'
-import { Injectable, inject } from '@angular/core'
+import { inject, Injectable } from '@angular/core'
 import { ActivatedRouteSnapshot, Router } from '@angular/router'
 import { MdViewActions } from '../../../../../../../libs/feature/record/src'
 import {
@@ -9,15 +9,18 @@ import {
   SetFilters,
   SetSortBy,
 } from '../../../../../../../libs/feature/search/src'
-import { FieldFilters } from '../../../../../../../libs/common/domain/src/lib/model/search'
+import {
+  FieldFilters,
+  SortByEnum,
+} 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'
-import { map, mergeMap, tap } from 'rxjs/operators'
+import { map, mergeMap, take, tap } from 'rxjs/operators'
 import * as RouterActions from './router.actions'
 import { RouterFacade } from './router.facade'
 import { ROUTE_PARAMS } from '../constants'
-import { sortByFromString } from '../../../../../../../libs/util/shared/src'
+import { sortByFromString, sortByToString } from '../../../../../../../libs/util/shared/src'
 import { ROUTER_CONFIG, RouterConfigModel } from '../router.config'
 import { RouterService } from '../router.service'
 
@@ -55,6 +58,12 @@ export class RouterEffects {
       startWith([null, {}] as [Record<string, string>, FieldFilters]),
       pairwise(),
       map(([[oldParams, oldFilters], [newParams, newFilters]]) => {
+        console.log('RouterEffects - syncSearchState', {
+          oldParams,
+          newParams,
+          oldFilters,
+          newFilters,
+        })
         let sortBy =
           ROUTE_PARAMS.SORT in newParams
             ? sortByFromString(newParams[ROUTE_PARAMS.SORT])
@@ -103,6 +112,33 @@ export class RouterEffects {
     )
   )
 
+  /**
+   * This effect is needed because on the page load, the search params from the URL are
+   * directly applied to the underlying search facade; this means that it doesn't go
+   * through the RouterSearchService which makes sure that a relevancy sort is applied
+   * whenever there's a full text search criteria set.
+   */
+  applyInitialRelevancySort$ = createEffect(
+    () =>
+      this.facade.searchParams$.pipe(
+        take(1),
+        tap((filters) => {
+          const relevancySort = sortByToString(SortByEnum.RELEVANCY)
+          if (
+            filters['q'] &&
+            (!Array.isArray(filters['q']) || filters['q'].length > 0) &&
+            !filters[ROUTE_PARAMS.SORT]
+          ) {
+            this.facade.updateSearch({
+              ...filters,
+              [ROUTE_PARAMS.SORT]: relevancySort,
+            })
+          }
+        })
+      ),
+    { dispatch: false }
+  )
+
   /**
    * This effect will load the metadata when a navigation to
    * a metadata record happens

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

@@ -70,6 +70,7 @@ export class RouterFacade {
   }
 
   updateSearch(query?: SearchRouteParams) {
+    console.log('RouterFacade - updateSearch', query)
     this.go({
       path: this.routerService.getSearchRoute(),
       ...(query && { query: flattenQueryParams(query) }),
@@ -78,6 +79,7 @@ export class RouterFacade {
   }
 
   setSearch(query?: SearchRouteParams) {
+    console.log('RouterFacade - setSearch', query)
     this.go({
       path: this.routerService.getSearchRoute(),
       ...(query && { query: flattenQueryParams(query) }),

package/src/libs/feature/search/src/lib/fuzzy-search/fuzzy-search.component.ts

@@ -79,6 +79,7 @@ export class FuzzySearchComponent implements OnInit {
     if (this.inputSubmitted.observers.length > 0) {
       this.inputSubmitted.emit(any)
     } else {
+      console.log('FuzzySearchComponent - handleInputSubmission', any)
       this.searchService.updateFilters({ any })
     }
   }

package/src/libs/feature/search/src/lib/state/reducer.ts

@@ -111,7 +111,10 @@ export function reducerSearch(
         },
       }
     }
+    // From router.effects
+    // From home - fuzzy-search - search.service
     case fromActions.SET_FILTERS: {
+      console.log('reducerSearch - SET_FILTERS', action.payload)
       return {
         ...state,
         params: {
@@ -132,6 +135,7 @@ export function reducerSearch(
         },
       }
     }
+    // From results WC
     case fromActions.SET_SEARCH: {
       return {
         ...state,

package/src/libs/feature/search/src/lib/utils/service/search.service.ts

@@ -19,11 +19,13 @@ export class SearchService implements SearchServiceI {
   private facade = inject(SearchFacade)
 
   setSortAndFilters(filters: FieldFilters, sort: SortByField) {
+    console.log('SearchService - setSortAndFilters', { filters, sort })
     this.setFilters(filters)
     this.setSortBy(sort)
   }
 
   updateFilters(params: FieldFilters) {
+    console.log('SearchService - updateFilters', params)
     this.facade.searchFilters$
       .pipe(
         first(),

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

@@ -64,7 +64,7 @@
     <div class="flex flex-row gap-2.5 items-center pt-1">
       @if (link.accessServiceProtocol !== 'GPFDL') {
         <span
-          class="bg-primary-opacity-50 uppercase inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded text-primary-lightest group-hover:bg-primary transition-colors"
+          class="bg-primary/50 uppercase inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded text-primary-lightest group-hover:bg-primary transition-colors"
           [ngClass]="{
             '!bg-primary': currentlyActive,
           }"
@@ -76,7 +76,7 @@
       }
       @if (link.accessServiceProtocol === 'GPFDL') {
         <span
-          class="bg-primary-opacity-50 uppercase inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded text-primary-lightest group-hover:bg-primary transition-colors"
+          class="bg-primary/50 uppercase inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded text-primary-lightest group-hover:bg-primary transition-colors"
           [ngClass]="{
             '!bg-primary': currentlyActive,
           }"

package/src/libs/ui/elements/src/lib/application-banner/application-banner.component.ts

@@ -45,13 +45,12 @@ export class ApplicationBannerComponent {
         this.icon = 'matWarning'
         break
       case 'light':
-        this.msgClass =
-          'bg-primary-opacity-10 border-primary-lightest text-black'
+        this.msgClass = 'bg-primary/10 border-primary-lightest text-black'
         this.icon = 'matInfoOutline'
         break
       case 'secondary':
       default:
-        this.msgClass = 'bg-primary-opacity-50 border-primary-darker text-black'
+        this.msgClass = 'bg-primary/50 border-primary-darker text-black'
         this.icon = 'matWarningAmberOutline'
         break
     }

package/src/libs/ui/elements/src/lib/metadata-contact/metadata-contact.component.html

@@ -85,7 +85,7 @@
               class="!w-5 !h-5 !text-[20px] opacity-75 shrink-0"
               name="matPersonOutline"
             ></ng-icon>
-            <div class="flex flex-col ml-2">
+            <div class="flex flex-col ml-2" data-cy="contact-full-name">
               <p class="text-sm">
                 {{ contacts[0]?.firstName || '' }}
                 {{ contacts[0]?.lastName || '' }}

package/src/libs/ui/elements/src/lib/metadata-contact/metadata-contact.component.ts

@@ -52,9 +52,9 @@ export class MetadataContactComponent {
 
   get contacts() {
     return (
-      (this.metadata.kind === 'dataset'
-        ? this.metadata.contactsForResource
-        : this.metadata.contacts) || []
+      (this.metadata.kind === 'service'
+        ? this.metadata.contacts
+        : this.metadata.contactsForResource) || []
     )
   }
 

package/src/libs/ui/elements/src/lib/record-api-form/record-api-form.component.html

@@ -6,7 +6,7 @@
       </div>
       <button
         (click)="resetUrl()"
-        class="bg-primary-opacity-50 inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded capitalize text-primary-lightest hover:bg-primary transition-colors"
+        class="bg-primary/50 inline-flex items-center justify-center px-2 py-1 text-13 font-medium leading-none text-white rounded capitalize text-primary-lightest hover:bg-primary transition-colors"
       >
         <p class="text-[13px] uppercase" translate>
           record.metadata.api.form.reset

package/src/libs/ui/elements/src/lib/service-capabilities/service-capabilities.component.html

@@ -1,6 +1,6 @@
 @if (apiLinks.length > 0) {
   <div style="height: 652px" id="preview">
-    <div class="bg-primary-opacity-10 overflow-visible" style="height: 420px">
+    <div class="bg-primary/10 overflow-visible" style="height: 420px">
       <div class="container-lg px-4 lg:mx-auto">
         <div>
           <div class="gn-ui-section-title mb-6" translate>

package/src/libs/ui/map/src/lib/map-utils.ts

@@ -50,7 +50,7 @@ export function dragPanCondition(
 
 export function mouseWheelZoomCondition(
   this: MouseWheelZoom,
-  event: MapBrowserEvent<UIEvent>
+  event: MapBrowserEvent<WheelEvent>
 ) {
   if (!platformModifierKeyOnly(event) && event.type === 'wheel') {
     this.getMap().dispatchEvent('mapmuted')

package/src/libs/util/app-config/src/lib/app-config.ts

@@ -70,8 +70,11 @@ export function getCustomTranslations(langCode: string): CustomTranslations {
 
 let appConfigLoaded = false
 
-export function loadAppConfig() {
-  return fetch('assets/configuration/default.toml')
+export function loadAppConfig(configUrl = 'assets/configuration/default.toml') {
+  console.log(
+    `[geonetwork-ui] Loading application configuration from ${configUrl}`
+  )
+  return fetch(configUrl)
     .then((resp) => {
       if (!resp.ok) throw new Error('Configuration file could not be loaded')
       return resp.text()
@@ -229,6 +232,7 @@ export function loadAppConfig() {
           'record_kind_quick_filter',
           'filter_geometry_data',
           'filter_geometry_url',
+          'do_not_use_default_search_preset',
           'search_preset',
           'advanced_filters',
           'limit',
@@ -252,6 +256,8 @@ export function loadAppConfig() {
                 parsedSearchSection.record_kind_quick_filter,
               FILTER_GEOMETRY_DATA: parsedSearchSection.filter_geometry_data,
               FILTER_GEOMETRY_URL: parsedSearchSection.filter_geometry_url,
+              DO_NOT_USE_DEFAULT_SEARCH_PRESET:
+                !!parsedSearchSection.do_not_use_default_search_preset,
               SEARCH_PRESET: parsedSearchParams.map((param) => ({
                 sort: param.sort,
                 name: param.name,

package/src/libs/util/app-config/src/lib/fixtures.ts

@@ -40,6 +40,7 @@ fonts_stylesheet_url = "https://fonts.googleapis.com/css2?family=Open+Sans"
 [search]
 record_kind_quick_filter = false
 filter_geometry_url = 'https://my.domain.org/geom.json'
+do_not_use_default_search_preset = false
 advanced_filters = ['publicationYear', 'documentStandard', 'inspireKeyword', 'topic', 'license']
 
 [[search_preset]]

package/src/libs/util/app-config/src/lib/model.ts

@@ -58,6 +58,7 @@ export interface SearchConfig {
   RECORD_KIND_QUICK_FILTER?: boolean
   FILTER_GEOMETRY_URL?: string
   FILTER_GEOMETRY_DATA?: string
+  DO_NOT_USE_DEFAULT_SEARCH_PRESET?: boolean
   SEARCH_PRESET?: SearchPreset[]
   ADVANCED_FILTERS?: []
   LIMIT?: number

package/src/libs/util/shared/src/lib/gn-ui-version.ts

@@ -2,7 +2,8 @@ import packageJson from '../../../../../package.json'
 
 export const GEONETWORK_UI_VERSION = packageJson.version
 
-export const GEONETWORK_UI_TAG_NAME =
-  GEONETWORK_UI_VERSION.split('-')[1] === 'dev'
-    ? 'main'
-    : `v${packageJson.version}`
+export const GEONETWORK_UI_TAG_NAME = GEONETWORK_UI_VERSION.split(
+  '-'
+)[1]?.startsWith('dev')
+  ? 'main'
+  : `v${packageJson.version}`

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

@@ -10,26 +10,6 @@ export class ThemeService {
     return document.documentElement.style.getPropertyValue(`--color-${name}`)
   }
 
-  static generateBgOpacityClasses(
-    colorName,
-    colorValue,
-    opacities = [0, 10, 25, 50, 75]
-  ) {
-    const color = chroma(colorValue)
-    const styleElement = document.createElement('style')
-    styleElement.innerHTML = opacities.reduce((cssRules, opacity) => {
-      cssRules += `.bg-${colorName}-opacity-${opacity}{background-color:${color
-        .alpha(opacity / 100)
-        .css()};}`
-
-      cssRules += `.hover-bg-${colorName}-opacity-${opacity}:hover {background-color:${color
-        .alpha(opacity / 100)
-        .css()};}`
-      return cssRules
-    }, '')
-    document.getElementsByTagName('head')[0].appendChild(styleElement)
-  }
-
   static applyCssVariables(
     primaryColor: string,
     secondaryColor: string,
@@ -39,13 +19,19 @@ export class ThemeService {
     titleFont?: string,
     fontsStylesheetUrl?: string
   ) {
-    const applyColor = (name: string, color) => {
+    const applyColor = (name: string, color, includeRawValues?: boolean) => {
       document.documentElement.style.setProperty(`--color-${name}`, color.css())
+      if (includeRawValues) {
+        document.documentElement.style.setProperty(
+          `--color-raw-${name}`,
+          color.css().replace(/^rgba?\((.*)\)/, '$1')
+        )
+      }
     }
 
     const black = chroma('black')
     const white = chroma('white')
-    applyColor('primary', chroma(primaryColor))
+    applyColor('primary', chroma(primaryColor), true)
     applyColor(
       'primary-lighter',
       chroma.scale([primaryColor, white]).mode('lab')(0.3)
@@ -70,7 +56,7 @@ export class ThemeService {
       'primary-black',
       chroma.scale([primaryColor, black]).mode('lab')(0.85)
     )
-    applyColor('secondary', chroma(secondaryColor))
+    applyColor('secondary', chroma(secondaryColor), true)
     applyColor(
       'secondary-lighter',
       chroma.scale([secondaryColor, white]).mode('lab')(0.3)