refac: knowledge collection uploading indicator

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

@@ -101,6 +101,19 @@
 	const uploadFileHandler = async (file) => {
 		console.log(file);
 
+		const fileItem = {
+			type: 'file',
+			file: '',
+			id: null,
+			url: '',
+			name: file.name,
+			size: file.size,
+			status: 'uploading',
+			error: ''
+		};
+
+		knowledge.files = [...(knowledge.files ?? []), fileItem];
+
 		// Check if the file is an audio file and transcribe/convert it to text file
 		if (['audio/mpeg', 'audio/wav', 'audio/ogg', 'audio/x-m4a'].includes(file['type'])) {
 			const res = await transcribeAudio(localStorage.token, file).catch((error) => {
@@ -403,6 +416,7 @@
 
 	const onDrop = async (e) => {
 		e.preventDefault();
+		dragged = false;
 
 		if (e.dataTransfer?.files) {
 			const inputFiles = e.dataTransfer?.files;
@@ -415,8 +429,6 @@
 				toast.error($i18n.t(`File not found.`));
 			}
 		}
-
-		dragged = false;
 	};
 
 	onMount(async () => {

src/lib/components/workspace/Knowledge/Collection/Files.svelte

@@ -17,9 +17,10 @@
 					? ' bg-gray-50 dark:bg-gray-850'
 					: 'bg-transparent'} hover:bg-gray-50 dark:hover:bg-gray-850 transition"
 				{file}
-				name={file.meta.name}
+				name={file?.name ?? file?.meta?.name}
 				type="file"
-				size={file.meta?.size ?? ''}
+				size={file?.size ?? file?.meta?.size ?? ''}
+				loading={file.status === 'uploading'}
 				dismissible
 				on:click={() => {
 					dispatch('click', file.id);