diff --git a/apps/datahub/src/app/app.module.ts b/apps/datahub/src/app/app.module.ts index 37e7513ca7..03555b3475 100644 --- a/apps/datahub/src/app/app.module.ts +++ b/apps/datahub/src/app/app.module.ts @@ -13,6 +13,7 @@ import { FeatureRecordModule, GN_UI_VERSION, WEB_COMPONENT_EMBEDDER_URL, + RecordMetaComponent, } from '@geonetwork-ui/feature/record' import { DefaultRouterModule, @@ -188,6 +189,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : [] CarouselComponent, BlockListComponent, PreviousNextButtonsComponent, + RecordMetaComponent, LetDirective, // FIXME: these imports are required by non-standalone components and should be removed once all components have been made standalone NgIconsModule.withIcons({ diff --git a/apps/datahub/src/app/record/record-page/record-page.component.html b/apps/datahub/src/app/record/record-page/record-page.component.html index 139097e05a..1ba9c5c7f6 100644 --- a/apps/datahub/src/app/record/record-page/record-page.component.html +++ b/apps/datahub/src/app/record/record-page/record-page.component.html @@ -1,4 +1,7 @@
+ diff --git a/libs/feature/record/src/index.ts b/libs/feature/record/src/index.ts index 5cd2bfe857..7c48021576 100644 --- a/libs/feature/record/src/index.ts +++ b/libs/feature/record/src/index.ts @@ -7,3 +7,4 @@ export * from './lib/data-view-share/data-view-share.component' export * from './lib/data-view-web-component/data-view-web-component.component' export * from './lib/external-viewer-button/external-viewer-button.component' export * from './lib/map-view/map-view.component' +export * from './lib/record-meta/record-meta.component' diff --git a/libs/feature/record/src/lib/feature-record.module.ts b/libs/feature/record/src/lib/feature-record.module.ts index cec00152e7..855a62e344 100644 --- a/libs/feature/record/src/lib/feature-record.module.ts +++ b/libs/feature/record/src/lib/feature-record.module.ts @@ -79,6 +79,7 @@ import { matClose, matOpenInNew } from '@ng-icons/material-icons/baseline' DataViewPermalinkComponent, DataViewWebComponentComponent, DataViewShareComponent, + ExternalViewerButtonComponent, ], }) export class FeatureRecordModule {} diff --git a/libs/feature/record/src/lib/record-meta/record-meta.component.spec.ts b/libs/feature/record/src/lib/record-meta/record-meta.component.spec.ts new file mode 100644 index 0000000000..a3cdc592c7 --- /dev/null +++ b/libs/feature/record/src/lib/record-meta/record-meta.component.spec.ts @@ -0,0 +1,24 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing' +import { RecordMetaComponent } from './record-meta.component' + +describe('RecordMetaComponent', () => { + let component: RecordMetaComponent + let fixture: ComponentFixture + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [], + imports: [RecordMetaComponent], + providers: [], + }).compileComponents() + }) + + beforeEach(() => { + fixture = TestBed.createComponent(RecordMetaComponent) + component = fixture.componentInstance + }) + + it('should create', () => { + expect(component).toBeTruthy() + }) +}) diff --git a/libs/feature/record/src/lib/record-meta/record-meta.component.ts b/libs/feature/record/src/lib/record-meta/record-meta.component.ts new file mode 100644 index 0000000000..d26bf23c57 --- /dev/null +++ b/libs/feature/record/src/lib/record-meta/record-meta.component.ts @@ -0,0 +1,45 @@ +import { + ChangeDetectionStrategy, + Component, + Input, + OnChanges, + OnDestroy, +} from '@angular/core' +import { Meta } from '@angular/platform-browser' +import { DatasetRecord } from '@geonetwork-ui/common/domain/model/record' + +@Component({ + selector: 'gn-ui-record-meta', + template: '', + changeDetection: ChangeDetectionStrategy.OnPush, + standalone: true, +}) +export class RecordMetaComponent implements OnDestroy, OnChanges { + @Input() metadata: DatasetRecord + + constructor(private meta: Meta) {} + + ngOnChanges() { + if (this.metadata?.title) { + this.meta.addTag({ property: 'og:title', content: this.metadata.title }) + this.meta.addTag({ + property: 'og:url', + content: window.location.href.toString(), + }) + if (this.metadata?.overviews?.length > 0) { + for (const overview of this.metadata.overviews) { + this.meta.addTag({ + property: 'og:image', + content: overview.url.toString(), + }) + } + } + } + } + + ngOnDestroy() { + this.meta.removeTag('property="og:image"') + this.meta.removeTag('property="og:url"') + this.meta.removeTag('property="og:title"') + } +}