geonetwork-ui 2.4.0-dev.fdf8f64b → 2.4.1-dev.c1a684900

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

@@ -18,6 +18,40 @@ import { Keyword } from '../../../../../libs/common/domain/src/lib/model/record'
  ************************************************************
  */
 
+export const RECORD_UNIQUE_IDENTIFIER_FIELD: EditorField = {
+  model: 'uniqueIdentifier',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.uniqueIdentifier'),
+  },
+  hidden: true,
+}
+
+export const CONSTRAINTS_SHORTCUTS: EditorField = {
+  componentName: 'form-field-constraints-shortcuts',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.constraintsShortcuts'),
+  },
+}
+
+export const LEGAL_CONSTRAINTS_FIELD: EditorField = {
+  model: 'legalConstraints',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.legalConstraints'),
+  },
+}
+export const SECURITY_CONSTRAINTS_FIELD: EditorField = {
+  model: 'securityConstraints',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.securityConstraints'),
+  },
+}
+export const OTHER_CONSTRAINTS_FIELD: EditorField = {
+  model: 'otherConstraints',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.otherConstraints'),
+  },
+}
+
 export const RECORD_LICENSE_FIELD: EditorField = {
   model: 'licenses',
   formFieldConfig: {
@@ -32,11 +66,18 @@ export const RECORD_KEYWORDS_FIELD: EditorField = {
   },
 }
 
-export const RECORD_UNIQUE_IDENTIFIER_FIELD: EditorField = {
-  model: 'uniqueIdentifier',
+export const RECORD_RESOURCE_CREATED_FIELD: EditorField = {
+  model: 'resourceCreated',
   formFieldConfig: {
-    labelKey: marker('editor.record.form.field.uniqueIdentifier'),
-    locked: true,
+    labelKey: marker('editor.record.form.field.resourceCreated'),
+  },
+  gridColumnSpan: 1,
+}
+
+export const RESOURCE_IDENTIFIER_FIELD: EditorField = {
+  model: 'resourceIdentifier',
+  formFieldConfig: {
+    labelKey: marker('editor.record.form.field.resourceIdentifier'),
   },
 }
 
@@ -52,10 +93,10 @@ export const RECORD_UPDATED_FIELD: EditorField = {
   model: 'recordUpdated',
   formFieldConfig: {
     labelKey: marker('editor.record.form.field.recordUpdated'),
-    locked: true,
   },
   onSaveProcess: '${dateNow()}',
   gridColumnSpan: 1,
+  hidden: true,
 }
 
 export const RECORD_UPDATE_FREQUENCY_FIELD: EditorField = {
@@ -107,6 +148,12 @@ export const RECORD_GRAPHICAL_OVERVIEW_FIELD: EditorField = {
   },
 }
 
+export const RECORD_SPATIAL_TOGGLE_FIELD: EditorField = {
+  componentName: 'form-field-spatial-toggle',
+  formFieldConfig: {},
+  hidden: true,
+}
+
 export const RECORD_SPATIAL_EXTENTS_FIELD: EditorField = {
   model: 'spatialExtents',
   formFieldConfig: {
@@ -150,6 +197,8 @@ export const ABOUT_SECTION: EditorSection = {
   hidden: false,
   fields: [
     RECORD_UNIQUE_IDENTIFIER_FIELD,
+    RESOURCE_IDENTIFIER_FIELD,
+    RECORD_RESOURCE_CREATED_FIELD,
     RECORD_RESOURCE_UPDATED_FIELD,
     RECORD_UPDATED_FIELD,
     RECORD_UPDATE_FREQUENCY_FIELD,
@@ -160,7 +209,7 @@ export const ABOUT_SECTION: EditorSection = {
 export const GEOGRAPHICAL_COVERAGE_SECTION: EditorSection = {
   labelKey: marker('editor.record.form.section.geographicalCoverage.label'),
   hidden: false,
-  fields: [RECORD_SPATIAL_EXTENTS_FIELD],
+  fields: [RECORD_SPATIAL_TOGGLE_FIELD, RECORD_SPATIAL_EXTENTS_FIELD],
 }
 
 export const ASSOCIATED_RESOURCES_SECTION: EditorSection = {
@@ -191,7 +240,13 @@ export const CLASSIFICATION_SECTION: EditorSection = {
 export const USE_AND_ACCESS_CONDITIONS_SECTION: EditorSection = {
   labelKey: marker('editor.record.form.section.useAndAccessConditions.label'),
   hidden: false,
-  fields: [RECORD_LICENSE_FIELD],
+  fields: [
+    RECORD_LICENSE_FIELD,
+    CONSTRAINTS_SHORTCUTS,
+    LEGAL_CONSTRAINTS_FIELD,
+    SECURITY_CONSTRAINTS_FIELD,
+    OTHER_CONSTRAINTS_FIELD,
+  ],
 }
 
 export const DATA_MANAGERS_SECTION: EditorSection = {
@@ -201,10 +256,10 @@ export const DATA_MANAGERS_SECTION: EditorSection = {
   fields: [CONTACTS_FOR_RESOURCE_FIELD],
 }
 
-export const DATA_POINT_OF_CONTACT_SECTION: EditorSection = {
-  labelKey: marker('editor.record.form.section.dataPointOfContact.label'),
+export const METADATA_POINT_OF_CONTACT_SECTION: EditorSection = {
+  labelKey: marker('editor.record.form.section.metadataPointOfContact.label'),
   descriptionKey: marker(
-    'editor.record.form.section.dataPointOfContact.description'
+    'editor.record.form.section.metadataPointOfContact.description'
   ),
   hidden: false,
   fields: [CONTACTS],
@@ -230,7 +285,7 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
         CLASSIFICATION_SECTION,
         USE_AND_ACCESS_CONDITIONS_SECTION,
         DATA_MANAGERS_SECTION,
-        DATA_POINT_OF_CONTACT_SECTION,
+        METADATA_POINT_OF_CONTACT_SECTION,
       ],
     },
   ],
@@ -240,14 +295,30 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
  ***************           LICENSES            **************
  ************************************************************
  */
-export const OPEN_DATA_LICENSES: string[] = [
+export const AVAILABLE_LICENSES: string[] = [
+  'cc-by',
+  'cc-by-sa',
+  'cc-zero',
   'etalab',
   'etalab-v2',
   'odbl',
   'odc-by',
   'pddl',
+  'unknown',
 ]
 
+export const OPEN_DATA_LICENSE = 'etalab'
+
+marker('editor.record.form.license.cc-by')
+marker('editor.record.form.license.cc-by-sa')
+marker('editor.record.form.license.cc-zero')
+marker('editor.record.form.license.etalab')
+marker('editor.record.form.license.etalab-v2')
+marker('editor.record.form.license.odbl')
+marker('editor.record.form.license.odc-by')
+marker('editor.record.form.license.pddl')
+marker('editor.record.form.license.unknown')
+
 export const MAX_UPLOAD_SIZE_MB = 10
 /************************************************************
  ***************        SPATIAL SCOPE            ************

package/src/libs/feature/editor/src/lib/models/editor-config.model.ts

@@ -11,7 +11,6 @@ export interface FormFieldConfig {
   hintKey?: string
   tooltipKey?: string
   required?: boolean
-  locked?: boolean
   invalid?: boolean
   invalidHintKey?: string
 }
@@ -24,14 +23,23 @@ export type FieldModelSpecifier =
   | OnlineLinkResourceSpecifier
   | DatasetDistributionsSpecifier
 
-export interface EditorField {
-  // configuration of the form field used as presentation
-  formFieldConfig: FormFieldConfig
+export type FormFieldComponentName =
+  | 'form-field-constraints-shortcuts'
+  | 'form-field-spatial-toggle'
 
+export interface EditorFieldIdentification {
   // name of the target field in the record; will not change the record directly if not defined
   model?: CatalogRecordKeys
   modelSpecifier?: FieldModelSpecifier
 
+  // if no model is given, a component can be shown instead
+  componentName?: FormFieldComponentName
+}
+
+export interface EditorField extends EditorFieldIdentification {
+  // configuration of the form field used as presentation
+  formFieldConfig: FormFieldConfig
+
   // grid column span; if unspecified, full width will be used
   gridColumnSpan?: number
 

package/src/libs/feature/editor/src/lib/services/editor.service.ts

@@ -59,6 +59,7 @@ export class EditorService {
     record: CatalogRecord,
     recordSource: string
   ): Observable<void> {
+    record.recordUpdated = new Date()
     return this.recordsRepository
       .saveRecordAsDraft(record, recordSource)
       .pipe(map(() => undefined))
@@ -70,4 +71,10 @@ export class EditorService {
     this.recordsRepository.clearRecordDraft(record.uniqueIdentifier)
     return this.recordsRepository.openRecordForEdition(record.uniqueIdentifier)
   }
+
+  hasRecordChangedSinceDraft(
+    localRecord: CatalogRecord
+  ): Observable<{ user: string; date: Date }> {
+    return this.recordsRepository.hasRecordChangedSinceDraft(localRecord)
+  }
 }

package/src/libs/feature/map/src/lib/add-layer-from-wms/add-layer-from-wms.component.html

@@ -22,7 +22,7 @@
     *ngFor="let layer of layers"
     [ngTemplateOutlet]="layerTreeItem"
     [ngTemplateOutletContext]="{
-      layer: layer
+      layer: layer,
     }"
   ></ng-container>
 </div>
@@ -47,7 +47,7 @@
       *ngFor="let child of layer.children"
       [ngTemplateOutlet]="layerTreeItem"
       [ngTemplateOutletContext]="{
-        layer: child
+        layer: child,
       }"
     >
     </ng-container>

package/src/libs/feature/map/src/lib/feature-map.module.ts

@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core'
 import { CommonModule } from '@angular/common'
 import { UiLayoutModule } from '../../../../../libs/ui/layout/src'
-import { MatIconModule } from '@angular/material/icon'
 import { MatTabsModule } from '@angular/material/tabs'
 import { TranslateModule } from '@ngx-translate/core'
 import { FeatureSearchModule } from '../../../../../libs/feature/search/src'
@@ -17,7 +16,6 @@ import { AddLayerFromOgcApiComponent } from './add-layer-from-ogc-api/add-layer-
   imports: [
     CommonModule,
     UiLayoutModule,
-    MatIconModule,
     MatTabsModule,
     TranslateModule,
     FeatureSearchModule,

package/src/libs/feature/map/src/lib/layers-panel/layers-panel.component.html

@@ -2,7 +2,7 @@
   class="bg-white rounded shadow shadow-lg relative h-full w-[400px] overflow-hidden"
 >
   <div class="p-3 border-b border-gray-300 flex items-center">
-    <mat-icon class="material-symbols-outlined mr-2">layers</mat-icon>
+    <ng-icon class="mr-2" name="matLayersOutline"></ng-icon>
     <span translate>map.layers.list</span>
   </div>
   <div class="flex flex-col px-4 divide-y divide-y-gray-50">
@@ -10,9 +10,7 @@
       *ngFor="let layer of layers$ | async; let index = index"
       class="flex flex-row py-3"
     >
-      <mat-icon class="material-symbols-outlined -ml-2 mr-2 shrink-0"
-        >chevron_right</mat-icon
-      >
+      <ng-icon class="-ml-2 mr-2 shrink-0" name="matChevronRight"></ng-icon>
       <span class="mr-2 grow">{{ layer.label }}</span>
       <a
         href
@@ -58,6 +56,6 @@
 </div>
 
 <ng-template #addLayerTitle>
-  <mat-icon class="material-symbols-outlined mr-4">add_circle</mat-icon>
+  <ng-icon class="mr-4" name="matAddCircleOutlineOutline"> </ng-icon>
   <span translate>map.add.layer</span>
 </ng-template>

package/src/libs/feature/map/src/lib/layers-panel/layers-panel.component.ts

@@ -2,8 +2,7 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'
 import { MapFacade } from '../+state/map.facade'
 import { firstValueFrom, map } from 'rxjs'
 import { MapContextLayer } from '@geospatial-sdk/core'
-import { MatIconModule } from '@angular/material/icon'
-import { UiLayoutModule } from '../../../../../../libs/ui/layout/src'
+import { ExpandablePanelButtonComponent } from '../../../../../../libs/ui/layout/src'
 import { MatTabsModule } from '@angular/material/tabs'
 import { AddLayerFromOgcApiComponent } from '../add-layer-from-ogc-api/add-layer-from-ogc-api.component'
 import { AddLayerFromWfsComponent } from '../add-layer-from-wfs/add-layer-from-wfs.component'
@@ -12,6 +11,16 @@ import { AddLayerFromCatalogComponent } from '../add-layer-from-catalog/add-laye
 import { AddLayerFromFileComponent } from '../add-layer-from-file/add-layer-from-file.component'
 import { TranslateModule } from '@ngx-translate/core'
 import { CommonModule } from '@angular/common'
+import {
+  NgIconComponent,
+  provideIcons,
+  provideNgIconsConfig,
+} from '@ng-icons/core'
+import {
+  matAddCircleOutlineOutline,
+  matLayersOutline,
+} from '@ng-icons/material-icons/outline'
+import { matChevronRight } from '@ng-icons/material-icons/baseline'
 
 @Component({
   selector: 'gn-ui-layers-panel',
@@ -20,8 +29,6 @@ import { CommonModule } from '@angular/common'
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    MatIconModule,
-    UiLayoutModule,
     MatTabsModule,
     AddLayerFromOgcApiComponent,
     AddLayerFromWfsComponent,
@@ -30,6 +37,18 @@ import { CommonModule } from '@angular/common'
     AddLayerFromFileComponent,
     TranslateModule,
     CommonModule,
+    NgIconComponent,
+    ExpandablePanelButtonComponent,
+  ],
+  providers: [
+    provideIcons({
+      matLayersOutline,
+      matAddCircleOutlineOutline,
+      matChevronRight,
+    }),
+    provideNgIconsConfig({
+      size: '1.5em',
+    }),
   ],
 })
 export class LayersPanelComponent {

package/src/libs/feature/notifications/src/lib/notifications.service.ts

@@ -10,7 +10,12 @@ type NotificationWithIdentity = NotificationContent & { id: number }
 export class NotificationsService {
   notifications$ = new BehaviorSubject<NotificationWithIdentity[]>([])
 
-  showNotification(content: NotificationContent, timeoutMs?: number) {
+  showNotification(
+    content: NotificationContent,
+    timeoutMs?: number,
+    error?: Error
+  ) {
+    error && console.error(error)
     const id = Math.floor(Math.random() * 1000000)
     this.notifications$.next([...this.notifications$.value, { ...content, id }])
     if (typeof timeoutMs === 'undefined') return

package/src/libs/feature/record/src/index.ts

@@ -7,3 +7,6 @@ export * from './lib/data-view-share/data-view-share.component'
 export * from './lib/data-view-web-component/data-view-web-component.component'
 export * from './lib/external-viewer-button/external-viewer-button.component'
 export * from './lib/map-view/map-view.component'
+export * from './lib/gpf-api-dl/gpf-api-dl.component'
+export * from './lib/record-meta/record-meta.component'
+export * from './lib/external-viewer-button/external-viewer-button.component'

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

@@ -2,7 +2,7 @@
   <gn-ui-dropdown-selector
     *ngIf="dropdownChoices$ | async as choices"
     [title]="'table.select.data' | translate"
-    class="truncate p-1 -mx-1"
+    class="truncate p-1 -mx-1 self-end mb-1"
     extraBtnClass="!text-primary font-sans font-medium"
     [choices]="choices"
     (selectValue)="selectLink($event)"

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

@@ -10,12 +10,27 @@ import { map, tap } from 'rxjs/operators'
 import { MdViewFacade } from '../state'
 import { DatavizConfigurationModel } from '../../../../../../libs/common/domain/src/lib/model/dataviz/dataviz-configuration.model'
 import { DatasetOnlineResource } from '../../../../../../libs/common/domain/src/lib/model/record'
+import { DropdownSelectorComponent } from '../../../../../../libs/ui/inputs/src'
+import {
+  ChartViewComponent,
+  TableViewComponent,
+} from '../../../../../../libs/feature/dataviz/src'
+import { CommonModule } from '@angular/common'
+import { TranslateModule } from '@ngx-translate/core'
 
 @Component({
   selector: 'gn-ui-data-view',
   templateUrl: './data-view.component.html',
   styleUrls: ['./data-view.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [
+    CommonModule,
+    DropdownSelectorComponent,
+    TableViewComponent,
+    TranslateModule,
+    ChartViewComponent,
+  ],
 })
 export class DataViewComponent {
   @Input() mode: 'table' | 'chart'

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

@@ -10,6 +10,9 @@ import { Configuration } from '../../../../../../libs/data-access/gn4/src'
 import { BehaviorSubject, combineLatest, map } from 'rxjs'
 import { MdViewFacade } from '../state'
 import { GN_UI_VERSION } from '../gn-ui-version.token'
+import { CopyTextButtonComponent } from '../../../../../../libs/ui/inputs/src'
+import { CommonModule } from '@angular/common'
+import { TranslateModule } from '@ngx-translate/core'
 
 export const WEB_COMPONENT_EMBEDDER_URL = new InjectionToken<string>(
   'webComponentEmbedderUrl'
@@ -20,6 +23,8 @@ export const WEB_COMPONENT_EMBEDDER_URL = new InjectionToken<string>(
   templateUrl: './data-view-permalink.component.html',
   styleUrls: ['./data-view-permalink.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule, CopyTextButtonComponent, TranslateModule],
 })
 export class DataViewPermalinkComponent {
   viewType$ = new BehaviorSubject<string>('map')

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

@@ -5,13 +5,28 @@ import {
   Input,
   Optional,
 } from '@angular/core'
-import { WEB_COMPONENT_EMBEDDER_URL } from '../data-view-permalink/data-view-permalink.component'
+import {
+  DataViewPermalinkComponent,
+  WEB_COMPONENT_EMBEDDER_URL,
+} from '../data-view-permalink/data-view-permalink.component'
+import { MatTabsModule } from '@angular/material/tabs'
+import { CommonModule } from '@angular/common'
+import { DataViewWebComponentComponent } from '../data-view-web-component/data-view-web-component.component'
+import { TranslateModule } from '@ngx-translate/core'
 
 @Component({
   selector: 'gn-ui-data-view-share',
   templateUrl: './data-view-share.component.html',
   styleUrls: ['./data-view-share.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    CommonModule,
+    MatTabsModule,
+    DataViewPermalinkComponent,
+    DataViewWebComponentComponent,
+    TranslateModule,
+  ],
+  standalone: true,
 })
 export class DataViewShareComponent {
   private _viewType: string

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

@@ -8,12 +8,17 @@ import { Configuration } from '../../../../../../libs/data-access/gn4/src'
 import { MdViewFacade } from '../state'
 import { BehaviorSubject, combineLatest, map } from 'rxjs'
 import { GN_UI_VERSION } from '../gn-ui-version.token'
+import { CopyTextButtonComponent } from '../../../../../../libs/ui/inputs/src'
+import { CommonModule } from '@angular/common'
+import { TranslateModule } from '@ngx-translate/core'
 
 @Component({
   selector: 'gn-ui-data-view-web-component',
   templateUrl: './data-view-web-component.component.html',
   styleUrls: ['./data-view-web-component.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule, CopyTextButtonComponent, TranslateModule],
 })
 export class DataViewWebComponentComponent {
   viewType$ = new BehaviorSubject<string>('map')

package/src/libs/feature/record/src/lib/external-viewer-button/external-viewer-button.component.html

@@ -5,5 +5,5 @@
   [title]="'record.externalViewer.open' | translate"
   extraClass="ms-2 !rounded-lg"
 >
-  <mat-icon class="material-symbols-outlined">open_in_new</mat-icon>
+  <ng-icon name="matOpenInNew"></ng-icon>
 </gn-ui-button>

package/src/libs/feature/record/src/lib/external-viewer-button/external-viewer-button.component.ts

@@ -8,8 +8,12 @@ import {
 } from '@angular/core'
 import { DatasetOnlineResource } from '../../../../../../libs/common/domain/src/lib/model/record'
 import { marker } from '@biesbjerg/ngx-translate-extract-marker'
-import { TranslateService } from '@ngx-translate/core'
+import { TranslateModule, TranslateService } from '@ngx-translate/core'
 import { getFileFormat } from '../../../../../../libs/util/shared/src'
+import { ButtonComponent } from '../../../../../../libs/ui/inputs/src'
+import { NgIcon, provideIcons } from '@ng-icons/core'
+import { CommonModule } from '@angular/common'
+import { matOpenInNew } from '@ng-icons/material-icons/baseline'
 
 marker('externalviewer.dataset.unnamed')
 
@@ -26,6 +30,9 @@ export const EXTERNAL_VIEWER_OPEN_NEW_TAB = new InjectionToken<boolean>(
   templateUrl: './external-viewer-button.component.html',
   styleUrls: ['./external-viewer-button.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule, ButtonComponent, NgIcon, TranslateModule],
+  viewProviders: [provideIcons({ matOpenInNew })],
 })
 export class ExternalViewerButtonComponent {
   @Input() link: DatasetOnlineResource

package/src/libs/feature/record/src/lib/feature-record.module.ts

@@ -1,47 +1,26 @@
 import { NgModule } from '@angular/core'
 import { CommonModule } from '@angular/common'
-import {
-  FeatureDetailComponent,
-  MapContainerComponent,
-} from '../../../../../libs/ui/map/src'
 import { StoreModule } from '@ngrx/store'
 import { EffectsModule } from '@ngrx/effects'
 import { UiLayoutModule } from '../../../../../libs/ui/layout/src'
-import {
-  FeatureMapModule,
-  MapStateContainerComponent,
-} from '../../../../../libs/feature/map/src'
+import { FeatureMapModule } from '../../../../../libs/feature/map/src'
 import { UiInputsModule } from '../../../../../libs/ui/inputs/src'
 import { UiElementsModule } from '../../../../../libs/ui/elements/src'
 import { MdViewFacade } from './state'
 import { MdViewEffects } from './state/mdview.effects'
-import { MapViewComponent } from './map-view/map-view.component'
-import { DataViewComponent } from './data-view/data-view.component'
 import {
   METADATA_VIEW_FEATURE_STATE_KEY,
   reducer,
 } from './state/mdview.reducer'
 import { MatTabsModule } from '@angular/material/tabs'
-import { MatIconModule } from '@angular/material/icon'
-import { PopupAlertComponent, UiWidgetsModule } from '../../../../../libs/ui/widgets/src'
+import { UiWidgetsModule } from '../../../../../libs/ui/widgets/src'
 import { TranslateModule } from '@ngx-translate/core'
-import { ExternalViewerButtonComponent } from './external-viewer-button/external-viewer-button.component'
 import { FeatureCatalogModule } from '../../../../../libs/feature/catalog/src'
 import { TableComponent } from '../../../../../libs/ui/dataviz/src'
-import { FeatureDatavizModule } from '../../../../../libs/feature/dataviz/src'
-import { DataViewPermalinkComponent } from './data-view-permalink/data-view-permalink.component'
-import { DataViewWebComponentComponent } from './data-view-web-component/data-view-web-component.component'
-import { DataViewShareComponent } from './data-view-share/data-view-share.component'
+import { NgIconsModule, provideNgIconsConfig } from '@ng-icons/core'
+import { DropdownSelectorComponent } from '../../../../../libs/ui/inputs/src'
 
 @NgModule({
-  declarations: [
-    MapViewComponent,
-    DataViewComponent,
-    ExternalViewerButtonComponent,
-    DataViewPermalinkComponent,
-    DataViewWebComponentComponent,
-    DataViewShareComponent,
-  ],
   imports: [
     CommonModule,
     StoreModule.forFeature(METADATA_VIEW_FEATURE_STATE_KEY, reducer),
@@ -52,23 +31,17 @@ import { DataViewShareComponent } from './data-view-share/data-view-share.compon
     UiInputsModule,
     UiElementsModule,
     MatTabsModule,
-    MatIconModule,
     UiWidgetsModule,
     TranslateModule,
     TableComponent,
-    FeatureDatavizModule,
-    PopupAlertComponent,
-    FeatureDetailComponent,
-    MapStateContainerComponent,
-    MapContainerComponent,
+    NgIconsModule,
+    DropdownSelectorComponent,
   ],
-  providers: [MdViewFacade],
-  exports: [
-    MapViewComponent,
-    DataViewComponent,
-    DataViewPermalinkComponent,
-    DataViewWebComponentComponent,
-    DataViewShareComponent,
+  providers: [
+    MdViewFacade,
+    provideNgIconsConfig({
+      size: '1.5em',
+    }),
   ],
 })
 export class FeatureRecordModule {}

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

@@ -0,0 +1,22 @@
+:host ::ng-deep input {
+  color: black;
+  opacity: 1;
+}
+
+:host ::ng-deep gn-ui-copy-text-button input[type='text'] {
+  color: black;
+  background-color: white;
+}
+
+:host ::ng-deep gn-ui-copy-text-button button,
+host ::ng-deep gn-ui-copy-text-button button:hover {
+  background-color: var(--color-secondary) !important;
+}
+
+:host ::ng-deep gn-ui-copy-text-button button ng-icon {
+  color: white !important;
+  opacity: 1 !important;
+}
+:host ::ng-deep gn-ui-copy-text-button button:hover ng-icon {
+  color: lightgrey !important;
+}