text: 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,
  				},
  				{
  					name: `viewport`,
  					content: 'width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no',
  				},
  				{
  					httpEquiv: "X-UA-Compatible",
  					content: "IE=edge,chrome=1"
  				},
  				{
  					name: "HandheldFriendly",
  					content: true
  				}
  			].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
  