geonetwork-ui 2.4.1-dev.c1a684900 → 2.4.1-dev.e5315d8c8

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

@@ -26,35 +26,47 @@ type Licence = {
 })
 export class FormFieldLicenseComponent implements OnInit {
   @Input() label: string
-  @Input() recordConstraints: Constraint[] = []
-  @Output() recordConstraintsChange: EventEmitter<Constraint[]> =
+  @Input() recordLicences: Constraint[] = []
+  @Output() recordLicencesChange: EventEmitter<Constraint[]> =
     new EventEmitter()
 
+  choices: Licence[] = AVAILABLE_LICENSES.map((license) => ({
+    label: marker(`editor.record.form.license.${license}`),
+    value: license,
+  }))
+
   selectedLicence: string
 
   ngOnInit(): void {
-    // get the licence from the record constraints if it is one of the open data licence list
-    this.selectedLicence = this.recordConstraints.find((constraint) => {
-      return this.licenceOptions.find((licence) => {
-        return licence.value === constraint.text
-      })
-    })?.text
-    // otherwise pre-select the first licence option
-    if (this.selectedLicence === undefined) {
-      this.selectedLicence = this.licenceOptions[0].value // cannot select 'etalab' as default as this would toggle the OpenData Toggle
-      this.recordConstraintsChange.emit([{ text: this.selectedLicence }])
+    if (this.recordLicences.length === 0) {
+      this.selectedLicence = 'unknown'
+    } else {
+      this.selectedLicence = this.recordLicences.find((constraint) => {
+        return this.choices.find((licence) => {
+          return licence.value === constraint.text
+        })
+      })?.text
     }
-  }
 
-  get licenceOptions(): Licence[] {
-    return AVAILABLE_LICENSES.map((license) => ({
-      label: marker(`editor.record.form.license.${license}`),
-      value: license,
-    }))
+    if (this.selectedLicence === undefined) {
+      this.choices = [
+        {
+          value: this.recordLicences[0].text,
+          label: this.recordLicences[0].text,
+        },
+        ...this.choices,
+      ]
+      this.selectedLicence = this.recordLicences[0].text
+    }
   }
 
   handleLicenceSelection(licenceValue: string) {
     this.selectedLicence = licenceValue
-    this.recordConstraintsChange.emit([{ text: licenceValue }])
+    if (licenceValue === 'unknown') {
+      this.recordLicencesChange.emit([])
+      return
+    } else {
+      this.recordLicencesChange.emit([{ text: licenceValue }])
+    }
   }
 }

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

@@ -5,7 +5,6 @@
     (uploadCancel)="handleUploadCancel()"
     [uploadProgress]="uploadProgress"
     (urlChange)="handleUrlChange($event)"
-    [disabled]="disabled$ | async"
   ></gn-ui-file-input>
   <div class="h-[8px]"></div>
   <gn-ui-sortable-list
@@ -42,17 +41,9 @@
         class="w-full"
         [disabled]="true"
         [value]="onlineResource.url"
-        [showUploadButton]="false"
         [disabled]="disabled$ | async"
+        [showValidateButton]="false"
       ></gn-ui-url-input>
     </div>
   </ng-template>
-  <div
-    *ngIf="disabled$ | async"
-    class="p-4 text-sm border border-primary bg-primary-lightest rounded-lg"
-    translate
-    data-test="disabled-message"
-  >
-    editor.record.form.field.draft.only.disabled
-  </div>
 </div>

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

@@ -30,7 +30,6 @@ import { PlatformServiceInterface } from '../../../../../../../../../libs/common
 import { map, Subscription } from 'rxjs'
 import { MatDialog } from '@angular/material/dialog'
 import { MAX_UPLOAD_SIZE_MB } from '../../../../fields.config'
-import { EditorFacade } from '../../../../+state/editor.facade'
 
 @Component({
   selector: 'gn-ui-form-field-online-link-resources',
@@ -69,17 +68,12 @@ export class FormFieldOnlineLinkResourcesComponent {
 
   protected MAX_UPLOAD_SIZE_MB = MAX_UPLOAD_SIZE_MB
 
-  disabled$ = this.editorFacade.alreadySavedOnce$.pipe(
-    map((alreadySavedOnce) => !alreadySavedOnce)
-  )
-
   constructor(
     private notificationsService: NotificationsService,
     private translateService: TranslateService,
     private platformService: PlatformServiceInterface,
     private cd: ChangeDetectorRef,
-    private dialog: MatDialog,
-    private editorFacade: EditorFacade
+    private dialog: MatDialog
   ) {}
 
   handleFileChange(file: File) {

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

@@ -4,7 +4,6 @@
     (selectedValue)="onSelectedTypeChange($event.value)"
     extraClasses="grow text-sm"
     data-cy="online-resources-type"
-    [disabled]="disabled$ | async"
   ></gn-ui-switch-toggle>
   <div class="h-[8px]"></div>
   <gn-ui-file-input
@@ -14,7 +13,6 @@
     (uploadCancel)="handleUploadCancel()"
     [uploadProgress]="uploadProgress"
     (urlChange)="handleDownloadUrlChange($event)"
-    [disabled]="disabled$ | async"
   ></gn-ui-file-input>
   <div
     *ngIf="selectedType === 'service'"
@@ -23,13 +21,8 @@
     <gn-ui-online-service-resource-input
       [service]="newService"
       [disabled]="disabled$ | async"
+      (identifierSubmit)="handleIdentifierSubmit($event)"
     ></gn-ui-online-service-resource-input>
-    <span class="w-full border-b border-gray-300"></span>
-    <gn-ui-url-input
-      class="w-full"
-      (uploadClick)="handleServiceUrlChange($event)"
-      [disabled]="disabled$ | async"
-    ></gn-ui-url-input>
   </div>
   <div class="h-[8px]"></div>
   <gn-ui-sortable-list
@@ -61,28 +54,22 @@
           [(value)]="onlineResource.description"
         ></gn-ui-text-area>
       </div>
-      <ng-container *ngIf="onlineResource.type === 'service'">
+      <ng-container *ngIf="onlineResource.type === 'service'; else urlInput">
         <span class="w-full border-b border-gray-300"></span>
         <gn-ui-online-service-resource-input
           [service]="onlineResource"
-          [disabled]="disabled$ | async"
+          [modifyMode]="true"
         ></gn-ui-online-service-resource-input>
       </ng-container>
-      <span class="w-full border-b border-gray-300"></span>
-      <gn-ui-url-input
-        class="w-full"
-        [disabled]="true"
-        [value]="onlineResource.url"
-        [showUploadButton]="false"
-      ></gn-ui-url-input>
+      <ng-template #urlInput>
+        <span class="w-full border-b border-gray-300"></span>
+        <gn-ui-url-input
+          class="w-full"
+          [disabled]="true"
+          [value]="onlineResource.url"
+          [showValidateButton]="false"
+        ></gn-ui-url-input>
+      </ng-template>
     </div>
   </ng-template>
-  <div
-    *ngIf="disabled$ | async"
-    class="p-4 text-sm border border-primary bg-primary-lightest rounded-lg"
-    translate
-    data-test="disabled-message"
-  >
-    editor.record.form.field.draft.only.disabled
-  </div>
 </div>

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

@@ -32,11 +32,10 @@ import {
   SortableListComponent,
 } from '../../../../../../../../../libs/ui/layout/src'
 import { TranslateModule, TranslateService } from '@ngx-translate/core'
-import { map, Subscription } from 'rxjs'
+import { Subscription } from 'rxjs'
 import { MAX_UPLOAD_SIZE_MB } from '../../../../fields.config'
 import { OnlineResourceCardComponent } from '../../../online-resource-card/online-resource-card.component'
 import { OnlineServiceResourceInputComponent } from '../../../online-service-resource-input/online-service-resource-input.component'
-import { EditorFacade } from '../../../../+state/editor.facade'
 
 type OnlineNotLinkResource =
   | DatasetDownloadDistribution
@@ -93,25 +92,21 @@ export class FormFieldOnlineResourcesComponent {
   notLinkResources: OnlineNotLinkResource[] = []
   uploadProgress = undefined
   uploadSubscription: Subscription = null
-  newService = {
+  newService = <DatasetServiceDistribution>{
     type: 'service',
     accessServiceProtocol: 'ogcFeatures',
     identifierInService: '',
-  } as Omit<DatasetServiceDistribution, 'url'>
+    url: undefined,
+  }
 
   protected MAX_UPLOAD_SIZE_MB = MAX_UPLOAD_SIZE_MB
 
-  disabled$ = this.editorFacade.alreadySavedOnce$.pipe(
-    map((alreadySavedOnce) => !alreadySavedOnce)
-  )
-
   constructor(
     private notificationsService: NotificationsService,
     private translateService: TranslateService,
     private platformService: PlatformServiceInterface,
     private cd: ChangeDetectorRef,
-    private dialog: MatDialog,
-    private editorFacade: EditorFacade
+    private dialog: MatDialog
   ) {}
 
   onSelectedTypeChange(selectedType: unknown) {
@@ -174,6 +169,16 @@ export class FormFieldOnlineResourcesComponent {
     ])
   }
 
+  handleIdentifierSubmit(payload: { url: string; identifier: string }) {
+    this.valueChange.emit([
+      ...this.allResources,
+      {
+        ...this.newService,
+        url: new URL(payload.url),
+      },
+    ])
+  }
+
   handleServiceModify(
     oldService: DatasetServiceDistribution,
     newService: DatasetServiceDistribution

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

@@ -9,14 +9,5 @@
     (delete)="handleDelete()"
     [uploadProgress]="uploadProgress"
     (uploadCancel)="handleUploadCancel()"
-    [disabled]="disabled$ | async"
   ></gn-ui-image-input>
-  <div
-    *ngIf="disabled$ | async"
-    class="p-4 text-sm border border-primary bg-primary-lightest rounded-lg"
-    translate
-    data-test="disabled-message"
-  >
-    editor.record.form.field.draft.only.disabled
-  </div>
 </div>

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

@@ -8,13 +8,12 @@ import {
   Output,
 } from '@angular/core'
 import { GraphicOverview } from '../../../../../../../../../libs/common/domain/src/lib/model/record'
-import { ImageInputComponent } from '../../../../../../../../../libs/ui/inputs/src'
+import { ImageInputComponent } from '../../../../../../../../../libs/ui/elements/src'
 import { PlatformServiceInterface } from '../../../../../../../../../libs/common/domain/src/lib/platform.service.interface'
 import { NotificationsService } from '../../../../../../../../../libs/feature/notifications/src'
 import { TranslateModule, TranslateService } from '@ngx-translate/core'
-import { map, Subscription } from 'rxjs'
+import { Subscription } from 'rxjs'
 import { MAX_UPLOAD_SIZE_MB } from '../../../../fields.config'
-import { EditorFacade } from '../../../../+state/editor.facade'
 
 @Component({
   selector: 'gn-ui-form-field-overviews',
@@ -30,10 +29,6 @@ export class FormFieldOverviewsComponent {
   @Output() valueChange: EventEmitter<Array<GraphicOverview>> =
     new EventEmitter()
 
-  disabled$ = this.editorFacade.alreadySavedOnce$.pipe(
-    map((alreadySavedOnce) => !alreadySavedOnce)
-  )
-
   uploadProgress = undefined
   uploadSubscription: Subscription = null
 
@@ -52,8 +47,7 @@ export class FormFieldOverviewsComponent {
     private platformService: PlatformServiceInterface,
     private notificationsService: NotificationsService,
     private translateService: TranslateService,
-    private cd: ChangeDetectorRef,
-    private editorFacade: EditorFacade
+    private cd: ChangeDetectorRef
   ) {}
 
   handleFileChange(file: File) {

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

@@ -1,4 +1,4 @@
-<div class="flex flex-col gap-8">
+<div class="flex flex-col gap-3">
   <gn-ui-generic-keywords
     [placeholder]="'Search for place keywords'"
     [keywords]="shownKeywords$ | async"
@@ -7,9 +7,9 @@
     (addedKeyword)="handleKeywordAdd($event)"
   >
   </gn-ui-generic-keywords>
-</div>
-<div class="w-full h-96 mt-2">
-  <gn-ui-form-field-map-container
-    [spatialExtents]="spatialExtents$ | async"
-  ></gn-ui-form-field-map-container>
+  <div class="w-full h-96 mt-2">
+    <gn-ui-form-field-map-container
+      [spatialExtents]="spatialExtents$ | async"
+    ></gn-ui-form-field-map-container>
+  </div>
 </div>

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

@@ -8,6 +8,8 @@ import {
 } from '@angular/core'
 import {
   UpdateFrequency,
+  UpdateFrequencyCode,
+  updateFrequencyCodeValues,
   UpdateFrequencyCustom,
 } from '../../../../../../../../../libs/common/domain/src/lib/model/record'
 import {
@@ -18,6 +20,10 @@ import {
 import { TranslateModule, TranslateService } from '@ngx-translate/core'
 import { firstValueFrom } from 'rxjs'
 
+const initialListValues = updateFrequencyCodeValues.filter(
+  (code) => !['unknown', 'notPlanned', 'asNeeded', 'irregular'].includes(code)
+)
+
 @Component({
   selector: 'gn-ui-form-field-update-frequency',
   templateUrl: './form-field-update-frequency.component.html',
@@ -33,20 +39,39 @@ export class FormFieldUpdateFrequencyComponent implements OnInit {
   protected choices: DropdownChoice[] = []
 
   get planned() {
-    return typeof this.value !== 'string'
+    return this.value && this.value !== 'notPlanned' && this.value !== 'unknown'
   }
 
   constructor(private translateService: TranslateService) {}
 
   async ngOnInit() {
     this.choices = await this.getInitialChoices()
+    if (!this.planned) {
+      return
+    }
+    if (
+      typeof this.value === 'string' &&
+      !this.choices.map((choice) => choice.value).includes(this.value)
+    ) {
+      this.choices = [
+        {
+          value: this.value,
+          label: await firstValueFrom(
+            this.translateService.get(
+              `domain.record.updateFrequency.${this.value}`
+            )
+          ),
+        },
+        ...this.choices,
+      ]
+    }
     if (typeof this.value === 'string') {
       return
     }
     const updatedTimes = this.value.updatedTimes
     const per = this.value.per
     // the update frequency is not in the list; make it appear there
-    if (updatedTimes && updatedTimes !== 1 && updatedTimes !== 2) {
+    if (updatedTimes) {
       this.choices = [
         {
           value: `${per}.${updatedTimes}`,
@@ -65,90 +90,37 @@ export class FormFieldUpdateFrequencyComponent implements OnInit {
     if (this.planned) {
       this.valueChange.emit('notPlanned')
     } else {
-      this.valueChange.emit({ updatedTimes: 1, per: 'day' })
+      this.valueChange.emit(this.choices[0].value as UpdateFrequencyCode)
     }
   }
 
   get selectedFrequency(): string {
-    if (!this.value || typeof this.value === 'string') return null
+    if (!this.value) return null
+    if (typeof this.value === 'string') return this.value
     const { updatedTimes, per } = this.value
     return `${per}.${updatedTimes}`
   }
 
-  onSelectFrequencyValue(value: unknown) {
-    const split = (value as string).split('.')
-    this.valueChange.emit({
-      updatedTimes: Number(split[1]),
-      per: split[0] as UpdateFrequencyCustom['per'],
-    })
+  onSelectFrequencyValue(value: string) {
+    if (!value.includes('.')) {
+      this.valueChange.emit(value as UpdateFrequencyCode)
+    } else {
+      const split = (value as string).split('.')
+      this.valueChange.emit({
+        updatedTimes: Number(split[1]),
+        per: split[0] as UpdateFrequencyCustom['per'],
+      })
+    }
   }
 
   private async getInitialChoices() {
-    return [
-      {
-        value: 'day.1',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.day', {
-            count: 1,
-          })
-        ),
-      },
-      {
-        value: 'day.2',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.day', {
-            count: 2,
-          })
-        ),
-      },
-      {
-        value: 'week.1',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.week', {
-            count: 1,
-          })
-        ),
-      },
-      {
-        value: 'week.2',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.week', {
-            count: 2,
-          })
-        ),
-      },
-      {
-        value: 'month.1',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.month', {
-            count: 1,
-          })
-        ),
-      },
-      {
-        value: 'month.2',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.month', {
-            count: 2,
-          })
-        ),
-      },
-      {
-        value: 'year.1',
-        label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.year', {
-            count: 1,
-          })
-        ),
-      },
-      {
-        value: 'year.2',
+    return Promise.all(
+      initialListValues.map(async (value) => ({
+        value,
         label: await firstValueFrom(
-          this.translateService.get('domain.record.updateFrequency.year', {
-            count: 2,
-          })
+          this.translateService.get(`domain.record.updateFrequency.${value}`)
         ),
-      },
-    ]
+      }))
+    )
   }
 }

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

