diff --git a/apps/marketing/src/app/(marketing)/blog/[post]/opengraph-image.tsx b/apps/marketing/src/app/(marketing)/blog/[post]/opengraph-image.tsx index 2de6fb3d4..71fe6c7e0 100644 --- a/apps/marketing/src/app/(marketing)/blog/[post]/opengraph-image.tsx +++ b/apps/marketing/src/app/(marketing)/blog/[post]/opengraph-image.tsx @@ -11,6 +11,13 @@ export const size = { export const contentType = 'image/png'; +const OG_IMAGE_ASSETS = [ + './../../../../assets/inter-bold.ttf', + './../../../../assets/inter-regular.ttf', + './../../../../assets/background-blog-og.png', + './../../../../../public/logo.png', +]; + type BlogPostOpenGraphImageProps = { params: { post: string }; }; @@ -22,29 +29,19 @@ export default async function BlogPostOpenGraphImage({ params }: BlogPostOpenGra return null; } - const [interBold, interRegular, backgroundImage, logoImage] = await Promise.all([ - fetch(new URL('./../../../../assets/inter-bold.ttf', import.meta.url)).then(async (res) => - res.arrayBuffer(), + const [interBold, interRegular, backgroundImage, logoImage] = await Promise.all( + OG_IMAGE_ASSETS.map(async (asset) => + fetch(new URL(asset, import.meta.url)).then(async (res) => res.arrayBuffer()), ), - fetch(new URL('./../../../../assets/inter-regular.ttf', import.meta.url)).then(async (res) => - res.arrayBuffer(), - ), - fetch(new URL('./../../../../assets/background-blog-og.png', import.meta.url)).then( - async (res) => res.arrayBuffer(), - ), - fetch(new URL('./../../../../../public/logo.png', import.meta.url)).then(async (res) => - res.arrayBuffer(), - ), - ]); + ); return new ImageResponse( ( -
+
+ {/* @ts-expect-error Lack of typing from ImageResponse */} og-background + {/* @ts-expect-error Lack of typing from ImageResponse */} logo