Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
A wrapper around react-helmet that makes use of StaticQuery from Gatsby.
import { graphql, StaticQuery } from 'gatsby';
import * as React from 'react';
import { Helmet as ReactHelmet } from 'react-helmet';
interface HelmetProps {
pageTitle?: string;
}
interface HelmetDataProps extends HelmetProps {
data: {
site: {
siteMetadata: {
title: string;
},
},
};
}
const Helmet: React.SFC<HelmetDataProps> = ({
children,
data,
pageTitle,
}) => {
const siteTitle = pageTitle ? `${pageTitle} | ${data.site.siteMetadata.title}` : data.site.siteMetadata.title;
return (
<ReactHelmet>
<title>{siteTitle}</title>
</ReactHelmet>
);
};
export default (props: HelmetProps) => (
<StaticQuery
query={graphql`
query {
site {
siteMetadata {
title
}
}
}
`}
// tslint:disable-next-line jsx-no-lambda
render={(data) => <Helmet data={data} {...props} />}
/>
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment