diff --git a/src/lib/components/chat/MessageInput/IntegrationsMenu.svelte b/src/lib/components/chat/MessageInput/IntegrationsMenu.svelte
index 84bf8018d9..f0113a8b24 100644
--- a/src/lib/components/chat/MessageInput/IntegrationsMenu.svelte
+++ b/src/lib/components/chat/MessageInput/IntegrationsMenu.svelte
@@ -330,7 +330,7 @@
 					{#each Object.keys(tools) as toolId}
 						<button
 							class="relative flex w-full justify-between gap-2 items-center px-3 py-1.5 text-sm cursor-pointer rounded-xl hover:bg-gray-50 dark:hover:bg-gray-800/50"
-							on:click={(e) => {
+							on:click={async (e) => {
 								if (!(tools[toolId]?.authenticated ?? true)) {
 									e.preventDefault();
 
@@ -341,6 +341,15 @@
 									window.open(authUrl, '_blank', 'noopener');
 								} else {
 									tools[toolId].enabled = !tools[toolId].enabled;
+
+									const state = tools[toolId].enabled;
+									await tick();
+
+									if (state) {
+										selectedToolIds = [...selectedToolIds, toolId];
+									} else {
+										selectedToolIds = selectedToolIds.filter((id) => id !== toolId);
+									}
 								}
 							}}
 						>
@@ -383,18 +392,7 @@
 							{/if}
 
 							<div class=" shrink-0">
-								<Switch
-									state={tools[toolId].enabled}
-									on:change={async (e) => {
-										const state = e.detail;
-										await tick();
-										if (state) {
-											selectedToolIds = [...selectedToolIds, toolId];
-										} else {
-											selectedToolIds = selectedToolIds.filter((id) => id !== toolId);
-										}
-									}}
-								/>
+								<Switch state={tools[toolId].enabled} />
 							</div>
 						</button>
 					{/each}