geonetwork-ui 2.6.0-dev.b1563a5e0 → 2.6.0-dev.bb0bdaec6

package/src/libs/feature/editor/src/lib/components/wizard/wizard.component.html

@@ -1,22 +0,0 @@
-<div class="pl-5 pt-24 flex flex-1 flex-col justify-between" #wizardFields>
-  <div class="flex-1 flex" *ngFor="let config of configuration; let i = index">
-    <gn-ui-wizard-field [wizardFieldConfig]="config"></gn-ui-wizard-field>
-  </div>
-</div>
-<div class="flex pt-24 pl-8">
-  <gn-ui-button
-    (buttonClick)="handlePreviousBtnClick()"
-    type="primary"
-    class="pr-8"
-    extraClass="rounded-full px-20"
-  >
-    <span class="uppercase text-white font-bold" translate>previous</span>
-  </gn-ui-button>
-  <gn-ui-button
-    (buttonClick)="handleNextBtnClick()"
-    type="primary"
-    extraClass="rounded-full px-20"
-  >
-    <span class="uppercase text-white font-bold" translate>next</span>
-  </gn-ui-button>
-</div>

package/src/libs/feature/editor/src/lib/components/wizard/wizard.component.ts

@@ -1,93 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  ElementRef,
-  EventEmitter,
-  Input,
-  OnInit,
-  Output,
-  ViewChild,
-} from '@angular/core'
-import { TranslateService } from '@ngx-translate/core'
-import { take } from 'rxjs/operators'
-import { WizardFieldModel } from '../../models/wizard-field.model'
-import { WizardService } from '../../services/wizard.service'
-
-@Component({
-  selector: 'gn-ui-wizard',
-  templateUrl: './wizard.component.html',
-  styleUrls: ['./wizard.component.css'],
-})
-export class WizardComponent implements OnInit, AfterViewInit {
-  @Input() id: string
-  @Input() initialConfig: {
-    configuration: WizardFieldModel[][]
-    storageKey: string
-  }
-  @Input() requiredMsgKey: string
-
-  @Output() stepChanges = new EventEmitter<number>()
-  @Output() stepsNumber = new EventEmitter<number>()
-
-  @ViewChild('wizardFields') wizardFieldsEl: ElementRef<HTMLElement>
-
-  currentStep: number
-  configuration: WizardFieldModel[]
-
-  constructor(
-    private wizardService: WizardService,
-    private translate: TranslateService
-  ) {}
-
-  ngOnInit(): void {
-    this.wizardService.initialize(this.id, this.initialConfig)
-
-    this.initializeCurrentStep()
-    this.stepChanges.emit(this.wizardService.getCurrentStep())
-    this.stepsNumber.emit(this.wizardService.getConfigurationStepNumber())
-  }
-
-  ngAfterViewInit() {
-    this.setFocus()
-  }
-
-  handlePreviousBtnClick() {
-    this.onStepChange(this.currentStep - 1)
-
-    this.stepChanges.emit(this.currentStep)
-  }
-
-  handleNextBtnClick() {
-    if (
-      this.wizardFieldsEl?.nativeElement?.querySelectorAll('.invalid').length >
-      0
-    ) {
-      this.translate.get(this.requiredMsgKey).pipe(take(1)).subscribe(alert)
-      return
-    }
-    this.onStepChange(this.currentStep + 1)
-
-    this.stepChanges.emit(this.currentStep)
-  }
-
-  onStepChange(step: number) {
-    this.wizardService.onWizardStepChanged(step)
-
-    this.setFocus()
-    this.initializeCurrentStep()
-  }
-
-  private initializeCurrentStep() {
-    this.currentStep = this.wizardService.getCurrentStep()
-    this.configuration = this.wizardService.getStepConfiguration()
-  }
-
-  private setFocus() {
-    setTimeout(() => {
-      const inputEl = this.wizardFieldsEl.nativeElement.querySelectorAll(
-        'input, textarea, select'
-      )[0] as HTMLElement
-      inputEl.focus()
-    }, 0)
-  }
-}

package/src/libs/feature/editor/src/lib/components/wizard-field/wizard-field.component.css

