portifolio-evandrodevbr/app/servicos/[slug]/opengraph-image.tsx

import { notFound } from "next/navigation";
import { ImageResponse } from "next/og";
import { OG_CONTENT_TYPE, OG_SIZE, OgCard } from "@/lib/og-card";
import { getServicePage, servicePages } from "@/lib/site-content";

function getImageMetadata(service: (typeof servicePages)[number]) {
  return {
    id: service.slug,
    alt: `${service.navLabel} — Evandro Fonseca Junior`,
    size: OG_SIZE,
    contentType: OG_CONTENT_TYPE,
  };
}

export function generateImageMetadata({
  params,
}: {
  params: { slug?: string };
}) {
  if (!params.slug) {
    return servicePages.map(getImageMetadata);
  }

  const service = getServicePage(params.slug);
  if (!service) notFound();
  return [getImageMetadata(service)];
}

export default async function Image({
  params,
  id,
}: {
  params: Promise<{ slug: string }>;
  id: Promise<string>;
}) {
  const [{ slug }, imageId] = await Promise.all([params, id]);
  const service = getServicePage(slug);
  if (!service || imageId !== service.slug) notFound();

  return new ImageResponse(
    <OgCard
      eyebrow={service.eyebrow}
      title={service.navLabel}
      description={service.intro}
    />,
    OG_SIZE,
  );
}