Merge pull request #101 from Eisvana/dev

limit max discord message size to 10mb

components/BlogBuilder.vue

@@ -9,6 +9,7 @@ import PicoStyle from './PicoStyle.vue';
 import GalleryElement from './GalleryElement.vue';
 import { escapeFileName } from '../logic/fileNameEscape';
 import { maxLength } from '../variables/formValidation';
+import { maxFilesPerMessage, maxMessageSize } from '../variables/fileCompression';
 
 const pageContent = ref('# Hello World\n\nThis is content');
 const images = ref<File[]>([]);
@@ -50,14 +51,30 @@ const textFormData = computed<FormData>(() => buildTextFileFormData(pageContent.
 const formData = computed<FormData[]>(() => [textFormData.value, ...imageFormData.value]);
 
 function paginate(arr: File[]) {
-  const size = 10; // maximum amount of files in one Discord message
-  return arr.reduce((acc: File[][], val, i) => {
-    const idx = Math.floor(i / size);
-    const page = (acc[idx] ??= []);
-    page.push(val);
-
-    return acc;
-  }, []);
+  // sort by filesize; descending (largest first, smallest last)
+  const sortedFiles = arr.toSorted((a, b) => b.size - a.size);
+
+  const chunks: File[][] = [];
+  let currentChunk: File[] = [];
+  let currentSize = 0;
+
+  for (const file of sortedFiles) {
+    if (currentChunk.length < maxFilesPerMessage && currentSize + file.size < maxMessageSize) {
+      // add the file to the current chunk
+      currentChunk.push(file);
+      currentSize += file.size;
+    } else {
+      // start a new chunk
+      chunks.push(currentChunk);
+      currentChunk = [file];
+      currentSize = file.size;
+    }
+  }
+
+  // add the last chunk if it's not empty
+  if (currentChunk.length) chunks.push(currentChunk);
+
+  return chunks;
 }
 
 const renameFile = (file: File, name: string) => new File([file], name, { type: file.type });

logic/compressImage.ts

@@ -1,19 +1,19 @@
-import { maxSize } from '../variables/fileCompression';
+import { maxFileSize } from '../variables/fileCompression';
 import { imageTypes, compressImage } from 'simple-image-compressor';
 import { escapeFileName } from './fileNameEscape';
 
 export async function compressFile(inputFile: File, quality: number = 1): Promise<File> {
   const sanitisedFileName = escapeFileName(inputFile.name);
   const file = new File([inputFile], sanitisedFileName, { type: inputFile.type });
-  if (file.size < maxSize) return file; // if below 2 MB, don't do anything
+  if (file.size < maxFileSize) return file; // if below 2 MB, don't do anything
   const type = imageTypes.WEBP;
   const newFileExtension = type.split('/').at(-1);
   const res = await compressImage(file, {
     quality,
     type,
   });
   const lowerQuality = quality - 0.01; // NoSonar reduce quality by 1%;
-  if (res.size > maxSize) return await compressFile(file, lowerQuality); // compress original file with lower quality setting to avoid double compression
+  if (res.size > maxFileSize) return await compressFile(file, lowerQuality); // compress original file with lower quality setting to avoid double compression
   const fileName = file.name.split('.').slice(0, -1).join('.');
   const newFileName = `${fileName}-min.${newFileExtension}`;
   return new File([res], newFileName, { type });

package.json

@@ -8,13 +8,13 @@
   },
   "dependencies": {
     "@picocss/pico": "^2.0.0",
-    "md-editor-v3": "^4.18.1",
+    "md-editor-v3": "^4.20.1",
     "simple-image-compressor": "^1.8.2",
-    "vitepress": "^1.3.3"
+    "vitepress": "^1.3.4"
   },
   "devDependencies": {
     "prettier": "^3.3.3",
-    "sass": "^1.77.8",
-    "vue-tsc": "^2.0.29"
+    "sass": "^1.78.0",
+    "vue-tsc": "^2.1.6"
   }
 }

public/robots.txt

@@ -0,0 +1,4 @@
+# robots.txt generated by smallseotools.com
+User-agent: *
+Disallow: 
+Sitemap: https://eisvana.com/sitemap.xml

variables/fileCompression.ts

@@ -1 +1,4 @@
-export const maxSize = 2000000; // 2MB, to keep page load speeds fast
+export const maxFilesPerMessage = 10; // maximum amount of files in one Discord message
+export const maxFileSize  = 2000000; // 2MB, to keep page load speeds fast
+
+export const maxMessageSize = 10000000; // 10MB, Discord upload limit