geonetwork-ui 2.6.0-dev.10c659821 → 2.6.0-dev.14c46265d

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

@@ -970,3 +970,55 @@ export const SAMPLE_RECORD = {
     ...SAMPLE_PLACE_KEYWORDS_FROM_XML,
   ],
 }
+
+export const multilingualDatasetFixture: () => DatasetRecord = () => ({
+  kind: 'dataset',
+  defaultLanguage: 'en',
+  otherLanguages: ['fr', 'de'],
+  title: 'English Title',
+  abstract: 'English Abstract',
+  lineage: 'English Lineage',
+  translations: {
+    title: { fr: 'Titre Français', de: 'Titel DE' },
+    abstract: { fr: 'Résumé Français', de: 'Beschreibung DE' },
+    lineage: { fr: 'Généalogie Français', de: 'Lineage DE' },
+  },
+  keywords: [
+    {
+      label: 'Keyword EN',
+      description: 'Keyword Desc EN',
+      type: 'theme',
+      translations: {
+        label: { fr: 'Mot-clé FR', de: 'Schlusselwort DE' },
+        description: { fr: 'Description FR', de: 'Schlusselwort DE' },
+      },
+    },
+  ],
+  onlineResources: [],
+  licenses: [],
+  legalConstraints: [],
+  securityConstraints: [],
+  otherConstraints: [],
+  contacts: [],
+  contactsForResource: [],
+  ownerOrganization: {
+    name: 'Org EN',
+    translations: {
+      name: { fr: 'Org FR', de: 'Org DE' },
+    },
+  },
+  spatialExtents: [
+    {
+      description: 'Extent EN',
+      translations: {
+        description: { fr: 'Étendue FR', de: 'Bereich DE' },
+      },
+    },
+  ],
+  temporalExtents: [],
+  status: 'ongoing',
+  uniqueIdentifier: 'ABCD-EFGH',
+  overviews: [],
+  topics: [],
+  recordUpdated: null,
+})

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

@@ -10,10 +10,7 @@ import {
 } from '../../../../../libs/data-access/gn4/src'
 import { CommonModule } from '@angular/common'
 import { SourceLabelComponent } from './source-label/source-label.component'
