;
loading: boolean;
onAction(action: FileAction, entry: FileTreeEntry): void;
onCreateRoot(kind: "file" | "directory"): void;
onOpen(path: string): void;
onRefresh(): void;
+ onToggleDirectory(path: string): void;
query: string;
rootName: string;
selectedPath: string | null;
setQuery(value: string): void;
showAnnotate: boolean;
+ showSql: boolean;
truncated: boolean;
}) {
- const [expanded, setExpanded] = useState
>(new Set());
-
- // Reveal a newly selected file by expanding every folder above it, so a
- // file created or opened inside a collapsed folder appears in the tree
- // instead of only in the editor.
- useEffect(() => {
- if (selectedPath === null) return;
- const ancestors: string[] = [];
- let parent = parentPath(selectedPath);
- while (parent.length > 0) {
- ancestors.push(parent);
- parent = parentPath(parent);
- }
- if (ancestors.length === 0) return;
- setExpanded((current) => {
- let next = current;
- for (const ancestor of ancestors) {
- if (!next.has(ancestor)) {
- if (next === current) next = new Set(current);
- next.add(ancestor);
- }
- }
- return next;
- });
- }, [selectedPath]);
-
const visibleEntries = useMemo(() => {
if (query.length > 0) return searchSortEntries(entries);
- return filterVisibleEntries(orderTreeEntries(entries), expanded);
- }, [entries, expanded, query]);
+ return filterVisibleEntries(orderTreeEntries(entries), expandedDirs);
+ }, [entries, expandedDirs, query]);
return (