feat: tools full integration

src/lib/components/chat/Chat.svelte

@@ -73,6 +73,7 @@
 	let selectedModels = [''];
 	let atSelectedModel: Model | undefined;
 
+	let selectedToolIds = [];
 	let webSearchEnabled = false;
 
 	let chat = null;
@@ -687,6 +688,7 @@
 			},
 			format: $settings.requestFormat ?? undefined,
 			keep_alive: $settings.keepAlive ?? undefined,
+			tool_ids: selectedToolIds.length > 0 ? selectedToolIds : undefined,
 			docs: docs.length > 0 ? docs : undefined,
 			citations: docs.length > 0,
 			chat_id: $chatId
@@ -948,6 +950,7 @@
 					top_p: $settings?.params?.top_p ?? undefined,
 					frequency_penalty: $settings?.params?.frequency_penalty ?? undefined,
 					max_tokens: $settings?.params?.max_tokens ?? undefined,
+					tool_ids: selectedToolIds.length > 0 ? selectedToolIds : undefined,
 					docs: docs.length > 0 ? docs : undefined,
 					citations: docs.length > 0,
 					chat_id: $chatId
@@ -1274,6 +1277,7 @@
 				bind:files
 				bind:prompt
 				bind:autoScroll
+				bind:selectedToolIds
 				bind:webSearchEnabled
 				bind:atSelectedModel
 				{selectedModels}

src/lib/components/chat/MessageInput.svelte

@@ -8,7 +8,8 @@
 		showSidebar,
 		models,
 		config,
-		showCallOverlay
+		showCallOverlay,
+		tools
 	} from '$lib/stores';
 	import { blobToFile, calculateSHA256, findWordIndices } from '$lib/utils';
 
@@ -57,6 +58,7 @@
 	let chatInputPlaceholder = '';
 
 	export let files = [];
+	export let selectedToolIds = [];
 
 	export let webSearchEnabled = false;
 
@@ -653,6 +655,15 @@
 								<div class=" ml-0.5 self-end mb-1.5 flex space-x-1">
 									<InputMenu
 										bind:webSearchEnabled
+										bind:selectedToolIds
+										tools={$tools.reduce((a, e, i, arr) => {
+											a[e.id] = {
+												name: e.name,
+												enabled: false
+											};
+
+											return a;
+										}, {})}
 										uploadFilesHandler={() => {
 											filesInputElement.click();
 										}}

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

@@ -14,6 +14,8 @@
 	const i18n = getContext('i18n');
 
 	export let uploadFilesHandler: Function;
+
+	export let selectedToolIds: string[] = [];
 	export let webSearchEnabled: boolean;
 
 	export let tools = {};
@@ -44,16 +46,23 @@
 			transition={flyAndScale}
 		>
 			{#if Object.keys(tools).length > 0}
-				{#each Object.keys(tools) as tool}
+				{#each Object.keys(tools) as toolId}
 					<div
 						class="flex gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer rounded-xl"
 					>
 						<div class="flex-1 flex items-center gap-2">
 							<WrenchSolid />
-							<div class="flex items-center">{tool}</div>
+							<div class="flex items-center">{tools[toolId].name}</div>
 						</div>
 
-						<Switch bind:state={tools[tool]} />
+						<Switch
+							bind:state={tools[toolId].enabled}
+							on:change={(e) => {
+								selectedToolIds = e.detail
+									? [...selectedToolIds, toolId]
+									: selectedToolIds.filter((id) => id !== toolId);
+							}}
+						/>
 					</div>
 				{/each}
 				<hr class="border-gray-100 dark:border-gray-800 my-1" />