Skip to content

Hide twisties and indentation when tree nodes have flat hierarchy #277923

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
Nov 19, 2025
+11 −2
Merged

Hide twisties and indentation when tree nodes have flat hierarchy #277923

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
08501e7
Initial plan
Copilot Nov 17, 2025
5b39a71
Hide twisties and remove indentation when repositories have no hierarchy
Copilot Nov 17, 2025
f5a8dd2
Revert "Hide twisties and remove indentation when repositories have n…
dmitrivMS Nov 18, 2025
aafee73
Hide unnecessary controls when nodes have no children.
dmitrivMS Nov 18, 2025
25a5964
Merge branch 'main' into copilot/fix-indent-logic-for-items
dmitrivMS Nov 18, 2025
74cf6d6
Update src/vs/platform/quickinput/browser/tree/quickInputTreeControll…
dmitrivMS Nov 18, 2025
8f8ac5f
Merge branch 'main' into copilot/fix-indent-logic-for-items
dmitrivMS Nov 18, 2025
d7e8e78
Use explicit null check instead of nullish coalescing
Copilot Nov 18, 2025
6d9009e
Merge branch 'main' into copilot/fix-indent-logic-for-items
dmitrivMS Nov 18, 2025
2186b95
Merge branch 'main' into copilot/fix-indent-logic-for-items
dmitrivMS Nov 18, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions src/vs/platform/quickinput/browser/media/quickInput.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -388,6 +388,11 @@
padding-bottom: 5px;
}

.quick-input-tree.quick-input-tree-flat .monaco-tl-indent,
.quick-input-tree.quick-input-tree-flat .monaco-tl-twistie {
display: none !important;
}

.quick-input-tree .quick-input-tree-entry {
box-sizing: border-box;
overflow: hidden;
Expand Down
8 changes: 6 additions & 2 deletions src/vs/platform/quickinput/browser/tree/quickInputTreeController.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import { QuickInputTreeRenderer } from './quickInputTreeRenderer.js';
import { QuickInputTreeSorter } from './quickInputTreeSorter.js';

const $ = dom.$;
const flatHierarchyClass = 'quick-input-tree-flat';

export class QuickInputTreeController extends Disposable {
private readonly _renderer: QuickInputTreeRenderer<IQuickTreeItem>;
Expand All @@ -33,7 +34,7 @@ export class QuickInputTreeController extends Disposable {
private readonly _onDidChangeCheckboxState = this._register(new Emitter<IQuickTreeCheckboxEvent<IQuickTreeItem>>());
readonly onDidChangeCheckboxState = this._onDidChangeCheckboxState.event;

private readonly _onDidCheckedLeafItemsChange = this._register(new Emitter<ReadonlyArray<IQuickTreeItem>>);
private readonly _onDidCheckedLeafItemsChange = this._register(new Emitter<ReadonlyArray<IQuickTreeItem>>());
readonly onDidChangeCheckedLeafItems = this._onDidCheckedLeafItemsChange.event;

private readonly _onLeave = new Emitter<void>();
Expand Down Expand Up @@ -132,9 +133,11 @@ export class QuickInputTreeController extends Disposable {
}

setTreeData(treeData: readonly IQuickTreeItem[]): void {
let hasNestedItems = false;
const createTreeElement = (item: IQuickTreeItem): IObjectTreeElement<IQuickTreeItem> => {
let children: IObjectTreeElement<IQuickTreeItem>[] | undefined;
if (item.children) {
if (item.children?.length) {
hasNestedItems = true;
children = item.children.map(child => createTreeElement(child));
item.checked = getParentNodeState(children);
}
Expand All @@ -148,6 +151,7 @@ export class QuickInputTreeController extends Disposable {

const treeElements = treeData.map(item => createTreeElement(item));
this._tree.setChildren(null, treeElements);
this._container.classList.toggle(flatHierarchyClass, !hasNestedItems);
}

layout(maxHeight?: number): void {
Expand Down
Loading