More simplified approach to loading images

package.json

@@ -11,7 +11,6 @@
   "private": true,
   "dependencies": {
     "@fluxerjs/core": "^1.0.6",
-    "canvas": "^3.2.1",
     "pg": "^8.18.0",
     "pg-hstore": "^2.3.4",
     "sequelize": "^6.37.7"

src/enums.js

@@ -10,7 +10,7 @@ helperEnums.err = {
     DISPLAY_NAME_TOO_LONG: "The display name is too long. Please limit it to 32 characters or less.",
     PROXY_EXISTS: "A duplicate proxy already exists for one of your members. Please pick a new one, or change the old one first.",
     NO_SUCH_COMMAND: "No such command exists.",
-    PROPIC_FAILS_REQUIREMENTS: "Profile picture must be in JPG or PNG format.",
+    PROPIC_FAILS_REQUIREMENTS: "Profile picture must be in JPG, PNG, or WEBP format.",
     PROPIC_CANNOT_LOAD: "Profile picture could not be loaded from URL.",
     NO_WEBHOOKS_ALLOWED: "Channel does not support webhooks.",
     NOT_IN_SERVER: "You can only proxy in a server.",
@@ -32,7 +32,7 @@ helperEnums.help = {
     NAME: "Updates the name for a specific member based on their current name, for ex: `pf;member jane name jane`. The member name should ideally be short so you can write other commands with it easily.",
     DISPLAY_NAME: "Updates the display name for a specific member based on their name, for example: `pf;member jane \"Jane Doe | ze/hir\"`.This can be up to 32 characters long. If it has spaces, put it in __double quotes__.",
     PROXY: "Updates the proxy tag for a specific member based on their name. The proxy must be formatted with the tags surrounding the word 'text', for example: `pf;member jane proxy Jane:text` or `pf;member amal proxy [text]` This is so the bot can detect what the proxy tags are.",
-    PROPIC: "Updates the profile picture for the member. Must be in JPG or PNG format. The two options are:\n1. Pass in a direct remote image URL, for example: `pf;member jane propic <https://cdn.pixabay.com/photo/2020/05/02/02/54/animal-5119676_1280.jpg>`. You can upload images on sites like <https://imgbb.com/>.\n2. Upload an attachment directly.\n\n**NOTE:** Fluxer does not save your attachments forever, so option #1 is recommended.",
+    PROPIC: "Updates the profile picture for the member. Must be in JPG, PNG, or WEBP format. The two options are:\n1. Pass in a direct remote image URL, for example: `pf;member jane propic <https://cdn.pixabay.com/photo/2020/05/02/02/54/animal-5119676_1280.jpg>`. You can upload images on sites like <https://imgbb.com/>.\n2. Upload an attachment directly.\n\n**NOTE:** Fluxer does not save your attachments forever, so option #1 is recommended.",
     IMPORT: "Imports from PluralKit using the JSON file provided by their export command. Importing from other proxy bots is TBD. `pf;import` and attach your JSON file to the message."
 }
 

src/helpers/memberHelper.js

@@ -1,6 +1,5 @@
 import {db} from '../db.js';
 import {enums} from "../enums.js";
-import {loadImage} from "canvas";
 import {EmptyResultError} from "sequelize";
 import {EmbedBuilder} from "@fluxerjs/core";
 
@@ -188,17 +187,31 @@ mh.updatePropic = async function(authorId, args, attachmentUrl, attachmentExpiry
     if (updatedArgs[2]) {
         img = updatedArgs[2];
     }
-
-    const loadedImage = await loadImage(img).then((li) => {
-        return li;
-    }).catch((err) => {
-        throw new Error(`${enums.err.PROPIC_CANNOT_LOAD}: ${err.message}`);
-    });
-    if (loadedImage) {
+    console.log(img);
+    const isValidImage = await mh.checkImageFormatValidity(img).catch((e) =>{throw e});
+    if (isValidImage) {
         return await mh.updateMemberField(authorId, updatedArgs).catch((e) =>{throw e});
     }
 }
 
+/**
+ * Checks if an uploaded picture is in the right format.
+ *
+ * @async
+ * @param {string} imageUrl - The url of the image
+ * @returns {Promise<boolean>} - If the image is a valid format.
+ * @throws {Error} When loading the profile picture from a URL doesn't work, or it fails requirements.
+ */
+mh.checkImageFormatValidity = async function(imageUrl) {
+    const acceptableImages = ['image/png', 'image/jpg', 'image/jpeg', 'image/webp'];
+    return await fetch(imageUrl).then(r => r.blob()).then(blobFile => {
+        if (blobFile.size > 1000000 || !acceptableImages.includes(blobFile.type)) throw new Error(enums.err.PROPIC_FAILS_REQUIREMENTS);
+        return true;
+    }).catch((error) => {
+        throw new Error(`${enums.err.PROPIC_CANNOT_LOAD}: ${error.message}`);
+    });
+}
+
 /**
  * Removes a member.
  *
@@ -250,9 +263,10 @@ mh.addFullMember = async function(authorId, memberName, displayName = null, prox
         await mh.checkIfProxyExists(authorId, proxy).catch((e) =>{throw e});
     }
     if (propic) {
-        await loadImage(propic).catch((err) => {
-            throw new Error(`Can't add ${memberName}. ${enums.err.PROPIC_CANNOT_LOAD}: ${err.message}`);
-        });
+        const isValidImage = await mh.checkImageFormatValidity(img).catch((e) =>{throw e});
+        if (isValidImage) {
+            return await mh.updateMemberField(authorId, updatedArgs).catch((e) =>{throw e});
+        }
     }
 
     return await db.members.create({