diff --git a/app/(landing)/opengraph-image.tsx b/app/(landing)/opengraph-image.tsx
index f46971d..cfa2e90 100644
--- a/app/(landing)/opengraph-image.tsx
+++ b/app/(landing)/opengraph-image.tsx
@@ -1,27 +1,20 @@
import { ImageResponse } from 'next/og';
-import { env } from '@/env';
-
export const runtime = 'edge';
export const contentType = 'image/png';
-const interRegularFontP = fetch(
- new URL('https://fonts.bunny.net/inter/files/inter-latin-400-normal.woff'),
-).then((res) => res.arrayBuffer());
-
-const interBoldFontP = fetch(
- new URL('https://fonts.bunny.net/inter/files/inter-latin-700-normal.woff'),
-).then((res) => res.arrayBuffer());
-
-const publicUrl =
- env.SITE_URL ||
- (env.VERCEL_URL && `https://${env.VERCEL_URL}`) ||
- 'http://localhost:3000';
+const fetchArrayBuffer = async (url: string | URL) =>
+ fetch(url).then((res) => res.arrayBuffer());
export const handler = async () => {
- const [interRegularFont, interBoldFont] = await Promise.all([
- interRegularFontP,
- interBoldFontP,
+ const [interRegularFont, interBoldFont, globeImage] = await Promise.all([
+ fetchArrayBuffer(
+ 'https://fonts.bunny.net/inter/files/inter-latin-400-normal.woff',
+ ),
+ fetchArrayBuffer(
+ 'https://fonts.bunny.net/inter/files/inter-latin-700-normal.woff',
+ ),
+ fetchArrayBuffer(new URL('@/assets/globe.png', import.meta.url)),
]);
return new ImageResponse(
@@ -158,8 +151,7 @@ export const handler = async () => {
{/* eslint-disable-next-line @next/next/no-img-element, jsx-a11y/alt-text */}
res.arrayBuffer());
-
-const interBoldFontP = fetch(
- new URL('https://fonts.bunny.net/inter/files/inter-latin-700-normal.woff'),
-).then((res) => res.arrayBuffer());
-
-const publicUrl =
- env.SITE_URL ||
- (env.VERCEL_URL && `https://${env.VERCEL_URL}`) ||
- 'http://localhost:3000';
+const fetchArrayBuffer = async (url: string | URL) =>
+ fetch(url).then((res) => res.arrayBuffer());
type OGImageProps = {
params: Promise<{
@@ -27,9 +16,14 @@ type OGImageProps = {
export const handler = async ({ params: paramsPromise }: OGImageProps) => {
const params = await paramsPromise;
- const [interRegularFont, interBoldFont] = await Promise.all([
- interRegularFontP,
- interBoldFontP,
+ const [interRegularFont, interBoldFont, globeImage] = await Promise.all([
+ fetchArrayBuffer(
+ 'https://fonts.bunny.net/inter/files/inter-latin-400-normal.woff',
+ ),
+ fetchArrayBuffer(
+ 'https://fonts.bunny.net/inter/files/inter-latin-700-normal.woff',
+ ),
+ fetchArrayBuffer(new URL('@/assets/globe.png', import.meta.url)),
]);
return new ImageResponse(
@@ -166,8 +160,7 @@ export const handler = async ({ params: paramsPromise }: OGImageProps) => {
{/* eslint-disable-next-line @next/next/no-img-element, jsx-a11y/alt-text */}