import * as React from 'react';

import { Helmet } from 'react-helmet';

interface ISEOProps {
  title?: string;
  image?: string;
  description?: string;
  type?: string;
  skipMainTitle?: boolean;
  keywords?: any;
}

export default class SEO extends React.Component<ISEOProps> {

  get metadata() {
    const { title, image, description, type, skipMainTitle, keywords } = this.props;

    const meta = [];

    if (title) {
      meta.push({ name: 'og:title', content: title });
      meta.push({ name: 'twitter:title', content: title });
    }

    if (description) {
      meta.push({ name: 'description', content: description });
      meta.push({ name: 'og:description', content: description });
      meta.push({ name: 'twitter:description', content: description });

    }

    if (image) {
      meta.push({ name: 'image', content: image });
      meta.push({ name: 'og:image', content: image });
      meta.push({ name: 'og:image:url', content: image });
      meta.push({ name: 'twitter:image', content: image });
    }

    if (type) {
      meta.push({ name: 'og:type', content: type });
    }

    if (keywords) {
      meta.push({ name: 'keywords', content: keywords });
    }

    return meta;
  }

  render() {
    const { title } = this.props;

    return (
      <Helmet
        title={title}
        meta={this.metadata}
      />
    );
  }
}