import Head from 'next/head'
import { SEODefaultValues } from 'types/config'
import { SEOConfig } from 'utils/config'

const NextHead: React.FC<SEODefaultValues> = ({
  shortName = SEOConfig.shortName,
  longName = SEOConfig.longName,
  color = SEOConfig.color,
  defaultLocale = SEOConfig.defaultLocale,
  description = SEOConfig.description,
  icons = SEOConfig.icons,
  url = SEOConfig.url
}) => {
  return (
    <Head>
      <title>{shortName}</title>

      <link rel='shortcut icon' href={icons?.default} type='image/x-icon' />
      <link rel='apple-touch-icon' sizes='180x180' href={icons?.apple} />
      <link rel='icon' type='image/png' sizes='16x16' href={icons?.['16_16']} />
      <link rel='icon' type='image/png' sizes='32x32' href={icons?.['32_32']} />

      {/* Default meta tags */}

      <meta charSet='UTF-8' />
      <meta httpEquiv='X-UA-Compatible' content='IE=edge' />
      <meta name='viewport' content='width=device-width, initial-scale=1.0' />
      <meta name='description' content={description} />
      <meta name='language' content={defaultLocale} />
      <meta name='theme-color' content={color} />
      <meta name='copyright' content={shortName} />
      <meta name='author' content={shortName} />
      <meta name='publisher' content={shortName} />
      <meta name='robots' content='index, follow' />
      <meta name='rating' content='general' />
      <meta name='distribution' content='global' />
      <meta name='msapplication-TileColor' content={color} />

      {/* Open graph MT */}

      <meta property='og:title' content={shortName} />
      <meta property='og:type' content='website' />
      <meta property='og:url' content={url} />
      <meta property='og:image' content={icons?.image} />
      <meta property='og:description' content={description} />
      <meta
        property='og:locale'
        content={SEOConfig.defaultLocale?.concat(
          '_',
          SEOConfig.defaultLocale.toUpperCase()
        )}
      />
      <meta property='og:site_name' content={longName} />

      {/* Twitter card Metadata */}
      <meta name='twitter:card' content='summary' />
      <meta name='twitter:description' content={description} />
      <meta name='twitter:title' content={longName} />
      <meta name='twitter:image:src' content={icons?.image} />
    </Head>
  )
}

export default NextHead
