import { glob } from "glob";
import dynamic, { LoaderComponent } from "next/dynamic";
import React from "react";

export const dynamicParams = false;

export async function generateStaticParams(): Promise<{ slug: string[] }[]> {
  const posts = await glob(
    `${process.cwd()}/src/markdown/posts/[[]...slug[]]/**/*.mdx`,
    {
      nodir: true,
    }
  );

  const slugs = posts.map((post) => ({
    slug: [post.split("/").at(-1)!.slice(0, -4)],
  }));

  return slugs;
}

export default async function Post({
  params,
}: {
  params: Promise<{ slug: string[] }>;
}): Promise<React.JSX.Element> {
  const mdxFile = await import(
    `../../../../markdown/posts/[...slug]/${(await params).slug.join("/")}.mdx`
  ) as LoaderComponent<unknown>;
  const Post = dynamic(() => mdxFile);
  return <Post />;
}