feat: add generic content page

apps/marketing/contentlayer.config.ts

@@ -18,9 +18,9 @@ export const BlogPost = defineDocumentType(() => ({
   },
 }));
 
-export const Privacy = defineDocumentType(() => ({
+export const GenericPage = defineDocumentType(() => ({
-  name: 'Privacy',
+  name: 'GenericPage',
-  filePathPattern: 'privacy.mdx',
+  filePathPattern: '**/*.mdx',
   contentType: 'mdx',
   fields: {
     title: { type: 'string', required: true },
@@ -30,4 +30,4 @@ export const Privacy = defineDocumentType(() => ({
   },
 }));
 
-export default makeSource({ contentDirPath: 'content', documentTypes: [BlogPost, Privacy] });
+export default makeSource({ contentDirPath: 'content', documentTypes: [BlogPost, GenericPage] });

apps/marketing/src/app/(marketing)/[content]/page.tsx

@@ -0,0 +1,42 @@
+import Image from 'next/image';
+import { notFound } from 'next/navigation';
+
+import { allDocuments } from 'contentlayer/generated';
+import type { MDXComponents } from 'mdx/types';
+import { useMDXComponent } from 'next-contentlayer/hooks';
+
+export const generateStaticParams = async () =>
+  allDocuments.map((post) => ({ post: post._raw.flattenedPath }));
+
+export const generateMetadata = ({ params }: { params: { content: string } }) => {
+  const document = allDocuments.find((post) => post._raw.flattenedPath === params.content);
+
+  if (!document) {
+    notFound();
+  }
+
+  return { title: `Documenso - ${document.title}` };
+};
+
+const mdxComponents: MDXComponents = {
+  MdxNextImage: (props: { width: number; height: number; alt?: string; src: string }) => (
+    <Image {...props} alt={props.alt ?? ''} />
+  ),
+};
+
+/**
+ * A generic catch all page for the root level that checks for content layer documents.
+ *
+ * Will render the document if it exists, otherwise will return a 404.
+ */
+export default function ContentPage({ params }: { params: { content: string } }) {
+  const post = allDocuments.find((post) => post._raw.flattenedPath === params.content);
+
+  if (!post) {
+    notFound();
+  }
+
+  const MDXContent = useMDXComponent(post.body.code);
+
+  return <MDXContent components={mdxComponents} />;
+}

apps/marketing/src/app/(marketing)/privacy/page.tsx

@@ -1,13 +0,0 @@
-import { useMDXComponent } from 'next-contentlayer/hooks';
-
-import privacy from '~/../.contentlayer/generated/Privacy/privacy.mdx.json';
-
-export const generateMetadata = () => {
-  return { title: `Documenso - ${privacy.title}` };
-};
-
-export default function PrivacyPage() {
-  const MDXContent = useMDXComponent(privacy.body.code);
-
-  return <MDXContent />;
-}