| import React from "react" |
| import PropTypes from "prop-types" |
| import { Helmet } from "react-helmet" |
| import { useStaticQuery, graphql } from "gatsby" |
| |
| function SEO({ description, lang, meta, title }) { |
| const { site } = useStaticQuery( |
| graphql` |
| query { |
| site { |
| siteMetadata { |
| title |
| description |
| author |
| } |
| } |
| } |
| ` |
| ) |
| |
| const metaDescription = description || site.siteMetadata.description |
| |
| return ( |
| <Helmet |
| htmlAttributes={{ |
| lang, |
| }} |
| title={title} |
| titleTemplate={`%s | ${site.siteMetadata.title}`} |
| meta={[ |
| { |
| 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, |
| }, |
| ].concat(meta)} |
| /> |
| ) |
| } |
| |
| SEO.defaultProps = { |
| lang: `en`, |
| meta: [], |
| description: ``, |
| } |
| |
| SEO.propTypes = { |
| description: PropTypes.string, |
| lang: PropTypes.string, |
| meta: PropTypes.arrayOf(PropTypes.object), |
| title: PropTypes.string.isRequired, |
| } |
| |
| export default SEO |