novel
/
fe


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
							import Head from "next/head";
import { ReactNode } from "react";

export interface SeoHeadConfig {
  title?: string;
  description?: string;
  keywords?: string;
  url?: string;
  siteName?: string;
  img?: string;
  canonical?: string;
  pre?: string;
  next?: string;
  jsonLd?: string;
}

interface SeoHeadProps {
  seoConfig: SeoHeadConfig;
  children?: ReactNode;
}

export function SeoHead({ seoConfig, children }: SeoHeadProps) {
  return (
    <Head>
      {children}

      {seoConfig.title ? <title>{seoConfig.title}</title> : null}

      {seoConfig.description ? (
        <meta name="description" content={seoConfig.description} />
      ) : null}

      {seoConfig.keywords ? (
        <meta name="keywords" content={seoConfig.keywords} />
      ) : null}

      {seoConfig.url ? (
        <meta property="og:url" key="og:url" content={seoConfig.url} />
      ) : null}

      {seoConfig.siteName ? (
        <meta
          property="og:site_name"
          key="og:site_name"
          content={seoConfig.siteName}
        />
      ) : null}

      {seoConfig.title ? (
        <meta property="og:title" key="og:title" content={seoConfig.title} />
      ) : null}

      {seoConfig.description ? (
        <meta
          property="og:description"
          key="og:description"
          content={seoConfig.description}
        />
      ) : null}

      {seoConfig.img ? (
        <meta property="og:image" key="og:image" content={seoConfig.img} />
      ) : null}

      {seoConfig.title ? (
        <meta
          name="twitter:title"
          key="twitter:title"
          content={seoConfig.title}
        />
      ) : null}

      {seoConfig.description ? (
        <meta
          name="twitter:description"
          key="twitter:description"
          content={seoConfig.description}
        />
      ) : null}

      {seoConfig.img ? (
        <>
          <meta name="twitter:card" key="twitter:card" content="summary" />
          <meta
            name="twitter:image"
            key="twitter:image"
            content={seoConfig.img}
          />
        </>
      ) : null}

      {seoConfig.canonical ? (
        <link rel="canonical" key="canonical" href={seoConfig.canonical} />
      ) : null}

      {seoConfig.pre ? <link rel="prev" key="prev" href={seoConfig.pre} /> : null}

      {seoConfig.next ? <link rel="next" key="next" href={seoConfig.next} /> : null}

      {seoConfig.jsonLd ? (
        <script
          type="application/ld+json"
          key="application/ld+json"
          dangerouslySetInnerHTML={{ __html: seoConfig.jsonLd }}
        />
      ) : null}
    </Head>
  );
}