Cleanup

apps/web/app/(marketing)/blog/[slug]/page.tsx

@@ -0,0 +1,70 @@
+import type { Metadata } from 'next';
+
+import { notFound } from 'next/navigation';
+import Script from 'next/script';
+
+import { allPosts } from 'contentlayer/generated';
+import appConfig from '~/config/app.config';
+import { withI18n } from '~/lib/i18n/with-i18n';
+
+import Post from '../components/post';
+
+export async function generateMetadata({
+  params,
+}: {
+  params: { slug: string };
+}): Promise<Metadata | undefined> {
+  const post = allPosts.find((post) => post.slug === params.slug);
+
+  if (!post) {
+    return;
+  }
+
+  const { title, date, description, image, slug } = post;
+  const url = [appConfig.url, 'blog', slug].join('/');
+
+  return {
+    title,
+    description,
+    openGraph: {
+      title,
+      description,
+      type: 'article',
+      publishedTime: date,
+      url,
+      images: image
+        ? [
+            {
+              url: image,
+            },
+          ]
+        : [],
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title,
+      description,
+      images: image ? [image] : [],
+    },
+  };
+}
+
+async function BlogPost({ params }: { params: { slug: string } }) {
+  const post = allPosts.find((post) => post.slug === params.slug);
+
+  if (!post) {
+    notFound();
+  }
+
+  return (
+    <div className={'container mx-auto'}>
+      <Script id={'ld-json'} type="application/ld+json">
+        {JSON.stringify(post.structuredData)}
+      </Script>
+
+      <Post post={post} content={post.body.code} />
+    </div>
+  );
+}
+
+export default withI18n(BlogPost);