From 6681df29d27e1d56baabadfbac5492e509870137 Mon Sep 17 00:00:00 2001
From: Clivia <132346501+Yanyutin753@users.noreply.github.com>
Date: Wed, 31 Jul 2024 07:25:53 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E2=9A=A1Initialize=20fileItem=20first=20to?=
 =?UTF-8?q?=20speed=20up=20file=20display?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/chat/MessageInput.svelte | 71 ++++++++++++---------
 1 file changed, 41 insertions(+), 30 deletions(-)

diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index 5ea541c7f..e59e917e1 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { toast } from 'svelte-sonner';
+	import { v4 as uuidv4 } from 'uuid';
 	import { onMount, tick, getContext } from 'svelte';
 	import {
 		type Model,
@@ -98,6 +99,8 @@
 
 	const uploadFileHandler = async (file) => {
 		console.log(file);
+		const fileId = uuidv4();
+
 		// Check if the file is an audio file and transcribe/convert it to text file
 		if (['audio/mpeg', 'audio/wav'].includes(file['type'])) {
 			const res = await transcribeAudio(localStorage.token, file).catch((error) => {
@@ -112,40 +115,48 @@
 			}
 		}
 
-		// Upload the file to the server
-		const uploadedFile = await uploadFile(localStorage.token, file).catch((error) => {
-			toast.error(error);
-			return null;
-		});
+		const fileItem = {
+			type: 'file',
+			file: '',
+			id: fileId,
+			url: '',
+			name: file.name,
+			collection_name: '',
+			status: 'uploaded',
+			size: file.size,
+			error: ''
+		};
+		files = [...files, fileItem];
 
-		if (uploadedFile) {
-			const fileItem = {
-				type: 'file',
-				file: uploadedFile,
-				id: uploadedFile.id,
-				url: `${WEBUI_API_BASE_URL}/files/${uploadedFile.id}`,
-				name: file.name,
-				collection_name: '',
-				status: 'uploaded',
-				error: ''
-			};
-			files = [...files, fileItem];
+		try {
+			const uploadedFile = await uploadFile(localStorage.token, file);
 
-			// TODO: Check if tools & functions have files support to skip this step to delegate file processing
-			// Default Upload to VectorDB
-			if (
-				SUPPORTED_FILE_TYPE.includes(file['type']) ||
-				SUPPORTED_FILE_EXTENSIONS.includes(file.name.split('.').at(-1))
-			) {
-				processFileItem(fileItem);
+			if (uploadedFile) {
+				fileItem.file = uploadedFile;
+				fileItem.id = uploadedFile.id;
+				fileItem.url = `${WEBUI_API_BASE_URL}/files/${uploadedFile.id}`;
+
+				// TODO: Check if tools & functions have files support to skip this step to delegate file processing
+				// Default Upload to VectorDB
+				if (
+					SUPPORTED_FILE_TYPE.includes(file['type']) ||
+					SUPPORTED_FILE_EXTENSIONS.includes(file.name.split('.').at(-1))
+				) {
+					processFileItem(fileItem);
+				} else {
+					toast.error(
+						$i18n.t(`Unknown file type '{{file_type}}'. Proceeding with the file upload anyway.`, {
+							file_type: file['type']
+						})
+					);
+					processFileItem(fileItem);
+				}
 			} else {
-				toast.error(
-					$i18n.t(`Unknown file type '{{file_type}}'. Proceeding with the file upload anyway.`, {
-						file_type: file['type']
-					})
-				);
-				processFileItem(fileItem);
+				files = files.filter((item) => item.id !== fileId);
 			}
+		} catch (error) {
+			toast.error(error);
+			files = files.filter((item) => item.id !== fileId);
 		}
 	};
 

From c9ed934d0b57ffffc1ccf763fa241dab1b38025a Mon Sep 17 00:00:00 2001
From: "Timothy J. Baek" <timothyjrbeck@gmail.com>
Date: Thu, 1 Aug 2024 22:09:29 +0200
Subject: [PATCH 2/2] refac: file should not have 'uploaded' status

---
 src/lib/components/chat/MessageInput.svelte | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index e59e917e1..2fa835acd 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
 	import { toast } from 'svelte-sonner';
-	import { v4 as uuidv4 } from 'uuid';
 	import { onMount, tick, getContext } from 'svelte';
 	import {
 		type Model,
@@ -99,7 +98,6 @@
 
 	const uploadFileHandler = async (file) => {
 		console.log(file);
-		const fileId = uuidv4();
 
 		// Check if the file is an audio file and transcribe/convert it to text file
 		if (['audio/mpeg', 'audio/wav'].includes(file['type'])) {
@@ -118,11 +116,11 @@
 		const fileItem = {
 			type: 'file',
 			file: '',
-			id: fileId,
+			id: null,
 			url: '',
 			name: file.name,
 			collection_name: '',
-			status: 'uploaded',
+			status: '',
 			size: file.size,
 			error: ''
 		};
@@ -132,6 +130,7 @@
 			const uploadedFile = await uploadFile(localStorage.token, file);
 
 			if (uploadedFile) {
+				fileItem.status = 'uploaded';
 				fileItem.file = uploadedFile;
 				fileItem.id = uploadedFile.id;
 				fileItem.url = `${WEBUI_API_BASE_URL}/files/${uploadedFile.id}`;
@@ -152,11 +151,11 @@
 					processFileItem(fileItem);
 				}
 			} else {
-				files = files.filter((item) => item.id !== fileId);
+				files = files.filter((item) => item.status !== null);
 			}
-		} catch (error) {
-			toast.error(error);
-			files = files.filter((item) => item.id !== fileId);
+		} catch (e) {
+			toast.error(e);
+			files = files.filter((item) => item.status !== null);
 		}
 	};
 
@@ -173,7 +172,6 @@
 			// Remove the failed doc from the files array
 			// files = files.filter((f) => f.id !== fileItem.id);
 			toast.error(e);
-
 			fileItem.status = 'processed';
 			files = files;
 		}