From bc597920c79d176c42b0b4b88c95e2f3700dcd09 Mon Sep 17 00:00:00 2001
From: Isaac Alencar <alencarisaac3@gmail.com>
Date: Sun, 24 Dec 2023 11:10:37 -0300
Subject: [PATCH 1/2] add opengraph image generator

---
 app/opengraph-image.tsx | 45 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 app/opengraph-image.tsx

diff --git a/app/opengraph-image.tsx b/app/opengraph-image.tsx
new file mode 100644
index 0000000..cc214da
--- /dev/null
+++ b/app/opengraph-image.tsx
@@ -0,0 +1,45 @@
+import NextImage from "next/image";
+import { ImageResponse } from "next/og";
+import config from "./config.mts";
+
+// // Route segment config
+export const runtime = "edge";
+
+// Image metadata
+export const alt = config.meta.title;
+export const size = {
+  width: 600,
+  height: 315
+};
+
+export const contentType = "image/png";
+
+// Image generation
+export default async function Image() {
+  return new ImageResponse(
+    (
+      // ImageResponse JSX element
+      <div className="flex min-h-[630px] min-w-[1200px] flex-col items-center justify-center bg-slate-900">
+        <div className="flex w-4/12 flex-col gap-6">
+          <NextImage
+            src="./logo.svg"
+            alt={config.meta.logo}
+            width={size.width}
+            height={size.height}
+            className="self-center"
+          />
+          <div className="max-w-fit self-center text-center">
+            <p className="mb-4 text-lg">{config.meta.description}</p>
+            <span className="text-lg text-[#00e6a7]">{config.meta.siteUrl}</span>
+          </div>
+        </div>
+      </div>
+    ),
+    // ImageResponse options
+    {
+      // For convenience, we can re-use the exported opengraph-image
+      // size config to also set the ImageResponse's width and height.
+      ...size
+    }
+  );
+}

From e77c46fd84e90016b5c477715a736509f39fad69 Mon Sep 17 00:00:00 2001
From: Isaac Alencar <alencarisaac3@gmail.com>
Date: Sun, 24 Dec 2023 11:12:21 -0300
Subject: [PATCH 2/2] add twitter image generator

---
 app/twitter-image.tsx | 45 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 app/twitter-image.tsx

diff --git a/app/twitter-image.tsx b/app/twitter-image.tsx
new file mode 100644
index 0000000..cc214da
--- /dev/null
+++ b/app/twitter-image.tsx
@@ -0,0 +1,45 @@
+import NextImage from "next/image";
+import { ImageResponse } from "next/og";
+import config from "./config.mts";
+
+// // Route segment config
+export const runtime = "edge";
+
+// Image metadata
+export const alt = config.meta.title;
+export const size = {
+  width: 600,
+  height: 315
+};
+
+export const contentType = "image/png";
+
+// Image generation
+export default async function Image() {
+  return new ImageResponse(
+    (
+      // ImageResponse JSX element
+      <div className="flex min-h-[630px] min-w-[1200px] flex-col items-center justify-center bg-slate-900">
+        <div className="flex w-4/12 flex-col gap-6">
+          <NextImage
+            src="./logo.svg"
+            alt={config.meta.logo}
+            width={size.width}
+            height={size.height}
+            className="self-center"
+          />
+          <div className="max-w-fit self-center text-center">
+            <p className="mb-4 text-lg">{config.meta.description}</p>
+            <span className="text-lg text-[#00e6a7]">{config.meta.siteUrl}</span>
+          </div>
+        </div>
+      </div>
+    ),
+    // ImageResponse options
+    {
+      // For convenience, we can re-use the exported opengraph-image
+      // size config to also set the ImageResponse's width and height.
+      ...size
+    }
+  );
+}