From c37a4efef3bb06fd3b458c282b2a47f81c9248da Mon Sep 17 00:00:00 2001
From: Bart van der Braak <bartvdbraak@gmail.com>
Date: Sun, 21 Jan 2024 22:28:54 +0100
Subject: [PATCH] refactor: restructure code and errorhandling

---
 src/routes/og.png/+server.ts | 93 ++++++++++++++++++++++--------------
 1 file changed, 57 insertions(+), 36 deletions(-)

diff --git a/src/routes/og.png/+server.ts b/src/routes/og.png/+server.ts
index 31ad2cf..8047c33 100644
--- a/src/routes/og.png/+server.ts
+++ b/src/routes/og.png/+server.ts
@@ -4,52 +4,73 @@ import { html as toReactNode } from 'satori-html';
 import { OgImage } from '$lib/components/site';
 import GeistRegular from '$lib/assets/og/Geist-Regular.woff';
 import GeistBold from '$lib/assets/og/Geist-Bold.woff';
-import { readFileSync } from 'fs';
+import { readFile } from 'fs/promises';
+import path from 'path';
 
 const height = 630;
 const width = 1200;
 
-const meImage = readFileSync(`${process.cwd()}/src/lib/assets/og/me.jpg`);
-const imageData = Buffer.from(meImage).toString('base64');
+const getImageData = async () => {
+	try {
+		const imagePath = path.join(process.cwd(), 'src', 'lib', 'assets', 'og', 'me.jpg');
+		const meImage = await readFile(imagePath);
+		return Buffer.from(meImage).toString('base64');
+	} catch (error) {
+		console.error('Error reading image:', error);
+		throw error;
+	}
+};
 
 /** @type {import('./$types').RequestHandler} */
 export const GET = async ({ url }) => {
-	const title = url.searchParams.get('title') ?? undefined;
-	const subTitle = url.searchParams.get('subTitle') ?? undefined;
+	try {
+		const title = url.searchParams.get('title') ?? undefined;
+		const subTitle = url.searchParams.get('subTitle') ?? undefined;
 
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	const result = (OgImage as any).render({ title, subTitle, imageData });
-	const element = toReactNode(`${result.html}<style>${result.css.code}</style>`);
+		const imageData = await getImageData();
 
-	const svg = await satori(element, {
-		fonts: [
-			{
-				name: 'Geist Regular',
-				data: Buffer.from(GeistRegular),
-				weight: 100
-			},
-			{
-				name: 'Geist Bold',
-				data: Buffer.from(GeistBold),
-				weight: 700
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		const result = (OgImage as any).render({ title, subTitle, imageData });
+		const element = toReactNode(`${result.html}<style>${result.css.code}</style>`);
+
+		const svg = await satori(element, {
+			fonts: [
+				{
+					name: 'Geist Regular',
+					data: Buffer.from(GeistRegular),
+					weight: 100
+				},
+				{
+					name: 'Geist Bold',
+					data: Buffer.from(GeistBold),
+					weight: 700
+				}
+			],
+			height,
+			width
+		});
+
+		const resvg = new Resvg(svg, {
+			fitTo: {
+				mode: 'width',
+				value: width
 			}
-		],
-		height,
-		width
-	});
+		});
 
-	const resvg = new Resvg(svg, {
-		fitTo: {
-			mode: 'width',
-			value: width
-		}
-	});
+		const image = resvg.render();
 
-	const image = resvg.render();
-
-	return new Response(image.asPng(), {
-		headers: {
-			'content-type': 'image/png'
-		}
-	});
+		return new Response(image.asPng(), {
+			headers: {
+				'content-type': 'image/png'
+			}
+		});
+	} catch (error) {
+		console.error('Error generating image:', error);
+		return new Response('Internal Server Error', {
+			status: 500,
+			headers: {
+				'content-type': 'text/plain'
+			}
+		});
+	}
 };