@codingame/monaco-vscode-api 24.3.0 → 25.0.0

package/vscode/src/vs/workbench/contrib/debug/browser/breakpointsView.js

@@ -8,17 +8,18 @@ import { IconLabel } from '../../../../base/browser/ui/iconLabel/iconLabel.js';
 import { InputBox } from '../../../../base/browser/ui/inputbox/inputBox.js';
 import '../../../../base/browser/ui/splitview/splitview.js';
 import { Action } from '../../../../base/common/actions.js';
-import { equals } from '../../../../base/common/arrays.js';
 import { RunOnceScheduler } from '../../../../base/common/async.js';
 import { Codicon } from '../../../../base/common/codicons.js';
 import { MarkdownString } from '../../../../base/common/htmlContent.js';
 import { KeyCode } from '../../../../base/common/keyCodes.js';
-import { DisposableStore, dispose } from '../../../../base/common/lifecycle.js';
+import { DisposableStore, toDisposable, dispose } from '../../../../base/common/lifecycle.js';
 import { basenameOrAuthority, dirname } from '../../../../base/common/resources.js';
 import { ThemeIcon } from '../../../../base/common/themables.js';
+import { URI } from '../../../../base/common/uri.js';
 import { Constants } from '../../../../base/common/uint.js';
 import { isCodeEditor } from '../../../../editor/browser/editorBrowser.js';
 import { ILanguageService } from '../../../../editor/common/languages/language.service.js';
+import { ITextModelService } from '../../../../editor/common/services/resolverService.service.js';
 import { localize, localize2 } from '../../../../nls.js';
 import { getContextMenuActions, getActionBarActions } from '../../../../platform/actions/browser/menuEntryActionViewItem.js';
 import { MenuId, registerAction2, Action2 } from '../../../../platform/actions/common/actions.js';
@@ -32,7 +33,7 @@ import { IHoverService } from '../../../../platform/hover/browser/hover.service.
 import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
 import { IKeybindingService } from '../../../../platform/keybinding/common/keybinding.service.js';
 import { ILabelService } from '../../../../platform/label/common/label.service.js';
-import { WorkbenchList } from '../../../../platform/list/browser/listService.js';
+import { WorkbenchCompressibleObjectTree } from '../../../../platform/list/browser/listService.js';
 import { INotificationService } from '../../../../platform/notification/common/notification.service.js';
 import { IOpenerService } from '../../../../platform/opener/common/opener.service.js';
 import { IQuickInputService } from '../../../../platform/quickinput/common/quickInput.service.js';
