Skip to content

Commit 178f09f

Browse files
bpaserobpasero
authored
agent sessions - session card visual updates (#279967)
1 parent c426bc9 commit 178f09f

File tree

11 files changed

+60
-46
lines changed

11 files changed

+60
-46
lines changed

‎src/vs/workbench/contrib/chat/browser/actions/chatActions.ts‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -514,7 +514,7 @@ export function registerChatActions() {
514514
id: MenuId.ViewTitle,
515515
when: ContextKeyExpr.and(
516516
ContextKeyExpr.equals('view', ChatViewId),
517-
ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewSessionsEnabled}`, false)
517+
ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewRecentSessionsEnabled}`, false)
518518
),
519519
group: 'navigation',
520520
order: 2
@@ -523,7 +523,7 @@ export function registerChatActions() {
523523
id: MenuId.ViewTitle,
524524
when: ContextKeyExpr.and(
525525
ContextKeyExpr.equals('view', ChatViewId),
526-
ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewSessionsEnabled}`, true)
526+
ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewRecentSessionsEnabled}`, true)
527527
),
528528
group: '2_history',
529529
order: 1
@@ -1842,11 +1842,11 @@ registerAction2(class EditToolApproval extends Action2 {
18421842
registerAction2(class ToggleChatHistoryVisibilityAction extends Action2 {
18431843
constructor() {
18441844
super({
1845-
id: 'workbench.action.chat.toggleEmptyChatViewSessions',
1846-
title: localize2('chat.toggleEmptyChatViewSessions.label', "Show Agent Sessions"),
1845+
id: 'workbench.action.chat.toggleEmptyChatViewRecentSessions',
1846+
title: localize2('chat.toggleEmptyChatViewRecentSessions.label', "Show Recent Agent Sessions"),
18471847
category: CHAT_CATEGORY,
18481848
precondition: ChatContextKeys.enabled,
1849-
toggled: ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewSessionsEnabled}`, true),
1849+
toggled: ContextKeyExpr.equals(`config.${ChatConfiguration.EmptyChatViewRecentSessionsEnabled}`, true),
18501850
menu: {
18511851
id: MenuId.ChatWelcomeContext,
18521852
group: '1_modify',
@@ -1858,7 +1858,7 @@ registerAction2(class ToggleChatHistoryVisibilityAction extends Action2 {
18581858
async run(accessor: ServicesAccessor): Promise<void> {
18591859
const configurationService = accessor.get(IConfigurationService);
18601860

1861-
const emptyChatViewSessionsEnabled = configurationService.getValue<boolean>(ChatConfiguration.EmptyChatViewSessionsEnabled);
1862-
await configurationService.updateValue(ChatConfiguration.EmptyChatViewSessionsEnabled, !emptyChatViewSessionsEnabled);
1861+
const emptyChatViewRecentSessionsEnabled = configurationService.getValue<boolean>(ChatConfiguration.EmptyChatViewRecentSessionsEnabled);
1862+
await configurationService.updateValue(ChatConfiguration.EmptyChatViewRecentSessionsEnabled, !emptyChatViewRecentSessionsEnabled);
18631863
}
18641864
});

‎src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsActions.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ registerAction2(class extends Action2 {
9797
super({
9898
id: 'agentSession.unarchive',
9999
title: localize('unarchive', "Unarchive"),
100-
icon: Codicon.discard,
100+
icon: Codicon.inbox,
101101
menu: {
102102
id: MenuId.AgentSessionItemToolbar,
103103
group: 'navigation',

‎src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsControl.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,11 @@ import { IMarshalledChatSessionContext } from '../actions/chatSessionActions.js'
3232
import { distinct } from '../../../../../base/common/arrays.js';
3333
import { IAgentSessionsService } from './agentSessionsService.js';
3434
import { ITelemetryService } from '../../../../../platform/telemetry/common/telemetry.js';
35+
import { IListStyles } from '../../../../../base/browser/ui/list/listWidget.js';
36+
import { IStyleOverride } from '../../../../../platform/theme/browser/defaultStyles.js';
3537

3638
export interface IAgentSessionsControlOptions {
39+
readonly overrideStyles?: IStyleOverride<IListStyles>;
3740
readonly filter?: IAgentSessionsFilter;
3841
readonly allowNewSessionFromEmptySpace?: boolean;
3942
readonly allowOpenSessionsInPanel?: boolean;
@@ -102,6 +105,7 @@ export class AgentSessionsControl extends Disposable {
102105
defaultFindMode: TreeFindMode.Filter,
103106
keyboardNavigationLabelProvider: new AgentSessionsKeyboardNavigationLabelProvider(),
104107
sorter,
108+
overrideStyles: this.options?.overrideStyles,
105109
paddingBottom: this.options?.allowNewSessionFromEmptySpace ? AgentSessionsListDelegate.ITEM_HEIGHT : undefined,
106110
twistieAdditionalCssClass: () => 'force-no-twistie',
107111
}

‎src/vs/workbench/contrib/chat/browser/agentSessions/agentSessionsViewer.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -181,7 +181,7 @@ export class AgentSessionRenderer implements ICompressibleTreeRenderer<IAgentSes
181181
return Codicon.error;
182182
}
183183

184-
return session.icon;
184+
return Codicon.pass;
185185
}
186186

187187
private renderDescription(session: ITreeNode<IAgentSession, FuzzyScore>, template: IAgentSessionItemTemplate): void {
@@ -244,7 +244,7 @@ export class AgentSessionRenderer implements ICompressibleTreeRenderer<IAgentSes
244244
}
245245

246246
if (!timeLabel) {
247-
timeLabel = fromNow(session.timing.endTime || session.timing.startTime, true);
247+
timeLabel = fromNow(session.timing.endTime || session.timing.startTime);
248248
}
249249
return `${session.providerLabel} • ${timeLabel}`;
250250
};
@@ -295,7 +295,7 @@ export class AgentSessionRenderer implements ICompressibleTreeRenderer<IAgentSes
295295

296296
export class AgentSessionsListDelegate implements IListVirtualDelegate<IAgentSession> {
297297

298-
static readonly ITEM_HEIGHT = 44;
298+
static readonly ITEM_HEIGHT = 52;
299299

300300
getHeight(element: IAgentSession): number {
301301
return AgentSessionsListDelegate.ITEM_HEIGHT;

‎src/vs/workbench/contrib/chat/browser/agentSessions/media/agentsessionsactions.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
.agent-sessions-viewer .agent-session-item .agent-session-details-toolbar {
77

88
.monaco-action-bar .actions-container .action-item .action-label {
9+
background-color: var(--vscode-toolbar-hoverBackground);
910
padding: 0;
1011
}
1112

‎src/vs/workbench/contrib/chat/browser/agentSessions/media/agentsessionsviewer.css‎

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -32,13 +32,13 @@
3232
}
3333

3434
.monaco-list-row .agent-session-title-toolbar .monaco-toolbar .action-label {
35-
padding: 2px 3px; /* limit padding top/bottom to preserve our 20px line-height per row */
35+
padding: 0; /* limit padding top/bottom to preserve line-height per row */
3636
}
3737

3838
.agent-session-item {
3939
display: flex;
4040
flex-direction: row;
41-
padding: 0 8px;
41+
padding: 8px;
4242

4343
.agent-session-main-col,
4444
.agent-session-title-row,
@@ -50,33 +50,29 @@
5050
.agent-session-icon-col {
5151
display: flex;
5252
align-items: flex-start;
53-
padding-top: 5px;
5453

5554
.agent-session-icon {
5655
flex-shrink: 0;
57-
width: 16px;
58-
height: 16px;
5956
font-size: 16px;
60-
61-
&.codicon-terminal {
62-
font-size: 15px; /* TODO@bpasero remove once we settle on icon */
63-
}
6457
}
6558
}
6659

60+
.agent-session-main-col {
61+
padding-left: 8px;
62+
}
63+
6764
.agent-session-title-row,
6865
.agent-session-details-row {
6966
display: flex;
7067
align-items: center;
71-
line-height: 20px; /* ends up as 22px with the padding below */
68+
line-height: 16px;
7269
}
7370

7471
.agent-session-title-row {
75-
padding: 2px 6px 0 6px;
72+
padding-bottom: 4px;
7673
}
7774

7875
.agent-session-details-row {
79-
padding: 0 6px 2px 6px;
8076
font-size: 12px;
8177
color: var(--vscode-descriptionForeground);
8278

@@ -105,7 +101,7 @@
105101
}
106102

107103
.agent-session-status {
108-
padding: 0 4px 0 8px; /* to align with diff area above */
104+
padding-left: 8px;
109105
font-variant-numeric: tabular-nums;
110106

111107
/* In case the changes toolbar to the left is greedy, we give up space */

‎src/vs/workbench/contrib/chat/browser/chat.contribution.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -358,10 +358,10 @@ configurationRegistry.registerConfiguration({
358358
enum: ['inline', 'hover', 'input', 'none'],
359359
default: 'inline',
360360
},
361-
[ChatConfiguration.EmptyChatViewSessionsEnabled]: {
361+
[ChatConfiguration.EmptyChatViewRecentSessionsEnabled]: {
362362
type: 'boolean',
363363
default: product.quality !== 'stable',
364-
description: nls.localize('chat.emptyState.sessions.enabled', "Show agent sessions on the empty chat state."),
364+
description: nls.localize('chat.emptyState.sessions.enabled', "Show recent agent sessions on the empty chat state."),
365365
tags: ['preview', 'experimental'],
366366
experiment: {
367367
mode: 'auto'

‎src/vs/workbench/contrib/chat/browser/chatViewPane.ts‎

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import { Link } from '../../../../platform/opener/browser/link.js';
2424
import { IOpenerService } from '../../../../platform/opener/common/opener.js';
2525
import { IStorageService, StorageScope, StorageTarget } from '../../../../platform/storage/common/storage.js';
2626
import { ITelemetryService } from '../../../../platform/telemetry/common/telemetry.js';
27-
import { editorBackground } from '../../../../platform/theme/common/colorRegistry.js';
27+
import { editorBackground, editorWidgetBackground } from '../../../../platform/theme/common/colorRegistry.js';
2828
import { IThemeService } from '../../../../platform/theme/common/themeService.js';
2929
import { IViewPaneOptions, ViewPane } from '../../../browser/parts/views/viewPane.js';
3030
import { Memento } from '../../../common/memento.js';
@@ -266,7 +266,7 @@ export class ChatViewPane extends ViewPane implements IViewWelcomeDelegate {
266266
this._register(Event.any(
267267
this._widget.onDidChangeEmptyState,
268268
Event.fromObservable(this.welcomeController.isShowingWelcome),
269-
Event.filter(this.configurationService.onDidChangeConfiguration, e => e.affectsConfiguration(ChatConfiguration.EmptyChatViewSessionsEnabled))
269+
Event.filter(this.configurationService.onDidChangeConfiguration, e => e.affectsConfiguration(ChatConfiguration.EmptyChatViewRecentSessionsEnabled))
270270
)(() => {
271271
this.sessionsControl?.clearFocus(); // improve visual appearance when switching visibility by clearing focus
272272
this.notifySessionsControlChanged();
@@ -278,6 +278,11 @@ export class ChatViewPane extends ViewPane implements IViewWelcomeDelegate {
278278
const that = this;
279279
const sessionsContainer = this.sessionsContainer = parent.appendChild($('.agent-sessions-container'));
280280

281+
// Recent Sessions Title
282+
const titleContainer = append(sessionsContainer, $('.agent-sessions-title-container'));
283+
const title = append(titleContainer, $('span.agent-sessions-title'));
284+
title.textContent = localize('recentSessions', "Recent Sessions");
285+
281286
// Sessions Control
282287
this.sessionsControlContainer = append(sessionsContainer, $('.agent-sessions-control-container'));
283288
this.sessionsControl = this._register(this.instantiationService.createInstance(AgentSessionsControl, this.sessionsControlContainer, {
@@ -294,13 +299,16 @@ export class ChatViewPane extends ViewPane implements IViewWelcomeDelegate {
294299
notifyResults(count: number) {
295300
that.notifySessionsControlChanged(count);
296301
}
302+
},
303+
overrideStyles: {
304+
listBackground: editorWidgetBackground
297305
}
298306
}));
299307
this._register(this.onDidChangeBodyVisibility(visible => this.sessionsControl?.setVisible(visible)));
300308

301309
// Link to Sessions View
302310
this.sessionsLinkContainer = append(sessionsContainer, $('.agent-sessions-link-container'));
303-
this._register(this.instantiationService.createInstance(Link, this.sessionsLinkContainer, { label: localize('openAgentSessionsView', "Show All Sessions"), href: '', }, {
311+
this._register(this.instantiationService.createInstance(Link, this.sessionsLinkContainer, { label: localize('openAgentSessionsView', "Show all sessions"), href: '', }, {
304312
opener: () => this.instantiationService.invokeFunction(openAgentSessionsView)
305313
}));
306314
}
@@ -324,10 +332,10 @@ export class ChatViewPane extends ViewPane implements IViewWelcomeDelegate {
324332
}
325333

326334
const newSessionsContainerVisible =
327-
this.configurationService.getValue<boolean>(ChatConfiguration.EmptyChatViewSessionsEnabled) && // enabled in settings
328-
(!this._widget || this._widget?.isEmpty()) && // chat widget empty
329-
!this.welcomeController?.isShowingWelcome.get() && // welcome not showing
330-
this.sessionsCount > 0; // has sessions
335+
this.configurationService.getValue<boolean>(ChatConfiguration.EmptyChatViewRecentSessionsEnabled) && // enabled in settings
336+
(!this._widget || this._widget?.isEmpty()) && // chat widget empty
337+
!this.welcomeController?.isShowingWelcome.get() && // welcome not showing
338+
this.sessionsCount > 0; // has sessions
331339

332340
this.viewPaneContainer.classList.toggle('has-sessions-control', newSessionsContainerVisible);
333341

‎src/vs/workbench/contrib/chat/browser/chatWidget.ts‎

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2355,13 +2355,6 @@ export class ChatWidget extends Disposable implements IChatWidget {
23552355
this.tree.layout(contentHeight, width);
23562356

23572357
this.welcomeMessageContainer.style.height = `${contentHeight}px`;
2358-
if (this.welcomePart.value) {
2359-
if (contentHeight >= this.welcomePart.value.element.offsetHeight) {
2360-
this.welcomePart.value.element.style.visibility = 'visible';
2361-
} else {
2362-
this.welcomePart.value.element.style.visibility = 'hidden';
2363-
}
2364-
}
23652358

23662359
this.renderer.layout(width);
23672360

‎src/vs/workbench/contrib/chat/browser/media/chatViewPane.css‎

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,17 +13,29 @@
1313
.agent-sessions-container {
1414
display: flex;
1515
flex-direction: column;
16-
padding: 4px 8px 32px 8px;
17-
18-
.agent-sessions-viewer .monaco-list .monaco-list-row {
19-
border-radius: 3px;
16+
margin: 12px 16px 32px 16px;
17+
border-radius: 4px;
18+
background-color: var(--vscode-editorWidget-background);
19+
20+
.agent-sessions-title-container {
21+
font-size: 11px;
22+
text-transform: uppercase;
23+
letter-spacing: 0.5px;
24+
color: var(--vscode-descriptionForeground);
25+
padding: 8px;
2026
}
2127

2228
.agent-sessions-link-container {
23-
padding: 4px 12px;
29+
padding-bottom: 8px;
2430
font-size: 12px;
2531
text-align: center;
2632
}
33+
34+
.agent-sessions-link-container a:hover,
35+
.agent-sessions-link-container a:active {
36+
text-decoration: none;
37+
color: var(--vscode-textLink-foreground);
38+
}
2739
}
2840

2941
.interactive-session {

0 commit comments

Comments
 (0)