next-mdx-remote plugins not working properly

async function getDocFromParams({ params }: DocPageProps) {
  const slug = params.slug?.join('/') || 'index';
  const filePath = path.join(process.cwd(), docDir, `${slug}.mdx`);

  if (fs.existsSync(filePath)) {
    const source = fs.readFileSync(filePath, 'utf8');
    const { content, frontmatter } = await getMdx({ source });

    return {
      meta: frontmatter,
      slug,
      content,
    };
  } else {
    return null;
  }

import {compileMdx} from 'next-mdx-remote/rsc'
import remarkGfm from 'remark-gfm';

export async function getMdx({ source }: MdxProps) {
  const { content, frontmatter } = await compileMDX<any>({
    source,
    components,
    options: {
      parseFrontmatter: true,
      mdxOptions: { remarkPlugins: [remarkToc, remarkGfm], format: 'mdx' },
    },
  });
  return {
    content,
    frontmatter,
  };
}

export default async function DocPage({ params }: DocPageProps) {
  const doc = await getDocFromParams({ params });
  return (
    {doc.content}
)