import React from 'react';
import EasyPrismicReact, { ElementTypes, SerializeParams, PrismicDocument } from 'easy-prismic-react';
import DiscoverEmbed from '../components/blog/DiscoverEmbed';
import RelatedVideoEmbed from '../components/blog/RelatedVideoEmbed';
import RelatedPostEmbed from '../components/blog/RelatedPostEmbed';
import { serializeHyperlink } from '../components/PrismicLink';
import { TContentTypes } from './api';

const DISCOVER_BLOCK_SHORT_CODE = '## discover-block';
const RELATED_POST_SHORT_CODE = '## related-post';
const RELATED_VIDEO_SHORT_CODE = '## related-video';
const PRE_SHORT_CODES = [DISCOVER_BLOCK_SHORT_CODE, RELATED_POST_SHORT_CODE, RELATED_VIDEO_SHORT_CODE];

function getShortCodeParameters(shortCode: string): any[] {
  return shortCode.substring(shortCode.lastIndexOf('|') + 1).split(',');
}

export function hrefResolver(doc: PrismicDocument<any>): string {
  switch ((doc.type) as TContentTypes) {
    case 'blog_tag':
      return `/blog/[tag]?tag=${doc.uid}`;
    case 'blog_post':
      return `/blog/[tag]/[slug]?slug=${doc.uid}&tag=${doc.data.tag.uid}`;
    case 'product_landing':
      return `/products/[slug]?slug=${doc.uid}`;
    case 'blog_home':
      return '/blog';
    case 'homepage':
      return '/';
    default:
      return '/';
  }
}

export function linkResolver(doc: PrismicDocument<any>): string {
  switch ((doc.type) as TContentTypes) {
    case 'blog_tag':
      return `/blog/${doc.uid}`;
    case 'blog_post':
      return `/blog/${doc.data.tag.uid}/${doc.uid}`;
    case 'product_landing':
      return `/products/${doc.uid}`;
    case 'blog_home':
      return '/blog';
    case 'homepage':
      return '/';
    default:
      return '/';
  }
}

export function hrefResolverProduct(slug: string): string {
  return `/products/[slug]?slug=${slug}`;
}

export function linkResolverProduct(slug: string): string {
  return `/products/${slug}`;
}

const easyPrismicReact = new EasyPrismicReact({
  linkResolver,
  hrefResolver,
  customSerializers: {
    [ElementTypes.Preformatted]: (params: SerializeParams) => {
      const { element, index, children, context } = params;
      const value = element?.text?.trim();
      const embedIndex = PRE_SHORT_CODES.findIndex((shortCode: string) => shortCode.search(value) !== -1);
      const embed = embedIndex !== -1 ? PRE_SHORT_CODES[embedIndex] : null;

      switch (embed) {
        case DISCOVER_BLOCK_SHORT_CODE:
          return (<DiscoverEmbed key={`embed-${index}`} shortCodeParams={getShortCodeParameters(value)} postContext={context}/>);
        case RELATED_VIDEO_SHORT_CODE:
          return (<RelatedVideoEmbed key={`embed-${index}`} shortCodeParams={getShortCodeParameters(value)} postContext={context}/>);
        case RELATED_POST_SHORT_CODE:
          return (<RelatedPostEmbed key={`embed-${index}`} shortCodeParams={getShortCodeParameters(value)} postContext={context}/>);
        default:
          return EasyPrismicReact.serializers.serializeStandardTag('pre', element, children, index);
      }
    },
    [ElementTypes.Hyperlink]: (params: SerializeParams) => {
      const { element, children } = params;
      return serializeHyperlink(element, children, 0);
    }
  }
});

export default easyPrismicReact;