import { ImageResponse } from 'next/og';

import { getCreatorDataCached } from '@/services/creatorsCache';

import CreatorSquareBlurOgImage from '@/components/opengraph/CreatorSquareBlurOgImage';

const imageSize = {
  width: 1200,
  height: 630,
};

type RouteContext = {
  params: Promise<{ id: string }>;
};

export async function GET(_request: Request, context: RouteContext) {
  const { id } = await Promise.resolve(context.params);

  const creator = await getCreatorDataCached(id).catch(() => null);
  const galleryImage = creator?.galeria?.[0] ?? null;
  const apiUrl = process.env.NEXT_PUBLIC_API_URL?.replace(/\/$/, '');
  const imageUrl =
    apiUrl && galleryImage?.key
      ? `${apiUrl}/imageRepository/getImage?key=${encodeURIComponent(galleryImage.key)}`
      : null;

  return new ImageResponse(
    <CreatorSquareBlurOgImage
      imageUrl={imageUrl}
      imageWidth={galleryImage?.width}
      imageHeight={galleryImage?.height}
      canvasWidth={imageSize.width}
      canvasHeight={imageSize.height}
    />,
    {
      width: imageSize.width,
      height: imageSize.height,
    }
  );
}