Fix featured sponsors SVG (404 error)

package.json

@@ -35,7 +35,6 @@
     "marked": "^9.0.3",
     "mdast-util-to-string": "^4.0.0",
     "nanoid": "^5.0.1",
-    "node-base64-image": "^2.0.6",
     "octokit": "^3.1.1",
     "postcss-import": "^15.1.0",
     "postcss-nested": "^6.0.0",

src/pages/resources/featured-sponsors-darkmode.svg.js

@@ -1,6 +1,7 @@
 import featuredSponsors from "../../featured-sponsors.json"
+import fs from "fs"
+import path from "path"
 import sizeOf from "image-size"
-import {encode} from 'node-base64-image';
 
 const baseUrl = import.meta.env.SITE
 
@@ -67,7 +68,7 @@ const buildResponse = () => {
   images.map((image) => {
     response += `
       <a xlink:href="${image.url}" target="_blank">
-        <image href="${encode(image.path)}" x="${image.x}" y="${image.y}" height="${image.height}" width="${image.width}" />
+        <image href="${imgToBase64(image.path)}" x="${image.x}" y="${image.y}" height="${image.height}" width="${image.width}" />
       </a>
     `
   })
@@ -77,6 +78,16 @@ const buildResponse = () => {
   return response;
 }
 
+function imgToBase64(filePath) {
+  let extname = path.extname(filePath).slice(1) || 'png';
+
+  if (extname === 'svg') {
+    extname = "svg+xml"
+  }
+
+  return 'data:image/' + extname + ';base64,' + fs.readFileSync(filePath).toString('base64');
+}
+
 /**
  * Take the original width and height of an image and proportionally scale it
  * for optical balance in this layout.
@@ -117,8 +128,6 @@ const getScaledImageDimensions = (width, height) => {
   return [w, h];
 }
 
-export async function get({ params, request }) {
-  return {
-    body: buildResponse(),
-  }
+export async function GET({ params, request }) {
+  return new Response(buildResponse())
 }

src/pages/resources/featured-sponsors.svg.js

@@ -1,6 +1,7 @@
 import featuredSponsors from "../../featured-sponsors.json"
+import fs from "fs"
+import path from "path"
 import sizeOf from "image-size"
-import {encode} from 'node-base64-image';
 
 const baseUrl = import.meta.env.SITE
 
@@ -67,7 +68,7 @@ const buildResponse = () => {
   images.map((image) => {
     response += `
       <a xlink:href="${image.url}" target="_blank">
-        <image href="${encode(image.path)}" x="${image.x}" y="${image.y}" height="${image.height}" width="${image.width}" />
+        <image href="${imgToBase64(image.path)}" x="${image.x}" y="${image.y}" height="${image.height}" width="${image.width}" />
       </a>
     `
   })
@@ -77,6 +78,16 @@ const buildResponse = () => {
   return response;
 }
 
+function imgToBase64(filePath) {
+  let extname = path.extname(filePath).slice(1) || 'png';
+
+  if (extname === 'svg') {
+    extname = "svg+xml"
+  }
+
+  return 'data:image/' + extname + ';base64,' + fs.readFileSync(filePath).toString('base64');
+}
+
 /**
  * Take the original width and height of an image and proportionally scale it
  * for optical balance in this layout.
@@ -117,8 +128,6 @@ const getScaledImageDimensions = (width, height) => {
   return [w, h];
 }
 
-export async function get({ params, request }) {
-  return {
-    body: buildResponse(),
-  }
+export async function GET({ params, request }) {
+  return new Response(buildResponse())
 }