import Head from 'next/head';
import PropTypes from 'prop-types';

const MetaWrapper = (props) => {
  const {
    title,
    description,
    type,
    imageUrl,
    contentUrl,
    faviconUrl,
    keywords,
    publishedAt,
    children,
    authorName,
  } = props;
  const siteName = "Your_site_name"
  const appThemeColor = '#4c6796';
  const twitterAcountName = "@your_account"

  return (
    <Head>
      <title>{title}</title>
      <link rel="shortcut icon" href={faviconUrl} type="image/x-icon" />
      <meta name="title" content={title} />
      <meta name="description" content={description} />
      <meta name="keywords" content={keywords} />
      <meta name="image" content={imageUrl} />
      <link rel="canonical" href={contentUrl} />
      <meta name="theme-color" content={appThemeColor} />
      <meta name="robots" content="follow, index" />
      <meta property="og:type" content={type} />
      <meta property="og:site_name" content={siteName} />
      <meta property="og:url" content={contentUrl} />
      <meta property="og:title" content={title} />
      <meta property="og:description" content={description} />
      <meta property="og:image" content={imageUrl} />
      <meta name="twitter:title" content={title} />
      <meta name="twitter:description" content={description} />
      <meta name="twitter:image" content={imageUrl} />
      <meta name="twitter:site" content={twitterAcountName} />
      <meta name="twitter:url" content={contentUrl} />
      <meta name="twitter:card" content="summary_large_image" />
      {type === 'article' && (
        <>
          <meta name="author" content={authorName} />
          <meta property="article:author" content={authorName} />
        </>
      )}
      {type === 'article' && publishedAt && (
        <meta property="article:published_time" content={publishedAt} />
      )}
      {children}
    </Head>
  );
};

MetaWrapper.defaultProps = {
  children: null,
  publishedAt: null,
  authorName: null,
};

MetaWrapper.propTypes = {
  title: PropTypes.string.isRequired,
  description: PropTypes.string.isRequired,
  keywords: PropTypes.string.isRequired,
  type: PropTypes.string.isRequired,
  publishedAt: PropTypes.string,
  imageUrl: PropTypes.string.isRequired,
  contentUrl: PropTypes.string.isRequired,
  faviconUrl: PropTypes.string.isRequired,
  authorName: PropTypes.string,
  children: PropTypes.node,
};

export default MetaWrapper;