Fix: MacOS TitleBar & History Reactive-Glitch

src/App.svelte

@@ -3,6 +3,7 @@
   import { invoke } from "@tauri-apps/api/core";
   import { listen } from "@tauri-apps/api/event";
   import { getVersion } from "@tauri-apps/api/app";
+  import { getCurrentWindow } from "@tauri-apps/api/window";
   import { gql } from "./lib/client";
   import { GET_DOWNLOAD_STATUS } from "./lib/queries";
   import { store, addToast, setActiveDownloads, setSettingsOpen } from "./store/state.svelte";
@@ -16,6 +17,7 @@
   import MangaPreview from "./components/shared/MangaPreview.svelte";
 
   const MAX_ATTEMPTS = 60;
+  const win = getCurrentWindow();
 
   let serverProbeOk   = $state(!store.settings.autoStartServer);
   let appReady        = $state(!store.settings.autoStartServer);
@@ -147,6 +149,15 @@
     platformScale = await invoke<number>("get_platform_ui_scale").catch(() => 1);
     applyZoom();
 
+    // ── Fullscreen state sync ─────────────────────────────────────────────────
+    // Seed the initial state, then keep it in sync on every resize event.
+    // onResized is the correct Tauri 2 API — it fires on fullscreen enter/exit,
+    // window snap, and manual resize. isFullscreen() is cheap (single IPC call).
+    store.isFullscreen = await win.isFullscreen();
+    const unlistenResize = await win.onResized(async () => {
+      store.isFullscreen = await win.isFullscreen();
+    });
+
     if (store.settings.autoStartServer) {
       invoke<void>("spawn_server", { binary: store.settings.serverBinary }).catch((err: any) => {
         if (err?.kind === "NotConfigured") {
@@ -181,6 +192,7 @@
 
     return () => {
       cancelled = true;
+      unlistenResize();
       if (store.settings.autoStartServer) invoke("kill_server").catch(() => {});
       if (idleTimer) clearTimeout(idleTimer);
       if (pollInterval) clearInterval(pollInterval);
@@ -215,7 +227,7 @@
       <SplashScreen mode="idle" showCards={store.settings.splashCards ?? true}
         onDismiss={() => setTimeout(() => idle = false, 340)} />
     {/if}
-    {#if !store.activeChapter}<TitleBar />{/if}
+    {#if !store.activeChapter && !store.isFullscreen}<TitleBar />{/if}
     <div class="content">
       {#if store.activeChapter}<Reader />{:else}<Layout />{/if}
     </div>

src/components/layout/TitleBar.svelte

@@ -1,10 +1,27 @@
 <script lang="ts">
+  import { onMount } from "svelte";
   import { getCurrentWindow } from "@tauri-apps/api/window";
-  const win = getCurrentWindow();
+  import { platform } from "@tauri-apps/plugin-os";
+
+  const win   = getCurrentWindow();
+  const isMac = platform() === "macos";
+
+  let isFullscreen = $state(false);
+
+  onMount(async () => {
+    isFullscreen = await win.isFullscreen();
+    const unlisten = await win.onResized(async () => {
+      isFullscreen = await win.isFullscreen();
+    });
+    return unlisten;
+  });
 </script>
 
+{#if !isFullscreen}
 <div class="bar" data-tauri-drag-region>
+  {#if isMac}<div class="mac-spacer"></div>{/if}
   <span class="title" data-tauri-drag-region>Moku</span>
+  {#if !isMac}
   <div class="controls">
     <button onclick={() => win.minimize()} title="Minimize" aria-label="Minimize">
       <svg width="10" height="1" viewBox="0 0 10 1">
@@ -23,7 +40,9 @@
       </svg>
     </button>
   </div>
+  {/if}
 </div>
+{/if}
 
 <style>
   .bar {
@@ -38,6 +57,12 @@
     user-select: none;
     -webkit-app-region: drag;
   }
+  /* Spacer to clear the native macOS traffic lights (~70px) */
+  .mac-spacer {
+    width: 70px;
+    flex-shrink: 0;
+    -webkit-app-region: drag;
+  }
   .title {
     font-family: var(--font-ui);
     font-size: var(--text-2xs);

src/components/reader/Reader.svelte

@@ -115,6 +115,9 @@
   let abortCtrl:  AbortController | null = null;
   let loadingId:  number | null = null;
   let navToken    = 0;
+  // Only write history after the user has genuinely moved past the opening page.
+  // Prevents the "started on page 1" entry being saved as last position on close.
+  let hasNavigated = false;
 
   // ─── Derived ──────────────────────────────────────────────────────────────────
 
@@ -188,9 +191,10 @@
     abortCtrl  = ctrl;
     loadingId  = id;
     navToken++;
-    appending  = false;
-    markedRead = new Set();
-    loading    = true;
+    appending    = false;
+    markedRead   = new Set();
+    hasNavigated = false;
+    loading      = true;
     error      = null;
     pageGroups = [];
     pageReady  = false;
@@ -394,17 +398,33 @@
   });
 
   // ─── Progress / history tracking ─────────────────────────────────────────────
+  // Only records history after the user has genuinely navigated (pageNumber > 1,
+  // or scrolled past page 1 in longstrip). This prevents the chapter-open event
+  // from writing "page 1" as the last-read position, which caused the history to
+  // always show the chapter you started on rather than where you left off.
 
   $effect(() => {
-    if (store.activeChapter && lastPage && store.activeManga) {
-      const chapterId   = store.activeChapter.id;
-      const chapterName = store.activeChapter.name;
+    // Use displayChapter, not store.activeChapter — in longstrip with autoNext,
+    // store.activeChapter stays as the chapter you *opened* (e.g. ch61) while
+    // displayChapter tracks visibleChapterId (the chapter actually on screen).
+    // Using store.activeChapter here caused every history write to stamp ch61
+    // even when the user had scrolled all the way to ch72.
+    const ch = displayChapter ?? store.activeChapter;
+    if (ch && lastPage && store.activeManga) {
+      const chapterId   = ch.id;
+      const chapterName = ch.name;
       const mangaId     = store.activeManga.id;
       const mangaTitle  = store.activeManga.title;
       const thumb       = store.activeManga.thumbnailUrl;
       const pageNum     = store.pageNumber;
       const atLast      = store.pageNumber === lastPage;
+
+      // Mark that the user has moved past the initial load.
+      if (pageNum > 1) hasNavigated = true;
+
       untrack(() => {
+        // Skip the very first page-1 write that fires on chapter load.
+        if (!hasNavigated) return;
         addHistory({ mangaId, mangaTitle, thumbnailUrl: thumb, chapterId, chapterName, pageNumber: pageNum, readAt: Date.now() });
         if (style !== "longstrip" && store.settings.autoMarkRead && atLast) markChapterRead(chapterId);
       });

src/store/state.svelte.ts

@@ -272,6 +272,8 @@ class Store {
   toasts:            Toast[]          = $state([]);
   activeChapter:     Chapter | null   = $state(null);
   activeChapterList: Chapter[]        = $state([]);
+  // UI-only: synced from Tauri window events in App.svelte. Not persisted.
+  isFullscreen:      boolean          = $state(false);
 
   // ── Discover session cache ────────────────────────────────────────────────
   // Survives navigation within a session but is never persisted to localStorage.
@@ -300,6 +302,9 @@ class Store {
   }
 
   closeReader() {
+    // Null activeChapter FIRST so the history $effect in Reader can't fire
+    // one last time with stale chapter + pageNumber=1, overwriting the real
+    // last-read position with page 1.
     this.activeChapter     = null;
     this.activeChapterList = [];
     this.pageUrls          = [];