-
-
+
+
+
+
+
+
+
+
+
+ {{
+ selectedPage === 0
+ ? ('editor.record.form.bottomButtons.comeBackLater' | translate)
+ : ('editor.record.form.bottomButtons.previous' | translate)
+ }}
+
+ editor.record.form.bottomButtons.next
-
+
diff --git a/apps/metadata-editor/src/app/edit/edit-page.component.spec.ts b/apps/metadata-editor/src/app/edit/edit-page.component.spec.ts
index 401d9541ce..36fc290d2d 100644
--- a/apps/metadata-editor/src/app/edit/edit-page.component.spec.ts
+++ b/apps/metadata-editor/src/app/edit/edit-page.component.spec.ts
@@ -1,12 +1,14 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'
import { EditPageComponent } from './edit-page.component'
import { ActivatedRoute, Router } from '@angular/router'
-import { EditorFacade } from '@geonetwork-ui/feature/editor'
+import { EDITOR_CONFIG, EditorFacade } from '@geonetwork-ui/feature/editor'
import { NO_ERRORS_SCHEMA } from '@angular/core'
import { DATASET_RECORDS } from '@geonetwork-ui/common/fixtures'
import { BehaviorSubject, Subject } from 'rxjs'
import { NotificationsService } from '@geonetwork-ui/feature/notifications'
import { TranslateModule } from '@ngx-translate/core'
+import { FindPipe } from '../pipes/filter.pipe'
+import { PageSelectorComponent } from './components/breadcrumbs/page-selector.component'
const getRoute = () => ({
snapshot: {
@@ -25,6 +27,7 @@ class RouterMock {
class EditorFacadeMock {
record$ = new BehaviorSubject(DATASET_RECORDS[0])
+ recordFields$ = new BehaviorSubject(EDITOR_CONFIG())
openRecord = jest.fn()
saveError$ = new Subject
()
saveSuccess$ = new Subject()
@@ -42,7 +45,12 @@ describe('EditPageComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- imports: [EditPageComponent, TranslateModule.forRoot()],
+ imports: [
+ EditPageComponent,
+ TranslateModule.forRoot(),
+ FindPipe,
+ PageSelectorComponent,
+ ],
schemas: [NO_ERRORS_SCHEMA],
providers: [
{
diff --git a/apps/metadata-editor/src/app/edit/edit-page.component.ts b/apps/metadata-editor/src/app/edit/edit-page.component.ts
index 7327286a2c..8586f05362 100644
--- a/apps/metadata-editor/src/app/edit/edit-page.component.ts
+++ b/apps/metadata-editor/src/app/edit/edit-page.component.ts
@@ -3,6 +3,7 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
import { ActivatedRoute, Router } from '@angular/router'
import {
EditorFacade,
+ EditorFieldPage,
RecordFormComponent,
} from '@geonetwork-ui/feature/editor'
import { ButtonComponent } from '@geonetwork-ui/ui/inputs'
@@ -13,8 +14,14 @@ import {
NotificationsContainerComponent,
NotificationsService,
} from '@geonetwork-ui/feature/notifications'
-import { TranslateService } from '@ngx-translate/core'
+import { TranslateModule, TranslateService } from '@ngx-translate/core'
import { filter, Subscription, take } from 'rxjs'
+import { PageSelectorComponent } from './components/breadcrumbs/page-selector.component'
+import { marker } from '@biesbjerg/ngx-translate-extract-marker'
+
+marker('editor.record.form.bottomButtons.comeBackLater')
+marker('editor.record.form.bottomButtons.previous')
+marker('editor.record.form.bottomButtons.next')
@Component({
selector: 'md-editor-edit',
@@ -29,18 +36,30 @@ import { filter, Subscription, take } from 'rxjs'
PublishButtonComponent,
TopToolbarComponent,
NotificationsContainerComponent,
+ PageSelectorComponent,
+ TranslateModule,
],
})
export class EditPageComponent implements OnInit, OnDestroy {
subscription = new Subscription()
+ fields$ = this.facade.recordFields$
+ totalPages = 0
+ selectedPage = 0
+
constructor(
private route: ActivatedRoute,
private facade: EditorFacade,
private notificationsService: NotificationsService,
private translateService: TranslateService,
private router: Router
- ) {}
+ ) {
+ this.subscription.add(
+ this.fields$.subscribe((fields) => {
+ this.totalPages = fields.pages.length
+ })
+ )
+ }
ngOnInit(): void {
const [currentRecord, currentRecordSource, currentRecordAlreadySaved] =
@@ -109,4 +128,25 @@ export class EditPageComponent implements OnInit, OnDestroy {
ngOnDestroy() {
this.subscription.unsubscribe()
}
+
+ getSelectedPageFields(pages: EditorFieldPage[]) {
+ return pages[this.selectedPage]
+ }
+
+ previousPageButtonHandler() {
+ if (this.selectedPage === 0) {
+ this.router.navigate(['catalog', 'search'])
+ } else {
+ this.selectedPage--
+ }
+ }
+
+ nextPageButtonHandler() {
+ if (this.selectedPage === this.totalPages - 1) return
+ this.selectedPage++
+ }
+
+ selectedPageChange(index: number) {
+ this.selectedPage = index
+ }
}
diff --git a/apps/metadata-editor/src/app/pipes/filter.pipe.ts b/apps/metadata-editor/src/app/pipes/filter.pipe.ts
deleted file mode 100644
index 4cbff21914..0000000000
--- a/apps/metadata-editor/src/app/pipes/filter.pipe.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core'
-
-@Pipe({
- name: 'filter',
- standalone: true,
-})
-export class FilterPipe implements PipeTransform {
- transform(array: any[], index: number): any {
- return array.find((item) => item.index === index)
- }
-}
diff --git a/apps/metadata-editor/tsconfig.json b/apps/metadata-editor/tsconfig.json
index d2c6daf3e1..54f2b40f0e 100644
--- a/apps/metadata-editor/tsconfig.json
+++ b/apps/metadata-editor/tsconfig.json
@@ -19,11 +19,7 @@
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"target": "es2020",
- "lib": [
- "dom",
- "es2020",
- "dom.iterable"
- ],
+ "lib": ["dom", "es2020", "dom.iterable"],
"downlevelIteration": true
},
"angularCompilerOptions": {
diff --git a/libs/feature/editor/src/index.ts b/libs/feature/editor/src/index.ts
index 5e6dd85211..c95afdefd4 100644
--- a/libs/feature/editor/src/index.ts
+++ b/libs/feature/editor/src/index.ts
@@ -9,3 +9,4 @@ export * from './lib/components/record-form/record-form.component'
export * from './lib/components/wizard/wizard.component'
export * from './lib/components/wizard-field/wizard-field.component'
export * from './lib/components/wizard-summarize/wizard-summarize.component'
+export * from './lib/fixtures'
diff --git a/libs/feature/editor/src/lib/+state/editor.reducer.ts b/libs/feature/editor/src/lib/+state/editor.reducer.ts
index 425e3d0c41..506f3436fb 100644
--- a/libs/feature/editor/src/lib/+state/editor.reducer.ts
+++ b/libs/feature/editor/src/lib/+state/editor.reducer.ts
@@ -2,7 +2,7 @@ import { Action, createReducer, on } from '@ngrx/store'
import * as EditorActions from './editor.actions'
import { CatalogRecord } from '@geonetwork-ui/common/domain/model/record'
import { SaveRecordError } from './editor.models'
-import { EditorFieldsConfig } from '../models/fields.model'
+import { EditorConfig } from '../models'
import { DEFAULT_FIELDS } from '../fields.config'
export const EDITOR_FEATURE_KEY = 'editor'
@@ -22,7 +22,7 @@ export interface EditorState {
saving: boolean
saveError: SaveRecordError | null
changedSinceSave: boolean
- fieldsConfig: EditorFieldsConfig
+ fieldsConfig: EditorConfig
}
export interface EditorPartialState {
diff --git a/libs/feature/editor/src/lib/+state/editor.selectors.spec.ts b/libs/feature/editor/src/lib/+state/editor.selectors.spec.ts
index 0d61773f97..e3ee07bfd9 100644
--- a/libs/feature/editor/src/lib/+state/editor.selectors.spec.ts
+++ b/libs/feature/editor/src/lib/+state/editor.selectors.spec.ts
@@ -58,45 +58,26 @@ describe('Editor Selectors', () => {
describe('selectRecordFields', () => {
it('should return the config and value for each field', () => {
const result = EditorSelectors.selectRecordFields(state)
- expect(result).toEqual([
- {
- config: DEFAULT_FIELDS[0],
- value: DATASET_RECORDS[0].title,
- },
- {
- config: DEFAULT_FIELDS[1],
- value: DATASET_RECORDS[0].abstract,
- },
- {
- config: DEFAULT_FIELDS[2],
- value: DATASET_RECORDS[0].uniqueIdentifier,
- },
- {
- config: DEFAULT_FIELDS[3],
- value: DATASET_RECORDS[0].recordUpdated,
- },
- {
- config: DEFAULT_FIELDS[4],
- value: DATASET_RECORDS[0].licenses,
- },
- {
- config: DEFAULT_FIELDS[5],
- value: DATASET_RECORDS[0].resourceUpdated,
- },
- {
- config: DEFAULT_FIELDS[6],
- value: DATASET_RECORDS[0].updateFrequency,
- },
- {
- config: DEFAULT_FIELDS[7],
- value: DATASET_RECORDS[0].temporalExtents,
- },
- {
- config: DEFAULT_FIELDS[8],
- value: DATASET_RECORDS[0].keywords,
- },
- ])
+
+ const actualSections = result.pages.map((page) => page.sections).flat()
+
+ const expectedSections = DEFAULT_FIELDS.pages
+ .map((page) => page.sections)
+ .flat()
+
+ expect(actualSections).toEqual(expectedSections)
+
+ const actualFields = actualSections
+ .map((section) => section.fields)
+ .flat()
+
+ const expectedFields = expectedSections
+ .map((section) => section.fields)
+ .flat()
+
+ expect(actualFields).toEqual(expectedFields)
})
+
it('should not coerce falsy values to null', () => {
const result = EditorSelectors.selectRecordFields({
...state,
@@ -109,14 +90,19 @@ describe('Editor Selectors', () => {
},
},
})
- expect(result).toContainEqual({
- config: DEFAULT_FIELDS[0],
- value: '',
- })
- expect(result).toContainEqual({
- config: DEFAULT_FIELDS[1],
- value: '',
- })
+
+ const resultFields = result.pages
+ .flatMap((page) => page.sections)
+ .flatMap((section) => section.fields)
+
+ const abstractField = resultFields.find(
+ (field) => field.model === 'abstract'
+ )
+
+ const titleField = resultFields.find((field) => field.model === 'title')
+
+ expect(abstractField.value).toEqual('')
+ expect(titleField.value).toEqual('')
})
})
})
diff --git a/libs/feature/editor/src/lib/+state/editor.selectors.ts b/libs/feature/editor/src/lib/+state/editor.selectors.ts
index e9a601da80..3661ace5f1 100644
--- a/libs/feature/editor/src/lib/+state/editor.selectors.ts
+++ b/libs/feature/editor/src/lib/+state/editor.selectors.ts
@@ -41,9 +41,18 @@ export const selectRecordFieldsConfig = createSelector(
export const selectRecordFields = createSelector(
selectEditorState,
- (state: EditorState) =>
- state.fieldsConfig.map((fieldConfig) => ({
- config: fieldConfig,
- value: state.record?.[fieldConfig.model] ?? null,
- }))
+ (state: EditorState) => {
+ const fieldsConfig = state.fieldsConfig
+ fieldsConfig.pages.forEach((page) => {
+ page.sections.forEach((section) => {
+ section.fields.forEach((field) => {
+ if (state.record) {
+ field.value = state.record[field.model]
+ }
+ })
+ })
+ })
+
+ return fieldsConfig
+ }
)
diff --git a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html
index 98f8503d27..ec1b774a7b 100644
--- a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html
+++ b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.html
@@ -4,8 +4,8 @@
@@ -15,14 +15,14 @@
-
{{ formControl.value }}
-
+
help
@@ -41,14 +41,14 @@
diff --git a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.spec.ts b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.spec.ts
index aa81387dba..6337d1d9b3 100644
--- a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.spec.ts
+++ b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.spec.ts
@@ -23,7 +23,6 @@ describe('FormFieldComponent', () => {
fixture = TestBed.createComponent(FormFieldComponent)
component = fixture.componentInstance
component.config = {
- type: 'text',
labelKey: 'my.label',
}
})
diff --git a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts
index 5077db478e..44621437a5 100644
--- a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts
+++ b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.ts
@@ -25,10 +25,10 @@ import { FormFieldObjectComponent } from './form-field-object/form-field-object.
import { FormFieldRichComponent } from './form-field-rich/form-field-rich.component'
import { FormFieldSimpleComponent } from './form-field-simple/form-field-simple.component'
import { FormFieldSpatialExtentComponent } from './form-field-spatial-extent/form-field-spatial-extent.component'
-import { FormFieldConfig } from './form-field.model'
import { FormFieldUpdateFrequencyComponent } from './form-field-update-frequency/form-field-update-frequency.component'
import { CatalogRecordKeys } from '@geonetwork-ui/common/domain/model/record'
import { FormFieldKeywordsComponent } from './form-field-keywords/form-field-keywords.component'
+import { FormFieldConfig } from '../../../models'
@Component({
selector: 'gn-ui-form-field',
@@ -65,6 +65,7 @@ export class FormFieldComponent {
emitEvent: false,
})
}
+
@Output() valueChange: Observable
@ViewChild('titleInput') titleInput: ElementRef
diff --git a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.model.ts b/libs/feature/editor/src/lib/components/record-form/form-field/form-field.model.ts
deleted file mode 100644
index cbc9d543b3..0000000000
--- a/libs/feature/editor/src/lib/components/record-form/form-field/form-field.model.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-type BaseFormFieldType =
- | 'text'
- | 'number'
- | 'rich'
- | 'date'
- | 'list'
- | 'spatial_extent'
- | 'temporal_extent'
- | 'url'
- | 'file'
- | 'toggle'
-
-type AllFormFieldType = BaseFormFieldType | 'object' | 'array'
-
-interface FormFieldConfigBase {
- type: AllFormFieldType
- labelKey: string
- hintKey?: string
- tooltipKey?: string
- required?: boolean
- locked?: boolean
- invalid?: boolean
- invalidHintKey?: string
-}
-
-export interface FormFieldConfigSimple extends FormFieldConfigBase {
- type: BaseFormFieldType
-}
-
-export interface FormFieldConfigArray extends FormFieldConfigBase {
- type: 'array'
- items: FormFieldConfig
-}
-
-export interface FormFieldConfigObject extends FormFieldConfigBase {
- type: 'object'
- fields: Array
-}
-
-export type FormFieldConfig =
- | FormFieldConfigSimple
- | FormFieldConfigArray
- | FormFieldConfigObject
diff --git a/libs/feature/editor/src/lib/components/record-form/form-field/index.ts b/libs/feature/editor/src/lib/components/record-form/form-field/index.ts
index 053dede8e5..8555c39727 100644
--- a/libs/feature/editor/src/lib/components/record-form/form-field/index.ts
+++ b/libs/feature/editor/src/lib/components/record-form/form-field/index.ts
@@ -9,4 +9,3 @@ export * from './form-field-object/form-field-object.component'
export * from './form-field-array/form-field-array.component'
export * from './form-field-spatial-extent/form-field-spatial-extent.component'
export * from './form-field.component'
-export * from './form-field.model'
diff --git a/libs/feature/editor/src/lib/components/record-form/record-form.component.html b/libs/feature/editor/src/lib/components/record-form/record-form.component.html
index 7b07459330..ed64b72b3a 100644
--- a/libs/feature/editor/src/lib/components/record-form/record-form.component.html
+++ b/libs/feature/editor/src/lib/components/record-form/record-form.component.html
@@ -1,11 +1,43 @@
-
-
-
-
-
+
+
+
+
+
+
+
+ {{ section.labelKey }}
+
+
+ {{ section.descriptionKey }}
+
+
+
+
+
+
+
+
+