"use client";

import mkMarkdownIt from "markdown-it";
import styles from "./Article.module.scss";
import { markdownPreprocessor } from "../../lib/mdpp";
import ConvertNode from "./ConvertNode";

const markdownIt = mkMarkdownIt({
  html: true,
  linkify: true,
}).use(markdownPreprocessor);

export interface ArticleProps {
  source: string;
}

export function Article({ source }: ArticleProps) {
  const compiled = markdownIt.render(source);
  // const parser = new window.DOMParser();
  // const result = parser.parseFromString(compiled, "text/html");

  return (
    <div className={styles.article}>
      {compiled}
      {/* {[...result.body.childNodes].map((x) => (
        <ConvertNode node={x} />
      ))} */}
    </div>
  );
}