Merge pull request #957 from geonetwork/DH/open-data-switch

[Editor]: Add an open data switch

apps/metadata-editor-e2e/src/e2e/edit.cy.ts

@@ -134,6 +134,56 @@ describe('editor form', () => {
           .should('not.exist')
       })
     })
+    describe('Access and constraints', () => {
+      describe('Open data switch', () => {
+        describe('When the open data switch is checked', () => {
+          beforeEach(() => {
+            cy.visit('/edit/accroche_velos')
+            cy.get('md-editor-page-selector')
+              .find('gn-ui-button')
+              .last()
+              .click()
+          })
+          it('should not display the licence form field', () => {
+            cy.get('gn-ui-form-field-license').should('not.exist')
+          })
+          it('should display the license form field when toggled', () => {
+            cy.get('[data-cy="openDataToggle"]').click()
+            cy.get('gn-ui-form-field-license').should('be.visible')
+            cy.get('gn-ui-form-field-license')
+              .find('button')
+              .children('div')
+              .first()
+              .invoke('text')
+              .should('eq', ' Open Licence (Etalab) ')
+          })
+        })
+        describe('When the open data switch is unchecked', () => {
+          beforeEach(() => {
+            cy.visit(
+              '/edit/fr-120066022-jdd-f20f8125-877e-46dc-8cf8-2a8a372045eb'
+            )
+            cy.get('md-editor-page-selector')
+              .find('gn-ui-button')
+              .last()
+              .click()
+          })
+          it('should display the licence form field', () => {
+            cy.get('gn-ui-form-field-license').should('be.visible')
+            cy.get('gn-ui-form-field-license')
+              .find('button')
+              .children('div')
+              .first()
+              .invoke('text')
+              .should('eq', ' Creative Commons CC-BY ')
+          })
+          it('should hide the license form field when toggled', () => {
+            cy.get('[data-cy="openDataToggle"]').click()
+            cy.get('gn-ui-form-field-license').should('not.exist')
+          })
+        })
+      })
+    })
   })
 
   describe('date range in sortable list', () => {

libs/feature/editor/src/lib/components/record-form/form-field/form-field-open-data/form-field-open-data.component.html

@@ -0,0 +1,6 @@
+<gn-ui-check-toggle
+  [label]="'editor.record.form.classification.opendata' | translate"
+  [value]="value"
+  (toggled)="onOpenDataToggled($event)"
+  data-cy="openDataToggle"
+></gn-ui-check-toggle>

libs/feature/editor/src/lib/components/record-form/form-field/form-field-open-data/form-field-open-data.component.spec.ts

@@ -0,0 +1,47 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing'
+import { FormFieldOpenDataComponent } from './form-field-open-data.component'
+import { TranslateModule } from '@ngx-translate/core'
+import { FormControl } from '@angular/forms'
+
+jest.mock('./../../../../fields.config', () => {
+  return {
+    OPEN_DATA_LICENSES: ['CC-BY'],
+  }
+})
+
+describe('FormFieldOpenDataComponent', () => {
+  let component: FormFieldOpenDataComponent
+  let fixture: ComponentFixture<FormFieldOpenDataComponent>
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [FormFieldOpenDataComponent, TranslateModule.forRoot()],
+    }).compileComponents()
+
+    fixture = TestBed.createComponent(FormFieldOpenDataComponent)
+    component = fixture.componentInstance
+    component.control = new FormControl()
+    component.control.setValue([{ text: 'odc-by' }])
+    fixture.detectChanges()
+  })
+
+  it('should create', () => {
+    expect(component).toBeTruthy()
+  })
+
+  it('should emit the new license value on toggle', () => {
+    const control = new FormControl()
+    const setValueSpy = jest.spyOn(control, 'setValue')
+    component.control = control
+
+    component.onOpenDataToggled(true)
+
+    expect(setValueSpy).toHaveBeenCalledWith([{ text: 'CC-BY' }])
+  })
+
+  it('should emit the event value on toggle', () => {
+    const toggledSpy = jest.spyOn(component.visibilityChange, 'emit')
+    component.onOpenDataToggled(true)
+    expect(toggledSpy).toHaveBeenCalledWith(true)
+  })
+})

