import React, { Component } from 'react'
import Helmet from 'react-helmet'
import ImgIntro from '../images/saburly.jpg'

class SEO extends Component {
  render() {
    const {
      siteTitle,
      siteDescription,
      siteImage,
      siteUrl,
      postSEO,
    } = this.props

    let title = siteTitle
      ? siteTitle
      : 'Saburly - App Development & Mobile Design agency that makes you stand out'
    let desc = siteDescription
      ? siteDescription
      : 'We are in the business of solving real-world problems with digital solutions. Our mission is to make you stand out with the help of modern technologies'
    let img = siteImage ? siteImage : ImgIntro
    let blogUrl = 'https://www.saburly.com/blog'
    let pageUrl = siteUrl ? siteUrl : 'https://www.saburly.com'

    const schemaOrgJSONLD = [
      {
        '@context': 'http://schema.org',
        '@type': 'WebSite',
        url: blogUrl,
        name: title,
        alternateName:
          'Saburly - App Development & Mobile Design agency that makes you stand out',
      },
    ]

    if (postSEO) {
      schemaOrgJSONLD.push(
        {
          '@context': 'http://schema.org',
          '@type': 'BreadcrumbList',
          itemListElement: [
            {
              '@type': 'ListItem',
              position: 1,
              item: {
                '@id': pageUrl,
                name: title,
                img,
              },
            },
          ],
        },
        {
          '@context': 'http://schema.org',
          '@type': 'BlogPosting',
          url: blogUrl,
          name: title,
          alternateName:
            'Saburly - App Development & Mobile Design agency that makes you stand out',
          headline: title,
          image: {
            '@type': 'ImageObject',
            url: img,
          },
          desc,
        }
      )
    }

    return (
      <Helmet>

        <title>{title}</title>
        <meta name="description" content={desc} />
        <meta name="image" content={img} />

        <script type="application/ld+json">
          {JSON.stringify(schemaOrgJSONLD)}
        </script>

        <meta property="og:title" content={title} />
        <meta property="og:description" content={desc} />
        <meta property="og:image" content={img} />
        <meta property="og:url" content={siteUrl ? siteUrl : blogUrl} />
        <meta property="og:site_name" content="Saburly.com" />
        <meta property="fb:app_id" content="1896398823783343" />
        <meta property="og:type" content="website" />

        <meta itemprop="name" content={title} />
        <meta itemprop="description" content={desc} />
        <meta itemprop="image" content={img} />

        <meta name="twitter:card" content="summary" />
        <meta name="twitter:title" content={title} />
        <meta name="twitter:description" content={desc} />
        <meta name="twitter:site" content="@saburly" />
        <meta name="twitter:creator" content="@saburly" />
        <meta name="twitter:image:src" content={img} />
      </Helmet>
    )
  }
}

export default SEO
