generate og image for blog

src/app/blog/[slug]/opengraph-image.png/route.ts

@@ -0,0 +1,11 @@
+import {getAllPosts, getPostBySlug} from '@/app/blog/lib/posts';
+import {generateOgImage} from '@/lib/generate-og-image';
+
+export async function generateStaticParams() {
+  return getAllPosts().map(({data: {slug}}) => ({slug}));
+}
+
+export async function GET(req: Request, {params}: {params: {slug: string}}) {
+  const post = getPostBySlug(params.slug);
+  return generateOgImage({title: post.data.title});
+}

src/app/blog/[slug]/page.tsx

@@ -27,6 +27,9 @@ export function generateMetadata({params}: Props): Metadata {
   return {
     title: `${post.data.title} - loganz`,
     description: post.data.description,
+    openGraph: {
+      images: `/blog/${params.slug}/opengraph-image.png`,
+    },
   };
 }