import React , { ReactElement } from 'react' ; import { Helmet } from 'react-helmet' ; import { Event , WithContext } from 'schema-dts' ; import { EventModel } from 'api-client' ; import DateFormatter from 'api-client/src/i18n/DateFormatter' ; const createJsonLd = ( event , formatter ) : WithContext < Event > => { const date = event . date ; const jsonLd = { '@context' : 'https://schema.org' , '@type' : 'Event' , name : event . title , startDate : date . allDay ? formatter . format ( date . startDate , { format : 'YYYY-MM-DD' } ) : formatter . format ( date . startDate , { format : undefined } ) , eventStatus : 'https://schema.org/EventScheduled' , description : event . excerpt , location : { '@type' : 'Place' , name : event . location . name , address : { '@type' : 'PostalAddress' , streetAddress : event . location . address ?? 'Unknown' , addressLocality : event . location . town ?? 'Unknown' , postalCode : event . location . postcode ?? 'Unknow' , addressRegion : event . location . region ?? 'Unknown' , addressCountry : event . location . country ?? 'Unknown' } } } ; if ( date . endDate . isValid ( ) ) { jsonLd . endDate = date . allDay ? date . endDate . format ( 'YYYY-MM-DD' ) : date . endDate . format ( ) ; } if ( event . featuredImage ) { jsonLd . image = [ event . featuredImage . thumbnail . url , event . featuredImage . medium . url , event . featuredImage . large . url , event . featuredImage . full . url ] ; } return jsonLd ; } ; type PropsType = { event : EventModel ; formatter : DateFormatter ; } ; const JsonLdEvent = ( { event , formatter } ) : ReactElement => ( < Helmet > < script type = 'application/ld+json' > { JSON . stringify ( createJsonLd ( event , formatter ) ) } < /script> < /Helmet>); export default JsonLdEvent ;