refac

src/lib/components/chat/MessageInput/InputMenu.svelte

@@ -27,7 +27,7 @@
 
 	const i18n = getContext('i18n');
 
-	export let selectedToolIds: string[] = [];
+	export let files = [];
 
 	export let selectedModels: string[] = [];
 	export let fileUploadCapableModels: string[] = [];
@@ -54,13 +54,28 @@
 		return /android|iphone|ipad|ipod|windows phone/i.test(userAgent);
 	};
 
-	function handleFileChange(event) {
+	const handleFileChange = (event) => {
 		const inputFiles = Array.from(event.target?.files);
 		if (inputFiles && inputFiles.length > 0) {
 			console.log(inputFiles);
 			inputFilesHandler(inputFiles);
 		}
-	}
+	};
+
+	const onSelect = (item) => {
+		if (files.find((f) => f.id === item.id)) {
+			return;
+		}
+		files = [
+			...files,
+			{
+				...item,
+				status: 'processed'
+			}
+		];
+
+		show = false;
+	};
 </script>
 
 <!-- Hidden file input used to open the camera on mobile -->
@@ -422,7 +437,7 @@
 						</div>
 					</button>
 
-					<Knowledge knowledge={$knowledge ?? []} />
+					<Knowledge knowledge={$knowledge ?? []} {onSelect} />
 				</div>
 			{:else if tab === 'notes'}
 				<div in:fly={{ x: 20, duration: 150 }}>
@@ -441,7 +456,7 @@
 						</div>
 					</button>
 
-					<Notes />
+					<Notes {onSelect} />
 				</div>
 			{:else if tab === 'chats'}
 				<div in:fly={{ x: 20, duration: 150 }}>
@@ -460,7 +475,7 @@
 						</div>
 					</button>
 
-					<Chats />
+					<Chats {onSelect} />
 				</div>
 			{/if}
 		</DropdownMenu.Content>

src/lib/components/chat/MessageInput/InputMenu/Chats.svelte

@@ -8,6 +8,7 @@
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
 	import Spinner from '$lib/components/common/Spinner.svelte';
 	import Loader from '$lib/components/common/Loader.svelte';
+	import { chatId } from '$lib/stores';
 
 	const i18n = getContext('i18n');
 
@@ -70,33 +71,35 @@
 	{:else}
 		<div class="flex flex-col gap-0.5">
 			{#each items as item, idx}
-				<button
-					class=" px-2.5 py-1 rounded-xl w-full text-left flex justify-between items-center text-sm {idx ===
-					selectedIdx
-						? ' bg-gray-50 dark:bg-gray-800 dark:text-gray-100 selected-command-option-button'
-						: ''}"
-					type="button"
-					on:click={() => {
-						onSelect(item);
-					}}
-					on:mousemove={() => {
-						selectedIdx = idx;
-					}}
-					on:mouseleave={() => {
-						if (idx === 0) {
-							selectedIdx = -1;
-						}
-					}}
-					data-selected={idx === selectedIdx}
-				>
-					<div class="text-black dark:text-gray-100 flex items-center gap-1.5">
-						<Tooltip content={item.description || decodeString(item?.name)} placement="top-start">
-							<div class="line-clamp-1 flex-1">
-								{decodeString(item?.name)}
-							</div>
-						</Tooltip>
-					</div>
-				</button>
+				{#if item?.id !== $chatId}
+					<button
+						class=" px-2.5 py-1 rounded-xl w-full text-left flex justify-between items-center text-sm {idx ===
+						selectedIdx
+							? ' bg-gray-50 dark:bg-gray-800 dark:text-gray-100 selected-command-option-button'
+							: ''}"
+						type="button"
+						on:click={() => {
+							onSelect(item);
+						}}
+						on:mousemove={() => {
+							selectedIdx = idx;
+						}}
+						on:mouseleave={() => {
+							if (idx === 0) {
+								selectedIdx = -1;
+							}
+						}}
+						data-selected={idx === selectedIdx}
+					>
+						<div class="text-black dark:text-gray-100 flex items-center gap-1.5">
+							<Tooltip content={item.description || decodeString(item?.name)} placement="top-start">
+								<div class="line-clamp-1 flex-1">
+									{decodeString(item?.name)}
+								</div>
+							</Tooltip>
+						</div>
+					</button>
+				{/if}
 			{/each}
 
 			{#if !allItemsLoaded}