feat(gurubu-client): open graph image generator added

gurubu-client/src/app/api/og/route.tsx

@@ -0,0 +1,53 @@
+import { ImageResponse } from "next/og";
+import { CSSProperties } from "react";
+
+export const runtime = "edge";
+
+const imageStyle: CSSProperties = {
+  backgroundColor: "#ffffff",
+  backgroundSize: "150px 150px",
+  height: "100%",
+  width: "100%",
+  display: "flex",
+  textAlign: "center",
+  alignItems: "center",
+  justifyContent: "center",
+  flexDirection: "column",
+  flexWrap: "nowrap",
+  fontSize: "48px",
+};
+
+const imageSize = {
+  width: 1200,
+  height: 630,
+};
+
+export async function GET(request: Request) {
+  try {
+    const imageData = await fetch(
+      new URL("../../../../public/logo-with-text.png", import.meta.url)
+    ).then((res) => res.arrayBuffer());
+
+    return new ImageResponse(
+      (
+        <div style={imageStyle}>
+          {imageData && (
+            <img width={372} height={90} src={imageData as unknown as string} />
+          )}
+          Simple, fast and practical grooming.
+        </div>
+      ),
+      imageSize
+    );
+  } catch (e: any) {
+    return new ImageResponse(
+      (
+        <div style={imageStyle}>
+          <h1>GuruBu</h1>
+          Simple, fast and practical grooming.
+        </div>
+      ),
+      imageSize
+    );
+  }
+}

gurubu-client/src/app/layout.tsx

@@ -9,6 +9,16 @@ const spaceGrotesk = Space_Grotesk({ subsets: ["latin"], variable: '--font-space
 export const metadata: Metadata = {
   title: "Gurubu | Simple, fast and practical grooming",
   description: "Simple, fast and practical grooming.",
+  openGraph: {
+    images: [
+      {
+        url: "/api/og",
+        width: 1200,
+        height: 630,
+        alt: "Simple, fast and practical grooming.",
+      },
+    ],
+  },
 };
 
 export default function RootLayout({

gurubu-client/src/app/robots.ts

@@ -0,0 +1,9 @@
+import { MetadataRoute } from "next";
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: {
+      allow: ["/", "/api/og/*"],
+    },
+  };
+}