src/lib/components/common/Dropdown.svelte

@@ -1,8 +1,15 @@
 <script lang="ts">
 	import { DropdownMenu } from 'bits-ui';
+	import { createEventDispatcher } from 'svelte';
+
+	const dispatch = createEventDispatcher();
 </script>
 
-<DropdownMenu.Root>
+<DropdownMenu.Root
+	onOpenChange={(state) => {
+		dispatch('change', state);
+	}}
+>
 	<DropdownMenu.Trigger>
 		<slot />
 	</DropdownMenu.Trigger>

src/lib/components/layout/Sidebar.svelte

@@ -520,6 +520,9 @@
 										deleteHandler={() => {
 											chatDeleteId = chat.id;
 										}}
+										onClose={() => {
+											selectedChatId = null;
+										}}
 									>
 										<button
 											aria-label="Chat Menu"

src/lib/components/layout/Sidebar/ChatMenu.svelte

@@ -8,9 +8,17 @@
 
 	export let renameHandler: Function;
 	export let deleteHandler: Function;
+
+	export let onClose: Function;
 </script>
 
-<Dropdown>
+<Dropdown
+	on:change={(e) => {
+		if (e.detail === false) {
+			onClose();
+		}
+	}}
+>
 	<Tooltip content="More">
 		<slot />
 	</Tooltip>