@@ -30,8 +30,11 @@
           #autosize="cdkTextareaAutosize"
           cdkAutosizeMinRows="1"
           data-test="recordTitleInput"
-          class="grow font-title text-3xl font-normal overflow-hidden"
+          class="grow font-title text-3xl font-normal overflow-hidden text-black/80"
           (change)="valueChange.emit($event.target.value)"
+          [placeholder]="
+            'editor.record.form.field.title.placeholder' | translate
+          "
           >{{ valueAsString }}</textarea
         >
         <div class="flex flex-row justify-between self-start mt-0.5">
@@ -109,8 +112,8 @@
     <ng-container *ngSwitchCase="'licenses'">
       <gn-ui-form-field-license
         [label]="config.labelKey! | translate"
-        [recordConstraints]="valueAsConstraints"
-        (recordConstraintsChange)="valueChange.emit($event)"
+        [recordLicences]="valueAsConstraints"
+        (recordLicencesChange)="valueChange.emit($event)"
       ></gn-ui-form-field-license>
     </ng-container>
 

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

@@ -6,14 +6,11 @@
     "
   >
     <ng-container *ngIf="!section.hidden">
-      <div class="flex flex-col gap-8 border p-8 rounded-[8px] shadow">
-        <div
-          class="flex flex-col gap-2"
-          [ngClass]="section.labelKey ? 'mb-4' : 'hidden'"
-        >
+      <div class="flex flex-col gap-6 border p-8 rounded-[8px] shadow">
+        <div class="flex flex-col gap-2">
           <div
             *ngIf="section.labelKey"
