import { ImageResponse } from "next/og";
import { OgFrame } from "@/components/OgImage";
import { RESOURCE_TABS, getPost } from "@/lib/resources-posts";

export const size = { width: 1200, height: 630 };
export const contentType = "image/png";

export default async function OgImage({
  params,
}: {
  params: Promise<{ slug: string }>;
}) {
  const { slug } = await params;
  const post = getPost(slug);
  const tabLabel =
    RESOURCE_TABS.find((t) => t.id === post?.tab)?.label.toUpperCase() ??
    "MXERP RESOURCES";
  // Keep long titles readable at OG scale
  const title =
    post && post.title.length > 90 ? post.title.slice(0, 87) + "…" : (post?.title ?? "MxERP Resources");
  return new ImageResponse(
    <OgFrame eyebrow={tabLabel} title={title} />,
    { ...size }
  );
}