breakpoints view: render edit action inline for exception breakpoints

src/vs/workbench/contrib/debug/browser/breakpointsView.ts

@@ -38,8 +38,10 @@ import * as icons from 'vs/workbench/contrib/debug/browser/debugIcons';
 import { registerAction2, Action2, MenuId, IMenu, IMenuService } from 'vs/platform/actions/common/actions';
 import { localize } from 'vs/nls';
 import { ServicesAccessor } from 'vs/editor/browser/editorExtensions';
-import { createAndFillInContextMenuActions } from 'vs/platform/actions/browser/menuEntryActionViewItem';
+import { createAndFillInContextMenuActions, createAndFillInActionBarActions } from 'vs/platform/actions/browser/menuEntryActionViewItem';
 import { isCodeEditor } from 'vs/editor/browser/editorBrowser';
+import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
+import { Codicon } from 'vs/base/common/codicons';
 
 const $ = dom.$;
 
@@ -109,7 +111,7 @@ export class BreakpointsView extends ViewPane {
 
 		this.list = <WorkbenchList<BreakpointItem>>this.instantiationService.createInstance(WorkbenchList, 'Breakpoints', container, delegate, [
 			this.instantiationService.createInstance(BreakpointsRenderer),
-			new ExceptionBreakpointsRenderer(this.debugService),
+			new ExceptionBreakpointsRenderer(this.menu, this.debugService),
 			new ExceptionBreakpointInputRenderer(this.debugService, this.contextViewService, this.themeService),
 			this.instantiationService.createInstance(FunctionBreakpointsRenderer),
 			this.instantiationService.createInstance(DataBreakpointsRenderer),
@@ -202,12 +204,12 @@ export class BreakpointsView extends ViewPane {
 		this.breakpointItemType.set(type);
 		this.exceptionBreakpointSupportsCondition.set(element instanceof ExceptionBreakpoint && element.supportsCondition);
 
-		const actions: IAction[] = [];
-		const actionsDisposable = createAndFillInContextMenuActions(this.menu, { arg: e.element, shouldForwardArgs: false }, actions);
+		const secondary: IAction[] = [];
+		const actionsDisposable = createAndFillInContextMenuActions(this.menu, { arg: e.element, shouldForwardArgs: false }, { primary: [], secondary }, g => /^inline/.test(g));
 
 		this.contextMenuService.showContextMenu({
 			getAnchor: () => e.anchor,
-			getActions: () => actions,
+			getActions: () => secondary,
 			getActionsContext: () => element,
 			onHide: () => dispose(actionsDisposable)
 		});
@@ -289,7 +291,9 @@ interface IBaseBreakpointTemplateData {
 	name: HTMLElement;
 	checkbox: HTMLInputElement;
 	context: BreakpointItem;
+	actionBar: ActionBar;
 	toDispose: IDisposable[];
+	elementDisposable: IDisposable[];
 }
 
 interface IBaseBreakpointWithIconTemplateData extends IBaseBreakpointTemplateData {
@@ -390,6 +394,7 @@ class BreakpointsRenderer implements IListRenderer<IBreakpoint, IBreakpointTempl
 class ExceptionBreakpointsRenderer implements IListRenderer<IExceptionBreakpoint, IExceptionBreakpointTemplateData> {
 
 	constructor(
+		private menu: IMenu,
 		private debugService: IDebugService
 	) {
 		// noop
@@ -407,6 +412,7 @@ class ExceptionBreakpointsRenderer implements IListRenderer<IExceptionBreakpoint
 
 		data.checkbox = createCheckbox();
 		data.toDispose = [];
+		data.elementDisposable = [];
 		data.toDispose.push(dom.addStandardDisposableListener(data.checkbox, 'change', (e) => {
 			this.debugService.enableOrDisableBreakpoints(!data.context.enabled, data.context);
 		}));
@@ -417,6 +423,8 @@ class ExceptionBreakpointsRenderer implements IListRenderer<IExceptionBreakpoint
 		data.condition = dom.append(data.breakpoint, $('span.condition'));
 		data.breakpoint.classList.add('exception');
 
+		data.actionBar = new ActionBar(data.breakpoint);
+		data.toDispose.push(data.actionBar);
 		return data;
 	}
 
@@ -427,6 +435,15 @@ class ExceptionBreakpointsRenderer implements IListRenderer<IExceptionBreakpoint
 		data.checkbox.checked = exceptionBreakpoint.enabled;
 		data.condition.textContent = exceptionBreakpoint.condition || '';
 		data.condition.title = localize('expressionCondition', "Expression condition: {0}", exceptionBreakpoint.condition);
+
+		const primary: IAction[] = [];
+		data.elementDisposable.push(createAndFillInActionBarActions(this.menu, { arg: exceptionBreakpoint, shouldForwardArgs: true }, { primary, secondary: [] }, g => /^inline/.test(g)));
+		data.actionBar.clear();
+		data.actionBar.push(primary, { icon: true, label: false });
+	}
+
+	disposeElement(_element: IExceptionBreakpoint, _index: number, templateData: IExceptionBreakpointTemplateData): void {
+		dispose(templateData.elementDisposable);
 	}
 
 	disposeTemplate(templateData: IExceptionBreakpointTemplateData): void {
@@ -1067,12 +1084,17 @@ registerAction2(class extends Action2 {
 	constructor() {
 		super({
 			id: 'workbench.action.debug.editExceptionBreakpointCondition',
-			title: localize('editCondition', "Edit Condition"),
+			title: localize('editCondition', "Edit Condition..."),
+			icon: Codicon.edit,
 			menu: [{
 				id: MenuId.DebugBreakpointsContext,
 				group: 'navigation',
 				order: 10,
-				when: CONTEXT_EXCEPTION_BREAKPOINT_SUPPORTS_CONDITION
+				when: ContextKeyExpr.and(CONTEXT_EXCEPTION_BREAKPOINT_SUPPORTS_CONDITION, CONTEXT_BREAKPOINT_ITEM_TYPE.isEqualTo('exceptionBreakpoint'))
+			}, {
+				id: MenuId.DebugBreakpointsContext,
+				group: 'inline',
+				order: 10,
 			}]
 		});
 	}

src/vs/workbench/contrib/debug/browser/media/debugViewlet.css

@@ -144,22 +144,22 @@
 	display: none;
 }
 
-.debug-pane .debug-call-stack .monaco-list-row .monaco-action-bar {
+.debug-pane .monaco-list-row .monaco-action-bar {
 	display: none;
 	flex-shrink: 0;
 	margin-right: 1px;
 }
 
-.debug-pane .debug-call-stack .monaco-list-row:hover .monaco-action-bar {
+.debug-pane .monaco-list-row:hover .monaco-action-bar {
 	display: initial;
 }
 
-.debug-pane .debug-call-stack .session .codicon {
+.debug-pane .session .codicon {
 	line-height: 22px;
 	margin-right: 2px;
 }
 
-.monaco-workbench  .debug-pane .debug-call-stack .monaco-action-bar .action-item > .action-label {
+.monaco-workbench .debug-pane .monaco-action-bar .action-item > .action-label {
 	width: 16px;
 	height: 100%;
 	line-height: 22px;