-            class="text-2xl font-title text-main"
+            class="text-2xl font-title text-black"
             translate
           >
             {{ section.labelKey }}

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

@@ -61,9 +61,7 @@ export const RECORD_LICENSE_FIELD: EditorField = {
 
 export const RECORD_KEYWORDS_FIELD: EditorField = {
   model: 'keywords',
-  formFieldConfig: {
-    labelKey: marker('editor.record.form.field.keywords'),
-  },
+  formFieldConfig: {},
 }
 
 export const RECORD_RESOURCE_CREATED_FIELD: EditorField = {
@@ -156,25 +154,19 @@ export const RECORD_SPATIAL_TOGGLE_FIELD: EditorField = {
 
 export const RECORD_SPATIAL_EXTENTS_FIELD: EditorField = {
   model: 'spatialExtents',
-  formFieldConfig: {
-    labelKey: marker('editor.record.form.field.spatialExtents'),
-  },
+  formFieldConfig: {},
 }
 
 export const RECORD_ONLINE_RESOURCES: EditorField = {
   model: 'onlineResources',
   modelSpecifier: 'onlineResourceType:!link',
-  formFieldConfig: {
-    labelKey: marker('editor.record.form.field.onlineResources'),
-  },
+  formFieldConfig: {},
 }
 
 export const RECORD_ONLINE_LINK_RESOURCES: EditorField = {
   model: 'onlineResources',
   modelSpecifier: 'onlineResourceType:link',
-  formFieldConfig: {
-    labelKey: marker('editor.record.form.field.onlineLinkResources'),
-  },
+  formFieldConfig: {},
 }
 
 /************************************************************
@@ -273,7 +265,12 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
   pages: [
     {
       labelKey: marker('editor.record.form.page.description'),
-      sections: [TITLE_SECTION, ABOUT_SECTION, GEOGRAPHICAL_COVERAGE_SECTION],
+      sections: [
+        TITLE_SECTION,
+        ABOUT_SECTION,
+        CLASSIFICATION_SECTION,
+        GEOGRAPHICAL_COVERAGE_SECTION,
+      ],
     },
     {
       labelKey: marker('editor.record.form.page.ressources'),
@@ -282,7 +279,6 @@ export const DEFAULT_CONFIGURATION: EditorConfig = {
     {
       labelKey: marker('editor.record.form.page.accessAndContact'),
       sections: [
-        CLASSIFICATION_SECTION,
         USE_AND_ACCESS_CONDITIONS_SECTION,
         DATA_MANAGERS_SECTION,
         METADATA_POINT_OF_CONTACT_SECTION,

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

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core'
-import { Observable, switchMap } from 'rxjs'
+import { forkJoin, Observable, of, switchMap } from 'rxjs'
 import { map, tap } from 'rxjs/operators'
 import { CatalogRecord } from '../../../../../../libs/common/domain/src/lib/model/record'
 import { EditorConfig } from '../models/'
@@ -16,8 +16,7 @@ export class EditorService {
   saveRecord(
     record: CatalogRecord,
     recordSource: string,
-    fieldsConfig: EditorConfig,
-    generateNewUniqueIdentifier = false
+    fieldsConfig: EditorConfig
   ): Observable<[CatalogRecord, string]> {
     const savedRecord = { ...record }
 
@@ -35,22 +34,25 @@ export class EditorService {
         })
       }
     }
-
-    // if we want a new unique identifier, clear the existing one
-    if (generateNewUniqueIdentifier) {
+    let publishToAll = true
+    // if the record is new, generate a new unique identifier and pass publishToAll as false
+    if (!record.uniqueIdentifier) {
       savedRecord.uniqueIdentifier = null
+      publishToAll = false
     }
 
-    return this.recordsRepository.saveRecord(savedRecord, recordSource).pipe(
-      switchMap((uniqueIdentifier) =>
-        this.recordsRepository.openRecordForEdition(uniqueIdentifier)
-      ),
-      tap(() => {
-        // if saving was successful, the original draft can be discarded
-        this.recordsRepository.clearRecordDraft(record.uniqueIdentifier)
-      }),
-      map(([record, recordSource]) => [record, recordSource])
-    )
+    return this.recordsRepository
+      .saveRecord(savedRecord, recordSource, publishToAll)
+      .pipe(
+        switchMap((uniqueIdentifier) =>
+          this.recordsRepository.openRecordForEdition(uniqueIdentifier)
+        ),
+        tap(() => {
+          // if saving was successful, the original draft can be discarded
+          this.recordsRepository.clearRecordDraft(record.uniqueIdentifier)
+        }),
+        map(([record, recordSource]) => [record, recordSource])
+      )
   }
 
   // emits and completes once saving is done

package/src/libs/feature/record/src/lib/data-view-share/data-view-share.component.html

@@ -1,4 +1,4 @@
-<div class="container-lg px-5 my-1 lg:mx-auto">
+<div class="px-5 my-1" [ngClass]="extraClass">
   <mat-tab-group
     [selectedIndex]="0"
     animationDuration="0ms"