feat: Add sidebar style options to appearance settings

- Introduced a new section in the Appearance settings to allow users to choose between 'unified' and 'discord' sidebar layouts.
- Updated the app state and settings migration to include the new sidebarStyle property.
- Enhanced the UI to reflect the selected sidebar style with appropriate visual feedback.
- Ensured synchronization of sidebar style settings across the application.

apps/ui/src/routes/__root.tsx

@@ -4,6 +4,7 @@ import { QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { createLogger } from '@automaker/utils/logger';
 import { Sidebar } from '@/components/layout/sidebar';
+import { ProjectSwitcher } from '@/components/layout/project-switcher';
 import {
   FileBrowserProvider,
   useFileBrowser,
@@ -167,6 +168,7 @@ function RootLayoutContent() {
     theme,
     fontFamilySans,
     fontFamilyMono,
+    sidebarStyle,
     skipSandboxWarning,
     setSkipSandboxWarning,
     fetchCodexModels,
@@ -860,6 +862,8 @@ function RootLayoutContent() {
             aria-hidden="true"
           />
         )}
+        {/* Discord-style layout: narrow project switcher + expandable sidebar */}
+        {sidebarStyle === 'discord' && <ProjectSwitcher />}
         <Sidebar />
         <div
           className="flex-1 flex flex-col overflow-hidden transition-all duration-300"