feat: async file upload

src/lib/apis/files/index.ts

@@ -1,4 +1,5 @@
 import { WEBUI_API_BASE_URL } from '$lib/constants';
+import { splitStream } from '$lib/utils';
 
 export const uploadFile = async (token: string, file: File, metadata?: object | null) => {
 	const data = new FormData();
@@ -31,6 +32,75 @@ export const uploadFile = async (token: string, file: File, metadata?: object |
 		throw error;
 	}
 
+	if (res) {
+		const status = await getFileProcessStatus(token, res.id);
+
+		if (status && status.ok) {
+			const reader = status.body
+				.pipeThrough(new TextDecoderStream())
+				.pipeThrough(splitStream('\n'))
+				.getReader();
+
+			while (true) {
+				const { value, done } = await reader.read();
+				if (done) {
+					break;
+				}
+
+				try {
+					let lines = value.split('\n');
+
+					for (const line of lines) {
+						if (line !== '') {
+							console.log(line);
+							if (line === 'data: [DONE]') {
+								console.log(line);
+							} else {
+								let data = JSON.parse(line.replace(/^data: /, ''));
+								console.log(data);
+
+								if (data?.error) {
+									console.error(data.error);
+									res.error = data.error;
+								}
+							}
+						}
+					}
+				} catch (error) {
+					console.log(error);
+				}
+			}
+		}
+	}
+
+	if (error) {
+		throw error;
+	}
+
+	return res;
+};
+
+export const getFileProcessStatus = async (token: string, id: string) => {
+	const queryParams = new URLSearchParams();
+	queryParams.append('stream', 'true');
+
+	let error = null;
+	const res = await fetch(`${WEBUI_API_BASE_URL}/files/${id}/process/status?${queryParams}`, {
+		method: 'GET',
+		headers: {
+			Accept: 'application/json',
+			authorization: `Bearer ${token}`
+		}
+	}).catch((err) => {
+		error = err.detail;
+		console.error(err);
+		return null;
+	});
+
+	if (error) {
+		throw error;
+	}
+
 	return res;
 };
 

src/lib/components/chat/Chat.svelte

@@ -90,6 +90,7 @@
 	import { fade } from 'svelte/transition';
 	import Tooltip from '../common/Tooltip.svelte';
 	import Sidebar from '../icons/Sidebar.svelte';
+	import { uploadFile } from '$lib/apis/files';
 
 	export let chatIdProp = '';
 

src/lib/components/workspace/Knowledge/KnowledgeBase.svelte

@@ -182,6 +182,12 @@
 
 			if (uploadedFile) {
 				console.log(uploadedFile);
+
+				if (uploadedFile.error) {
+					console.warn('File upload warning:', uploadedFile.error);
+					toast.warning(uploadedFile.error);
+				}
+
 				knowledge.files = knowledge.files.map((item) => {
 					if (item.itemId === tempItemId) {
 						item.id = uploadedFile.id;