@@ -1,31 +0,0 @@
-:host {
-  display: flex;
-  flex: 1;
-}
-
-gn-ui-text-input::ng-deep input,
-input[type='text'] {
-  height: 100%;
-  background: white;
-  color: black;
-  font-style: italic;
-
-  border-width: 2px;
-  border-color: var(--color-primary);
-}
-
-gn-ui-text-area::ng-deep textarea {
-  border-width: 2px;
-  border-color: var(--color-primary);
-}
-
-gn-ui-dropdown-selector::ng-deep div {
-  height: 100%;
-}
-
-gn-ui-dropdown-selector::ng-deep select {
-  height: 100%;
-  border-width: 2px;
-  border-color: var(--color-primary);
-  background-color: white;
-}

package/src/libs/feature/editor/src/lib/components/wizard-field/wizard-field.component.html

@@ -1,62 +0,0 @@
-<div class="flex flex-1">
-  <span [class]="wizardFieldConfig.icon + ' pr-10'"></span>
-  <div class="flex flex-col flex-1">
-    <div translate class="text-xl font-bold pb-1">
-      {{ wizardFieldConfig.label }}
-    </div>
-    <div
-      class="w-1/2 h-12"
-      *ngIf="wizardFieldType.TEXT === wizardFieldConfig.type"
-    >
-      <gn-ui-text-input
-        #searchText
-        [id]="wizardFieldConfig.id"
-        [value]="wizardFieldData"
-        [required]="wizardFieldConfig.required || false"
-        placeholder=""
-      ></gn-ui-text-input>
-    </div>
-    <div
-      class="h-32 w-11/12"
-      *ngIf="wizardFieldType.TEXT_AREA === wizardFieldConfig.type"
-    >
-      <gn-ui-text-area
-        #textArea
-        [id]="wizardFieldConfig.id"
-        [value]="wizardFieldData"
-        [required]="wizardFieldConfig.required || false"
-        placeholder=""
-      ></gn-ui-text-area>
-    </div>
-    <div
-      class="w-1/2 h-12"
-      *ngIf="wizardFieldType.DATA_PICKER === wizardFieldConfig.type"
-    >
-      <input
-        [id]="wizardFieldConfig.id"
-        type="text"
-        (click)="datepicker.open()"
-        class="rounded p-2 text-gray-700 w-full leading-tight focus:outline-none focus:border-primary"
-        [value]="wizardFieldData"
-        [matDatepicker]="datepicker"
-        (dateChange)="onDateChange($event)"
-      />
-      <mat-datepicker #datepicker></mat-datepicker>
-    </div>
-    <div
-      class="w-1/2 h-12"
-      *ngIf="wizardFieldType.DROPDOWN === wizardFieldConfig.type"
-    >
-      <gn-ui-dropdown-selector
-        #dropdown
-        [id]="wizardFieldConfig.id"
-        [title]="''"
-        [extraBtnClass]="'secondary min-w-full'"
-        [showTitle]="false"
-        [choices]="dropdownChoices"
-        [selected]="wizardFieldData"
-        ariaName="search-sort-by"
-      ></gn-ui-dropdown-selector>
-    </div>
-  </div>
-</div>

package/src/libs/feature/editor/src/lib/components/wizard-field/wizard-field.component.ts

