perf(right-sidebar): gate live effects, memoize lookups, always-mount tabs (#1674)

* perf(right-sidebar): gate live effects, memoize lookups, always-mount tabs Performance fixes for the right sidebar (git/files/context tabs). == Correctness / leak fixes (P0) * RightSidebar: drop dead useEffect that re-nulled refs the resize handler already nulled; collapse the redundant width/minWidth/maxWidth triple into width + the existing --oc-right-sidebar-width variable. * useUIStore: clamp setRightSidebarWidth to [MIN, MAX]; simplify setRightSidebarOpen (22 lines -> 12). * RightSidebarTabs: useRightSidebarGitSync now takes the right tab and main tab and only polls when the right git tab is the visible consumer and the browser is online + visible. Replaces a global poll that fired for the lifetime of the open sidebar. * GitView: commit-files fetch refactored to cancelled + Promise.all (was a per-hash loop that could setState after unmount); getRemoteUrl and refreshRemotes gated on cancelled/mountedRef; new module-scoped mountedRef guards setIsSettingIdentity from firing after unmount. * GitView + useGitmojiList: extract gitmoji fetch/cache into a hook with module-level inflight promise + subscribers Set; stale-while- revalidate from localStorage; ensureLoaded() for call-site-initiated hydration; cancelled flag on setIsLoading to avoid the React setState-after-unmount race. * ProjectNotesTodoPanel: 400 ms notes debounce now cancels on blur (was double-saving); persistProjectData chained per project through a module-level Map<projectId, Promise> so a fast todo toggle racing the debounced save no longer hits the server in parallel; resize auto-adjust guards against same-value pings. == Render fanout (P1) * RightSidebarTabs: all three tab content components are now always mounted with the hidden attribute. State and cache survive tab switches. When activeMainTab === 'git' (or 'context') the matching right tab is filtered out of the tab strip and a redirect effect snaps any persisted-but-now-hidden right tab to 'files'. onSelect is now a type-guarded handler instead of `as RightTab`. * GitView: 13 separate useGitStore action selectors collapsed into one useShallow block (one re-evaluation per store change instead of 13). * GitView: new isGitViewActive flag (true when this instance is the visible consumer) gates the 7 live effects — load identities, fetch remote URL, refresh remotes, ensureAll, sessionEvents.onGitRefreshHint, worktree bootstrap poll, default-identity auto-apply. Hidden GitView instances no longer run these. * GitView: gitViewSnapshots module-level Map is now backed by an LRU wrapper (cap 20) so per-directory draft snapshots cannot leak across hundreds of project switches. Removed the dead `unique.set` dedup in changeEntries — GitStatus.files is already unique by path. * SidebarFilesTree: statusByPath Map<path, FileStatus> and badgeByDir Map<dirPath, { modified, added }> are precomputed once per gitStatus change. Tree render is O(1) per node instead of O(N) per node via the previous per-row find/scan. badgeByDir walks each file's path segments and increments counters for every ancestor dir, so total cost is O(N + total_dirs_in_files) per gitStatus change. * SidebarFilesTree: FileRow wrapped in React.memo with a custom comparator. Context-menu open state moved INTO FileRow as local state — opening a menu in one row no longer re-renders siblings. * SidebarFilesTree: loadDirectory accepts an isCancelled predicate; the batch-load effect for expandedPaths passes a stable predicate so per-dir fetches stop touching state once the effect tears down. * SidebarFilesTree: module-level fileTreeCacheByRoot Map (LRU, cap 8 roots) hydrates childrenByDir / loadErrorsByDir / loadedDirsRef on mount or root change. Mirror effects write state back to the cache. Survives close-and-reopen of the right sidebar; populated entries are dropped on unmount only when they had no data. == Result Net diff: 6 files modified, 1 new (useGitmojiList.ts), 682 insertions, 283 deletions. Existing test suite baseline preserved (537 pass / 58 fail / 1 error) — no new regressions. The 58 pre-existing failures are in unrelated chat/streaming tests and were verified via git stash on the same branch. Architecture assumptions, verified by manual review: - P1.1's redirect effect snaps rightSidebarTab to 'files' whenever activeMainTab === 'git', so the right and main GitView instances are mutually exclusive — isGitViewActive cannot be true for both. - The 7 gated effects plus the useRightSidebar GitSync poll cover all cases where git state should advance: visible consumer fetches; the poll keeps the store warm when only the right git tab is visible. - The aborted loadDirectory predicate is sufficient because inFlightDirsRef and loadedDirsRef dedup at the call site before any network IO is initiated. * fix(sidebar): always clean up inFlightDirsRef regardless of cancellation * refactor(sidebar): deduplicate RIGHT_SIDEBAR_MIN/MAX_WIDTH constants, export from useUIStore * docs: split right sidebar perf plan into standalone file, clean up merged master status from chat plan * fix(git): gate GitView effects by instance visibility --------- Co-authored-by: Leonid Skorobogatyy <bash@opencode.itc.local> Co-authored-by: Bohdan Triapitsyn <artmore@protonmail.com>
2026-06-16 13:52:05 +03:00
parent e982bd9388
commit 9199798a14
10 changed files with 1273 additions and 291 deletions
@@ -111,7 +111,8 @@ const CONTEXT_PANEL_MAX_WIDTH = 1400;
 const CONTEXT_PANEL_MAX_TABS = 12;
 const CONTEXT_PANEL_MAX_LABEL_LENGTH = 120;
 const LEFT_SIDEBAR_MIN_WIDTH = 280;
-const RIGHT_SIDEBAR_MIN_WIDTH = 360;
+export const RIGHT_SIDEBAR_MIN_WIDTH = 360;
+export const RIGHT_SIDEBAR_MAX_WIDTH = 860;
 const activeMainTabByRuntime = new Map<string, MainTab>();

 const runtimeMemoryKey = (value?: string | null): string => {
@@ -979,29 +980,24 @@ export const useUIStore = create<UIStore>()(
        setRightSidebarOpen: (open) => {
          set((state) => {
            if (state.isRightSidebarOpen === open) {
-              if (!open) {
-                return state;
-              }
-              if (!state.hasManuallyResizedRightSidebar && state.rightSidebarWidth !== RIGHT_SIDEBAR_MIN_WIDTH) {
-                return {
-                  isRightSidebarOpen: open,
-                  rightSidebarWidth: RIGHT_SIDEBAR_MIN_WIDTH,
-                };
-              }
              return state;
            }
-            if (open && !state.hasManuallyResizedRightSidebar) {
-              return {
-                isRightSidebarOpen: open,
-                rightSidebarWidth: RIGHT_SIDEBAR_MIN_WIDTH,
-              };
-            }
-            return { isRightSidebarOpen: open };
+            const shouldResetWidth = open
+              && !state.hasManuallyResizedRightSidebar
+              && state.rightSidebarWidth !== RIGHT_SIDEBAR_MIN_WIDTH;
+            return {
+              isRightSidebarOpen: open,
+              rightSidebarWidth: shouldResetWidth ? RIGHT_SIDEBAR_MIN_WIDTH : state.rightSidebarWidth,
+            };
          });
        },

        setRightSidebarWidth: (width) => {
-          set({ rightSidebarWidth: width, hasManuallyResizedRightSidebar: true });
+          const clamped = Math.min(
+            RIGHT_SIDEBAR_MAX_WIDTH,
+            Math.max(RIGHT_SIDEBAR_MIN_WIDTH, width)
+          );
+          set({ rightSidebarWidth: clamped, hasManuallyResizedRightSidebar: true });
        },

        setRightSidebarTab: (tab) => {