geonetwork-ui 2.3.0-dev.6083baae → 2.3.0-dev.61774f7d

package/libs/ui/elements/src/lib/user-feedback-item/user-feedback-item.component.d.ts

@@ -0,0 +1,22 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { UserFeedback, UserFeedbackViewModel } from '../../../../../../libs/common/domain/src/lib/model/record';
+import { UserModel } from '../../../../../../libs/common/domain/src/lib/model/user';
+import * as i0 from "@angular/core";
+export declare class UserFeedbackItemComponent implements OnInit {
+    userFeedbackParent: UserFeedbackViewModel;
+    userFeedBacksAnswers: UserFeedbackViewModel[];
+    isActiveUserEditor: boolean;
+    activeUser: UserModel;
+    isLastComment: boolean;
+    isAddUserFeedbackLoading: boolean;
+    newUserFeedbackAnswer: EventEmitter<UserFeedback>;
+    isAnAnswer: boolean;
+    newAnswer: string;
+    isAnswerEmpty: boolean;
+    ngOnInit(): void;
+    onNewAnswerValueChange(): void;
+    publishNewAnswer(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UserFeedbackItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UserFeedbackItemComponent, "gn-ui-user-feedback-item", never, { "userFeedbackParent": { "alias": "userFeedbackParent"; "required": false; }; "userFeedBacksAnswers": { "alias": "userFeedBacksAnswers"; "required": false; }; "isActiveUserEditor": { "alias": "isActiveUserEditor"; "required": false; }; "activeUser": { "alias": "activeUser"; "required": false; }; "isLastComment": { "alias": "isLastComment"; "required": false; }; "isAddUserFeedbackLoading": { "alias": "isAddUserFeedbackLoading"; "required": false; }; }, { "newUserFeedbackAnswer": "newUserFeedbackAnswer"; }, never, never, false, never>;
+}
+//# sourceMappingURL=user-feedback-item.component.d.ts.map

package/libs/ui/elements/src/lib/user-feedback-item/user-feedback-item.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-feedback-item.component.d.ts","sourceRoot":"","sources":["../../../../../../src/libs/ui/elements/src/lib/user-feedback-item/user-feedback-item.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,YAAY,EAEZ,MAAM,EAEP,MAAM,eAAe,CAAA;AACtB,OAAO,EACL,YAAY,EACZ,qBAAqB,EACtB,MAAM,2DAA2D,CAAA;AAClE,OAAO,EAAE,SAAS,EAAE,MAAM,yDAAyD,CAAA;;AAEnF,qBAMa,yBAA0B,YAAW,MAAM;IAC7C,kBAAkB,EAAE,qBAAqB,CAAA;IACzC,oBAAoB,EAAE,qBAAqB,EAAE,CAAA;IAC7C,kBAAkB,EAAE,OAAO,CAAA;IAC3B,UAAU,EAAE,SAAS,CAAA;IACrB,aAAa,EAAE,OAAO,CAAA;IACtB,wBAAwB,EAAE,OAAO,CAAA;IAEhC,qBAAqB,6BAAmC;IAElE,UAAU,UAAQ;IAClB,SAAS,SAAK;IACd,aAAa,UAAO;IAEpB,QAAQ,IAAI,IAAI;IAIhB,sBAAsB;IAItB,gBAAgB;yCAtBL,yBAAyB;2CAAzB,yBAAyB;CA0CrC"}

package/libs/ui/inputs/src/lib/text-area/text-area.component.d.ts

@@ -2,16 +2,22 @@ import { AfterViewInit } from '@angular/core';
 import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 export declare class TextAreaComponent implements AfterViewInit {
+    private readonly baseClasses;
+    private readonly disabledClasses;
     value: string;
+    disabled: boolean;
+    extraClass: string;
     placeholder: string;
     required: boolean;
     rawChange: Subject<string>;
     valueChange: import("rxjs").Observable<string>;
     input: any;
+    constructor();
+    get classList(): string;
     ngAfterViewInit(): void;
     checkRequired(value: any): void;
     handleChange($event: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TextAreaComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TextAreaComponent, "gn-ui-text-area", never, { "value": { "alias": "value"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TextAreaComponent, "gn-ui-text-area", never, { "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "extraClass": { "alias": "extraClass"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 //# sourceMappingURL=text-area.component.d.ts.map

package/libs/ui/inputs/src/lib/text-area/text-area.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-area.component.d.ts","sourceRoot":"","sources":["../../../../../../src/libs/ui/inputs/src/lib/text-area/text-area.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAKd,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;;AAG9B,qBAMa,iBAAkB,YAAW,aAAa;IAC5C,KAAK,SAAK;IACV,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,UAAQ;IAEzB,SAAS,kBAAwB;IACvB,WAAW,oCAA8C;IAE/C,KAAK,MAAA;IAEzB,eAAe;IAIf,aAAa,CAAC,KAAK,KAAA;IAOnB,YAAY,CAAC,MAAM,KAAA;yCArBR,iBAAiB;2CAAjB,iBAAiB;CA0B7B"}
+{"version":3,"file":"text-area.component.d.ts","sourceRoot":"","sources":["../../../../../../src/libs/ui/inputs/src/lib/text-area/text-area.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAKd,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;;AAG9B,qBAMa,iBAAkB,YAAW,aAAa;IACrD,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAQ;IACpC,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAQ;IAE/B,KAAK,SAAK;IACV,QAAQ,UAAQ;IAChB,UAAU,SAAK;IACf,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,UAAQ;IAEzB,SAAS,kBAAwB;IACvB,WAAW,oCAA8C;IAE/C,KAAK,MAAA;;IAoBzB,IAAI,SAAS,WAIZ;IAED,eAAe;IAIf,aAAa,CAAC,KAAK,KAAA;IAOnB,YAAY,CAAC,MAAM,KAAA;yCAlDR,iBAAiB;2CAAjB,iBAAiB;CAuD7B"}

package/libs/ui/inputs/src/lib/text-input/text-input.component.d.ts

@@ -2,16 +2,19 @@ import { AfterViewInit } from '@angular/core';
 import { Subject } from 'rxjs';
 import * as i0 from "@angular/core";
 export declare class TextInputComponent implements AfterViewInit {
+    private readonly baseClass;
     value: string;
+    extraClass: string;
     hint: string;
     required: boolean;
     rawChange: Subject<string>;
     valueChange: import("rxjs").Observable<string>;
     input: any;
+    get classList(): string;
     ngAfterViewInit(): void;
     checkRequired(value: any): void;
     handleChange($event: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TextInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TextInputComponent, "gn-ui-text-input", never, { "value": { "alias": "value"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "required": { "alias": "required"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TextInputComponent, "gn-ui-text-input", never, { "value": { "alias": "value"; "required": false; }; "extraClass": { "alias": "extraClass"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "required": { "alias": "required"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
 }
 //# sourceMappingURL=text-input.component.d.ts.map

package/libs/ui/inputs/src/lib/text-input/text-input.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-input.component.d.ts","sourceRoot":"","sources":["../../../../../../src/libs/ui/inputs/src/lib/text-input/text-input.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAKd,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;;AAE9B,qBAKa,kBAAmB,YAAW,aAAa;IAC7C,KAAK,SAAK;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,UAAQ;IACzB,SAAS,kBAAwB;IACvB,WAAW,oCAA8C;IAE/C,KAAK,MAAA;IAEzB,eAAe;IAIf,aAAa,CAAC,KAAK,KAAA;IAOnB,YAAY,CAAC,MAAM,KAAA;yCApBR,kBAAkB;2CAAlB,kBAAkB;CAyB9B"}
+{"version":3,"file":"text-input.component.d.ts","sourceRoot":"","sources":["../../../../../../src/libs/ui/inputs/src/lib/text-input/text-input.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAKd,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;;AAE9B,qBAKa,kBAAmB,YAAW,aAAa;IACtD,OAAO,CAAC,QAAQ,CAAC,SAAS,CASf;IAEF,KAAK,SAAK;IACV,UAAU,SAAK;IACf,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,UAAQ;IACzB,SAAS,kBAAwB;IACvB,WAAW,oCAA8C;IAC/C,KAAK,MAAA;IAEzB,IAAI,SAAS,WAEZ;IAED,eAAe;IAIf,aAAa,CAAC,KAAK,KAAA;IAOnB,YAAY,CAAC,MAAM,KAAA;yCAnCR,kBAAkB;2CAAlB,kBAAkB;CAwC9B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "geonetwork-ui",
-  "version": "2.3.0-dev.6083baae",
+  "version": "2.3.0-dev.61774f7d",
   "engines": {
     "node": ">=14.17.0"
   },

package/src/libs/api/metadata-converter/src/lib/gn4/gn4.field.mapper.ts

@@ -120,13 +120,13 @@ export class Gn4FieldMapper {
     }),
     creationDateForResource: (output, source) => ({
       ...output,
-      datasetCreated: toDate(
+      resourceCreated: toDate(
         getFirstValue(selectField<string>(source, 'creationDateForResource'))
       ),
     }),
     revisionDateForResource: (output, source) => ({
       ...output,
-      datasetUpdated: toDate(
+      resourceUpdated: toDate(
         getFirstValue(selectField<string>(source, 'revisionDateForResource'))
       ),
     }),

package/src/libs/api/repository/src/lib/gn4/auth/avatar.service.interface.ts

@@ -3,4 +3,5 @@ import { Observable } from 'rxjs'
 export abstract class AvatarServiceInterface {
   public abstract getPlaceholder(): Observable<string>
   public abstract getProfileIcon(...args): Observable<string>
+  public abstract getProfileIconUrl(userId: string): Promise<string>
 }

package/src/libs/api/repository/src/lib/gn4/auth/gravatar.service.ts

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core'
 import { AvatarServiceInterface } from './avatar.service.interface'
 import { Gn4SettingsService } from '../settings/gn4-settings.service'
 import { map } from 'rxjs/operators'
-import { Observable } from 'rxjs'
+import { firstValueFrom, Observable } from 'rxjs'
 
 @Injectable({
   providedIn: 'root',
@@ -14,6 +14,7 @@ export class GravatarService implements AvatarServiceInterface {
   private readonly identicon$ = this.gn4SettingsService.identicon$.pipe(
     map((identicon) => identicon?.replace('gravatar:', ''))
   )
+
   constructor(private gn4SettingsService: Gn4SettingsService) {}
 
   getPlaceholder(): Observable<string> {
@@ -26,4 +27,14 @@ export class GravatarService implements AvatarServiceInterface {
       map((identicon) => `${this.GRAVATAR_URL}${hash}?d=${identicon}`)
     )
   }
+
+  async getProfileIconUrl(userId: string) {
+    let iconUrl = ''
+    try {
+      iconUrl = await firstValueFrom(this.getProfileIcon(userId))
+    } catch (error) {
+      return ''
+    }
+    return iconUrl
+  }
 }

package/src/libs/api/repository/src/lib/gn4/platform/gn4-platform.mapper.ts

@@ -1,17 +1,23 @@
 import {
   MeResponseApiModel,
   UserApiModel,
+  UserFeedbackDTOApiModel,
 } from '../../../../../../../libs/data-access/gn4/src'
 import { UserModel } from '../../../../../../../libs/common/domain/src/lib/model/user/user.model'
 import { Injectable } from '@angular/core'
-import { AvatarServiceInterface } from '../auth/avatar.service.interface'
+import { AvatarServiceInterface } from '../auth'
 import { map } from 'rxjs/operators'
 import { Observable, of } from 'rxjs'
 import { ThesaurusModel } from '../../../../../../../libs/common/domain/src/lib/model/thesaurus/thesaurus.model'
+import {
+  UserFeedback,
+  UserFeedbackViewModel,
+} from '../../../../../../../libs/common/domain/src/lib/model/record'
 
 @Injectable()
 export class Gn4PlatformMapper {
   constructor(private avatarService: AvatarServiceInterface) {}
+
   userFromMeApi(apiUser: MeResponseApiModel): Observable<UserModel | null> {
     if (!apiUser) return of(null)
     const {
@@ -28,6 +34,7 @@ export class Gn4PlatformMapper {
       .getProfileIcon(hash)
       .pipe(map((profileIcon) => ({ ...user, profileIcon } as UserModel)))
   }
+
   userFromApi(apiUser: UserApiModel): UserModel {
     if (!apiUser) return null
     const {
@@ -65,4 +72,47 @@ export class Gn4PlatformMapper {
       }
     })
   }
+
+  userFeedbacksFromApi(userFeedback: any): UserFeedback {
+    return {
+      uuid: userFeedback.uuid,
+      metadataUUID: userFeedback.metadataUUID,
+      comment: userFeedback.comment,
+      authorUserId: userFeedback.authorUserId.toString(),
+      authorName: userFeedback.authorName,
+      authorEmail: userFeedback.authorEmail,
+      published: userFeedback.published,
+      parentUuid: userFeedback.parentUuid ?? undefined,
+      date: new Date(userFeedback.date),
+    }
+  }
+
+  userFeedbacksToApi(
+    userFeedback: UserFeedback
+  ): Partial<UserFeedbackDTOApiModel> {
+    return {
+      uuid: userFeedback.uuid,
+      metadataUUID: userFeedback.metadataUUID,
+      comment: userFeedback.comment,
+      authorUserId: Number.parseInt(userFeedback.authorUserId),
+      authorName: userFeedback.authorName,
+      authorEmail: userFeedback.authorEmail,
+      published: userFeedback.published,
+      parentUuid: userFeedback.parentUuid,
+      date: userFeedback.date.getTime().toString(),
+    }
+  }
+
+  async createUserFeedbackViewModel(
+    baseUserFeedback: UserFeedback
+  ): Promise<UserFeedbackViewModel> {
+    const userAvatarUrl = await this.avatarService.getProfileIconUrl(
+      baseUserFeedback.authorUserId?.toString()
+    )
+
+    return {
+      ...baseUserFeedback,
+      avatarUrl: userAvatarUrl,
+    }
+  }
 }

package/src/libs/api/repository/src/lib/gn4/platform/gn4-platform.service.ts

@@ -6,11 +6,15 @@ import {
   RegistriesApiService,
   SiteApiService,
   ToolsApiService,
+  UserfeedbackApiService,
   UsersApiService,
 } from '../../../../../../../libs/data-access/gn4/src'
 import { PlatformServiceInterface } from '../../../../../../../libs/common/domain/src/lib/platform.service.interface'
 import { UserModel } from '../../../../../../../libs/common/domain/src/lib/model/user/user.model'
-import { Organization } from '../../../../../../../libs/common/domain/src/lib/model/record'
+import {
+  Organization,
+  UserFeedback,
+} from '../../../../../../../libs/common/domain/src/lib/model/record'
 import { Gn4PlatformMapper } from './gn4-platform.mapper'
 import { ltr } from 'semver'
 import { ThesaurusModel } from '../../../../../../../libs/common/domain/src/lib/model/thesaurus/thesaurus.model'
@@ -21,9 +25,9 @@ const minApiVersion = '4.2.2'
 @Injectable()
 export class Gn4PlatformService implements PlatformServiceInterface {
   private readonly type = 'GeoNetwork'
-  private me$: Observable<UserModel>
-  private users$: Observable<UserModel[]>
-  private isAnonymous$: Observable<boolean>
+  private readonly me$: Observable<UserModel>
+  private readonly users$: Observable<UserModel[]>
+  private readonly isUserAnonymous$: Observable<boolean>
 
   private keyTranslations$ = this.toolsApiService
     .getTranslationsPackage1('gnui')
@@ -65,13 +69,18 @@ export class Gn4PlatformService implements PlatformServiceInterface {
     private mapper: Gn4PlatformMapper,
     private toolsApiService: ToolsApiService,
     private registriesApiService: RegistriesApiService,
-    private langService: LangService
+    private langService: LangService,
+    private userfeedbackApiService: UserfeedbackApiService
   ) {
     this.me$ = this.meApi.getMe().pipe(
       switchMap((apiUser) => this.mapper.userFromMeApi(apiUser)),
       shareReplay({ bufferSize: 1, refCount: true })
     )
-    this.isAnonymous$ = this.me$.pipe(map((user) => !user || !('id' in user)))
+
+    this.isUserAnonymous$ = this.me$.pipe(
+      map((user) => !user || !('id' in user))
+    )
+
     this.users$ = this.usersApi.getUsers().pipe(
       map((users) => users.map((user) => this.mapper.userFromApi(user))),
       shareReplay()
@@ -91,7 +100,7 @@ export class Gn4PlatformService implements PlatformServiceInterface {
   }
 
   isAnonymous(): Observable<boolean> {
-    return this.isAnonymous$
+    return this.isUserAnonymous$
   }
 
   getOrganizations(): Observable<Organization[]> {
@@ -148,6 +157,24 @@ export class Gn4PlatformService implements PlatformServiceInterface {
         ),
         shareReplay(1)
       )
+
     return this.thesauri[uri]
   }
+
+  getUserFeedbacks(uuid: string): Observable<UserFeedback[]> {
+    return this.userfeedbackApiService
+      .getUserComments(uuid)
+      .pipe(
+        map((userFeedbacks) =>
+          userFeedbacks.map(this.mapper.userFeedbacksFromApi)
+        )
+      )
+  }
+
+  postUserFeedbacks(userFeedback: UserFeedback): Observable<void> {
+    const mappedUserFeedBack = this.mapper.userFeedbacksToApi(userFeedback)
+    return this.userfeedbackApiService
+      .newUserFeedback(mappedUserFeedBack)
+      .pipe(map(() => undefined))
+  }
 }

package/src/libs/common/domain/src/lib/model/record/index.ts

@@ -1,3 +1,4 @@
 export * from './contact.model'
 export * from './organization.model'
 export * from './metadata.model'
+export * from './user-feedbacks.model'

package/src/libs/common/domain/src/lib/model/record/user-feedbacks.model.ts

@@ -0,0 +1,15 @@
+export interface UserFeedback {
+  uuid: string
+  comment: string
+  metadataUUID: string
+  authorUserId: string
+  authorName: string
+  authorEmail: string
+  published: boolean
+  parentUuid?: string
+  date: Date
+}
+
+export interface UserFeedbackViewModel extends UserFeedback {
+  avatarUrl: string
+}

package/src/libs/common/domain/src/lib/platform.service.interface.ts

@@ -2,6 +2,7 @@ import type { Observable } from 'rxjs'
 import type { UserModel } from './model/user/user.model'
 import type { Organization } from './model/record/organization.model'
 import type { ThesaurusModel } from './model/thesaurus/'
+import { UserFeedback } from './model/record'
 
 export abstract class PlatformServiceInterface {
   abstract getType(): string
@@ -16,4 +17,6 @@ export abstract class PlatformServiceInterface {
   abstract getOrganizations(): Observable<Organization[]>
   abstract translateKey(key: string): Observable<string>
   abstract getThesaurusByUri(uri: string): Observable<ThesaurusModel>
+  abstract getUserFeedbacks(recordUuid: string): Observable<UserFeedback[]>
+  abstract postUserFeedbacks(recordUuid: UserFeedback): Observable<void>
 }

package/src/libs/common/fixtures/src/index.ts

@@ -1,11 +1,13 @@
+export * from './lib/elasticsearch'
+export * from './lib/gn4'
+export * from './lib/search'
+
 export * from './lib/geojson.fixtures'
+export * from './lib/link.fixtures'
 export * from './lib/ol-feature.fixture'
+export * from './lib/organisations.fixture'
 export * from './lib/record-link.fixtures'
-export * from './lib/link.fixtures'
 export * from './lib/records.fixtures'
-export * from './lib/organisations.fixture'
-export * from './lib/elasticsearch'
-export * from './lib/search'
-export * from './lib/user.fixtures'
 export * from './lib/repository.fixtures'
-export * from './lib/gn4'
+export * from './lib/user.fixtures'
+export * from './lib/user-feedbacks.fixtures'

package/src/libs/common/fixtures/src/lib/records.fixtures.ts

@@ -1,5 +1,5 @@
 import { DatasetRecord } from '../../../../../libs/common/domain/src/lib/model/record'
-import { deepFreeze } from './utils/freeze'
+import { deepFreeze } from './utils'
 
 export const DATASET_RECORDS: DatasetRecord[] = deepFreeze([
   {

package/src/libs/common/fixtures/src/lib/user-feedbacks.fixtures.ts

@@ -0,0 +1,83 @@
+import { UserFeedback } from '../../../../../libs/common/domain/src/lib/model/record'
+import { deepFreeze } from './utils'
+
+export const SOME_USER_FEEDBACKS: UserFeedback[] = deepFreeze([
+  {
+    uuid: '4ad03fb7-1728-424c-bdaa-aedd531b07a8',
+    comment: 'A nice comment.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: undefined,
+    date: new Date('2023-01-01T08:00:00Z'),
+  },
+  {
+    uuid: '52cbd0f1-9cb9-4409-8e85-bc608f049af4',
+    comment: 'A very nice comment that is a reply.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: '4ad03fb7-1728-424c-bdaa-aedd531b07a8',
+    date: new Date('2023-01-01T09:00:00Z'),
+  },
+  {
+    uuid: 'b48f62ec-b5e6-4d27-a396-2c2b44f6dcb5',
+    comment: 'Another nice comment.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: undefined,
+    date: new Date('2023-01-01T10:00:00Z'),
+  },
+  {
+    uuid: '1f12a3be-fc8a-4e83-968f-9b88ffbcab02',
+    comment: 'Another very nice reply.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: '4ad03fb7-1728-424c-bdaa-aedd531b07a8',
+    date: new Date('2023-01-01T11:00:00Z'),
+  },
+  {
+    uuid: 'f8dd778d-e93c-4b3c-ba9b-9574be070f46',
+    comment: 'Another nice comment.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: undefined,
+    date: new Date('2023-01-01T10:00:00Z'),
+  },
+  {
+    uuid: 'df3b8872-61d1-4ae9-8822-bb070b94d7d1',
+    comment: 'Another nice comment.',
+    metadataUUID: 'my-dataset-001',
+    authorUserId: '46798',
+    authorName: 'Arnaud De Maison',
+    authorEmail: 'a.demaison@geo2france.fr',
+    published: true,
+    parentUuid: undefined,
+    date: new Date('2023-01-01T11:00:00Z'),
+  },
+])
+
+export const A_USER_FEEDBACK: UserFeedback = deepFreeze({
+  uuid: '4ad03fb7-1728-424c-bdaa-aedd531b07a8',
+  comment: 'A nice comment.',
+  metadataUUID: 'my-dataset-001',
+  authorUserId: '46798',
+  authorName: 'Arnaud De Maison',
+  authorEmail: 'a.demaison@geo2france.fr',
+  published: true,
+  parentUuid: undefined,
+  date: new Date('2023-01-01T08:00:00Z'),
+})

package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-rich/form-field-rich.component.css

@@ -1,5 +0,0 @@
-.icon-small {
-  font-size: 16px;
-  height: 16px;
-  width: 16px;
-}

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

@@ -4,7 +4,7 @@
     [extraClass]="getButtonExtraClass()"
     (buttonClick)="togglePreview()"
   >
-    <span class="material-symbols-outlined mr-1 icon-small">{{
+    <span class="material-symbols-outlined mr-1 gn-ui-icon-small">{{
       preview ? 'visibility' : 'visibility_off'
     }}</span>
     {{ preview ? 'WYSIWYG' : 'Markdown' }}

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

@@ -24,6 +24,30 @@
       >cancel</mat-icon
     >
   </div>
+  <ng-container *ngIf="isTitle">
+    <div class="flex justify-between items-center gap-3">
+      <h2
+        #titleInput
+        class="grow text-3xl font-normal"
+        [gnUiEditableLabel]="true"
+        (editableLabelChanged)="formControl.setValue($event)"
+      >
+        {{ formControl.value }}
+      </h2>
+      <span
+        class="material-symbols-outlined gn-ui-icon-small m-2 cursor-pointer"
+        (click)="focusTitleInput()"
+        >edit</span
+      >
+      <span
+        class="material-symbols-outlined gn-ui-icon-small m-2"
+        [matTooltip]="config.hintKey | translate"
+        matTooltipPosition="above"
+      >
+        help
+      </span>
+    </div>
+  </ng-container>
   <ng-container *ngIf="isSimpleField">
     <gn-ui-form-field-simple
       [type]="simpleType"

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

@@ -1,11 +1,16 @@
+import { CommonModule } from '@angular/common'
 import {
   ChangeDetectionStrategy,
   Component,
+  ElementRef,
   Input,
   Output,
+  ViewChild,
 } from '@angular/core'
 import { FormControl, ReactiveFormsModule } from '@angular/forms'
 import { MatIconModule } from '@angular/material/icon'
+import { MatTooltipModule } from '@angular/material/tooltip'
+import { EditableLabelDirective } from '../../../../../../../../libs/ui/inputs/src'
 import { TranslateModule } from '@ngx-translate/core'
 import { Observable } from 'rxjs'
 import { FormFieldArrayComponent } from './form-field-array/form-field-array.component'
@@ -16,7 +21,6 @@ import { FormFieldSimpleComponent } from './form-field-simple/form-field-simple.
 import { FormFieldSpatialExtentComponent } from './form-field-spatial-extent/form-field-spatial-extent.component'
 import { FormFieldTemporalExtentComponent } from './form-field-temporal-extent/form-field-temporal-extent.component'
 import { FormFieldConfig } from './form-field.model'
-import { CommonModule } from '@angular/common'
 
 @Component({
   selector: 'gn-ui-form-field',
@@ -25,6 +29,11 @@ import { CommonModule } from '@angular/common'
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
+    CommonModule,
+    ReactiveFormsModule,
+    EditableLabelDirective,
+    MatIconModule,
+    MatTooltipModule,
     FormFieldSimpleComponent,
     FormFieldRichComponent,
     FormFieldObjectComponent,
@@ -32,10 +41,7 @@ import { CommonModule } from '@angular/common'
     FormFieldTemporalExtentComponent,
     FormFieldFileComponent,
     FormFieldArrayComponent,
-    CommonModule,
-    ReactiveFormsModule,
     TranslateModule,
-    MatIconModule,
   ],
 })
 export class FormFieldComponent {
@@ -48,12 +54,18 @@ export class FormFieldComponent {
   }
   @Output() valueChange: Observable<unknown>
 
+  @ViewChild('titleInput') titleInput: ElementRef
+
   formControl = new FormControl()
 
   constructor() {
     this.valueChange = this.formControl.valueChanges
   }
 
+  focusTitleInput() {
+    this.titleInput.nativeElement.children[0].focus()
+  }
+
   get simpleType() {
     return this.config.type as
       | 'date'
@@ -100,6 +112,9 @@ export class FormFieldComponent {
     return !this.config.locked && this.config.invalid
   }
 
+  get isTitle() {
+    return this.model === 'title'
+  }
   get isAbstract() {
     return this.model === 'abstract'
   }

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

@@ -2,16 +2,7 @@ import { CommonModule } from '@angular/common'
 import { ChangeDetectionStrategy, Component } from '@angular/core'
 import { EditorFacade } from '../../+state/editor.facade'
 import { EditorFieldState, EditorFieldValue } from '../../models/fields.model'
-import {
-  FormFieldArrayComponent,
-  FormFieldComponent,
-  FormFieldFileComponent,
-  FormFieldObjectComponent,
-  FormFieldRichComponent,
-  FormFieldSimpleComponent,
-  FormFieldSpatialExtentComponent,
-  FormFieldTemporalExtentComponent,
-} from './form-field'
+import { FormFieldComponent } from './form-field'
 
 @Component({
   selector: 'gn-ui-record-form',
@@ -19,17 +10,7 @@ import {
   styleUrls: ['./record-form.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
-  imports: [
-    CommonModule,
-    FormFieldComponent,
-    FormFieldArrayComponent,
-    FormFieldFileComponent,
-    FormFieldObjectComponent,
-    FormFieldRichComponent,
-    FormFieldSimpleComponent,
-    FormFieldSpatialExtentComponent,
-    FormFieldTemporalExtentComponent,
-  ],
+  imports: [CommonModule, FormFieldComponent],
 })
 export class RecordFormComponent {
   fields$ = this.facade.recordFields$

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

@@ -11,7 +11,10 @@ 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 { MD_VIEW_FEATURE_STATE_KEY, reducer } from './state/mdview.reducer'
+import {
+  METADATA_VIEW_FEATURE_STATE_KEY,
+  reducer,
+} from './state/mdview.reducer'
 import { MatTabsModule } from '@angular/material/tabs'
 import { MatIconModule } from '@angular/material/icon'
 import { UiWidgetsModule } from '../../../../../libs/ui/widgets/src'
@@ -35,7 +38,7 @@ import { DataViewShareComponent } from './data-view-share/data-view-share.compon
   ],
   imports: [
     CommonModule,
-    StoreModule.forFeature(MD_VIEW_FEATURE_STATE_KEY, reducer),
+    StoreModule.forFeature(METADATA_VIEW_FEATURE_STATE_KEY, reducer),
     EffectsModule.forFeature([MdViewEffects]),
     UiLayoutModule,
     FeatureMapModule,