@@ -1,206 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  Input,
-  OnDestroy,
-  ViewChild,
-} from '@angular/core'
-import {
-  MAT_MOMENT_DATE_ADAPTER_OPTIONS,
-  MomentDateAdapter,
-} from '@angular/material-moment-adapter'
-import {
-  DateAdapter,
-  MAT_DATE_FORMATS,
-  MAT_DATE_LOCALE,
-} from '@angular/material/core'
-import { MatDatepickerInputEvent } from '@angular/material/datepicker'
-import { marker } from '@biesbjerg/ngx-translate-extract-marker'
-import { getLangFromBrowser } from '../../../../../../../libs/util/i18n/src'
-import { WizardFieldModel } from '../../models/wizard-field.model'
-import { WizardFieldType } from '../../models/wizard-field.type'
-import { WizardService } from '../../services/wizard.service'
-import {
-  DropdownSelectorComponent,
-  TextAreaComponent,
-  TextInputComponent,
-} from '../../../../../../../libs/ui/inputs/src'
-import { Subscription } from 'rxjs'
-
-marker('datafeeder.month.january')
-marker('datafeeder.month.february')
-marker('datafeeder.month.march')
-marker('datafeeder.month.april')
-marker('datafeeder.month.may')
-marker('datafeeder.month.june')
-marker('datafeeder.month.july')
-marker('datafeeder.month.august')
-marker('datafeeder.month.september')
-marker('datafeeder.month.october')
-marker('datafeeder.month.november')
-marker('datafeeder.month.december')
-
-export const MY_FORMATS = {
-  parse: {
-    dateInput: 'LL',
-  },
-  display: {
-    dateInput: 'LL',
-    monthYearLabel: 'MMM YYYY',
-    dateA11yLabel: 'LL',
-    monthYearA11yLabel: 'MMMM YYYY',
-  },
-}
-
-@Component({
-  selector: 'gn-ui-wizard-field',
-  templateUrl: './wizard-field.component.html',
-  styleUrls: ['./wizard-field.component.css'],
-  providers: [
-    { provide: MAT_DATE_LOCALE, useValue: getLangFromBrowser() },
-    {
-      provide: DateAdapter,
-      useClass: MomentDateAdapter,
-      deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
-    },
-    { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
-  ],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class WizardFieldComponent implements AfterViewInit, OnDestroy {
-  @Input() wizardFieldConfig: WizardFieldModel
-
-  @ViewChild('searchText') searchText: TextInputComponent
-  @ViewChild('textArea') textArea: TextAreaComponent
-  @ViewChild('dropdown') dropdown: DropdownSelectorComponent
-
-  subs = new Subscription()
-
-  get wizardFieldType(): typeof WizardFieldType {
-    return WizardFieldType
-  }
-
-  get dropdownChoices(): any {
-    return this.wizardFieldConfig.options
-  }
-
-  get wizardFieldData() {
-    const data = this.wizardService.getWizardFieldData(
-      this.wizardFieldConfig.id
-    )
-    switch (this.wizardFieldConfig.type) {
-      case WizardFieldType.TEXT: {
-        return data || ''
-      }
-      case WizardFieldType.TEXT_AREA: {
-        return data || ''
-      }
-      case WizardFieldType.DATA_PICKER: {
-        return data ? new Date(Number(data)) : new Date()
-      }
-      case WizardFieldType.DROPDOWN: {
-        return data ? JSON.parse(data) : this.dropdownChoices[0]?.value
-      }
-    }
-  }
-
-  constructor(
-    private wizardService: WizardService,
-    private cdr: ChangeDetectorRef
-  ) {}
-
-  ngAfterViewInit() {
-    this.initializeListeners()
-    this.cdr.detectChanges()
-  }
-
-  ngOnDestroy() {
-    this.subs.unsubscribe()
-  }
-
-  private initializeListeners() {
-    switch (this.wizardFieldConfig.type) {
-      case WizardFieldType.TEXT: {
-        this.initializeTextInputListener()
-        break
-      }
-      case WizardFieldType.TEXT_AREA: {
-        this.initializeTextAreaListener()
-        return
-      }
-      case WizardFieldType.DATA_PICKER: {
-        this.initializeDateInput()
-        return
-      }
-      case WizardFieldType.DROPDOWN: {
-        this.initializeDropdownListener()
-        return
-      }
-    }
-  }
-
-  private initializeTextInputListener() {
-    this.subs.add(
-      this.searchText.valueChange.subscribe((value) => {
-        this.wizardService.onWizardWizardFieldDataChanged(
-          this.wizardFieldConfig.id,
-          value
-        )
-      })
-    )
-  }
-
-  private initializeTextAreaListener() {
-    this.subs.add(
-      this.textArea.valueChange.subscribe((value) => {
-        this.wizardService.onWizardWizardFieldDataChanged(
-          this.wizardFieldConfig.id,
-          value
-        )
-      })
-    )
-  }
-
-  initializeDateInput() {
-    const time = this.wizardService.getWizardFieldData(
-      this.wizardFieldConfig.id
-    )
-    if (!time) {
-      this.wizardService.onWizardWizardFieldDataChanged(
-        this.wizardFieldConfig.id,
-        new Date().valueOf()
-      )
-    }
-  }
-
-  onDateChange(event: MatDatepickerInputEvent<Date>) {
-    this.wizardService.onWizardWizardFieldDataChanged(
-      this.wizardFieldConfig.id,
-      event.value.valueOf()
-    )
-  }
-
-  private initializeDropdownListener() {
-    if (
-      this.wizardService.getWizardFieldData(this.wizardFieldConfig.id) ===
-        undefined &&
-      !!this.dropdown.selected
-    ) {
-      this.wizardService.setWizardFieldData(
-        this.wizardFieldConfig.id,
-        this.dropdown.selected
-      )
-    }
-
-    this.subs.add(
-      this.dropdown.selectValue.subscribe((value) => {
-        this.wizardService.onWizardWizardFieldDataChanged(
-          this.wizardFieldConfig.id,
-          value
-        )
-      })
-    )
-  }
-}

package/src/libs/feature/editor/src/lib/components/wizard-summarize/wizard-summarize.component.css

@@ -1,3 +0,0 @@
-.icon-tag:before {
-  font-size: 18px;
-}

package/src/libs/feature/editor/src/lib/components/wizard-summarize/wizard-summarize.component.html

@@ -1,21 +0,0 @@
-<div>
-  <div class="text-2xl font-bold title">
-    {{ title | uppercase }}
-  </div>
-  <div class="text-lg font-bold pt-2 abstract">
-    {{ abstract }}
-  </div>
-  <div class="text-lg font-normal">
-    <span translate>datafeeder.wizardSummarize.createdAt</span>
-    &nbsp;<span class="date">{{ createdDate }}</span> -
-    <span translate>datafeeder.wizardSummarize.scale</span>
-    &nbsp;<span class="scale">{{ scale }}</span>
-  </div>
-  <div class="text-lg italic font-normal description">
-    {{ description }}
-  </div>
-  <div class="text-sm font-medium pt-4 tags">
-    <span class="icon-tag pr-2"></span>
-    {{ tags }}
-  </div>
-</div>

package/src/libs/feature/editor/src/lib/components/wizard-summarize/wizard-summarize.component.ts

@@ -1,58 +0,0 @@
-import { Component } from '@angular/core'
-import { WizardService } from '../../services/wizard.service'
-import { DateService } from '../../../../../../../libs/util/shared/src'
-
-@Component({
-  selector: 'gn-ui-wizard-summarize',
-  templateUrl: './wizard-summarize.component.html',
-  styleUrls: ['./wizard-summarize.component.css'],
-})
-export class WizardSummarizeComponent {
-  get title() {
-    return this.wizardService.getWizardFieldData('title') || ''
-  }
-
-  get abstract() {
-    return this.wizardService.getWizardFieldData('abstract') || ''
-  }
-
-  get tags(): string {
-    if (!this.wizardService.getWizardFieldData('tags')) {
-      return ''
-    }
-
-    return JSON.parse(this.wizardService.getWizardFieldData('tags'))
-      .map((t) => t.display)
-      .join(' - ')
-  }
-
-  get createdDate() {
-    const time = this.wizardService.getWizardFieldData('datepicker')
-
-    return this.dateService.formatDate(new Date(Number(time)), {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-    })
-  }
-
-  get scale() {
-    if (!this.wizardService.getWizardFieldData('dropdown')) {
-      return ''
-    }
-
-    const scaleValue = JSON.parse(
-      this.wizardService.getWizardFieldData('dropdown')
-    )
-    return `1:${scaleValue}`
-  }
-
-  get description() {
-    return this.wizardService.getWizardFieldData('description') || ''
-  }
-
-  constructor(
-    private wizardService: WizardService,
-    private dateService: DateService
-  ) {}
-}

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

@@ -1,10 +0,0 @@
-import { WizardFieldType } from './wizard-field.type'
-
-export interface WizardFieldModel {
-  id: string
-  label: string
-  icon: string
-  type: WizardFieldType
-  options?: any
-  required?: boolean
-}

package/src/libs/feature/editor/src/lib/models/wizard-field.type.ts

@@ -1,6 +0,0 @@
-export enum WizardFieldType {
-  TEXT,
-  TEXT_AREA,
-  DATA_PICKER,
-  DROPDOWN,
-}

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

@@ -1,105 +0,0 @@
-import { Injectable } from '@angular/core'
-import { TranslateService } from '@ngx-translate/core'
-import { WizardFieldModel } from '../models/wizard-field.model'
-
-@Injectable({
-  providedIn: 'root',
-})
-export class WizardService {
-  private wizardStep = 1
-  private wizardData: Map<string, any> = new Map()
-
-  private id: string
-  private storageKey: string
-  configuration: WizardFieldModel[][]
-  constructor(private translateService: TranslateService) {}
-
-  initialize(
-    id: string,
-    options: {
-      configuration: WizardFieldModel[][]
-      storageKey: string
-    }
-  ): void {
-    this.id = id
-    const { configuration, storageKey } = options
-    this.configuration = configuration
-    this.storageKey = storageKey
-    this.wizardData.clear()
-
-    this.load()
-  }
-
-  getCurrentStep(): number {
-    return this.wizardStep
-  }
-
-  getStepConfiguration(): WizardFieldModel[] {
-    return this.configuration[this.wizardStep - 1]
-  }
-
-  getConfiguration(): WizardFieldModel[][] {
-    return this.configuration
-  }
-
-  getConfigurationStepNumber(): number {
-    return this.configuration.length
-  }
-
-  getWizardFieldData(fieldId: string) {
-    return this.wizardData.get(fieldId)
-  }
-
-  onWizardWizardFieldDataChanged(fieldId: string, data: any): void {
-    this.setWizardFieldData(fieldId, data)
-  }
-
-  setWizardFieldData(fieldId: string, data: any): void {
-    this.wizardData.set(fieldId, data)
-    this.save()
-  }
-
-  save(): void {
-    const values = [...this.wizardData].map(([key, value]) => ({
-      id: key,
-      value,
-    }))
-    const datafeederState = this.load(false)
-
-    datafeederState[this.id] = {
-      step: this.wizardStep,
-      values,
-    }
-
-    localStorage.setItem(this.storageKey, JSON.stringify(datafeederState))
-  }
-
-  onWizardStepChanged(step: number) {
-    if (step > 0 && step < this.getConfigurationStepNumber()) {
-      this.wizardStep = step
-      this.save()
-    }
-  }
-
-  reset() {
-    this.wizardStep = 1
-    localStorage.removeItem(this.storageKey)
-  }
-
-  private load(write = true) {
-    const lsItem = localStorage.getItem(this.storageKey)
-    const datafeederData = lsItem ? JSON.parse(lsItem) : {}
-    if (write) {
-      datafeederData[this.id]?.values?.forEach((i) => {
-        this.wizardData.set(i.id, i.value)
-      })
-      this.wizardStep = datafeederData[this.id]?.step || 1
-    }
-    return datafeederData
-  }
-
-  getDataObject() {
-    this.load()
-    return Object.fromEntries(this.wizardData)
-  }
-}

package/src/libs/ui/dataviz/src/lib/ui-dataviz.module.ts

@@ -1,27 +0,0 @@
-import { NgModule } from '@angular/core'
-import { CommonModule } from '@angular/common'
-import { FigureComponent } from './figure/figure.component'
-import { TranslateModule } from '@ngx-translate/core'
-import { NgIconsModule, provideNgIconsConfig } from '@ng-icons/core'
-import { matCorporateFare } from '@ng-icons/material-icons/baseline'
-import { tablerFolderOpen } from '@ng-icons/tabler-icons'
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TranslateModule.forChild(),
-    // FIXME: these imports are required by non-standalone components and should be removed once all components have been made standalone
-    NgIconsModule.withIcons({
-      matCorporateFare,
-      tablerFolderOpen,
-    }),
-  ],
-  providers: [
-    provideNgIconsConfig({
-      size: '1.5em',
-    }),
-  ],
-  declarations: [FigureComponent],
-  exports: [FigureComponent],
-})
-export class UiDatavizModule {}

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

@@ -1,9 +0,0 @@
-<gn-ui-internal-link-card
-  [linkHref]="linkHref"
-  [linkTarget]="'_blank'"
-  [record]="record"
-  [favoriteTemplate]="favoriteTemplate"
-  [metadataQualityDisplay]="metadataQualityDisplay"
-  [size]="size"
->
-</gn-ui-internal-link-card>