feat: enhance folder settings with subfolder creation and navigation improvements

app/[locale]/calendar/page.tsx

@@ -11,6 +11,7 @@ import {
 } from "date-fns";
 import { useCalendarStore } from "@/stores/calendar-store";
 import { useAuthStore } from "@/stores/auth-store";
+import { useEmailStore } from "@/stores/email-store";
 import { useSettingsStore } from "@/stores/settings-store";
 import { useIdentityStore } from "@/stores/identity-store";
 import { toast } from "@/stores/toast-store";
@@ -44,7 +45,8 @@ export default function CalendarPage() {
   const router = useRouter();
   const t = useTranslations("calendar");
   const isMobile = useIsMobile();
-  const { client, isAuthenticated } = useAuthStore();
+  const { client, isAuthenticated, logout } = useAuthStore();
+  const { quota, isPushConnected } = useEmailStore();
   const {
     calendars, events, selectedDate, viewMode, selectedCalendarIds,
     isLoading, isLoadingEvents, supportsCalendar, error,
@@ -637,8 +639,13 @@ export default function CalendarPage() {
     <div className="flex h-screen bg-background">
       {/* Left Navigation Rail */}
       {!isMobile && (
-        <div className="w-14 border-r border-border bg-secondary flex flex-col items-center py-3 flex-shrink-0">
-          <NavigationRail collapsed className="py-0" />
+        <div className="w-14 border-r border-border bg-secondary flex flex-col flex-shrink-0">
+          <NavigationRail
+            collapsed
+            quota={quota}
+            isPushConnected={isPushConnected}
+            onLogout={() => { logout(); router.push('/login'); }}
+          />
         </div>
       )}
 

app/[locale]/contacts/page.tsx

@@ -17,6 +17,7 @@ import { ContactImportDialog } from "@/components/contacts/contact-import-dialog
 import { exportContacts } from "@/components/contacts/contact-export";
 import { useContactStore, getContactDisplayName } from "@/stores/contact-store";
 import { useAuthStore } from "@/stores/auth-store";
+import { useEmailStore } from "@/stores/email-store";
 import { toast } from "@/stores/toast-store";
 import { cn } from "@/lib/utils";
 import { NavigationRail } from "@/components/layout/navigation-rail";
@@ -37,7 +38,8 @@ type View =
 export default function ContactsPage() {
   const router = useRouter();
   const t = useTranslations("contacts");
-  const { client, isAuthenticated } = useAuthStore();
+  const { client, isAuthenticated, logout } = useAuthStore();
+  const { quota, isPushConnected } = useEmailStore();
   const {
     contacts,
     selectedContactId,
@@ -440,8 +442,13 @@ export default function ContactsPage() {
   return (
     <div className="flex h-screen bg-background">
       {!isMobile && (
-        <div className="w-14 border-r border-border bg-secondary flex flex-col items-center flex-shrink-0">
-          <NavigationRail collapsed />
+        <div className="w-14 border-r border-border bg-secondary flex flex-col flex-shrink-0">
+          <NavigationRail
+            collapsed
+            quota={quota}
+            isPushConnected={isPushConnected}
+            onLogout={() => { logout(); router.push('/login'); }}
+          />
         </div>
       )}
 

app/[locale]/page.tsx

@@ -49,7 +49,7 @@ export default function Home() {
   const [composerDraftText, setComposerDraftText] = useState("");
   const [pendingDraft, setPendingDraft] = useState<ComposerDraftData | null>(null);
   const { dialogProps: confirmDialogProps, confirm: confirmDialog } = useConfirmDialog();
-  const [initialCheckDone, setInitialCheckDone] = useState(false);
+  const [initialCheckDone, setInitialCheckDone] = useState(() => useAuthStore.getState().isAuthenticated && !!useAuthStore.getState().client);
   const [showShortcutsModal, setShowShortcutsModal] = useState(false);
   const [showAdvancedFields, setShowAdvancedFields] = useState(false);
   // Mobile conversation view state

app/[locale]/settings/page.tsx

@@ -17,7 +17,9 @@ import { AdvancedSettings } from '@/components/settings/advanced-settings';
 import { FolderSettings } from '@/components/settings/folder-settings';
 import { KeywordSettings } from '@/components/settings/keyword-settings';
 import { useAuthStore } from '@/stores/auth-store';
+import { useEmailStore } from '@/stores/email-store';
 import { useIsDesktop } from '@/hooks/use-media-query';
+import { NavigationRail } from '@/components/layout/navigation-rail';
 import { cn } from '@/lib/utils';
 
 type Tab = 'appearance' | 'email' | 'account' | 'identities' | 'vacation' | 'calendar' | 'filters' | 'templates' | 'folders' | 'keywords' | 'advanced';
@@ -25,7 +27,8 @@ type Tab = 'appearance' | 'email' | 'account' | 'identities' | 'vacation' | 'cal
 export default function SettingsPage() {
   const router = useRouter();
   const t = useTranslations('settings');
-  const { client, isAuthenticated } = useAuthStore();
+  const { client, isAuthenticated, logout } = useAuthStore();
+  const { quota, isPushConnected } = useEmailStore();
   const [activeTab, setActiveTab] = useState<Tab>('appearance');
   const [mobileShowContent, setMobileShowContent] = useState(false);
   const isDesktop = useIsDesktop();
@@ -153,6 +156,16 @@ export default function SettingsPage() {
   // Desktop layout
   return (
     <div className="flex h-screen bg-background">
+      {/* Navigation Rail */}
+      <div className="w-14 border-r border-border bg-secondary flex flex-col flex-shrink-0">
+        <NavigationRail
+          collapsed
+          quota={quota}
+          isPushConnected={isPushConnected}
+          onLogout={() => { logout(); router.push('/login'); }}
+        />
+      </div>
+
       {/* Settings Sidebar */}
       <div className="w-64 border-r border-border bg-secondary flex flex-col">
         {/* Header */}