text: import React from 'react';
  import Helmet from 'react-helmet';
  import {StaticQuery, graphql} from 'gatsby';
  
  function SEO({title, description, lang, meta, keywords, pageContext}) {
    return (
      <StaticQuery
        query={detailsQuery}
        render={(data) => {
          const metaDescription =
            description || data.site.siteMetadata.description;
          const isIndex = pageContext.frontmatter.title === 'Demo';
          const computedTitle =
            title ||
            (isIndex
              ? 'Tippy.js - Tooltip, Popover, Dropdown, and Menu Library'
              : pageContext.frontmatter.title);
          return (
            <Helmet
              htmlAttributes={{
                lang,
              }}
              title={computedTitle}
              titleTemplate={
                isIndex ? null : `%s | ${data.site.siteMetadata.title}`
              }
              meta={[
                {
                  name: `description`,
                  content: metaDescription,
                },
                {
                  property: `og:title`,
                  content: computedTitle,
                },
                {
                  property: `og:description`,
                  content: metaDescription,
                },
                {
                  property: `og:type`,
                  content: `website`,
                },
                {
                  name: `twitter:card`,
                  content: `summary`,
                },
                {
                  name: `twitter:creator`,
                  content: data.site.siteMetadata.author,
                },
                {
                  name: `twitter:title`,
                  content: computedTitle,
                },
                {
                  name: `twitter:description`,
                  content: metaDescription,
                },
              ]
                .concat(
                  keywords.length > 0
                    ? {
                        name: `keywords`,
                        content: keywords.join(`, `),
                      }
                    : []
                )
                .concat(meta)}
            />
          );
        }}
      />
    );
  }
  
  SEO.defaultProps = {
    lang: `en`,
    meta: [],
    keywords: [],
  };
  
  export default SEO;
  
  const detailsQuery = graphql`
    query DefaultSEOQuery {
      site {
        siteMetadata {
          title
          description
          author
        }
      }
    }
  `;
  