-import { LangService, UtilI18nModule } from '../../../../../libs/util/i18n/src'
-import { UiLayoutModule } from '../../../../../libs/ui/layout/src'
-import { TranslateModule, TranslateService } from '@ngx-translate/core'
-import { UiElementsModule } from '../../../../../libs/ui/elements/src'
+import { TranslateService } from '@ngx-translate/core'
 import { OrganizationsServiceInterface } from '../../../../../libs/common/domain/src/lib/organizations.service.interface'
 import {
   ElasticsearchService,
@@ -35,8 +32,7 @@ const organizationsServiceFactory = (
   searchApiService: SearchApiService,
   groupsApiService: GroupsApiService,
   translateService: TranslateService,
-  platformService: PlatformServiceInterface,
-  langService: LangService
+  platformService: PlatformServiceInterface
 ) =>
   strategy === 'groups'
     ? new OrganizationsFromGroupsService(
@@ -50,20 +46,12 @@ const organizationsServiceFactory = (
         searchApiService,
         groupsApiService,
         platformService,
-        langService
+        translateService
       )
 
 @NgModule({
   declarations: [SiteTitleComponent, SourceLabelComponent],
-  imports: [
-    UiLayoutModule,
-    CommonModule,
-    UtilI18nModule,
-    TranslateModule.forChild(),
-    UiElementsModule,
-    OrganisationsFilterComponent,
-    CatalogTitleComponent,
-  ],
+  imports: [CommonModule, OrganisationsFilterComponent, CatalogTitleComponent],
   exports: [SiteTitleComponent, SourceLabelComponent],
   providers: [
     {
@@ -76,7 +64,6 @@ const organizationsServiceFactory = (
         GroupsApiService,
         TranslateService,
         PlatformServiceInterface,
-        LangService,
       ],
     },
   ],

package/src/libs/feature/catalog/src/lib/sources/sources.service.ts

@@ -1,9 +1,10 @@
 import { Injectable } from '@angular/core'
 import { SourcesApiService } from '../../../../../../libs/data-access/gn4/src'
-import { LangService } from '../../../../../../libs/util/i18n/src'
 import { Observable } from 'rxjs'
 import { filter, map, shareReplay } from 'rxjs/operators'
 import { CatalogSource } from './sources.model'
+import { TranslateService } from '@ngx-translate/core'
+import { getLang3FromLang2 } from '../../../../../../libs/util/i18n/src'
 
 @Injectable({
   providedIn: 'root',
@@ -15,14 +16,17 @@ export class SourcesService {
 
   constructor(
     private sourcesApiService: SourcesApiService,
-    private langService: LangService
+    private translateService: TranslateService
   ) {}
 
   getSourceLabel(uuid: string): Observable<string> {
     return this.sources$.pipe(
       map((sources) => sources.filter((source) => source.uuid === uuid)[0]),
       filter((source) => !!source),
-      map((source) => source.label[this.langService.iso3])
+      map(
+        (source) =>
+          source.label[getLang3FromLang2(this.translateService.currentLang)]
+      )
     )
   }
 }

package/src/libs/feature/dataviz/src/lib/chart-view/chart-view.component.ts

@@ -33,7 +33,7 @@ import {
   DatasetFeatureCatalog,
   DatasetOnlineResource,
 } from '../../../../../../libs/common/domain/src/lib/model/record'
-import { TranslateModule, TranslateService } from '@ngx-translate/core'
+import { TranslatePipe, TranslateService } from '@ngx-translate/core'
 import { CommonModule } from '@angular/common'
 import { ChartComponent } from '../../../../../../libs/ui/dataviz/src'
 import {
@@ -61,10 +61,10 @@ marker('chart.aggregation.count')
   imports: [
     CommonModule,
     DropdownSelectorComponent,
-    TranslateModule,
     ChartComponent,
     LoadingMaskComponent,
     PopupAlertComponent,
+    TranslatePipe,
   ],
   standalone: true,
 })

package/src/libs/feature/dataviz/src/lib/figure/figure-container/figure-container.component.ts

@@ -4,7 +4,7 @@ import {
   Input,
   OnChanges,
 } from '@angular/core'
-import { TableItemModel, UiDatavizModule } from '../../../../../../../libs/ui/dataviz/src'
+import { FigureComponent, TableItemModel } from '../../../../../../../libs/ui/dataviz/src'
 import { FigureService } from '../figure.service'
 
 @Component({
@@ -13,7 +13,7 @@ import { FigureService } from '../figure.service'
   styleUrls: ['./figure-container.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
-  imports: [UiDatavizModule],
+  imports: [FigureComponent],
 })
 export class FigureContainerComponent implements OnChanges {
   @Input() dataset: TableItemModel[]

package/src/libs/feature/dataviz/src/lib/service/data.service.ts

@@ -227,7 +227,7 @@ export class DataService {
           ? endpoint.getCollectionItem(collections[0], '1')
           : null
       })
-      .catch((error) => {
+      .catch(() => {
         throw new Error(`ogc.unreachable.unknown`)
       })
   }
@@ -237,7 +237,9 @@ export class DataService {
     keepOriginalLink = false
   ): Promise<DatasetServiceDistribution[]> {
     const endpoint = new TmsEndpoint(tmsLink.url.toString())
-    const tileMaps = await endpoint.allTileMaps
+    const tileMaps = await endpoint.allTileMaps.catch(() => {
+      throw new Error(`ogc.unreachable.unknown`)
+    })
     if (!tileMaps?.length) return null
 
     // TODO: at some point use the identifierInService field if more that one layers in the TMS service

package/src/libs/feature/dataviz/src/lib/table-view/table-view.component.ts

@@ -15,7 +15,7 @@ import {
   DatasetFeatureCatalog,
   DatasetOnlineResource,
 } from '../../../../../../libs/common/domain/src/lib/model/record'
-import { TranslateModule, TranslateService } from '@ngx-translate/core'
+import { TranslatePipe, TranslateService } from '@ngx-translate/core'
 import {
   LoadingMaskComponent,
   PopupAlertComponent,
@@ -32,7 +32,7 @@ import { CommonModule } from '@angular/common'
     DataTableComponent,
     LoadingMaskComponent,
     PopupAlertComponent,
-    TranslateModule,
+    TranslatePipe,
   ],
   standalone: true,
 })

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

@@ -7,8 +7,5 @@ export * from './lib/feature-editor.module'
 export * from './lib/services/editor.service'
 export * from './lib/components/import-record/import-record.component'
 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/components/record-form/form-field'
 export * from './lib/components/multilingual-panel/multilingual-panel.component'

package/src/libs/feature/editor/src/lib/+state/editor.actions.ts

@@ -1,5 +1,8 @@
 import { createAction, props } from '@ngrx/store'
-import { CatalogRecord } from '../../../../../../libs/common/domain/src/lib/model/record'
+import {
+  CatalogRecord,
+  LanguageCode,
+} from '../../../../../../libs/common/domain/src/lib/model/record'
 import { SaveRecordError } from './editor.models'
 import { EditorFieldIdentification } from '../models'
 
@@ -16,6 +19,11 @@ export const updateRecordField = createAction(
   props<{ field: string; value: unknown }>()
 )
 
+export const updateRecordLanguages = createAction(
+  '[Editor] Update record languages',
+  props<{ defaultLanguage: LanguageCode; otherLanguages: LanguageCode[] }>()
+)
+
 export const markRecordAsChanged = createAction(
   '[Editor] Mark record as changed'
 )

package/src/libs/feature/editor/src/lib/+state/editor.effects.ts

@@ -4,7 +4,7 @@ import { debounceTime, EMPTY, filter, of, withLatestFrom } from 'rxjs'
 import { catchError, map, switchMap } from 'rxjs/operators'
 import * as EditorActions from './editor.actions'
 import { EditorService } from '../services/editor.service'
-import { Store } from '@ngrx/store'
+import { Action, Store } from '@ngrx/store'
 import {
   selectEditorConfig,
   selectRecord,
@@ -31,15 +31,20 @@ export class EditorEffects {
       ),
       switchMap(([, record, recordSource, fieldsConfig]) =>
         this.editorService.saveRecord(record, recordSource, fieldsConfig).pipe(
-          switchMap(([record, recordSource]) =>
-            of(
-              EditorActions.saveRecordSuccess(),
-              EditorActions.openRecord({
-                record,
-                recordSource,
-              })
-            )
-          ),
+          switchMap(([savedRecord, savedRecordSource]) => {
+            const actions: Action[] = [EditorActions.saveRecordSuccess()]
+
+            if (!record?.uniqueIdentifier) {
+              actions.push(
+                EditorActions.openRecord({
+                  record: savedRecord,
+                  recordSource: savedRecordSource,
+                })
+              )
+            }
+
+            return of(...actions)
+          }),
           catchError((error) =>
             of(
               EditorActions.saveRecordFailure({
@@ -78,14 +83,20 @@ export class EditorEffects {
 
   markAsChanged$ = createEffect(() =>
     this.actions$.pipe(
-      ofType(EditorActions.updateRecordField),
+      ofType(
+        EditorActions.updateRecordField,
+        EditorActions.updateRecordLanguages
+      ),
       map(() => EditorActions.markRecordAsChanged())
     )
   )
 
   saveRecordDraft$ = createEffect(() =>
     this.actions$.pipe(
-      ofType(EditorActions.updateRecordField),
+      ofType(
+        EditorActions.updateRecordField,
+        EditorActions.updateRecordLanguages
+      ),
       debounceTime(1000),
       withLatestFrom(
         this.store.select(selectRecord),

package/src/libs/feature/editor/src/lib/+state/editor.facade.ts

@@ -2,7 +2,10 @@ import { inject, Injectable } from '@angular/core'
 import { select, Store } from '@ngrx/store'
 import * as EditorActions from './editor.actions'
 import * as EditorSelectors from './editor.selectors'
-import { CatalogRecord } from '../../../../../../libs/common/domain/src/lib/model/record'
+import {
+  CatalogRecord,
+  LanguageCode,
+} from '../../../../../../libs/common/domain/src/lib/model/record'
 import { filter } from 'rxjs'
 import { Actions, ofType } from '@ngrx/effects'
 import { EditorFieldIdentification } from '../models'
@@ -57,6 +60,15 @@ export class EditorFacade {
     this.store.dispatch(EditorActions.updateRecordField({ field, value }))
   }
 
+  updateRecordLanguages(
+    defaultLanguage: LanguageCode,
+    otherLanguages: LanguageCode[]
+  ) {
+    this.store.dispatch(
+      EditorActions.updateRecordLanguages({ defaultLanguage, otherLanguages })
+    )
+  }
+
   setCurrentPage(page: number) {
     this.store.dispatch(EditorActions.setCurrentPage({ page }))
   }

package/src/libs/feature/editor/src/lib/+state/editor.reducer.ts

@@ -4,6 +4,7 @@ import { CatalogRecord } from '../../../../../../libs/common/domain/src/lib/mode
 import { SaveRecordError } from './editor.models'
 import { EditorConfig } from '../models'
 import { DEFAULT_CONFIGURATION } from '../fields.config'
+import { updateLanguages } from '../../../../../../libs/util/shared/src'
 
 export const EDITOR_FEATURE_KEY = 'editor'
 
@@ -116,7 +117,14 @@ const reducer = createReducer(
   on(EditorActions.canEditRecord, (state, { canEditRecord }) => ({
     ...state,
     canEditRecord: canEditRecord,
-  }))
+  })),
+  on(
+    EditorActions.updateRecordLanguages,
+    (state, { defaultLanguage, otherLanguages }) => ({
+      ...state,
+      record: updateLanguages(state.record, defaultLanguage, otherLanguages),
+    })
+  )
 )
 
 export function editorReducer(state: EditorState | undefined, action: Action) {

package/src/libs/feature/editor/src/lib/components/constraint-card/constraint-card.component.ts

@@ -6,11 +6,10 @@ import {
   Output,
 } from '@angular/core'
 import { CommonModule } from '@angular/common'
-import { MarkdownEditorComponent } from '../../../../../../../libs/ui/elements/src'
 import { FormFieldRichComponent } from '../record-form/form-field/form-field-rich/form-field-rich.component'
 import { ButtonComponent, UrlInputComponent } from '../../../../../../../libs/ui/inputs/src'
 import { MatIconModule } from '@angular/material/icon'
-import { TranslateModule } from '@ngx-translate/core'
+import { TranslateDirective, TranslatePipe } from '@ngx-translate/core'
 import { Constraint } from '../../../../../../../libs/common/domain/src/lib/model/record'
 import {
   NgIconComponent,
@@ -25,12 +24,12 @@ import { marker } from '@biesbjerg/ngx-translate-extract-marker'
   standalone: true,
   imports: [
     CommonModule,
-    MarkdownEditorComponent,
     FormFieldRichComponent,
     UrlInputComponent,
     ButtonComponent,
     MatIconModule,
-    TranslateModule,
+    TranslateDirective,
+    TranslatePipe,
     NgIconComponent,
   ],
   providers: [

package/src/libs/feature/editor/src/lib/components/generic-keywords/generic-keywords.component.ts

@@ -7,21 +7,12 @@ import {
   Output,
 } from '@angular/core'
 import { PlatformServiceInterface } from '../../../../../../../libs/common/domain/src/lib/platform.service.interface'
-import {
-  AutocompleteComponent,
-  DropdownSelectorComponent,
-  UiInputsModule,
-} from '../../../../../../../libs/ui/inputs/src'
-import { UiWidgetsModule } from '../../../../../../../libs/ui/widgets/src'
+import { AutocompleteComponent, BadgeComponent } from '../../../../../../../libs/ui/inputs/src'
 import { map } from 'rxjs'
 import { Keyword } from '../../../../../../../libs/common/domain/src/lib/model/record'
 import { KeywordType } from '../../../../../../../libs/common/domain/src/lib/model/thesaurus'
-import { TranslateModule } from '@ngx-translate/core'
-import {
-  NgIconComponent,
-  provideIcons,
-  provideNgIconsConfig,
-} from '@ng-icons/core'
+import { TranslatePipe } from '@ngx-translate/core'
+import { NgIconComponent, provideIcons } from '@ng-icons/core'
 import { matWarningAmberOutline } from '@ng-icons/material-icons/outline'
 
 type AutocompleteItem = { title: string; value: Keyword }
@@ -33,13 +24,11 @@ type AutocompleteItem = { title: string; value: Keyword }
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: true,
   imports: [
-    DropdownSelectorComponent,
-    UiInputsModule,
     CommonModule,
-    UiWidgetsModule,
     AutocompleteComponent,
-    TranslateModule,
     NgIconComponent,
+    BadgeComponent,
+    TranslatePipe,
   ],
   providers: [
     provideIcons({

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

@@ -7,8 +7,11 @@ import {
 } from '@angular/core'
 import { CommonModule } from '@angular/common'
 import { ButtonComponent, UrlInputComponent } from '../../../../../../../libs/ui/inputs/src'
-import { ThumbnailComponent } from '../../../../../../../libs/ui/elements/src'
-import { TranslateModule, TranslateService } from '@ngx-translate/core'
+import {
+  TranslateDirective,
+  TranslatePipe,
+  TranslateService,
+} from '@ngx-translate/core'
 import { NotificationsService } from '../../../../../../../libs/feature/notifications/src'
 import { RecordsRepositoryInterface } from '../../../../../../../libs/common/domain/src/lib/repository/records-repository.interface'
 import { Router } from '@angular/router'
@@ -19,7 +22,6 @@ import {
 } from '@ng-icons/core'
 import {
   iconoirArrowLeft,
-  iconoirAttachment,
   iconoirImport,
   iconoirLightBulbOn,
 } from '@ng-icons/iconoir'
@@ -43,9 +45,9 @@ type ImportMenuPage = 'mainMenu' | 'importExternalFile'
   imports: [
     CommonModule,
     ButtonComponent,
-    ThumbnailComponent,
     UrlInputComponent,
-    TranslateModule,
+    TranslateDirective,
+    TranslatePipe,
     NgIconComponent,
   ],
   providers: [

package/src/libs/feature/editor/src/lib/components/multilingual-panel/multilingual-panel.component.ts

@@ -3,6 +3,7 @@ import {
   Component,
   ElementRef,
   Input,
+  OnChanges,
   OnDestroy,
   QueryList,
   ViewChildren,
@@ -10,7 +11,11 @@ import {
 } from '@angular/core'
 import { CommonModule } from '@angular/common'
 import { ButtonComponent, CheckToggleComponent } from '../../../../../../../libs/ui/inputs/src'
-import { TranslateModule, TranslateService } from '@ngx-translate/core'
+import {
+  TranslateDirective,
+  TranslatePipe,
+  TranslateService,
+} from '@ngx-translate/core'
 import { CatalogRecord } from '../../../../../../../libs/common/domain/src/lib/model/record'
 import {
   NgIconComponent,
@@ -54,7 +59,8 @@ const extraFlagMap: { [key: string]: string } = {
   imports: [
     CommonModule,
     CheckToggleComponent,
-    TranslateModule,
+    TranslateDirective,
+    TranslatePipe,
     ButtonComponent,
     NgIconComponent,
     ActionMenuComponent,
@@ -189,11 +195,11 @@ export class MultilingualPanelComponent implements OnDestroy {
   }
 
   updateTranslations() {
-    this.facade.updateRecordField(
-      'otherLanguages',
-      this.selectedLanguages.filter((lang) => lang !== this.formLanguage)
+    const newLanguageSelection = this.selectedLanguages.filter(
+      (lang) => lang !== this.formLanguage
     )
-    this.recordLanguages = this.selectedLanguages
+    this.facade.updateRecordLanguages(this.formLanguage, newLanguageSelection)
+    this.recordLanguages = newLanguageSelection
     this.editTranslations = false
   }
 
@@ -203,9 +209,8 @@ export class MultilingualPanelComponent implements OnDestroy {
 
   switchDefaultLang(lang: string) {
     this.formLanguage = lang
-    this.facade.updateRecordField('defaultLanguage', lang)
-    this.facade.updateRecordField(
-      'otherLanguages',
+    this.facade.updateRecordLanguages(
+      lang,
       this.selectedLanguages.filter((lang) => lang !== this.formLanguage)
     )
     this.closeActionMenu()
@@ -226,6 +231,7 @@ export class MultilingualPanelComponent implements OnDestroy {
         cancelText: this.translateService.instant(
           'editor.record.multilingual.confirmation.cancelText'
         ),
+        focusCancel: true,
       },
       restoreFocus: true,
     })
@@ -239,7 +245,7 @@ export class MultilingualPanelComponent implements OnDestroy {
             }
             this.updateTranslations()
           } else {
-            this.facade.updateRecordField('otherLanguages', [])
+            this.facade.updateRecordLanguages(this.formLanguage, [])
             this.isMultilingual = false
             this.selectedLanguages = []
           }

package/src/libs/feature/editor/src/lib/components/online-resource-card/online-resource-card.component.ts

@@ -11,10 +11,8 @@ import {
   OnlineLinkResource,
   OnlineResource,
 } from '../../../../../../../libs/common/domain/src/lib/model/record'
-import { ThumbnailComponent } from '../../../../../../../libs/ui/elements/src'
 import { bytesToMegabytes, getFileFormat } from '../../../../../../../libs/util/shared/src'
-import { ButtonComponent } from '../../../../../../../libs/ui/inputs/src'
-import { TranslateModule } from '@ngx-translate/core'
+import { TranslateDirective, TranslatePipe } from '@ngx-translate/core'
 import {
   NgIconComponent,
   provideIcons,
@@ -25,13 +23,7 @@ import { iconoirAttachment } from '@ng-icons/iconoir'
 @Component({
   selector: 'gn-ui-online-resource-card',
   standalone: true,
-  imports: [
-    CommonModule,
-    ThumbnailComponent,
-    ButtonComponent,
-    TranslateModule,
-    NgIconComponent,
-  ],
+  imports: [CommonModule, TranslateDirective, TranslatePipe, NgIconComponent],
   providers: [
     provideIcons({
       iconoirAttachment,

package/src/libs/feature/editor/src/lib/components/online-service-resource-input/online-service-resource-input.component.ts

@@ -28,7 +28,7 @@ import {
   provideNgIconsConfig,
 } from '@ng-icons/core'
 import { iconoirRefresh } from '@ng-icons/iconoir'
-import { TranslateModule } from '@ngx-translate/core'
+import { TranslateDirective, TranslatePipe } from '@ngx-translate/core'
 import {
   BehaviorSubject,
   debounceTime,
@@ -57,7 +57,8 @@ marker(
     MatRadioModule,
     NgIconComponent,
     TextInputComponent,
-    TranslateModule,
+    TranslateDirective,
+    TranslatePipe,
     UrlInputComponent,
   ],
   providers: [

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

@@ -13,9 +13,9 @@ import {
   CatalogRecordKeys,
   Constraint,
 } from '../../../../../../../../../libs/common/domain/src/lib/model/record'
-import { ButtonComponent, UiInputsModule } from '../../../../../../../../../libs/ui/inputs/src'
+import { ButtonComponent } from '../../../../../../../../../libs/ui/inputs/src'
 import { marker } from '@biesbjerg/ngx-translate-extract-marker'
-import { TranslateModule } from '@ngx-translate/core'
+import { TranslatePipe } from '@ngx-translate/core'
 import {
   NgIconComponent,
   provideIcons,
@@ -36,10 +36,9 @@ marker('editor.record.form.constraint.header.otherConstraints')
     CommonModule,
     SortableListComponent,
     ConstraintCardComponent,
-    UiInputsModule,
     ButtonComponent,
-    TranslateModule,
     NgIconComponent,
+    TranslatePipe,
   ],
   providers: [
     provideIcons({ iconoirPlus }),

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

@@ -7,7 +7,7 @@ import {
 import { CommonModule } from '@angular/common'
 import { EditorFacade } from '../../../../+state/editor.facade'
 import { ButtonComponent, CheckToggleComponent } from '../../../../../../../../../libs/ui/inputs/src'
-import { TranslateModule } from '@ngx-translate/core'
+import { TranslatePipe } from '@ngx-translate/core'
 import {
   combineLatest,
   distinctUntilChanged,
@@ -53,7 +53,7 @@ export type ConstraintChoice =
     CommonModule,
     CheckToggleComponent,
     ButtonComponent,
-    TranslateModule,
+    TranslatePipe,
     NgIconComponent,
   ],
   providers: [