This repository has been archived on 2022-09-04. You can view files and clone it, but cannot push or open issues or pull requests.
tribalwarshelp.com/src/components/SEO.js

127 lines
2.7 KiB
JavaScript

/**
* SEO component that queries for data with
* Gatsby's useStaticQuery React hook
*
* See: https://www.gatsbyjs.org/docs/use-static-query/
*/
import React from "react"
import PropTypes from "prop-types"
import { Helmet } from "react-helmet"
import { useStaticQuery, graphql } from "gatsby"
import seoBG from "@images/seo-bg.png"
function SEO({ description, lang, meta, title, pathname }) {
const { site } = useStaticQuery(
graphql`
query {
site {
siteMetadata {
title
description
siteUrl
}
}
}
`
)
const metaDescription = description || site.siteMetadata.description
return (
<Helmet
htmlAttributes={{
lang,
}}
title={title}
titleTemplate={`%s | ${site.siteMetadata.title}`}
meta={[
{
name: `description`,
content: metaDescription,
},
{
property: `og:site_name`,
content: site.siteMetadata.title,
},
{
property: `og:title`,
content: title,
},
{
property: `og:description`,
content: metaDescription,
},
{
property: `og:url`,
content: `${site.siteMetadata.siteUrl}${pathname}`,
},
{
property: `og:image`,
content: `${site.siteMetadata.siteUrl}${seoBG}`,
},
{
property: `og:image:width`,
content: `1280`,
},
{
property: `og:image:height`,
content: `640`,
},
{
property: `og:image`,
content: `website`,
},
{
property: `og:locale`,
content: `pl`,
},
{
name: `twitter:card`,
content: `summary_large_image`,
},
{
name: `twitter:title`,
content: title,
},
{
name: `twitter:description`,
content: metaDescription,
},
{
name: `twitter:url`,
content: `${site.siteMetadata.siteUrl}${pathname}`,
},
{
name: `twitter:image`,
content: `${site.siteMetadata.siteUrl}${seoBG}`,
},
{
name: `twitter:image:alt`,
content: site.siteMetadata.title,
},
].concat(meta)}
>
<link
rel="canonical"
content={`${site.siteMetadata.siteUrl}${pathname}`}
></link>
</Helmet>
)
}
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