libs/feature/editor/src/lib/components/record-form/form-field/form-field-open-data/form-field-open-data.component.ts

@@ -0,0 +1,59 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  OnChanges,
+  OnInit,
+  Output,
+  SimpleChanges,
+} from '@angular/core'
+import { FormControl } from '@angular/forms'
+import { CheckToggleComponent } from '@geonetwork-ui/ui/inputs'
+import { TranslateModule } from '@ngx-translate/core'
+import { OPEN_DATA_LICENSES } from './../../../../fields.config'
+import { Subscription } from 'rxjs'
+
+@Component({
+  selector: 'gn-ui-form-field-open-data',
+  templateUrl: './form-field-open-data.component.html',
+  styleUrls: ['./form-field-open-data.component.css'],
+  standalone: true,
+  imports: [CheckToggleComponent, TranslateModule],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class FormFieldOpenDataComponent implements OnInit {
+  @Input() control: FormControl
+  value = false
+  @Output() visibilityChange = new EventEmitter<boolean>()
+  subscription: Subscription
+
+  get config() {
+    return OPEN_DATA_LICENSES
+  }
+
+  ngOnInit() {
+    this.initToggle()
+    this.subscription = new Subscription()
+
+    this.subscription.add(
+      this.control.valueChanges.subscribe((value) => {
+        this.value = this.config.includes(value[0].text)
+        this.visibilityChange.emit(this.value)
+      })
+    )
+  }
+
+  initToggle() {
+    this.value = this.config.includes(this.control.value[0].text)
+    this.visibilityChange.emit(this.value)
+  }
+
+  onOpenDataToggled(boolean) {
+    if (boolean) {
+      this.control.setValue([{ text: this.config[0] }])
+    }
+    this.value = !this.value
+    this.visibilityChange.emit(boolean)
+  }
+}

libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html

@@ -1,4 +1,10 @@
-<div class="flex flex-col h-full">
+<ng-container *ngIf="isOpenData">
+  <gn-ui-form-field-open-data
+    [control]="formControl"
+    (visibilityChange)="onVisibilityChange($event)"
+  ></gn-ui-form-field-open-data>
+</ng-container>
+<div class="flex flex-col h-full" *ngIf="!isHidden">
   <ng-container *ngIf="withoutWrapper; else withGenericWrapper">
     <ng-container *ngTemplateOutlet="fieldContent"></ng-container>
   </ng-container>

libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.spec.ts

@@ -16,6 +16,8 @@ import { EditorFacade } from '../../../+state/editor.facade'
 import { DATASET_RECORDS } from '@geonetwork-ui/common/fixtures'
 import { NO_ERRORS_SCHEMA } from '@angular/core'
 import { HttpClientTestingModule } from '@angular/common/http/testing'
+import { FormControl } from '@angular/forms'
+import { getGlobalConfig } from '@geonetwork-ui/util/app-config'
 
 class EditorFacadeMock {
   record$ = new BehaviorSubject(DATASET_RECORDS[0])
@@ -71,7 +73,7 @@ describe('FormFieldComponent', () => {
     let formField
     beforeEach(() => {
       component.model = 'licenses'
-      component.value = 'cc-by'
+      component.formControl = new FormControl([{ text: 'cc-by' }])
       fixture.detectChanges()
       formField = fixture.debugElement.query(
         By.directive(FormFieldLicenseComponent)

libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts

@@ -3,6 +3,7 @@ import {
   ChangeDetectionStrategy,
   Component,
   ElementRef,
+  EventEmitter,
   Input,
   Output,
   ViewChild,
@@ -33,6 +34,7 @@ import { map, take } from 'rxjs/operators'
 import { EditorFacade } from '../../../+state/editor.facade'
 import { FormFieldConfig } from '../../../models'
 import { FormFieldContactsForResourceComponent } from './form-field-contacts-for-resource/form-field-contacts-for-resource.component'
+import { FormFieldOpenDataComponent } from './form-field-open-data/form-field-open-data.component'
 
 @Component({
   selector: 'gn-ui-form-field',
@@ -61,6 +63,7 @@ import { FormFieldContactsForResourceComponent } from './form-field-contacts-for
     TranslateModule,
     FormFieldOverviewsComponent,
     FormFieldContactsForResourceComponent,
+    FormFieldOpenDataComponent,
   ],
 })
 export class FormFieldComponent {
@@ -73,6 +76,7 @@ export class FormFieldComponent {
   }
 
   @Output() valueChange: Observable<unknown>
+  isHidden = false
 
   @ViewChild('titleInput') titleInput: ElementRef
 
@@ -91,6 +95,10 @@ export class FormFieldComponent {
     this.titleInput.nativeElement.children[0].focus()
   }
 
+  onVisibilityChange(visibility: boolean) {
+    this.isHidden = visibility
+  }
+
   get isTitle() {
     return this.model === 'title'
   }
@@ -131,4 +139,8 @@ export class FormFieldComponent {
   get withoutWrapper() {
     return this.model === 'title' || this.model === 'abstract'
   }
+
+  get isOpenData() {
+    return this.model === 'licenses'
+  }
 }

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

@@ -201,3 +201,15 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
     },
   ],
 }
+
+/************************************************************
+ ***************           LICENSES            *****************
+ ************************************************************
+ */
+export const OPEN_DATA_LICENSES: string[] = [
+  'etalab',
+  'etalab-v2',
+  'odbl',
+  'odc-by',
+  'pddl',
+]

translations/de.json

@@ -209,6 +209,7 @@
   "editor.record.form.field.title": "Metadaten-Titel",
   "editor.record.form.field.uniqueIdentifier": "Eindeutige Kennung (ID)",
   "editor.record.form.field.updateFrequency": "Aktualisierungshäufigkeit",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.license.cc-by": "Creative Commons CC-BY",
   "editor.record.form.license.cc-by-sa": "Creative Commons CC-BY-SA",
   "editor.record.form.license.cc-zero": "Creative Commons CC-0",

translations/en.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "Come back later",
   "editor.record.form.bottomButtons.next": "Next",
   "editor.record.form.bottomButtons.previous": "Previous",
+  "editor.record.form.classification.opendata": "Open Data",
   "editor.record.form.field.abstract": "Abstract",
   "editor.record.form.field.contactsForResource.noContact": "Please provide at least one point of contact responsible for the data.",
   "editor.record.form.field.keywords": "Keywords",

translations/es.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "",
   "editor.record.form.bottomButtons.next": "",
   "editor.record.form.bottomButtons.previous": "",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.field.abstract": "",
   "editor.record.form.field.contactsForResource.noContact": "",
   "editor.record.form.field.keywords": "",

translations/fr.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "Revenir plus tard",
   "editor.record.form.bottomButtons.next": "Suivant",
   "editor.record.form.bottomButtons.previous": "Précédent",
+  "editor.record.form.classification.opendata": "Données ouvertes",
   "editor.record.form.field.abstract": "Résumé",
   "editor.record.form.field.contactsForResource.noContact": "Veuillez renseigner au moins un point de contact responsable de la donnée.",
   "editor.record.form.field.keywords": "Mots-clés",

translations/it.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "",
   "editor.record.form.bottomButtons.next": "",
   "editor.record.form.bottomButtons.previous": "",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.field.abstract": "",
   "editor.record.form.field.contactsForResource.noContact": "",
   "editor.record.form.field.keywords": "",

translations/nl.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "",
   "editor.record.form.bottomButtons.next": "",
   "editor.record.form.bottomButtons.previous": "",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.field.abstract": "",
   "editor.record.form.field.contactsForResource.noContact": "",
   "editor.record.form.field.keywords": "",

translations/pt.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "",
   "editor.record.form.bottomButtons.next": "",
   "editor.record.form.bottomButtons.previous": "",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.field.abstract": "",
   "editor.record.form.field.contactsForResource.noContact": "",
   "editor.record.form.field.keywords": "",

translations/sk.json

@@ -198,6 +198,7 @@
   "editor.record.form.bottomButtons.comeBackLater": "",
   "editor.record.form.bottomButtons.next": "",
   "editor.record.form.bottomButtons.previous": "",
+  "editor.record.form.classification.opendata": "",
   "editor.record.form.field.abstract": "",
   "editor.record.form.field.contactsForResource.noContact": "",
   "editor.record.form.field.keywords": "",