From 91da96d902351c6664db83d1f45d5749a95e329f Mon Sep 17 00:00:00 2001 From: DarkSkyXD Date: Wed, 25 Mar 2026 18:39:59 -0500 Subject: [PATCH] fix: move TopBar content update out of render phase useSetTopBar was calling store.setContent() synchronously during render, which triggered a setState on TopBar while Overview was still rendering. Wrap in useEffect so the update happens after render completes. Co-Authored-By: Claude Opus 4.6 (1M context) --- interface/src/components/TopBar.tsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/interface/src/components/TopBar.tsx b/interface/src/components/TopBar.tsx index f1ecd4b59..d1c671f7e 100644 --- a/interface/src/components/TopBar.tsx +++ b/interface/src/components/TopBar.tsx @@ -1,4 +1,4 @@ -import { createContext, useContext, useRef, useCallback, useSyncExternalStore, type ReactNode, type MouseEvent } from "react"; +import { createContext, useContext, useRef, useEffect, useCallback, useSyncExternalStore, type ReactNode, type MouseEvent } from "react"; import { Link } from "@tanstack/react-router"; import { BASE_PATH } from "@/api/client"; import { IS_TAURI, startDragging } from "@/platform"; @@ -59,9 +59,13 @@ export function useSetTopBar(node: ReactNode) { const store = useContext(TopBarContext); if (!store) throw new Error("useSetTopBar must be used within TopBarProvider"); - // Update content synchronously during render (like useSyncExternalStore pattern). - // This avoids the useEffect loop entirely. - store.setContent(node); + const nodeRef = useRef(node); + nodeRef.current = node; + + useEffect(() => { + store.setContent(nodeRef.current); + return () => store.setContent(null); + }); } // ── Component ────────────────────────────────────────────────────────────