refac: user valves

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

@@ -21,7 +21,6 @@
 	import Terminal from '$lib/components/icons/Terminal.svelte';
 	import ChevronRight from '$lib/components/icons/ChevronRight.svelte';
 	import ChevronLeft from '$lib/components/icons/ChevronLeft.svelte';
-	import ValvesModal from '$lib/components/workspace/common/ValvesModal.svelte';
 
 	const i18n = getContext('i18n');
 
@@ -41,16 +40,12 @@
 	export let showCodeInterpreterButton = false;
 	export let codeInterpreterEnabled = false;
 
+	export let onShowValves: Function;
 	export let onClose: Function;
 
 	let show = false;
 	let tab = '';
 
-	let showValvesModal = false;
-
-	let selectedValvesType = 'tool';
-	let selectedValvesItemId = null;
-
 	let tools = null;
 
 	$: if (show) {
@@ -96,16 +91,6 @@
 	};
 </script>
 
-<ValvesModal
-	bind:show={showValvesModal}
-	userValves={true}
-	type={selectedValvesType}
-	id={selectedValvesItemId ?? null}
-	on:save={async () => {
-		await tick();
-	}}
-/>
-
 <Dropdown
 	bind:show
 	on:change={(e) => {
@@ -192,6 +177,27 @@
 										</div>
 									</div>
 
+									{#if filter?.has_user_valves}
+										<div class=" shrink-0">
+											<Tooltip content={$i18n.t('Valves')}>
+												<button
+													class="self-center w-fit text-sm text-gray-600 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 transition rounded-full"
+													type="button"
+													on:click={(e) => {
+														e.stopPropagation();
+														e.preventDefault();
+														onShowValves({
+															type: 'function',
+															id: filter.id
+														});
+													}}
+												>
+													<Knobs />
+												</button>
+											</Tooltip>
+										</div>
+									{/if}
+
 									<div class=" shrink-0">
 										<Switch
 											state={selectedFilterIds.includes(filter.id)}
@@ -364,9 +370,10 @@
 											on:click={(e) => {
 												e.stopPropagation();
 												e.preventDefault();
-												selectedValvesType = 'tool';
-												selectedValvesItemId = toolId;
-												showValvesModal = true;
+												onShowValves({
+													type: 'tool',
+													id: toolId
+												});
 											}}
 										>
 											<Knobs />