From cce6aa560fcd9768454f549cfcdb83c6e0f4c209 Mon Sep 17 00:00:00 2001
From: npub1t2tgm7d8f995uqvmnm8h88sg3wnpp9a5xysjf6dg3tjmgt3ltulqdp8ehr
 <5a968df9a7494b4e019b9ecf739e088ba61097b4312124e9a88ae5b42e3f5f3e@sprout-oss.stage.blox.sqprod.co>
Date: Tue, 23 Jun 2026 10:38:35 -0400
Subject: [PATCH] Fix nav chrome offset in fullscreen

Co-authored-by: npub1t2tgm7d8f995uqvmnm8h88sg3wnpp9a5xysjf6dg3tjmgt3ltulqdp8ehr <5a968df9a7494b4e019b9ecf739e088ba61097b4312124e9a88ae5b42e3f5f3e@sprout-oss.stage.blox.sqprod.co>
Signed-off-by: npub1t2tgm7d8f995uqvmnm8h88sg3wnpp9a5xysjf6dg3tjmgt3ltulqdp8ehr <5a968df9a7494b4e019b9ecf739e088ba61097b4312124e9a88ae5b42e3f5f3e@sprout-oss.stage.blox.sqprod.co>
---
 desktop/src/app/AppTopChrome.tsx          | 18 +++++++-
 desktop/src/shared/lib/useIsFullscreen.ts | 50 +++++++++++++++++++++++
 2 files changed, 67 insertions(+), 1 deletion(-)
 create mode 100644 desktop/src/shared/lib/useIsFullscreen.ts

diff --git a/desktop/src/app/AppTopChrome.tsx b/desktop/src/app/AppTopChrome.tsx
index 1b010f2312..256bd8d8e3 100644
--- a/desktop/src/app/AppTopChrome.tsx
+++ b/desktop/src/app/AppTopChrome.tsx
@@ -6,7 +6,10 @@ import {
 } from "lucide-react";
 import * as React from "react";
 
+import { isMacPlatform } from "@/shared/lib/platform";
+import { useIsFullscreen } from "@/shared/lib/useIsFullscreen";
 import { Button } from "@/shared/ui/button";
+import { cn } from "@/shared/lib/cn";
 import { useOptionalSidebar } from "@/shared/ui/sidebar";
 
 type AppTopChromeProps = {
@@ -48,6 +51,14 @@ export function AppTopChrome({
   onGoBack,
   onGoForward,
 }: AppTopChromeProps) {
+  const isFullscreen = useIsFullscreen();
+  // On macOS the traffic-light buttons overlay the chrome at x≈12 (see
+  // `trafficLightPosition` in `tauri.conf.json`), so the nav row sits at
+  // `left-[80px]` to clear them. In fullscreen those buttons hide, so shift
+  // the row back to the standard left inset.
+  const navRowLeftClass =
+    isMacPlatform() && isFullscreen ? "left-[12px]" : "left-[80px]";
+
   React.useEffect(() => {
     const handleWheel = (event: WheelEvent) => {
       if (event.clientY <= TOP_CHROME_WHEEL_GUARD_HEIGHT) {
@@ -71,7 +82,12 @@ export function AppTopChrome({
         className="fixed inset-x-0 top-0 z-20 h-10 cursor-default select-none"
         data-tauri-drag-region
       />
-      <div className="fixed left-[80px] top-[6px] z-45 flex items-center gap-0.5">
+      <div
+        className={cn(
+          "fixed top-[6px] z-45 flex items-center gap-0.5",
+          navRowLeftClass,
+        )}
+      >
         <TopChromeSidebarTrigger />
         <Button
           aria-label="Go back"
diff --git a/desktop/src/shared/lib/useIsFullscreen.ts b/desktop/src/shared/lib/useIsFullscreen.ts
new file mode 100644
index 0000000000..abfe390d77
--- /dev/null
+++ b/desktop/src/shared/lib/useIsFullscreen.ts
@@ -0,0 +1,50 @@
+import { getCurrentWindow } from "@tauri-apps/api/window";
+import * as React from "react";
+
+/**
+ * Returns whether the current Tauri window is in fullscreen mode.
+ *
+ * Initial value resolves from `isFullscreen()`; subsequent updates come from
+ * `onResized` (macOS native fullscreen, Windows F11, and Linux fullscreen all
+ * fire a resize on transition). Each consumer owns one listener cleaned up on
+ * unmount.
+ */
+export function useIsFullscreen(): boolean {
+  const [isFullscreen, setIsFullscreen] = React.useState(false);
+
+  React.useEffect(() => {
+    let unlisten: (() => void) | undefined;
+    let cancelled = false;
+
+    const appWindow = getCurrentWindow();
+
+    void appWindow.isFullscreen().then((value) => {
+      if (!cancelled) {
+        setIsFullscreen(value);
+      }
+    });
+
+    void appWindow
+      .onResized(() => {
+        void appWindow.isFullscreen().then((value) => {
+          if (!cancelled) {
+            setIsFullscreen(value);
+          }
+        });
+      })
+      .then((fn) => {
+        if (cancelled) {
+          fn();
+        } else {
+          unlisten = fn;
+        }
+      });
+
+    return () => {
+      cancelled = true;
+      unlisten?.();
+    };
+  }, []);
+
+  return isFullscreen;
+}