/* eslint-disable @next/next/no-img-element */
import { ImageResponse } from "next/og";

export const runtime = "edge";

export const size = {
  width: 1200,
  height: 630,
};

export const contentType = "image/png";

export default async function Image() {
  const heroImage = (await fetch(
    new URL("@/public/assets/hero-image-participant.png", import.meta.url)
  ).then((res) => res.arrayBuffer())) as string;

  return new ImageResponse(
    (
      <div
        style={{
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
        }}
      >
        <img alt="" src={heroImage} width={1200} />
      </div>
    ),
    {
      ...size,
    }
  );
}