strapi mit next.js
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

53 lines
1.5 KiB

2 years ago
import { NextSeo } from "next-seo"
import PropTypes from "prop-types"
import { getStrapiMedia } from "utils/media"
import { mediaPropTypes } from "utils/types"
const Seo = ({ metadata }) => {
// Prevent errors if no metadata was set
if (!metadata) return null
return (
<NextSeo
title={metadata.metaTitle}
description={metadata.metaDescription}
openGraph={{
// Title and description are mandatory
title: metadata.metaTitle,
description: metadata.metaDescription,
// Only include OG image if we have it
// Careful: if you disable image optimization in Strapi, this will break
...(metadata.shareImage && {
images: Object.values(
metadata.shareImage.data.attributes.formats
).map((image) => {
return {
url: getStrapiMedia(image.url),
width: image.width,
height: image.height,
}
}),
}),
}}
// Only included Twitter data if we have it
twitter={{
...(metadata.twitterCardType && { cardType: metadata.twitterCardType }),
// Handle is the twitter username of the content creator
...(metadata.twitterUsername && { handle: metadata.twitterUsername }),
}}
/>
)
}
Seo.propTypes = {
metadata: PropTypes.shape({
metaTitle: PropTypes.string.isRequired,
metaDescription: PropTypes.string.isRequired,
shareImage: mediaPropTypes,
twitterCardType: PropTypes.string,
twitterUsername: PropTypes.string,
}),
}
export default Seo