import { notFound } from "next/navigation";
import { readFile } from "node:fs/promises";
import { join } from "node:path";
import { parseMarkdownWithFrontmatter } from "@/lib/markdown";
import ReactMarkdown from "react-markdown";
import remarkGfm from "remark-gfm";

type Params = { params: { slug: string } };

export default async function FaqArticlePage({ params }: Params) {
  const root = process.cwd();
  const file = join(root, "content", "pt", "perguntas", `${params.slug}.md`);
  try {
    const raw = await readFile(file);
    const { content, frontmatter } = parseMarkdownWithFrontmatter(raw.toString());
    return (
      <article aria-labelledby="article-title" className="prose max-w-none">
        <header className="mb-4">
          <h1 id="article-title" className="text-2xl font-bold">{String(frontmatter.title ?? "FAQ")}</h1>
          <p className="text-sm text-gray-700">
            {frontmatter.readTime && <span>Tempo de leitura: {String(frontmatter.readTime)}</span>}
            {frontmatter.intendedFor && <span className="ml-2">• Público: {String(frontmatter.intendedFor)}</span>}
          </p>
        </header>
        <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>
      </article>
    );
  } catch (e) {
    notFound();
  }
}