import React from "react"; import PropTypes from "prop-types"; import { Helmet } from "gatsby-plugin-react-i18next"; import { useStaticQuery, graphql } from "gatsby"; import { useLocation } from "@reach/router"; import { useTranslation } from "gatsby-plugin-react-i18next"; import useSiteMetadata from "../helpers/useSiteMetadata"; function SEO({ description, meta, title, speakable, image, children }) { const { t } = useTranslation(); const { site } = useStaticQuery( graphql` query { site { siteMetadata { title author keywords } } } ` ); const metaDescription = description || t("siteDescription"); const siteMeta = useSiteMetadata(); const location = useLocation(); return ( {[ { name: `description`, content: metaDescription, }, { property: `og:title`, content: title, }, { property: `og:description`, content: metaDescription, }, { property: `og:type`, content: `website`, }, { name: `twitter:card`, content: `summary`, }, { name: `twitter:creator`, content: site.siteMetadata.author, }, { name: `twitter:title`, content: title, }, { name: `twitter:description`, content: metaDescription, }, { name: "keywords", content: site.siteMetadata.keywords, }, ] .concat(meta) .map((m) => { return ( ); })} {image && [ , , ]} {children} ); } SEO.defaultProps = { meta: [], description: ``, }; SEO.propTypes = { description: PropTypes.string, meta: PropTypes.arrayOf(PropTypes.object), title: PropTypes.string.isRequired, speakable: PropTypes.any, image: PropTypes.string, children: PropTypes.any, }; export default SEO;