fix(desktop): address PR review titlebar and usage races

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/desktop/src/app/command-center/index.tsx

@@ -249,6 +249,7 @@ export function CommandCenterView({
   const [usageLoading, setUsageLoading] = useState(false)
   const [usageError, setUsageError] = useState('')
   const searchRequestRef = useRef(0)
+  const usageRequestRef = useRef(0)
 
   const debouncedQuery = useDebouncedValue(query.trim(), 180)
 
@@ -367,16 +368,25 @@ export function CommandCenterView({
 
   const refreshUsage = useCallback(
     async (days: UsagePeriod) => {
+      const requestId = usageRequestRef.current + 1
+      usageRequestRef.current = requestId
       setUsageLoading(true)
       setUsageError('')
 
       try {
         const response = await getUsageAnalytics(days)
-        setUsage(response)
+
+        if (usageRequestRef.current === requestId) {
+          setUsage(response)
+        }
       } catch (error) {
-        setUsageError(error instanceof Error ? error.message : String(error))
+        if (usageRequestRef.current === requestId) {
+          setUsageError(error instanceof Error ? error.message : String(error))
+        }
       } finally {
-        setUsageLoading(false)
+        if (usageRequestRef.current === requestId) {
+          setUsageLoading(false)
+        }
       }
     },
     []

apps/desktop/src/app/shell/titlebar.test.ts

@@ -1,6 +1,11 @@
 import { describe, expect, it } from 'vitest'
 
-import { TITLEBAR_CONTROL_OFFSET_X, TITLEBAR_EDGE_INSET, titlebarControlsPosition } from './titlebar'
+import {
+  TITLEBAR_CONTROL_OFFSET_X,
+  TITLEBAR_EDGE_INSET,
+  TITLEBAR_FALLBACK_WINDOW_BUTTON_X,
+  titlebarControlsPosition
+} from './titlebar'
 
 describe('titlebarControlsPosition', () => {
   it('offsets controls from visible traffic lights', () => {
@@ -13,6 +18,11 @@ describe('titlebarControlsPosition', () => {
 
   it('pins to the edge on Windows/Linux where native controls render on the right', () => {
     expect(titlebarControlsPosition(null).left).toBe(TITLEBAR_EDGE_INSET)
-    expect(titlebarControlsPosition(undefined).left).toBe(TITLEBAR_EDGE_INSET)
+  })
+
+  it('uses the macOS fallback while the initial window state is unknown', () => {
+    expect(titlebarControlsPosition(undefined).left).toBe(
+      TITLEBAR_FALLBACK_WINDOW_BUTTON_X + TITLEBAR_CONTROL_OFFSET_X
+    )
   })
 })

apps/desktop/src/app/shell/titlebar.ts

@@ -6,6 +6,7 @@ export const TITLEBAR_ICON_SIZE = 12
 export const TITLEBAR_CONTROL_OFFSET_X = 74
 export const TITLEBAR_CONTROL_HEIGHT = 22
 export const TITLEBAR_CONTROLS_TOP = (TITLEBAR_HEIGHT - TITLEBAR_CONTROL_HEIGHT) / 2
+export const TITLEBAR_FALLBACK_WINDOW_BUTTON_X = 24
 // Edge inset used when no left-side native controls take up that space —
 // Windows/Linux (native overlay is on the right) and macOS fullscreen
 // (traffic lights are hidden). Matches the right-cluster's 0.75rem padding.
@@ -30,9 +31,12 @@ export function titlebarControlsPosition(
   //   - Windows/Linux: native min/max/close render on the right via titleBarOverlay.
   //   - macOS fullscreen: traffic lights are hidden.
   // In both cases, pin the cluster to the edge with a small inset.
-  if (!windowButtonPosition || isFullscreen) {
+  if (windowButtonPosition === null || isFullscreen) {
     return { left: TITLEBAR_EDGE_INSET, top }
   }
 
-  return { left: windowButtonPosition.x + TITLEBAR_CONTROL_OFFSET_X, top }
+  return {
+    left: (windowButtonPosition?.x ?? TITLEBAR_FALLBACK_WINDOW_BUTTON_X) + TITLEBAR_CONTROL_OFFSET_X,
+    top
+  }
 }