@@ -47,10 +48,12 @@ import { CONTEXT_BREAKPOINT_ITEM_TYPE, CONTEXT_BREAKPOINT_ITEM_IS_DATA_BYTES, CO
 import { IDebugService } from '../common/debug.service.js';
 import { Breakpoint, InstructionBreakpoint, FunctionBreakpoint, DataBreakpoint, ExceptionBreakpoint } from '../common/debugModel.js';
 import { DisassemblyViewInput } from '../common/disassemblyViewInput.js';
-import { dataBreakpoint, functionBreakpoint, logBreakpoint, breakpoint, conditionalBreakpoint, debugBreakpointUnsupported, watchExpressionsAddFuncBreakpoint, watchExpressionsAddDataBreakpoint, breakpointsActivate, breakpointsRemoveAll } from './debugIcons.js';
+import { dataBreakpoint, functionBreakpoint, logBreakpoint, breakpoint, conditionalBreakpoint, debugBreakpointUnsupported, watchExpressionsAddFuncBreakpoint, watchExpressionsAddDataBreakpoint, breakpointsActivate, breakpointsRemoveAll, breakpointsViewIcon } from './debugIcons.js';
+import { equals } from '../../../../base/common/arrays.js';
+import { hasKey } from '../../../../base/common/types.js';
 import { Orientation } from '../../../../base/browser/ui/sash/sash.js';
 
-var BreakpointsRenderer_1, FunctionBreakpointsRenderer_1, DataBreakpointsRenderer_1, InstructionBreakpointsRenderer_1;
+var BreakpointsFolderRenderer_1, BreakpointsRenderer_1, FunctionBreakpointsRenderer_1, DataBreakpointsRenderer_1, InstructionBreakpointsRenderer_1;
 const $ = $$1;
 function createCheckbox(disposables) {
     const checkbox = $('input');
@@ -60,15 +63,30 @@ function createCheckbox(disposables) {
     return checkbox;
 }
 const MAX_VISIBLE_BREAKPOINTS = 9;
-function getExpandedBodySize(model, sessionId, countLimit) {
-    const length = model.getBreakpoints().length + model.getExceptionBreakpointsForSession(sessionId).length + model.getFunctionBreakpoints().length + model.getDataBreakpoints().length + model.getInstructionBreakpoints().length;
-    return Math.min(countLimit, length) * 22;
+class BreakpointsFolderItem {
+    constructor(uri, breakpoints) {
+        this.uri = uri;
+        this.breakpoints = breakpoints;
+    }
+    getId() {
+        return ( this.uri.toString());
+    }
+    get enabled() {
+        return this.breakpoints.every(bp => bp.enabled);
+    }
+    get indeterminate() {
+        const enabledCount = this.breakpoints.filter(bp => bp.enabled).length;
+        return enabledCount > 0 && enabledCount < this.breakpoints.length;
+    }
 }
 function getModeKindForBreakpoint(breakpoint) {
     const kind = breakpoint instanceof Breakpoint ? 'source' : breakpoint instanceof InstructionBreakpoint ? 'instruction' : 'exception';
     return kind;
 }
 let BreakpointsView = class BreakpointsView extends ViewPane {
+    getPresentation() {
+        return this.configurationService.getValue('debug.breakpointsView.presentation');
+    }
     constructor(options, contextMenuService, debugService, keybindingService, instantiationService, themeService, editorService, contextViewService, configurationService, viewDescriptorService, contextKeyService, openerService, labelService, menuService, hoverService, languageService) {
         super(options, keybindingService, contextMenuService, configurationService, contextKeyService, viewDescriptorService, instantiationService, openerService, themeService, hoverService);
         this.debugService = debugService;
@@ -79,7 +97,7 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
         this.needsRefresh = false;
         this.needsStateChange = false;
         this.ignoreLayout = false;
-        this.autoFocusedIndex = -1;
+        this.collapsedState = ( new Set());
         this.menu = menuService.createMenu(MenuId.DebugBreakpointsContext, contextKeyService);
         this._register(this.menu);
         this.breakpointItemType = CONTEXT_BREAKPOINT_ITEM_TYPE.bindTo(contextKeyService);
@@ -96,8 +114,8 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
         super.renderBody(container);
         this.element.classList.add('debug-pane');
         container.classList.add('debug-breakpoints');
-        const delegate = ( new BreakpointsDelegate(this));
-        this.list = this.instantiationService.createInstance(WorkbenchList, 'Breakpoints', container, delegate, [
+        this.tree = this.instantiationService.createInstance((WorkbenchCompressibleObjectTree), 'BreakpointsView', container, ( new BreakpointsDelegate(this)), [
+            this.instantiationService.createInstance(BreakpointsFolderRenderer),
             this.instantiationService.createInstance(BreakpointsRenderer, this.menu, this.breakpointHasMultipleModes, this.breakpointSupportsCondition, this.breakpointItemType),
             ( new ExceptionBreakpointsRenderer(
                 this.menu,
@@ -126,15 +144,50 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             )),
             this.instantiationService.createInstance(InstructionBreakpointsRenderer),
         ], {
-            identityProvider: { getId: (element) => element.getId() },
-            multipleSelectionSupport: false,
-            keyboardNavigationLabelProvider: { getKeyboardNavigationLabel: (e) => e },
+            compressionEnabled: this.getPresentation() === 'tree',
+            hideTwistiesOfChildlessElements: true,
+            identityProvider: {
+                getId: (element) => element.getId()
+            },
+            keyboardNavigationLabelProvider: {
+                getKeyboardNavigationLabel: (element) => {
+                    if (element instanceof BreakpointsFolderItem) {
+                        return basenameOrAuthority(element.uri);
+                    }
+                    if (element instanceof Breakpoint) {
+                        return `${basenameOrAuthority(element.uri)}:${element.lineNumber}`;
+                    }
+                    if (element instanceof FunctionBreakpoint) {
+                        return element.name;
+                    }
+                    if (element instanceof DataBreakpoint) {
+                        return element.description;
+                    }
+                    if (element instanceof ExceptionBreakpoint) {
+                        return element.label || element.filter;
+                    }
+                    if (element instanceof InstructionBreakpoint) {
+                        return `0x${( element.address.toString(16))}`;
+                    }
+                    return '';
+                },
+                getCompressedNodeKeyboardNavigationLabel: (elements) => {
+                    return ( elements.map(e => {
+                        if (e instanceof BreakpointsFolderItem) {
+                            return basenameOrAuthority(e.uri);
+                        }
+                        return '';
+                    })).join('/');
+                }
+            },
             accessibilityProvider: ( new BreakpointsAccessibilityProvider(this.debugService, this.labelService)),
+            multipleSelectionSupport: false,
             overrideStyles: this.getLocationBasedColors().listOverrideStyles
         });
-        CONTEXT_BREAKPOINTS_FOCUSED.bindTo(this.list.contextKeyService);
-        this._register(this.list.onContextMenu(this.onListContextMenu, this));
-        this._register(this.list.onMouseMiddleClick(async ({ element }) => {
+        this._register(this.tree);
+        CONTEXT_BREAKPOINTS_FOCUSED.bindTo(this.tree.contextKeyService);
+        this._register(this.tree.onContextMenu(this.onTreeContextMenu, this));
+        this._register(this.tree.onMouseMiddleClick(async ({ element }) => {
             if (element instanceof Breakpoint) {
                 await this.debugService.removeBreakpoints(element.getId());
             }
@@ -147,26 +200,49 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             else if (element instanceof InstructionBreakpoint) {
                 await this.debugService.removeInstructionBreakpoints(element.instructionReference, element.offset);
             }
+            else if (element instanceof BreakpointsFolderItem) {
+                await this.debugService.removeBreakpoints(( element.breakpoints.map(bp => bp.getId())));
+            }
         }));
-        this._register(this.list.onDidOpen(async (e) => {
-            if (!e.element) {
+        this._register(this.tree.onDidOpen(async (e) => {
+            const element = e.element;
+            if (!element) {
                 return;
             }
             if (isMouseEvent(e.browserEvent) && e.browserEvent.button === 1) {
                 return;
             }
-            if (e.element instanceof Breakpoint) {
-                openBreakpointSource(e.element, e.sideBySide, e.editorOptions.preserveFocus || false, e.editorOptions.pinned || !e.editorOptions.preserveFocus, this.debugService, this.editorService);
+            if (element instanceof Breakpoint) {
+                openBreakpointSource(element, e.sideBySide, e.editorOptions.preserveFocus || false, e.editorOptions.pinned || !e.editorOptions.preserveFocus, this.debugService, this.editorService);
             }
-            if (e.element instanceof InstructionBreakpoint) {
+            if (element instanceof InstructionBreakpoint) {
                 const disassemblyView = await this.editorService.openEditor(DisassemblyViewInput.instance);
-                disassemblyView.goToInstructionAndOffset(e.element.instructionReference, e.element.offset, isMouseEvent(e.browserEvent) && e.browserEvent.detail === 2);
+                disassemblyView.goToInstructionAndOffset(element.instructionReference, element.offset, isMouseEvent(e.browserEvent) && e.browserEvent.detail === 2);
             }
-            if (isMouseEvent(e.browserEvent) && e.browserEvent.detail === 2 && e.element instanceof FunctionBreakpoint && e.element !== this.inputBoxData?.breakpoint) {
-                this.renderInputBox({ breakpoint: e.element, type: 'name' });
+            if (isMouseEvent(e.browserEvent) && e.browserEvent.detail === 2 && element instanceof FunctionBreakpoint && element !== this.inputBoxData?.breakpoint) {
+                this.renderInputBox({ breakpoint: element, type: 'name' });
             }
         }));
-        this.list.splice(0, this.list.length, this.elements);
+        this._register(this.tree.onDidChangeCollapseState(e => {
+            const element = e.node.element;
+            if (element instanceof BreakpointsFolderItem) {
+                if (e.node.collapsed) {
+                    this.collapsedState.add(element.getId());
+                }
+                else {
+                    this.collapsedState.delete(element.getId());
+                }
+                this.updateSize();
+            }
+        }));
+        this._register(this.configurationService.onDidChangeConfiguration(e => {
+            if (e.affectsConfiguration('debug.breakpointsView.presentation')) {
+                const presentation = this.getPresentation();
+                this.tree.updateOptions({ compressionEnabled: presentation === 'tree' });
+                this.onBreakpointsChange();
+            }
+        }));
+        this.setTreeInput();
         this._register(this.onDidChangeBodyVisibility(visible => {
             if (visible) {
                 if (this.needsRefresh) {
@@ -195,7 +271,7 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
     }
     focus() {
         super.focus();
-        this.list?.domFocus();
+        this.tree?.domFocus();
     }
     renderInputBox(data) {
         this._inputBoxData = data;
@@ -210,7 +286,7 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             return;
         }
         super.layoutBody(height, width);
-        this.list?.layout(height, width);
+        this.tree?.layout(height, width);
         try {
             this.ignoreLayout = true;
             this.updateSize();
@@ -219,8 +295,18 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             this.ignoreLayout = false;
         }
     }
-    onListContextMenu(e) {
+    onTreeContextMenu(e) {
         const element = e.element;
+        if (element instanceof BreakpointsFolderItem) {
+            this.breakpointItemType.set('breakpointFolder');
+            const { secondary } = getContextMenuActions(this.menu.getActions({ arg: element, shouldForwardArgs: false }), 'inline');
+            this.contextMenuService.showContextMenu({
+                getAnchor: () => e.anchor,
+                getActions: () => secondary,
+                getActionsContext: () => element
+            });
+            return;
+        }
         const type = element instanceof Breakpoint ? 'breakpoint' : element instanceof ExceptionBreakpoint ? 'exceptionBreakpoint' :
             element instanceof FunctionBreakpoint ? 'functionBreakpoint' : element instanceof DataBreakpoint ? 'dataBreakpoint' :
                 element instanceof InstructionBreakpoint ? 'instructionBreakpoint' : undefined;
@@ -239,9 +325,9 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
     }
     updateSize() {
         const containerModel = this.viewDescriptorService.getViewContainerModel(this.viewDescriptorService.getViewContainerByViewId(this.id));
-        const sessionId = this.debugService.getViewModel().focusedSession?.getId();
-        this.minimumBodySize = this.orientation === Orientation.VERTICAL ? getExpandedBodySize(this.debugService.getModel(), sessionId, MAX_VISIBLE_BREAKPOINTS) : 170;
-        this.maximumBodySize = this.orientation === Orientation.VERTICAL && containerModel.visibleViewDescriptors.length > 1 ? getExpandedBodySize(this.debugService.getModel(), sessionId, Number.POSITIVE_INFINITY) : Number.POSITIVE_INFINITY;
+        const rowHeight = 22;
+        this.minimumBodySize = this.orientation === Orientation.VERTICAL ? Math.min(MAX_VISIBLE_BREAKPOINTS * rowHeight, this.tree.contentHeight) : 170;
+        this.maximumBodySize = this.orientation === Orientation.VERTICAL && containerModel.visibleViewDescriptors.length > 1 ? this.tree.contentHeight : Number.POSITIVE_INFINITY;
     }
     updateBreakpointsHint(delayed = false) {
         if (!this.hintContainer) {
@@ -273,17 +359,12 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
     }
     onBreakpointsChange() {
         if (this.isBodyVisible()) {
-            this.updateSize();
-            if (this.list) {
-                const lastFocusIndex = this.list.getFocus()[0];
-                const needsRefocus = lastFocusIndex && !this.elements.includes(this.list.element(lastFocusIndex));
-                this.list.splice(0, this.list.length, this.elements);
+            if (this.tree) {
+                this.setTreeInput();
                 this.needsRefresh = false;
-                if (needsRefocus) {
-                    this.list.focusNth(Math.min(lastFocusIndex, this.list.length - 1));
-                }
             }
             this.updateBreakpointsHint();
+            this.updateSize();
         }
         else {
             this.needsRefresh = true;
@@ -296,26 +377,26 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             let found = false;
             if (thread && thread.stoppedDetails && thread.stoppedDetails.hitBreakpointIds && thread.stoppedDetails.hitBreakpointIds.length > 0) {
                 const hitBreakpointIds = thread.stoppedDetails.hitBreakpointIds;
-                const elements = this.elements;
-                const index = elements.findIndex(e => {
+                const elements = this.flatElements;
+                const hitElement = elements.find(e => {
                     const id = e.getIdFromAdapter(thread.session.getId());
                     return typeof id === 'number' && hitBreakpointIds.indexOf(id) !== -1;
                 });
-                if (index >= 0) {
-                    this.list.setFocus([index]);
-                    this.list.setSelection([index]);
+                if (hitElement) {
+                    this.tree.setFocus([hitElement]);
+                    this.tree.setSelection([hitElement]);
                     found = true;
-                    this.autoFocusedIndex = index;
+                    this.autoFocusedElement = hitElement;
                 }
             }
             if (!found) {
-                const focus = this.list.getFocus();
-                const selection = this.list.getSelection();
-                if (this.autoFocusedIndex >= 0 && equals(focus, selection) && focus.indexOf(this.autoFocusedIndex) >= 0) {
-                    this.list.setFocus([]);
-                    this.list.setSelection([]);
+                const focus = this.tree.getFocus();
+                const selection = this.tree.getSelection();
+                if (this.autoFocusedElement && equals(focus, selection) && selection.includes(this.autoFocusedElement)) {
+                    this.tree.setFocus([]);
+                    this.tree.setSelection([]);
                 }
-                this.autoFocusedIndex = -1;
+                this.autoFocusedElement = undefined;
             }
             this.updateBreakpointsHint();
         }
@@ -323,7 +404,65 @@ let BreakpointsView = class BreakpointsView extends ViewPane {
             this.needsStateChange = true;
         }
     }
-    get elements() {
+    setTreeInput() {
+        const treeInput = this.getTreeElements();
+        this.tree.setChildren(null, treeInput);
+    }
+    getTreeElements() {
+        const model = this.debugService.getModel();
+        const sessionId = this.debugService.getViewModel().focusedSession?.getId();
+        const showAsTree = this.getPresentation() === 'tree';
+        const result = [];
+        for (const exBp of model.getExceptionBreakpointsForSession(sessionId)) {
+            result.push({ element: exBp, incompressible: true });
+        }
+        for (const funcBp of model.getFunctionBreakpoints()) {
+            result.push({ element: funcBp, incompressible: true });
+        }
+        for (const dataBp of model.getDataBreakpoints()) {
+            result.push({ element: dataBp, incompressible: true });
+        }
+        const sourceBreakpoints = model.getBreakpoints();
+        if (showAsTree && sourceBreakpoints.length > 0) {
+            const breakpointsByUri = ( new Map());
+            for (const bp of sourceBreakpoints) {
+                const key = ( bp.uri.toString());
+                if (!( breakpointsByUri.has(key))) {
+                    breakpointsByUri.set(key, []);
+                }
+                breakpointsByUri.get(key).push(bp);
+            }
+            for (const [uriStr, breakpoints] of breakpointsByUri) {
+                const uri = ( URI.parse(uriStr));
+                const folderItem = ( new BreakpointsFolderItem(uri, breakpoints));
+                breakpoints.sort((a, b) => a.lineNumber - b.lineNumber);
+                const children = ( breakpoints.map(bp => ({
+                    element: bp,
+                    incompressible: false
+                })));
+                result.push({
+                    element: folderItem,
+                    incompressible: false,
+                    collapsed: ( this.collapsedState.has(folderItem.getId())) || !( this.collapsedState.has(`_init_${folderItem.getId()}`)),
+                    children
+                });
+                if (!( this.collapsedState.has(`_init_${folderItem.getId()}`))) {
+                    this.collapsedState.add(`_init_${folderItem.getId()}`);
+                    this.collapsedState.add(folderItem.getId());
+                }
+            }
+        }
+        else {
+            for (const bp of sourceBreakpoints) {
+                result.push({ element: bp, incompressible: true });
+            }
+        }
+        for (const instrBp of model.getInstructionBreakpoints()) {
+            result.push({ element: instrBp, incompressible: true });
+        }
+        return result;
+    }
+    get flatElements() {
         const model = this.debugService.getModel();
         const sessionId = this.debugService.getViewModel().focusedSession?.getId();
         const elements = model.getExceptionBreakpointsForSession(sessionId).concat(model.getFunctionBreakpoints()).concat(model.getDataBreakpoints()).concat(model.getBreakpoints()).concat(model.getInstructionBreakpoints());
@@ -355,6 +494,9 @@ class BreakpointsDelegate {
         return 22;
     }
     getTemplateId(element) {
+        if (element instanceof BreakpointsFolderItem) {
+            return BreakpointsFolderRenderer.ID;
+        }
         if (element instanceof Breakpoint) {
             return BreakpointsRenderer.ID;
         }
@@ -386,9 +528,106 @@ class BreakpointsDelegate {
     }
 }
 const breakpointIdToActionBarDomeNode = ( new Map());
+let BreakpointsFolderRenderer = class BreakpointsFolderRenderer {
+    static { BreakpointsFolderRenderer_1 = this; }
+    static { this.ID = 'breakpointFolder'; }
+    constructor(debugService, labelService, hoverService) {
+        this.debugService = debugService;
+        this.labelService = labelService;
+        this.hoverService = hoverService;
+    }
+    get templateId() {
+        return BreakpointsFolderRenderer_1.ID;
+    }
+    renderTemplate(container) {
+        const data = Object.create(null);
+        data.elementDisposables = ( new DisposableStore());
+        data.templateDisposables = ( new DisposableStore());
+        data.templateDisposables.add(data.elementDisposables);
+        data.container = container;
+        container.classList.add('breakpoint', 'breakpoint-folder');
+        data.templateDisposables.add(toDisposable(() => {
+            container.classList.remove('breakpoint', 'breakpoint-folder');
+        }));
+        data.checkbox = createCheckbox(data.templateDisposables);
+        data.templateDisposables.add(addStandardDisposableListener(data.checkbox, 'change', (e) => {
+            const enabled = data.checkbox.checked;
+            for (const bp of data.context.breakpoints) {
+                this.debugService.enableOrDisableBreakpoints(enabled, bp);
+            }
+        }));
+        append(data.container, data.checkbox);
+        data.name = append(data.container, $('span.name'));
+        append(data.container, $('span.file-path'));
+        data.actionBar = ( new ActionBar(data.container));
+        data.templateDisposables.add(data.actionBar);
+        return data;
+    }
+    renderElement(node, _index, data) {
+        const folderItem = node.element;
+        data.context = folderItem;
+        data.name.textContent = this.labelService.getUriBasenameLabel(folderItem.uri);
+        data.container.classList.toggle('disabled', !this.debugService.getModel().areBreakpointsActivated());
+        const fullPath = this.labelService.getUriLabel(folderItem.uri, { relative: true });
+        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.container, fullPath));
+        if (folderItem.indeterminate) {
+            data.checkbox.checked = false;
+            data.checkbox.indeterminate = true;
+        }
+        else {
+            data.checkbox.indeterminate = false;
+            data.checkbox.checked = folderItem.enabled;
+        }
+        data.actionBar.clear();
+        const removeAction = data.elementDisposables.add(( new Action('debug.removeBreakpointsInFile', ( localize(6495, "Remove Breakpoints in File")), ThemeIcon.asClassName(Codicon.close), true, async () => {
+            for (const bp of folderItem.breakpoints) {
+                await this.debugService.removeBreakpoints(bp.getId());
+            }
+        })));
+        data.actionBar.push(removeAction, { icon: true, label: false });
+    }
+    renderCompressedElements(node, _index, data) {
+        const elements = node.element.elements;
+        const folderItem = elements[elements.length - 1];
+        data.context = folderItem;
+        const names = ( elements.map(e => basenameOrAuthority(e.uri)));
+        data.name.textContent = names.join('/');
+        const fullPath = this.labelService.getUriLabel(folderItem.uri, { relative: true });
+        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.container, fullPath));
+        if (folderItem.indeterminate) {
+            data.checkbox.checked = false;
+            data.checkbox.indeterminate = true;
+        }
+        else {
+            data.checkbox.indeterminate = false;
+            data.checkbox.checked = folderItem.enabled;
+        }
+        data.actionBar.clear();
+        const removeAction = data.elementDisposables.add(( new Action('debug.removeBreakpointsInFile', ( localize(6495, "Remove Breakpoints in File")), ThemeIcon.asClassName(Codicon.close), true, async () => {
+            for (const bp of folderItem.breakpoints) {
+                await this.debugService.removeBreakpoints(bp.getId());
+            }
+        })));
+        data.actionBar.push(removeAction, { icon: true, label: false });
+    }
+    disposeElement(element, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeTemplate(templateData) {
+        templateData.templateDisposables.dispose();
+    }
+};
+BreakpointsFolderRenderer = BreakpointsFolderRenderer_1 = ( __decorate([
+    ( __param(0, IDebugService)),
+    ( __param(1, ILabelService)),
+    ( __param(2, IHoverService))
+], BreakpointsFolderRenderer));
 let BreakpointsRenderer = class BreakpointsRenderer {
     static { BreakpointsRenderer_1 = this; }
-    constructor(menu, breakpointHasMultipleModes, breakpointSupportsCondition, breakpointItemType, debugService, hoverService, labelService) {
+    constructor(menu, breakpointHasMultipleModes, breakpointSupportsCondition, breakpointItemType, debugService, hoverService, labelService, textModelService) {
         this.menu = menu;
         this.breakpointHasMultipleModes = breakpointHasMultipleModes;
         this.breakpointSupportsCondition = breakpointSupportsCondition;
@@ -396,6 +635,7 @@ let BreakpointsRenderer = class BreakpointsRenderer {
         this.debugService = debugService;
         this.hoverService = hoverService;
         this.labelService = labelService;
+        this.textModelService = textModelService;
     }
     static { this.ID = 'breakpoints'; }
     get templateId() {
@@ -406,7 +646,11 @@ let BreakpointsRenderer = class BreakpointsRenderer {
         data.elementDisposables = ( new DisposableStore());
         data.templateDisposables = ( new DisposableStore());
         data.templateDisposables.add(data.elementDisposables);
-        data.breakpoint = append(container, $('.breakpoint'));
+        data.breakpoint = container;
+        container.classList.add('breakpoint');
+        data.templateDisposables.add(toDisposable(() => {
+            container.classList.remove('breakpoint');
+        }));
         data.icon = $('.icon');
         data.checkbox = createCheckbox(data.templateDisposables);
         data.templateDisposables.add(addStandardDisposableListener(data.checkbox, 'change', (e) => {
@@ -422,10 +666,25 @@ let BreakpointsRenderer = class BreakpointsRenderer {
         data.badge = append(badgeContainer, $('span.line-number.monaco-count-badge'));
         return data;
     }
-    renderElement(breakpoint, index, data) {
+    renderElement(node, index, data) {
+        const breakpoint = node.element;
         data.context = breakpoint;
+        if (node.depth > 1) {
+            this.renderBreakpointLineLabel(breakpoint, data);
+        }
+        else {
+            this.renderBreakpointFileLabel(breakpoint, data);
+        }
+        this.renderBreakpointCommon(breakpoint, data);
+    }
+    renderCompressedElements(node, index, data) {
+        const breakpoint = node.element.elements[node.element.elements.length - 1];
+        data.context = breakpoint;
+        this.renderBreakpointFileLabel(breakpoint, data);
+        this.renderBreakpointCommon(breakpoint, data);
+    }
+    renderBreakpointCommon(breakpoint, data) {
         data.breakpoint.classList.toggle('disabled', !this.debugService.getModel().areBreakpointsActivated());
-        data.name.textContent = basenameOrAuthority(breakpoint.uri);
         let badgeContent = ( breakpoint.lineNumber.toString());
         if (breakpoint.column) {
             badgeContent += `:${breakpoint.column}`;
@@ -434,7 +693,6 @@ let BreakpointsRenderer = class BreakpointsRenderer {
             badgeContent = `${breakpoint.modeLabel}: ${badgeContent}`;
         }
         data.badge.textContent = badgeContent;
-        data.filePath.textContent = this.labelService.getUriLabel(dirname(breakpoint.uri), { relative: true });
         data.checkbox.checked = breakpoint.enabled;
         const { message, icon } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), breakpoint, this.labelService, this.debugService.getModel());
         data.icon.className = ThemeIcon.asClassName(icon);
@@ -452,7 +710,37 @@ let BreakpointsRenderer = class BreakpointsRenderer {
         data.actionBar.push(primary, { icon: true, label: false });
         breakpointIdToActionBarDomeNode.set(breakpoint.getId(), data.actionBar.domNode);
     }
-    disposeElement(a, index, template) {
+    renderBreakpointFileLabel(breakpoint, data) {
+        data.name.textContent = basenameOrAuthority(breakpoint.uri);
+        data.filePath.textContent = this.labelService.getUriLabel(dirname(breakpoint.uri), { relative: true });
+    }
+    renderBreakpointLineLabel(breakpoint, data) {
+        data.name.textContent = ( localize(6496, "Loading..."));
+        data.filePath.textContent = '';
+        this.textModelService.createModelReference(breakpoint.uri).then(reference => {
+            if (data.context !== breakpoint) {
+                reference.dispose();
+                return;
+            }
+            data.elementDisposables.add(reference);
+            const model = reference.object.textEditorModel;
+            if (model && breakpoint.lineNumber <= model.getLineCount()) {
+                const lineContent = model.getLineContent(breakpoint.lineNumber).trim();
+                data.name.textContent = lineContent || ( localize(6497, "(empty line)"));
+            }
+            else {
+                data.name.textContent = ( localize(6498, "(line not found)"));
+            }
+        }).catch(() => {
+            if (data.context === breakpoint) {
+                data.name.textContent = ( localize(6499, "(cannot load line)"));
+            }
+        });
+    }
+    disposeElement(node, index, template) {
+        template.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, template) {
         template.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -462,7 +750,8 @@ let BreakpointsRenderer = class BreakpointsRenderer {
 BreakpointsRenderer = BreakpointsRenderer_1 = ( __decorate([
     ( __param(4, IDebugService)),
     ( __param(5, IHoverService)),
-    ( __param(6, ILabelService))
+    ( __param(6, ILabelService)),
+    ( __param(7, ITextModelService))
 ], BreakpointsRenderer));
 class ExceptionBreakpointsRenderer {
     constructor(menu, breakpointHasMultipleModes, breakpointSupportsCondition, breakpointItemType, debugService, hoverService) {
@@ -497,15 +786,23 @@ class ExceptionBreakpointsRenderer {
         data.badge = append(badgeContainer, $('span.line-number.monaco-count-badge'));
         return data;
     }
-    renderElement(exceptionBreakpoint, index, data) {
+    renderElement(node, index, data) {
+        const exceptionBreakpoint = node.element;
+        this.renderExceptionBreakpoint(exceptionBreakpoint, data);
+    }
+    renderCompressedElements(node, index, data) {
+        const exceptionBreakpoint = node.element.elements[node.element.elements.length - 1];
+        this.renderExceptionBreakpoint(exceptionBreakpoint, data);
+    }
+    renderExceptionBreakpoint(exceptionBreakpoint, data) {
         data.context = exceptionBreakpoint;
         data.name.textContent = exceptionBreakpoint.label || `${exceptionBreakpoint.filter} exceptions`;
-        const exceptionBreakpointtitle = exceptionBreakpoint.verified ? (exceptionBreakpoint.description || data.name.textContent) : exceptionBreakpoint.message || ( localize(6473, "Unverified Exception Breakpoint"));
+        const exceptionBreakpointtitle = exceptionBreakpoint.verified ? (exceptionBreakpoint.description || data.name.textContent) : exceptionBreakpoint.message || ( localize(6500, "Unverified Exception Breakpoint"));
         data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, exceptionBreakpointtitle));
         data.breakpoint.classList.toggle('disabled', !exceptionBreakpoint.verified);
         data.checkbox.checked = exceptionBreakpoint.enabled;
         data.condition.textContent = exceptionBreakpoint.condition || '';
-        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.condition, ( localize(6474, "Expression condition: {0}", exceptionBreakpoint.condition))));
+        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.condition, ( localize(6501, "Expression condition: {0}", exceptionBreakpoint.condition))));
         if (exceptionBreakpoint.modeLabel) {
             data.badge.textContent = exceptionBreakpoint.modeLabel;
             data.badge.style.display = 'block';
@@ -521,7 +818,10 @@ class ExceptionBreakpointsRenderer {
         data.actionBar.push(primary, { icon: true, label: false });
         breakpointIdToActionBarDomeNode.set(exceptionBreakpoint.getId(), data.actionBar.domNode);
     }
-    disposeElement(element, index, templateData) {
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -563,7 +863,13 @@ let FunctionBreakpointsRenderer = class FunctionBreakpointsRenderer {
         data.badge = append(badgeContainer, $('span.line-number.monaco-count-badge'));
         return data;
     }
-    renderElement(functionBreakpoint, _index, data) {
+    renderElement(node, _index, data) {
+        this.renderFunctionBreakpoint(node.element, data);
+    }
+    renderCompressedElements(node, _index, data) {
+        this.renderFunctionBreakpoint(node.element.elements[node.element.elements.length - 1], data);
+    }
+    renderFunctionBreakpoint(functionBreakpoint, data) {
         data.context = functionBreakpoint;
         data.name.textContent = functionBreakpoint.name;
         const { icon, message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), functionBreakpoint, this.labelService, this.debugService.getModel());
@@ -573,7 +879,7 @@ let FunctionBreakpointsRenderer = class FunctionBreakpointsRenderer {
         data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, message ? message : ''));
         if (functionBreakpoint.condition && functionBreakpoint.hitCondition) {
             data.condition.textContent = ( localize(
-                6475,
+                6502,
                 "Condition: {0} | Hit Count: {1}",
                 functionBreakpoint.condition,
                 functionBreakpoint.hitCondition
@@ -592,7 +898,7 @@ let FunctionBreakpointsRenderer = class FunctionBreakpointsRenderer {
         const session = this.debugService.getViewModel().focusedSession;
         data.breakpoint.classList.toggle('disabled', (session && !session.capabilities.supportsFunctionBreakpoints) || !this.debugService.getModel().areBreakpointsActivated());
         if (session && !session.capabilities.supportsFunctionBreakpoints) {
-            data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, ( localize(6476, "Function breakpoints are not supported by this debug type"))));
+            data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, ( localize(6503, "Function breakpoints are not supported by this debug type"))));
         }
         this.breakpointSupportsCondition.set(!session || !!session.capabilities.supportsConditionalBreakpoints);
         this.breakpointItemType.set('functionBreakpoint');
@@ -601,7 +907,10 @@ let FunctionBreakpointsRenderer = class FunctionBreakpointsRenderer {
         data.actionBar.push(primary, { icon: true, label: false });
         breakpointIdToActionBarDomeNode.set(functionBreakpoint.getId(), data.actionBar.domNode);
     }
-    disposeElement(element, index, templateData) {
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -651,7 +960,13 @@ let DataBreakpointsRenderer = class DataBreakpointsRenderer {
         data.badge = append(badgeContainer, $('span.line-number.monaco-count-badge'));
         return data;
     }
-    renderElement(dataBreakpoint, _index, data) {
+    renderElement(node, _index, data) {
+        this.renderDataBreakpoint(node.element, data);
+    }
+    renderCompressedElements(node, _index, data) {
+        this.renderDataBreakpoint(node.element.elements[node.element.elements.length - 1], data);
+    }
+    renderDataBreakpoint(dataBreakpoint, data) {
         data.context = dataBreakpoint;
         data.name.textContent = dataBreakpoint.description;
         const { icon, message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), dataBreakpoint, this.labelService, this.debugService.getModel());
@@ -669,10 +984,10 @@ let DataBreakpointsRenderer = class DataBreakpointsRenderer {
         const session = this.debugService.getViewModel().focusedSession;
         data.breakpoint.classList.toggle('disabled', (session && !session.capabilities.supportsDataBreakpoints) || !this.debugService.getModel().areBreakpointsActivated());
         if (session && !session.capabilities.supportsDataBreakpoints) {
-            data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, ( localize(6477, "Data breakpoints are not supported by this debug type"))));
+            data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.breakpoint, ( localize(6504, "Data breakpoints are not supported by this debug type"))));
         }
         if (dataBreakpoint.accessType) {
-            const accessType = dataBreakpoint.accessType === 'read' ? ( localize(6478, "Read")) : dataBreakpoint.accessType === 'write' ? ( localize(6479, "Write")) : ( localize(6480, "Access"));
+            const accessType = dataBreakpoint.accessType === 'read' ? ( localize(6505, "Read")) : dataBreakpoint.accessType === 'write' ? ( localize(6506, "Write")) : ( localize(6507, "Access"));
             data.accessType.textContent = accessType;
         }
         else {
@@ -680,7 +995,7 @@ let DataBreakpointsRenderer = class DataBreakpointsRenderer {
         }
         if (dataBreakpoint.condition && dataBreakpoint.hitCondition) {
             data.condition.textContent = ( localize(
-                6475,
+                6502,
                 "Condition: {0} | Hit Count: {1}",
                 dataBreakpoint.condition,
                 dataBreakpoint.hitCondition
@@ -699,7 +1014,10 @@ let DataBreakpointsRenderer = class DataBreakpointsRenderer {
         breakpointIdToActionBarDomeNode.set(dataBreakpoint.getId(), data.actionBar.domNode);
         this.breakpointIsDataBytes.reset();
     }
-    disposeElement(element, index, templateData) {
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -743,11 +1061,17 @@ let InstructionBreakpointsRenderer = class InstructionBreakpointsRenderer {
         data.badge = append(badgeContainer, $('span.line-number.monaco-count-badge'));
         return data;
     }
-    renderElement(breakpoint, index, data) {
+    renderElement(node, index, data) {
+        this.renderInstructionBreakpoint(node.element, data);
+    }
+    renderCompressedElements(node, index, data) {
+        this.renderInstructionBreakpoint(node.element.elements[node.element.elements.length - 1], data);
+    }
+    renderInstructionBreakpoint(breakpoint, data) {
         data.context = breakpoint;
         data.breakpoint.classList.toggle('disabled', !this.debugService.getModel().areBreakpointsActivated());
         data.name.textContent = '0x' + ( breakpoint.address.toString(16));
-        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.name, ( localize(6481, "Decimal Address: {0}", (breakpoint.address.toString())))));
+        data.elementDisposables.add(this.hoverService.setupManagedHover(getDefaultHoverDelegate('mouse'), data.name, ( localize(6508, "Decimal Address: {0}", (breakpoint.address.toString())))));
         data.checkbox.checked = breakpoint.enabled;
         const { message, icon } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), breakpoint, this.labelService, this.debugService.getModel());
         data.icon.className = ThemeIcon.asClassName(icon);
@@ -764,7 +1088,10 @@ let InstructionBreakpointsRenderer = class InstructionBreakpointsRenderer {
             data.badge.style.display = 'none';
         }
     }
-    disposeElement(element, index, templateData) {
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -853,7 +1180,8 @@ class FunctionBreakpointInputRenderer {
         template.templateDisposables.add(template.elementDisposables);
         return template;
     }
-    renderElement(functionBreakpoint, _index, data) {
+    renderElement(node, _index, data) {
+        const functionBreakpoint = node.element;
         data.breakpoint = functionBreakpoint;
         data.type = this.view.inputBoxData?.type || 'name';
         const { icon, message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), functionBreakpoint, this.labelService, this.debugService.getModel());
@@ -862,21 +1190,21 @@ class FunctionBreakpointInputRenderer {
         data.checkbox.checked = functionBreakpoint.enabled;
         data.checkbox.disabled = true;
         data.inputBox.value = functionBreakpoint.name || '';
-        let placeholder = ( localize(6482, "Function to break on"));
-        let ariaLabel = ( localize(6483, "Type function breakpoint."));
+        let placeholder = ( localize(6509, "Function to break on"));
+        let ariaLabel = ( localize(6510, "Type function breakpoint."));
         if (data.type === 'condition') {
             data.inputBox.value = functionBreakpoint.condition || '';
-            placeholder = ( localize(6484, "Break when expression evaluates to true"));
+            placeholder = ( localize(6511, "Break when expression evaluates to true"));
             ariaLabel = ( localize(
-                6485,
+                6512,
                 "Type expression. Function breakpoint will break when expression evaluates to true"
             ));
         }
         else if (data.type === 'hitCount') {
             data.inputBox.value = functionBreakpoint.hitCondition || '';
-            placeholder = ( localize(6486, "Break when hit count is met"));
+            placeholder = ( localize(6513, "Break when hit count is met"));
             ariaLabel = ( localize(
-                6487,
+                6514,
                 "Type hit count. Function breakpoint will break when hit count is met."
             ));
         }
@@ -887,7 +1215,12 @@ class FunctionBreakpointInputRenderer {
             data.inputBox.select();
         }, 0);
     }
-    disposeElement(element, index, templateData) {
+    renderCompressedElements(node, _index, data) {
+    }
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -963,7 +1296,8 @@ class DataBreakpointInputRenderer {
         template.templateDisposables.add(template.elementDisposables);
         return template;
     }
-    renderElement(dataBreakpoint, _index, data) {
+    renderElement(node, _index, data) {
+        const dataBreakpoint = node.element;
         data.breakpoint = dataBreakpoint;
         data.type = this.view.inputBoxData?.type || 'condition';
         const { icon, message } = getBreakpointMessageAndIcon(this.debugService.state, this.debugService.getModel().areBreakpointsActivated(), dataBreakpoint, this.labelService, this.debugService.getModel());
@@ -976,16 +1310,16 @@ class DataBreakpointInputRenderer {
         let ariaLabel = '';
         if (data.type === 'condition') {
             data.inputBox.value = dataBreakpoint.condition || '';
-            placeholder = ( localize(6488, "Break when expression evaluates to true"));
+            placeholder = ( localize(6515, "Break when expression evaluates to true"));
             ariaLabel = ( localize(
-                6489,
+                6516,
                 "Type expression. Data breakpoint will break when expression evaluates to true"
             ));
         }
         else if (data.type === 'hitCount') {
             data.inputBox.value = dataBreakpoint.hitCondition || '';
-            placeholder = ( localize(6490, "Break when hit count is met"));
-            ariaLabel = ( localize(6491, "Type hit count. Data breakpoint will break when hit count is met."));
+            placeholder = ( localize(6517, "Break when hit count is met"));
+            ariaLabel = ( localize(6518, "Type hit count. Data breakpoint will break when hit count is met."));
         }
         data.inputBox.setAriaLabel(ariaLabel);
         data.inputBox.setPlaceHolder(placeholder);
@@ -994,7 +1328,12 @@ class DataBreakpointInputRenderer {
             data.inputBox.select();
         }, 0);
     }
-    disposeElement(element, index, templateData) {
+    renderCompressedElements(node, _index, data) {
+    }
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -1020,7 +1359,7 @@ class ExceptionBreakpointInputRenderer {
         this.view.breakpointInputFocused.set(true);
         const inputBoxContainer = append(breakpoint, $('.inputBoxContainer'));
         const inputBox = ( new InputBox(inputBoxContainer, this.contextViewService, {
-            ariaLabel: ( localize(6492, "Type exception breakpoint condition")),
+            ariaLabel: ( localize(6519, "Type exception breakpoint condition")),
             inputBoxStyles: defaultInputBoxStyles
         }));
         toDispose.add(inputBox);
@@ -1059,8 +1398,9 @@ class ExceptionBreakpointInputRenderer {
         };
         return templateData;
     }
-    renderElement(exceptionBreakpoint, _index, data) {
-        const placeHolder = exceptionBreakpoint.conditionDescription || ( localize(6493, "Break when expression evaluates to true"));
+    renderElement(node, _index, data) {
+        const exceptionBreakpoint = node.element;
+        const placeHolder = exceptionBreakpoint.conditionDescription || ( localize(6520, "Break when expression evaluates to true"));
         data.inputBox.setPlaceHolder(placeHolder);
         data.currentBreakpoint = exceptionBreakpoint;
         data.checkbox.checked = exceptionBreakpoint.enabled;
@@ -1071,7 +1411,12 @@ class ExceptionBreakpointInputRenderer {
             data.inputBox.select();
         }, 0);
     }
-    disposeElement(element, index, templateData) {
+    renderCompressedElements(node, _index, data) {
+    }
+    disposeElement(node, index, templateData) {
+        templateData.elementDisposables.clear();
+    }
+    disposeCompressedElements(node, index, templateData) {
         templateData.elementDisposables.clear();
     }
     disposeTemplate(templateData) {
@@ -1084,15 +1429,26 @@ class BreakpointsAccessibilityProvider {
         this.labelService = labelService;
     }
     getWidgetAriaLabel() {
-        return localize(6494, "Breakpoints");
+        return localize(6521, "Breakpoints");
     }
     getRole() {
         return 'checkbox';
     }
-    isChecked(breakpoint) {
-        return breakpoint.enabled;
+    isChecked(element) {
+        if (element instanceof BreakpointsFolderItem) {
+            return element.enabled;
+        }
+        return element.enabled;
     }
     getAriaLabel(element) {
+        if (element instanceof BreakpointsFolderItem) {
+            return localize(
+                6522,
+                "Breakpoints in {0}, {1} breakpoints",
+                basenameOrAuthority(element.uri),
+                element.breakpoints.length
+            );
+        }
         if (element instanceof ExceptionBreakpoint) {
             return ( element.toString());
         }
@@ -1133,11 +1489,11 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
     if (!breakpoint$1.enabled || !breakpointsActivated) {
         return {
             icon: breakpointIcon.disabled,
-            message: breakpoint$1.logMessage ? ( localize(6495, "Disabled Logpoint")) : ( localize(6496, "Disabled Breakpoint")),
+            message: breakpoint$1.logMessage ? ( localize(6523, "Disabled Logpoint")) : ( localize(6524, "Disabled Breakpoint")),
         };
     }
     const appendMessage = (text) => {
-        return ('message' in breakpoint$1 && breakpoint$1.message) ? text.concat(', ' + breakpoint$1.message) : text;
+        return breakpoint$1.message ? text.concat(', ' + breakpoint$1.message) : text;
     };
     if (debugActive && breakpoint$1 instanceof Breakpoint && breakpoint$1.pending) {
         return {
@@ -1147,7 +1503,7 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
     if (debugActive && !breakpoint$1.verified) {
         return {
             icon: breakpointIcon.unverified,
-            message: ('message' in breakpoint$1 && breakpoint$1.message) ? breakpoint$1.message : (breakpoint$1.logMessage ? ( localize(6497, "Unverified Logpoint")) : ( localize(6498, "Unverified Breakpoint"))),
+            message: breakpoint$1.message ? breakpoint$1.message : (breakpoint$1.logMessage ? ( localize(6525, "Unverified Logpoint")) : ( localize(6526, "Unverified Breakpoint"))),
             showAdapterUnverifiedMessage: true
         };
     }
@@ -1155,28 +1511,28 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
         if (!breakpoint$1.supported) {
             return {
                 icon: breakpointIcon.unverified,
-                message: ( localize(6499, "Data breakpoints not supported by this debug type")),
+                message: ( localize(6527, "Data breakpoints not supported by this debug type")),
             };
         }
         return {
             icon: breakpointIcon.regular,
-            message: breakpoint$1.message || ( localize(6500, "Data Breakpoint"))
+            message: breakpoint$1.message || ( localize(6528, "Data Breakpoint"))
         };
     }
     if (breakpoint$1 instanceof FunctionBreakpoint) {
         if (!breakpoint$1.supported) {
             return {
                 icon: breakpointIcon.unverified,
-                message: ( localize(6501, "Function breakpoints not supported by this debug type")),
+                message: ( localize(6529, "Function breakpoints not supported by this debug type")),
             };
         }
         const messages = [];
-        messages.push(breakpoint$1.message || ( localize(6502, "Function Breakpoint")));
+        messages.push(breakpoint$1.message || ( localize(6530, "Function Breakpoint")));
         if (breakpoint$1.condition) {
-            messages.push(( localize(6503, "Condition: {0}", breakpoint$1.condition)));
+            messages.push(( localize(6531, "Condition: {0}", breakpoint$1.condition)));
         }
         if (breakpoint$1.hitCondition) {
-            messages.push(( localize(6504, "Hit Count: {0}", breakpoint$1.hitCondition)));
+            messages.push(( localize(6532, "Hit Count: {0}", breakpoint$1.hitCondition)));
         }
         return {
             icon: breakpointIcon.regular,
@@ -1187,7 +1543,7 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
         if (!breakpoint$1.supported) {
             return {
                 icon: breakpointIcon.unverified,
-                message: ( localize(6505, "Instruction breakpoints not supported by this debug type")),
+                message: ( localize(6533, "Instruction breakpoints not supported by this debug type")),
             };
         }
         const messages = [];
@@ -1196,16 +1552,16 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
         }
         else if (breakpoint$1.instructionReference) {
             messages.push(( localize(
-                6506,
+                6534,
                 "Instruction breakpoint at address {0}",
                 breakpoint$1.instructionReference
             )));
         }
         else {
-            messages.push(( localize(6507, "Instruction breakpoint")));
+            messages.push(( localize(6535, "Instruction breakpoint")));
         }
         if (breakpoint$1.hitCondition) {
-            messages.push(( localize(6504, "Hit Count: {0}", breakpoint$1.hitCondition)));
+            messages.push(( localize(6532, "Hit Count: {0}", breakpoint$1.hitCondition)));
         }
         return {
             icon: breakpointIcon.regular,
@@ -1221,20 +1577,20 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
         let icon = breakpoint$1.logMessage ? logBreakpoint.regular : conditionalBreakpoint.regular;
         if (!breakpoint$1.supported) {
             icon = debugBreakpointUnsupported;
-            messages.push(( localize(6508, "Breakpoints of this type are not supported by the debugger")));
+            messages.push(( localize(6536, "Breakpoints of this type are not supported by the debugger")));
         }
         if (breakpoint$1.logMessage) {
-            messages.push(( localize(6509, "Log Message: {0}", breakpoint$1.logMessage)));
+            messages.push(( localize(6537, "Log Message: {0}", breakpoint$1.logMessage)));
         }
         if (breakpoint$1.condition) {
-            messages.push(( localize(6503, "Condition: {0}", breakpoint$1.condition)));
+            messages.push(( localize(6531, "Condition: {0}", breakpoint$1.condition)));
         }
         if (breakpoint$1.hitCondition) {
-            messages.push(( localize(6504, "Hit Count: {0}", breakpoint$1.hitCondition)));
+            messages.push(( localize(6532, "Hit Count: {0}", breakpoint$1.hitCondition)));
         }
         if (triggeringBreakpoint) {
             messages.push(( localize(
-                6510,
+                6538,
                 "Hit after breakpoint: {0}",
                 `${labelService.getUriLabel(triggeringBreakpoint.uri, { relative: true })}: ${triggeringBreakpoint.lineNumber}`
             )));
@@ -1244,7 +1600,7 @@ function getBreakpointMessageAndIcon(state, breakpointsActivated, breakpoint$1,
             message: appendMessage(messages.join('\n'))
         };
     }
-    const message = ('message' in breakpoint$1 && breakpoint$1.message) ? breakpoint$1.message : breakpoint$1 instanceof Breakpoint && labelService ? labelService.getUriLabel(breakpoint$1.uri) : ( localize(6511, "Breakpoint"));
+    const message = breakpoint$1.message ? breakpoint$1.message : breakpoint$1 instanceof Breakpoint && labelService ? labelService.getUriLabel(breakpoint$1.uri) : ( localize(6539, "Breakpoint"));
     return {
         icon: breakpointIcon.regular,
         message
@@ -1255,8 +1611,8 @@ registerAction2(class extends Action2 {
         super({
             id: 'workbench.debug.viewlet.action.addFunctionBreakpointAction',
             title: {
-                ...( localize2(6512, "Add Function Breakpoint")),
-                mnemonicTitle: ( localize(6513, "&&Function Breakpoint...")),
+                ...( localize2(6540, "Add Function Breakpoint")),
+                mnemonicTitle: ( localize(6541, "&&Function Breakpoint...")),
             },
             f1: true,
             icon: watchExpressionsAddFuncBreakpoint,
@@ -1303,7 +1659,7 @@ class MemoryBreakpointAction extends Action2 {
         }
         catch (e) {
             notifications.error(( localize(
-                6514,
+                6542,
                 "Failed to set data breakpoint at {0}: {1}",
                 range.address,
                 e.message
@@ -1315,7 +1671,7 @@ class MemoryBreakpointAction extends Action2 {
         let accessType = 'write';
         if (info.accessTypes && info.accessTypes?.length > 1) {
             const accessTypes = ( info.accessTypes.map(type => ({ label: type })));
-            const selectedAccessType = await quickInput.pick(accessTypes, { placeHolder: ( localize(6515, "Select the access type to monitor")) });
+            const selectedAccessType = await quickInput.pick(accessTypes, { placeHolder: ( localize(6543, "Select the access type to monitor")) });
             if (!selectedAccessType) {
                 return;
             }
@@ -1338,9 +1694,9 @@ class MemoryBreakpointAction extends Action2 {
         return (new Promise(resolve => {
             const disposables = ( new DisposableStore());
             const input = disposables.add(quickInput.createInputBox());
-            input.prompt = ( localize(6516, "Enter a memory range in which to break"));
+            input.prompt = ( localize(6544, "Enter a memory range in which to break"));
             input.placeholder = ( localize(
-                6517,
+                6545,
                 'Absolute range (0x1234 - 0x1300) or range of bytes after an address (0x1234 + 0xff)'
             ));
             if (defaultValue) {
@@ -1353,7 +1709,7 @@ class MemoryBreakpointAction extends Action2 {
             }));
             disposables.add(input.onDidAccept(() => {
                 const r = this.parseAddress(input.value, true);
-                if ('error' in r) {
+                if (hasKey(r, { error: true })) {
                     input.validationMessage = r.error;
                 }
                 else {
@@ -1373,7 +1729,7 @@ class MemoryBreakpointAction extends Action2 {
         const parts = /^(\S+)\s*(?:([+-])\s*(\S+))?/.exec(range);
         if (!parts) {
             return { error: ( localize(
-                6518,
+                6546,
                 'Address should be a range of numbers the form "[Start] - [End]" or "[Start] + [Bytes]"'
             )) };
         }
@@ -1382,7 +1738,7 @@ class MemoryBreakpointAction extends Action2 {
         for (const n of [startStr, endStr]) {
             if (!isNum(n)) {
                 return { error: ( localize(
-                    6519,
+                    6547,
                     'Number must be a decimal integer or hex value starting with \"0x\", got {0}',
                     n
                 )) };
@@ -1396,7 +1752,7 @@ class MemoryBreakpointAction extends Action2 {
         const address = `0x${( start.toString(16))}`;
         if (sign === '-') {
             if (start > end) {
-                return { error: ( localize(6520, 'End ({1}) should be greater than Start ({0})', startStr, endStr)) };
+                return { error: ( localize(6548, 'End ({1}) should be greater than Start ({0})', startStr, endStr)) };
             }
             return { address, bytes: Number(end - start) };
         }
@@ -1408,8 +1764,8 @@ registerAction2(class extends MemoryBreakpointAction {
         super({
             id: 'workbench.debug.viewlet.action.addDataBreakpointOnAddress',
             title: {
-                ...( localize2(6521, "Add Data Breakpoint at Address")),
-                mnemonicTitle: ( localize(6522, "&&Data Breakpoint...")),
+                ...( localize2(6549, "Add Data Breakpoint at Address")),
+                mnemonicTitle: ( localize(6550, "&&Data Breakpoint...")),
             },
             f1: true,
             icon: watchExpressionsAddDataBreakpoint,
@@ -1431,7 +1787,7 @@ registerAction2(class extends MemoryBreakpointAction {
     constructor() {
         super({
             id: 'workbench.debug.viewlet.action.editDataBreakpointOnAddress',
-            title: ( localize2(6523, "Edit Address...")),
+            title: ( localize2(6551, "Edit Address...")),
             menu: [{
                     id: MenuId.DebugBreakpointsContext,
                     when: ( ContextKeyExpr.and(
@@ -1448,7 +1804,7 @@ registerAction2(class extends Action2 {
     constructor() {
         super({
             id: 'workbench.debug.viewlet.action.toggleBreakpointsActivatedAction',
-            title: ( localize2(6524, 'Toggle Activate Breakpoints')),
+            title: ( localize2(6552, 'Toggle Activate Breakpoints')),
             f1: true,
             icon: breakpointsActivate,
             menu: {
@@ -1468,7 +1824,7 @@ registerAction2(class extends Action2 {
     constructor() {
         super({
             id: 'workbench.debug.viewlet.action.removeBreakpoint',
-            title: ( localize(6525, "Remove Breakpoint")),
+            title: ( localize(6553, "Remove Breakpoint")),
             icon: Codicon.removeClose,
             menu: [{
                     id: MenuId.DebugBreakpointsContext,
@@ -1504,8 +1860,8 @@ registerAction2(class extends Action2 {
         super({
             id: 'workbench.debug.viewlet.action.removeAllBreakpoints',
             title: {
-                ...( localize2(6526, "Remove All Breakpoints")),
-                mnemonicTitle: ( localize(6527, "Remove &&All Breakpoints")),
+                ...( localize2(6554, "Remove All Breakpoints")),
+                mnemonicTitle: ( localize(6555, "Remove &&All Breakpoints")),
             },
             f1: true,
             icon: breakpointsRemoveAll,
@@ -1540,8 +1896,8 @@ registerAction2(class extends Action2 {
         super({
             id: 'workbench.debug.viewlet.action.enableAllBreakpoints',
             title: {
-                ...( localize2(6528, "Enable All Breakpoints")),
-                mnemonicTitle: ( localize(6529, "&&Enable All Breakpoints")),
+                ...( localize2(6556, "Enable All Breakpoints")),
+                mnemonicTitle: ( localize(6557, "&&Enable All Breakpoints")),
             },
             f1: true,
             precondition: CONTEXT_DEBUGGERS_AVAILABLE,
@@ -1568,8 +1924,8 @@ registerAction2(class extends Action2 {
         super({
             id: 'workbench.debug.viewlet.action.disableAllBreakpoints',
             title: {
-                ...( localize2(6530, "Disable All Breakpoints")),
-                mnemonicTitle: ( localize(6531, "Disable A&&ll Breakpoints")),
+                ...( localize2(6558, "Disable All Breakpoints")),
+                mnemonicTitle: ( localize(6559, "Disable A&&ll Breakpoints")),
             },
             f1: true,
             precondition: CONTEXT_DEBUGGERS_AVAILABLE,
@@ -1595,7 +1951,7 @@ registerAction2(class extends Action2 {
     constructor() {
         super({
             id: 'workbench.debug.viewlet.action.reapplyBreakpointsAction',
-            title: ( localize2(6532, 'Reapply All Breakpoints')),
+            title: ( localize2(6560, 'Reapply All Breakpoints')),
             f1: true,
             precondition: CONTEXT_IN_DEBUG_MODE,
             menu: [{
@@ -1611,12 +1967,34 @@ registerAction2(class extends Action2 {
         await debugService.setBreakpointsActivated(true);
     }
 });
+registerAction2(class extends Action2 {
+    constructor() {
+        super({
+            id: 'workbench.debug.viewlet.action.toggleBreakpointsPresentation',
+            title: ( localize2(6561, "Toggle Breakpoints View Presentation")),
+            f1: true,
+            icon: breakpointsViewIcon,
+            menu: {
+                id: MenuId.ViewTitle,
+                group: 'navigation',
+                order: 10,
+                when: ( ContextKeyExpr.equals('view', BREAKPOINTS_VIEW_ID))
+            }
+        });
+    }
+    async run(accessor) {
+        const configurationService = accessor.get(IConfigurationService);
+        const currentPresentation = configurationService.getValue('debug.breakpointsView.presentation');
+        const newPresentation = currentPresentation === 'tree' ? 'list' : 'tree';
+        await configurationService.updateValue('debug.breakpointsView.presentation', newPresentation);
+    }
+});
 registerAction2(class extends ViewAction {
     constructor() {
         super({
             id: 'debug.editBreakpoint',
             viewId: BREAKPOINTS_VIEW_ID,
-            title: ( localize(6533, "Edit Condition...")),
+            title: ( localize(6562, "Edit Condition...")),
             icon: Codicon.edit,
             precondition: CONTEXT_BREAKPOINT_SUPPORTS_CONDITION,
             menu: [{
@@ -1645,8 +2023,8 @@ registerAction2(class extends ViewAction {
         }
         else if (breakpoint instanceof FunctionBreakpoint) {
             const contextMenuService = accessor.get(IContextMenuService);
-            const actions = [( new Action('breakpoint.editCondition', ( localize(6533, "Edit Condition...")), undefined, true, async () => view.renderInputBox({ breakpoint, type: 'condition' }))),
-                ( new Action('breakpoint.editCondition', ( localize(6534, "Edit Hit Count...")), undefined, true, async () => view.renderInputBox({ breakpoint, type: 'hitCount' })))];
+            const actions = [( new Action('breakpoint.editCondition', ( localize(6562, "Edit Condition...")), undefined, true, async () => view.renderInputBox({ breakpoint, type: 'condition' }))),
+                ( new Action('breakpoint.editCondition', ( localize(6563, "Edit Hit Count...")), undefined, true, async () => view.renderInputBox({ breakpoint, type: 'hitCount' })))];
             const domNode = breakpointIdToActionBarDomeNode.get(breakpoint.getId());
             if (domNode) {
                 contextMenuService.showContextMenu({
@@ -1666,7 +2044,7 @@ registerAction2(class extends ViewAction {
         super({
             id: 'debug.editFunctionBreakpoint',
             viewId: BREAKPOINTS_VIEW_ID,
-            title: ( localize(6535, "Edit Function Condition...")),
+            title: ( localize(6564, "Edit Function Condition...")),
             menu: [{
                     id: MenuId.DebugBreakpointsContext,
                     group: 'navigation',
@@ -1684,7 +2062,7 @@ registerAction2(class extends ViewAction {
         super({
             id: 'debug.editFunctionBreakpointHitCount',
             viewId: BREAKPOINTS_VIEW_ID,
-            title: ( localize(6534, "Edit Hit Count...")),
+            title: ( localize(6563, "Edit Hit Count...")),
             precondition: CONTEXT_BREAKPOINT_SUPPORTS_CONDITION,
             menu: [{
                     id: MenuId.DebugBreakpointsContext,
@@ -1703,7 +2081,7 @@ registerAction2(class extends ViewAction {
         super({
             id: 'debug.editBreakpointMode',
             viewId: BREAKPOINTS_VIEW_ID,
-            title: ( localize(6536, "Edit Mode...")),
+            title: ( localize(6565, "Edit Mode...")),
             menu: [{
                     id: MenuId.DebugBreakpointsContext,
                     group: 'navigation',
@@ -1718,7 +2096,7 @@ registerAction2(class extends ViewAction {
         const modes = debugService.getModel().getBreakpointModes(kind);
         const picked = await accessor.get(IQuickInputService).pick(( modes.map(
             mode => ({ label: mode.label, description: mode.description, mode: mode.mode })
-        )), { placeHolder: ( localize(6537, "Select Breakpoint Mode")) });
+        )), { placeHolder: ( localize(6566, "Select Breakpoint Mode")) });
         if (!picked) {
             return;
         }
@@ -1739,4 +2117,4 @@ registerAction2(class extends ViewAction {
     }
 });
 
-export { BreakpointsView, getBreakpointMessageAndIcon, getExpandedBodySize, openBreakpointSource };
+export { BreakpointsFolderItem, BreakpointsView, getBreakpointMessageAndIcon, openBreakpointSource };