ui: New Logo + Navigation cleanup & Mobile UI/UX improvements (#24897)

* chore: `npm audit fix --force`

* feat: Update sidebar toggle to use Logo

* refactor: Clean up favicon SVG

* feat: Refactor logo component and implement theme-aware favicon generation

* feat: Add configurable padding to generated PWA assets

* test: Add unit tests for writeThemeFavicons

* refactor: Componentization

* feat: WIP

* feat: WIP

* feat: WIP

* feat: Mobile UI

* feat: add SEARCH route constant

* feat: create SidebarNavigationSearchResults component

* refactor: use SidebarNavigationSearchResults in conversation list

* feat: enable mobile search navigation in sidebar actions

* feat: add mobile search route and page

* fix: prevent sidebar overflow on mobile viewports

* fix: Mobile sidebar

* feat: Mobile Search WIP

* feat: Mobile WIP

* feat: Add PWA standalone detection and refine mobile UI

* feat: Improve mobile layout, sidebar handling, and chat scrolling

* feat: Improve mobile sidebar visibility and iOS Safari chat spacing

* fix: Disable auto-scroll on mobile

* chore: Linting

* fix: Wrong condition

* feat: Mobile chat scroll

* refactor: WIP

* fix: Desktop initial scroll always working again

* fix: Partial fix for mobile auto-scroll / initial scroll

* fix: Desktop auto-scroll on initial load and during streaming

* fix: Mobile scrolling logic

* refactor: Clean up

* feat: Improve start UI

* feat: Add `delay` to `fadeInView`

* feat: Auto-scroll button

* refactor: Cleanup

* refactor: Extract chat dialogs and alerts into dedicated component

* refactor: Reorganize ChatScreen component structure and initialization

* feat: Improve auto-scroll after sending message

* feat: UI improvements

* fix: Settings link

* feat: UI improvements

* fix: better UI spacing

* fix: Remove unneeded logic

* fix: Chat Processing Info UI rendering

* feat: Improve mobile UI

* feat: UI improvement

* fix: Conditional transition delay for Chat Messages based on route from

* fix: Delay mobile sidebar collapse for smoother transitions

* fix: Mobile scroll down button + sidebar pointer events

* fix: Mobile UI

* fix: Auto scrolling

* fix: Implement dynamic height calculations for chat auto-scroll positioning and UI elements

* fix: Retrieve `autofocus` for Chat Form textarea

* fix: Use proper class

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

* refactor: extract scroll-to-bottom logic and fix message send flow

* fix: update viewport store usage and remove conflicting autofocus

* feat: add accessibility labels to scroll down button

* fix: correct HTML structure in sidebar empty states

* fix: dynamically toggle processing info visibility

* chore: remove commented exports and fix formatting

* fix

* fix: Mobile Chat Form Add Action Sheet interactions

---------

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

tools/ui/tests/stories/SidebarNavigation.stories.svelte

@@ -14,10 +14,6 @@
 </script>
 
 <script lang="ts">
-	import * as Sidebar from '$lib/components/ui/sidebar/index.js';
-
-	let sidebarOpen = $state(true);
-
 	// Mock conversations for the sidebar
 	const mockConversations: DatabaseConversation[] = [
 		{
@@ -66,11 +62,9 @@
 		);
 	}}
 >
-	<Sidebar.Provider bind:open={sidebarOpen}>
-		<div class="flex-column h-full h-screen w-72 bg-background">
-			<SidebarNavigation />
-		</div>
-	</Sidebar.Provider>
+	<div class="flex-column h-screen w-72 bg-background">
+		<SidebarNavigation />
+	</div>
 </Story>
 
 <Story
@@ -85,15 +79,16 @@
 			}, 0)
 		);
 
+		// Expand sidebar first, then click Search in the expanded button list
+		const logoTrigger = screen.getByRole('button', { name: /expand navigation/i });
+		await userEvent.click(logoTrigger);
 		const searchTrigger = screen.getByText('Search');
 		userEvent.click(searchTrigger);
 	}}
 >
-	<Sidebar.Provider bind:open={sidebarOpen}>
-		<div class="flex-column h-full h-screen w-72 bg-background">
-			<SidebarNavigation />
-		</div>
-	</Sidebar.Provider>
+	<div class="flex-column h-screen w-72 bg-background">
+		<SidebarNavigation />
+	</div>
 </Story>
 
 <Story
@@ -105,9 +100,7 @@
 		conversationsStore.conversations = [];
 	}}
 >
-	<Sidebar.Provider bind:open={sidebarOpen}>
-		<div class="flex-column h-full h-screen w-72 bg-background">
-			<SidebarNavigation />
-		</div>
-	</Sidebar.Provider>
+	<div class="flex-column h-screen w-72 bg-background">
+		<SidebarNavigation />
+	</div>
 </Story>