From 552fde5e8c7566bc29bc217a4cc45524052d7ece Mon Sep 17 00:00:00 2001 From: Joe Chen Date: Wed, 27 May 2026 21:25:27 -0400 Subject: [PATCH] 231 --- AGENTS.md | 2 +- .../{CommitFileTree.tsx => DiffFileTree.tsx} | 23 ++++++++----------- web/src/pages/repo/Commit.tsx | 10 ++++---- 3 files changed, 15 insertions(+), 20 deletions(-) rename web/src/components/{CommitFileTree.tsx => DiffFileTree.tsx} (92%) diff --git a/AGENTS.md b/AGENTS.md index 8f2084b9d..81114bb08 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -37,7 +37,7 @@ This applies to all texts, including but not limited to UI, documentation, code ## Tool-use guidance - Use `gh` CLI to access information on github.com that is not publicly available. -- Run the chrome-devtools MCP in headless mode so it does not steal focus from the user's foreground browser session. +- Run the Chrome DevTools MCP in headless mode so it does not steal focus from the user's foreground browser session. After finishing any task that used the Chrome DevTools MCP, kill all `chrome-devtools-mcp` processes with `pkill -f chrome-devtools-mcp`. ## Source code control diff --git a/web/src/components/CommitFileTree.tsx b/web/src/components/DiffFileTree.tsx similarity index 92% rename from web/src/components/CommitFileTree.tsx rename to web/src/components/DiffFileTree.tsx index 59a09e4ea..f8e9f6715 100644 --- a/web/src/components/CommitFileTree.tsx +++ b/web/src/components/DiffFileTree.tsx @@ -54,7 +54,7 @@ const TREE_UNSAFE_CSS = ` } `; -export interface CommitFileTreeHandle { +export interface DiffFileTreeHandle { expandAll(): void; collapseAll(): void; focusSearch(): void; @@ -105,7 +105,7 @@ function collectDirectoryPaths(paths: readonly string[]): string[] { return Array.from(dirs); } -export const CommitFileTree = forwardRef(function CommitFileTreeImpl( +export const DiffFileTree = forwardRef(function DiffFileTreeImpl( { items, onSelectItem, searchOpen = true, header, className, style }, ref, ) { @@ -138,11 +138,8 @@ export const CommitFileTree = forwardRef(function C onSelectItemRef.current = onSelectItem; }, [onSelectItem]); - const searchOpenRef = useRef(searchOpen); - useEffect(() => { - searchOpenRef.current = searchOpen; - }, [searchOpen]); - + // Set when a row is clicked, then consumed by the search-restore effect so + // we only reopen search on selection (not on blur from clicks outside). const selectionJustFiredRef = useRef(false); const onSelectionChange = useCallback((selectedPaths: readonly string[]) => { const target = selectedPaths[0]; @@ -190,18 +187,16 @@ export const CommitFileTree = forwardRef(function C initialExpansion: "open", flattenEmptyDirectories: true, search: true, - searchBlurBehavior: "retain", stickyFolders: true, gitStatus, onSelectionChange, unsafeCSS: TREE_UNSAFE_CSS, }); - // Pierre closes search in two cases we do NOT want: row clicks and input - // blur (clicking outside the tree). It only calls closeSearch() — not a - // prop toggle — so `searchOpen` (the prop) stays true while Pierre's - // internal state flips to false. Reopen with the last typed value whenever - // Pierre closes search while our prop says it should be open. + // Pierre closes search on row click. Reopen with the last typed value so + // the user does not have to retype after navigating to a matched file. + // Blur (clicking outside the tree) is intentionally NOT restored — only + // row-click closures are, gated by `selectionJustFiredRef`. const search = useFileTreeSearch(model); const searchValueRef = useRef(search.value); const searchOpenFnRef = useRef(search.open); @@ -210,7 +205,7 @@ export const CommitFileTree = forwardRef(function C if (search.value !== "") { searchValueRef.current = search.value; } - if (!search.isOpen && searchOpenRef.current && searchValueRef.current !== "") { + if (!search.isOpen && selectionJustFiredRef.current && searchValueRef.current !== "") { searchOpenFnRef.current(searchValueRef.current); } selectionJustFiredRef.current = false; diff --git a/web/src/pages/repo/Commit.tsx b/web/src/pages/repo/Commit.tsx index f46dad023..dc05791cf 100644 --- a/web/src/pages/repo/Commit.tsx +++ b/web/src/pages/repo/Commit.tsx @@ -19,7 +19,7 @@ import { import { type CSSProperties, useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useTranslation } from "react-i18next"; -import { CommitFileTree, type CommitFileTreeHandle } from "@/components/CommitFileTree"; +import { DiffFileTree, type DiffFileTreeHandle } from "@/components/DiffFileTree"; import { DiffSearch } from "@/components/DiffSearch"; import { DiffToolbar, type DiffToolbarSettings, type WhitespaceMode } from "@/components/DiffToolbar"; import { FileHeaderMenu } from "@/components/FileHeaderMenu"; @@ -196,8 +196,8 @@ export function RepoCommit() { const { theme } = useTheme(); const resolvedTheme = resolveTheme(theme); const viewRef = useRef | null>(null); - const treeRef = useRef(null); - const mobileTreeRef = useRef(null); + const treeRef = useRef(null); + const mobileTreeRef = useRef(null); const stickyWorkspaceRef = useRef(null); const [copied, setCopied] = useState(false); const [mobileTreeOpen, setMobileTreeOpen] = useState(false); @@ -855,7 +855,7 @@ export function RepoCommit() { - -