import type { BlogPost } from "@/data/details";
import styles from "./ArticleBody.module.css";

export default function ArticleBody({
  blocks,
}: {
  blocks: BlogPost["body"];
}) {
  return (
    <div className={styles.body}>
      {blocks.map((block, index) => {
        if (block.type === "quote") {
          return (
            <p key={index} className={styles.quote}>
              {block.text}
            </p>
          );
        }
        if (block.type === "rich") {
          return (
            <p key={index}>
              {block.text}
              {block.linkHref ? (
                <a href={block.linkHref} target="_blank" rel="noreferrer">
                  {block.linkText}
                </a>
              ) : null}
              {block.afterLink}
            </p>
          );
        }
        return <p key={index}>{block.text}</p>;
      })}
    </div>
  );
}