enh: code interpreter toggle

src/lib/components/chat/Chat.svelte

@@ -116,6 +116,7 @@
 
 	let selectedToolIds = [];
 	let imageGenerationEnabled = false;
+	let codeInterpreterEnabled = false;
 	let webSearchEnabled = false;
 
 	let chat = null;
@@ -1562,6 +1563,7 @@
 
 				features: {
 					image_generation: imageGenerationEnabled,
+					code_interpreter: codeInterpreterEnabled,
 					web_search: webSearchEnabled
 				},
 				variables: {
@@ -1971,6 +1973,7 @@
 								bind:autoScroll
 								bind:selectedToolIds
 								bind:imageGenerationEnabled
+								bind:codeInterpreterEnabled
 								bind:webSearchEnabled
 								bind:atSelectedModel
 								transparentBackground={$settings?.backgroundImageUrl ?? false}
@@ -2022,6 +2025,7 @@
 								bind:autoScroll
 								bind:selectedToolIds
 								bind:imageGenerationEnabled
+								bind:codeInterpreterEnabled
 								bind:webSearchEnabled
 								bind:atSelectedModel
 								transparentBackground={$settings?.backgroundImageUrl ?? false}

src/lib/components/chat/MessageInput.svelte

@@ -65,6 +65,7 @@
 
 	export let imageGenerationEnabled = false;
 	export let webSearchEnabled = false;
+	export let codeInterpreterEnabled = false;
 
 	$: onChange({
 		prompt,
@@ -660,6 +661,7 @@
 									<div class="ml-1 self-end mb-1.5 flex space-x-1">
 										<InputMenu
 											bind:imageGenerationEnabled
+											bind:codeInterpreterEnabled
 											bind:webSearchEnabled
 											bind:selectedToolIds
 											{screenCaptureHandler}

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

@@ -15,6 +15,7 @@
 	import WrenchSolid from '$lib/components/icons/WrenchSolid.svelte';
 	import CameraSolid from '$lib/components/icons/CameraSolid.svelte';
 	import PhotoSolid from '$lib/components/icons/PhotoSolid.svelte';
+	import CommandLineSolid from '$lib/components/icons/CommandLineSolid.svelte';
 
 	const i18n = getContext('i18n');
 
@@ -26,6 +27,7 @@
 
 	export let webSearchEnabled: boolean;
 	export let imageGenerationEnabled: boolean;
+	export let codeInterpreterEnabled: boolean;
 
 	export let onClose: Function;
 
@@ -148,6 +150,20 @@
 				</button>
 			{/if}
 
+			<button
+				class="flex w-full justify-between gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer rounded-xl"
+				on:click={() => {
+					codeInterpreterEnabled = !codeInterpreterEnabled;
+				}}
+			>
+				<div class="flex-1 flex items-center gap-2">
+					<CommandLineSolid />
+					<div class=" line-clamp-1">{$i18n.t('Code Intepreter')}</div>
+				</div>
+
+				<Switch state={codeInterpreterEnabled} />
+			</button>
+
 			{#if showWebSearch}
 				<button
 					class="flex w-full justify-between gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer rounded-xl"

src/lib/components/chat/Placeholder.svelte

@@ -35,6 +35,7 @@
 
 	export let selectedToolIds = [];
 	export let imageGenerationEnabled = false;
+	export let codeInterpreterEnabled = false;
 	export let webSearchEnabled = false;
 
 	let models = [];
@@ -196,6 +197,7 @@
 					bind:autoScroll
 					bind:selectedToolIds
 					bind:imageGenerationEnabled
+					bind:codeInterpreterEnabled
 					bind:webSearchEnabled
 					bind:atSelectedModel
 					{transparentBackground}

src/lib/components/icons/CommandLineSolid.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	export let className = 'size-4';
+</script>
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class={className}>
+	<path
+		fill-rule="evenodd"
+		d="M2.25 6a3 3 0 0 1 3-3h13.5a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H5.25a3 3 0 0 1-3-3V6Zm3.97.97a.75.75 0 0 1 1.06 0l2.25 2.25a.75.75 0 0 1 0 1.06l-2.25 2.25a.75.75 0 0 1-1.06-1.06l1.72-1.72-1.72-1.72a.75.75 0 0 1 0-1.06Zm4.28 4.28a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5h-3Z"
+		clip-rule="evenodd"
+	/>
+</svg>