Untitled

import { ImageResponse } from "next/og"
import { NextRequest } from "next/server"

export const runtime = "edge"

export async function GET(req: NextRequest) {
  const { searchParams } = req.nextUrl
  const postTitle = decodeURIComponent(searchParams.get("title") || "Thích Tiếng Anh")
  const font = fetch(new URL("../../../public/fonts/BeVietnamPro-Bold.ttf", import.meta.url)).then((res) => res.arrayBuffer())
  const fontData = await font

  return new ImageResponse(
    (
      <div
        style={{
          height: "100%",
          width: "100%",
          display: "flex",
          flexDirection: "column",
          alignItems: "flex-start",
          justifyContent: "center",
          backgroundImage: "linear-gradient(to bottom, #dbf4ff, #fff1f1)",
        }}
      >
        <div
          style={{
            marginLeft: 190,
            marginRight: 190,
            display: "flex",
            fontSize: 130,
            fontFamily: "Be Vietnam Pro",
            letterSpacing: "-0.05em",
            fontStyle: "normal",
            color: "black",
            lineHeight: "1.1",
            whiteSpace: "pre-wrap",
          }}
        >
          {postTitle}
        </div>
      </div>
    ),
    {
      width: 1920,
      height: 1080,
      fonts: [
        {
          name: "Be Vietnam Pro",
          data: fontData,
          style: "normal",
        },
      ],
      status: 200,
      headers: { "X-Robots-Tag": "noindex" },
    },

  )
}