From 743bbae5d1c3573b7104a7b589e76c7cdc385ed1 Mon Sep 17 00:00:00 2001
From: Entaigner <ent@aigner.dev>
Date: Sun, 21 Apr 2024 11:54:30 +0200
Subject: [PATCH] Bugfix: FileReader can't be resused so init one per image

---
 src/lib/components/chat/MessageInput.svelte | 47 ++++++++++-----------
 1 file changed, 22 insertions(+), 25 deletions(-)

diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index ebf8e9713..2793a8d4b 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -316,24 +316,22 @@
 			console.log(e);
 
 			if (e.dataTransfer?.files) {
-				let reader = new FileReader();
-
-				reader.onload = (event) => {
-					files = [
-						...files,
-						{
-							type: 'image',
-							url: `${event.target.result}`
-						}
-					];
-				};
-
 				const inputFiles = Array.from(e.dataTransfer?.files);
 
 				if (inputFiles && inputFiles.length > 0) {
 					inputFiles.forEach((file) => {
 						console.log(file, file.name.split('.').at(-1));
 						if (['image/gif', 'image/jpeg', 'image/png'].includes(file['type'])) {
+							let reader = new FileReader();
+							reader.onload = (event) => {
+								files = [
+									...files,
+									{
+										type: 'image',
+										url: `${event.target.result}`
+									}
+								];
+							};
 							reader.readAsDataURL(file);
 						} else if (
 							SUPPORTED_FILE_TYPE.includes(file['type']) ||
@@ -470,23 +468,22 @@
 					hidden
 					multiple
 					on:change={async () => {
-						let reader = new FileReader();
-						reader.onload = (event) => {
-							files = [
-								...files,
-								{
-									type: 'image',
-									url: `${event.target.result}`
-								}
-							];
-							inputFiles = null;
-							filesInputElement.value = '';
-						};
-
 						if (inputFiles && inputFiles.length > 0) {
 							const _inputFiles = Array.from(inputFiles);
 							_inputFiles.forEach((file) => {
 								if (['image/gif', 'image/jpeg', 'image/png'].includes(file['type'])) {
+									let reader = new FileReader();
+									reader.onload = (event) => {
+										files = [
+											...files,
+											{
+												type: 'image',
+												url: `${event.target.result}`
+											}
+										];
+										inputFiles = null;
+										filesInputElement.value = '';
+									};
 									reader.readAsDataURL(file);
 								} else if (
 									SUPPORTED_FILE_TYPE.includes(file['type']) ||