diff --git a/web/src/lib/components/NoteView.svelte b/web/src/lib/components/NoteView.svelte
index 4e0f0a1..04a1edc 100644
--- a/web/src/lib/components/NoteView.svelte
+++ b/web/src/lib/components/NoteView.svelte
@@ -25,6 +25,7 @@
 	let isComponentReady = false
 	let showSettings = false
 	let isSidebarOpen = window.innerWidth > 768
+	let isSidebarUserMenuOpen = false
 	let isVersionDropdownOpen = false
 	let isEditing = false
 	let errorTimeout: ReturnType<typeof setTimeout> | null = null
@@ -79,18 +80,22 @@
 	}
 
 	const toggleSettingsModal = () => {
+		isSidebarUserMenuOpen = false
 		showSettings = !showSettings
 	}
 
 	const toggleAdminModal = () => {
+		isSidebarUserMenuOpen = false
 		console.log("[DBG] Admin view is not implemented yet")
 	}
 
 	const toggleWebhookModal = () => {
+		isSidebarUserMenuOpen = false
 		console.log("[DBG] Webhooks aren't implemented yet")
 	}
 
 	const toggleTagModal = () => {
+		isSidebarUserMenuOpen = false
 		console.log("[DBG] Tags aren't implemented yet")
 	}
 
@@ -109,6 +114,7 @@
 			}
 
 			isEditing = true // open brand new notes in edit mode by default
+			isSidebarUserMenuOpen = false
 		}
 	}
 
@@ -140,6 +146,8 @@
 		if (window.innerWidth < 768) {
 			isSidebarOpen = false
 		}
+
+		isSidebarUserMenuOpen = false
 	}
 
 	const selectVersion = async (versionID: string, isActiveVersion: boolean) => {
@@ -270,6 +278,7 @@
 		<!-- Sidebar (2-way binded state) -->
 		<Sidebar
 			bind:isSidebarOpen
+			bind:isUserMenuOpen={isSidebarUserMenuOpen}
 			{username}
 			notes={$availableNotes || []}
 			currentNote={$currentFullNote}
diff --git a/web/src/lib/components/Sidebar.svelte b/web/src/lib/components/Sidebar.svelte
index e350c23..c435c93 100644
--- a/web/src/lib/components/Sidebar.svelte
+++ b/web/src/lib/components/Sidebar.svelte
@@ -18,6 +18,7 @@
 
 	// props
 	export let isSidebarOpen: boolean
+	export let isUserMenuOpen: boolean
 	export let username: string
 	export let notes: NoteMetadata[] = []
 	export let currentNote: FullNote | null = null
@@ -34,15 +35,13 @@
 	) => Promise<void>
 	export let deleteNote: (noteID: string) => Promise<void>
 
-	// local state
-	let userMenuOpen = false
-
 	const toggleSidebar = () => {
+		isUserMenuOpen = false
 		isSidebarOpen = !isSidebarOpen
 	}
 
 	const toggleUserMenu = () => {
-		userMenuOpen = !userMenuOpen
+		isUserMenuOpen = !isUserMenuOpen
 	}
 
 	const handleDeleteNote = (event: MouseEvent, noteID: string) => {
@@ -224,7 +223,7 @@
 						<span class="sidebar-user-button-username-text">Logged in as {username}</span>
 					</div>
 
-					{#if userMenuOpen}
+					{#if isUserMenuOpen}
 						<ChevronDown classString="h-6 w-6 flex-shrink-0" />
 					{:else}
 						<ChevronUp classString="h-6 w-6 flex-shrink-0" />
@@ -233,7 +232,7 @@
 			</button>
 
 			<!-- User actions dropdown menu -->
-			{#if userMenuOpen}
+			{#if isUserMenuOpen}
 				<div class="sidebar-user-dropdown">
 					<div class="flex flex-col p-0">
 						<button