1
0
mirror of https://github.com/kremalicious/portfolio.git synced 2024-06-15 17:03:26 +02:00
portfolio/src/components/atoms/SEO.jsx
dependabot[bot] 0367005b19
Bump eslint-plugin-react from 7.25.1 to 7.25.3 (#665)
* Bump eslint-plugin-react from 7.25.1 to 7.25.3

Bumps [eslint-plugin-react](https://github.com/yannickcr/eslint-plugin-react) from 7.25.1 to 7.25.3.
- [Release notes](https://github.com/yannickcr/eslint-plugin-react/releases)
- [Changelog](https://github.com/yannickcr/eslint-plugin-react/blob/master/CHANGELOG.md)
- [Commits](https://github.com/yannickcr/eslint-plugin-react/compare/v7.25.1...v7.25.3)

---
updated-dependencies:
- dependency-name: eslint-plugin-react
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>

* Update SEO.jsx

* Update SEO.jsx

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Matthias Kretschmann <m@kretschmann.io>
2021-09-20 11:36:17 +02:00

68 lines
2.2 KiB
JavaScript

import React from 'react'
import { Helmet } from 'react-helmet'
import PropTypes from 'prop-types'
import { useMeta } from '../../hooks/use-meta'
import { useResume } from '../../hooks/use-resume'
const MetaTags = ({ title, description, url, image }) => {
const { basics } = useResume()
const twitterHandle = basics.profiles.filter(
({ network }) => network === 'Twitter'
)[0].username
return (
<Helmet
defaultTitle={`${basics.name.toLowerCase()} { ${basics.label.toLowerCase()} }`}
titleTemplate={`%s // ${basics.name.toLowerCase()} { ${basics.label.toLowerCase()} }`}
title={title}
>
<html lang="en" />
{/* General tags */}
<meta name="description" content={description} />
<meta name="image" content={`${basics.website}${image}`} />
<link rel="canonical" href={url} />
{/* OpenGraph tags */}
<meta property="og:url" content={url} />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:image" content={`${basics.website}${image}`} />
{/* Twitter Card tags */}
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:creator" content={twitterHandle} />
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
<meta name="twitter:image" content={`${basics.website}${image}`} />
</Helmet>
)
}
MetaTags.propTypes = {
title: PropTypes.string,
description: PropTypes.string,
url: PropTypes.string,
image: PropTypes.string,
meta: PropTypes.object
}
SEO.propTypes = {
project: PropTypes.object
}
export default function SEO({ project }) {
const meta = useMeta()
const { basics } = useResume()
const title = (project && project.title) || null
const description = (project && project.fields.excerpt) || meta.description
const image =
(project && project.img.childImageSharp.twitterImage.src) ||
meta.img.childImageSharp.resize.src
const url = (project && `${basics.website}${project.slug}`) || basics.website
return (
<MetaTags title={title} description={description} url={url} image={image} />
)
}