load in optimization and error correction

src/components/Layout.tsx

@@ -1,6 +1,6 @@
 import { type Component, type JSX, createSignal, createEffect, Show, lazy, Suspense, onMount, onCleanup } from "solid-js";
 import { Sidebar, BottomNav, ContextSwitcher } from "./Navigation";
-import { store, setStore, activeTaskId, setActiveTaskId } from "@/store";
+import { store, setStore, activeTaskId, setActiveTaskId, requestImmediateNotesMetadataLoad } from "@/store";
 import { PanelLeftOpen, PanelLeftClose } from "lucide-solid";
 
 const TaskDetail = lazy(() => import("./TaskDetail").then(m => ({ default: m.TaskDetail })));
@@ -54,6 +54,12 @@ export const Layout: Component<LayoutProps> = (props) => {
     // Derived active task for the detail view
     const activeTask = () => store.tasks.find(t => t.id === activeTaskId());
 
+    createEffect(() => {
+        if (store.isNotepadMode) {
+            void requestImmediateNotesMetadataLoad();
+        }
+    });
+
     return (
         <div class="flex h-screen w-full min-w-0 bg-background overflow-hidden relative font-sans antialiased text-foreground">
             {/* Desktop UI Container */}
@@ -189,25 +195,20 @@ export const Layout: Component<LayoutProps> = (props) => {
                 </div>
 
                 {/* Sync Progress Bar Overlay */}
-                <Show when={store.isInitializing}>
+                <Show when={store.isInitializing || (store.isNotepadMode && store.isNotesLoading)}>
                     <div class="fixed top-0 left-0 w-full h-0.5 z-[100] overflow-hidden bg-primary/10">
                         <div class="h-full bg-primary animate-progress-fast w-1/3" />
                     </div>
                 </Show>
 
                 {/* Main Content Area */}
-                <main
-                    class={cn(
-                        "flex-1 min-w-0 overflow-y-auto overflow-x-hidden relative scroll-smooth",
-                        !store.isNotepadMode ? "pb-32 sm:pb-6" : ""
-                    )}
-                    style={{
-                        "padding-bottom": "calc(8px + env(safe-area-inset-bottom, 0px))"
-                    }}
-                >
+                <main class={cn(
+                    "flex-1 min-w-0 overflow-y-auto overflow-x-hidden relative scroll-smooth",
+                    !store.isNotepadMode ? "sm:pb-6" : ""
+                )}>
                     <div class={cn(
-                        "w-full h-full mx-auto",
-                        !store.isNotepadMode ? "max-w-screen-2xl px-4 sm:px-8 lg:px-12 pt-16 sm:pt-20 pb-8 space-y-6 sm:space-y-8" : "max-w-screen-2xl md:px-8 lg:px-12 md:pt-20 md:pb-8 pt-14"
+                        "w-full min-h-full mx-auto",
+                        !store.isNotepadMode ? "max-w-screen-2xl px-4 sm:px-8 lg:px-12 pt-16 sm:pt-20 mobile-footer-clearance space-y-6 sm:space-y-8" : "max-w-screen-2xl md:px-8 lg:px-12 md:pt-20 md:pb-8 pt-14"
                     )}>
                         <div class={cn(store.isNotepadMode ? "hidden" : "block")}>
                             <Show when={props.currentView.toLowerCase() !== "settings"}>