diff --git a/src/sections/dataset/Dataset.tsx b/src/sections/dataset/Dataset.tsx index 6cc83be9c..45d06ee81 100644 --- a/src/sections/dataset/Dataset.tsx +++ b/src/sections/dataset/Dataset.tsx @@ -20,6 +20,7 @@ import { SeparationLine } from '../shared/layout/SeparationLine/SeparationLine' import { BreadcrumbsGenerator } from '../shared/hierarchy/BreadcrumbsGenerator' import { useAlertContext } from '../alerts/AlertContext' import { AlertMessageKey } from '../../alert/domain/models/Alert' +import { useAddDatasetJsonLd } from './useAddDatasetJsonLd' interface DatasetProps { fileRepository: FileRepository @@ -32,6 +33,7 @@ export function Dataset({ fileRepository, created }: DatasetProps) { const { t } = useTranslation('dataset') const { hideModal, isModalOpen } = useNotImplementedModal() const { addDatasetAlert } = useAlertContext() + useAddDatasetJsonLd({ persistentId: dataset?.persistentId }) if (created) { addDatasetAlert({ messageKey: AlertMessageKey.DATASET_CREATED, variant: 'success' }) diff --git a/src/sections/dataset/useAddDatasetJsonLd.ts b/src/sections/dataset/useAddDatasetJsonLd.ts new file mode 100644 index 000000000..5478cfbde --- /dev/null +++ b/src/sections/dataset/useAddDatasetJsonLd.ts @@ -0,0 +1,46 @@ +import { useEffect, useRef } from 'react' +interface DatasetJsonLdProps { + persistentId: string | undefined +} + +export const useAddDatasetJsonLd = ({ persistentId }: DatasetJsonLdProps) => { + const scriptRef = useRef(null) + + const addJsonLdScript = (persistentId: string) => { + const jsonLdData = { + '@context': 'http://schema.org', + '@type': 'Dataset', + '@id': persistentId, + identifier: persistentId, + name: 'test', + creator: [ + { + '@type': 'Person', + givenName: 'Guillermo', + familyName: 'Portas', + name: 'Portas, Guillermo' + } + ] + } + //TODO: replace string with data from server + const script = document.createElement('script') + scriptRef.current = script + //persistentIdRef.current = persistentId + script.type = 'application/ld+json' + script.text = JSON.stringify(jsonLdData) + document.head.append(script) + } + useEffect(() => { + if (persistentId && scriptRef.current === null) { + console.log('%c Adding script', 'color: white; background: green; padding: 4px;') + addJsonLdScript(persistentId) + } + + return () => { + if (scriptRef.current !== null) { + console.log('%c Removing script', 'color: white; background: orange; padding: 4px;') + scriptRef.current.remove() + } + } + }, [persistentId]) +}