Fix remote image urls not showing up in image grids

package.json

@@ -30,6 +30,7 @@
     "@types/express": "^4.17.20",
     "@types/jest": "^29.0.0",
     "@types/uuid": "^9.0.0",
+    "axios": "^1.8.4",
     "body-parser": "^1.20.2",
     "canvas": "^2.11.2",
     "clone-deep": "^4.0.1",
@@ -40,7 +41,7 @@
     "glob": "^10.3.10",
     "jest": "^29.0.0",
     "jest-mock-extended": "^3.0.0",
-    "jimp": "^0.22.12",
+    "jimp": "^1.6.0",
     "minimatch": "9.0.5",
     "mysql": "^2.18.1",
     "ts-jest": "^29.0.0",

src/helpers/ImageHelper.ts

@@ -3,7 +3,8 @@ import path from "path";
 import AppLogger from "../client/appLogger";
 import {existsSync} from "fs";
 import Inventory from "../database/entities/app/Inventory";
-import Jimp from "jimp";
+import { Bitmap, Jimp } from "jimp";
+import axios from "axios";
 
 interface CardInput {
     id: string;
@@ -29,14 +30,24 @@ export default class ImageHelper {
 
             const filePath = path.join(process.env.DATA_DIR!, "cards", card.path);
 
-            const exists = existsSync(filePath);
+            let bitmap: Bitmap;
 
-            if (!exists) {
+            if (existsSync(filePath)) {
+                const data = await Jimp.read(filePath);
+
+                bitmap = data.bitmap;
+            } else if (card.path.startsWith("http://") || card.path.startsWith("https://")) {
+                const response = await axios.get(card.path, { responseType: "arraybuffer" });
+                const buffer = Buffer.from(response.data);
+                const data = await Jimp.fromBuffer(buffer);
+
+                bitmap = data.bitmap;
+            } else {
                 AppLogger.LogError("ImageHelper/GenerateCardImageGrid", `Failed to load image from path ${card.path}`);
                 continue;
             }
 
-            const imageData = await Jimp.read(filePath);
+            const imageData = Jimp.fromBitmap(bitmap);
 
             if (userId != null) {
                 const claimed = await Inventory.FetchOneByCardNumberAndUserId(userId, card.id);
@@ -46,7 +57,7 @@ export default class ImageHelper {
                 }
             }
 
-            const image = await loadImage(await imageData.getBufferAsync("image/png"));
+            const image = await loadImage(await imageData.getBuffer("image/png"));
 
             const x = i % gridWidth;
             const y = Math.floor(i / gridWidth);