import { compile } from '@mdx-js/mdx'
import rehypeKatex from 'rehype-katex'
import remarkMath from 'remark-math'
import { remark } from 'remark'
import remarkMdx from 'remark-mdx'

/**
 * Fetch MDX file from either local filesystem or IPFS.
 * @param file {string} - The file to fetch. Treated as a URI
 */
export const getFileForCompilation = async (file: string): Promise<any> => {
  await fetch(file, {
    method: 'GET'
  }).then(content => {
    // Return only the content
    if (content.ok) {
      return content.json()
    }
  }).catch(err => {
    console.error(err.stack)
  })
}

export const compileMDX = async (file: string) => {
  const myFile = await getFileForCompilation(file)
  String(
    await compile(myFile, {
      remarkPlugins: [remarkMath],
      rehypePlugins: [rehypeKatex]
    }))
}

export const renderMDX = async file =>
  String(
    remark()
      .use(remarkMdx)
      .processSync(file)
  )