import { readFileSync } from "node:fs";
import path from "node:path";
import type { Metadata } from "next";
import { Changelog } from "yt-dlp-transcript-common/components/Changelog";

export const metadata: Metadata = { title: "Changelog" };

function loadChangelog(): string {
  return readFileSync(
    path.join(/* turbopackIgnore: true */ process.cwd(), "CHANGELOG.md"),
    "utf8",
  );
}

export default function ChangelogPage() {
  const source = loadChangelog();
  return (
    <div className="flex flex-col gap-4 max-w-3xl">
      <h1 className="text-2xl font-semibold">Changelog</h1>
      <Changelog source={source} />
    </div>
  );
}