Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Basic markdown decorations for variables in requests #193533

Merged
merged 1 commit into from
Sep 20, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
18 changes: 14 additions & 4 deletions src/vs/workbench/contrib/chat/browser/chatListRenderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import { ICompressedTreeNode } from 'vs/base/browser/ui/tree/compressedObjectTre
import { ICompressibleTreeRenderer } from 'vs/base/browser/ui/tree/objectTree';
import { IAsyncDataSource, ITreeNode, ITreeRenderer } from 'vs/base/browser/ui/tree/tree';
import { IAction } from 'vs/base/common/actions';
import { distinct } from 'vs/base/common/arrays';
import { IntervalTimer } from 'vs/base/common/async';
import { Codicon } from 'vs/base/common/codicons';
import { Emitter, Event } from 'vs/base/common/event';
Expand Down Expand Up @@ -52,6 +53,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
import { ServiceCollection } from 'vs/platform/instantiation/common/serviceCollection';
import { WorkbenchCompressibleAsyncDataTree } from 'vs/platform/list/browser/listService';
import { ILogService } from 'vs/platform/log/common/log';
import { IOpenerService } from 'vs/platform/opener/common/opener';
import { defaultButtonStyles } from 'vs/platform/theme/browser/defaultStyles';
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { IResourceLabel, ResourceLabels } from 'vs/workbench/browser/labels';
Expand All @@ -61,7 +63,9 @@ import { IChatCodeBlockActionContext } from 'vs/workbench/contrib/chat/browser/a
import { ChatTreeItem, IChatCodeBlockInfo, IChatFileTreeInfo } from 'vs/workbench/contrib/chat/browser/chat';
import { ChatFollowups } from 'vs/workbench/contrib/chat/browser/chatFollowups';
import { ChatEditorOptions } from 'vs/workbench/contrib/chat/browser/chatOptions';
import { fixVariableReferences, walkTreeAndAnnotateResourceLinks } from 'vs/workbench/contrib/chat/browser/chatVariableReferenceRenderer';
import { CONTEXT_REQUEST, CONTEXT_RESPONSE, CONTEXT_RESPONSE_FILTERED, CONTEXT_RESPONSE_HAS_PROVIDER_ID, CONTEXT_RESPONSE_VOTE } from 'vs/workbench/contrib/chat/common/chatContextKeys';
import { IPlaceholderMarkdownString } from 'vs/workbench/contrib/chat/common/chatModel';
import { IChatReplyFollowup, IChatResponseProgressFileTreeData, IChatService, ISlashCommand, InteractiveSessionVoteDirection } from 'vs/workbench/contrib/chat/common/chatService';
import { IChatResponseMarkdownRenderData, IChatResponseRenderData, IChatResponseViewModel, IChatWelcomeMessageViewModel, isRequestVM, isResponseVM, isWelcomeVM } from 'vs/workbench/contrib/chat/common/chatViewModel';
import { IWordCountResult, getNWords } from 'vs/workbench/contrib/chat/common/chatWordCounter';
Expand All @@ -70,9 +74,6 @@ import { SelectionClipboardContributionID } from 'vs/workbench/contrib/codeEdito
import { getSimpleEditorOptions } from 'vs/workbench/contrib/codeEditor/browser/simpleEditorOptions';
import { createFileIconThemableTreeContainerScope } from 'vs/workbench/contrib/files/browser/views/explorerView';
import { IFilesConfiguration } from 'vs/workbench/contrib/files/common/files';
import { IOpenerService } from 'vs/platform/opener/common/opener';
import { distinct } from 'vs/base/common/arrays';
import { IPlaceholderMarkdownString } from 'vs/workbench/contrib/chat/common/chatModel';

const $ = dom.$;

Expand Down Expand Up @@ -137,7 +138,7 @@ export class ChatListItemRenderer extends Disposable implements ITreeRenderer<Ch
@ICommandService private readonly commandService: ICommandService,
@IOpenerService private readonly openerService: IOpenerService,
@IContextKeyService private readonly contextKeyService: IContextKeyService,
@IChatService private readonly chatService: IChatService
@IChatService private readonly chatService: IChatService,
) {
super();
this.renderer = this.instantiationService.createInstance(MarkdownRenderer, {});
Expand Down Expand Up @@ -607,6 +608,11 @@ export class ChatListItemRenderer extends Disposable implements ITreeRenderer<Ch
});

const codeblocks: IChatCodeBlockInfo[] = [];

if (isRequestVM(element)) {
markdown = fixVariableReferences(markdown);
}

const result = this.renderer.render(markdown, {
fillInIncompleteTokens,
codeBlockRendererSync: (languageId, text) => {
Expand Down Expand Up @@ -642,6 +648,10 @@ export class ChatListItemRenderer extends Disposable implements ITreeRenderer<Ch
disposables.add(toDisposable(() => this.codeBlocksByResponseId.delete(element.id)));
}

if (isRequestVM(element)) {
walkTreeAndAnnotateResourceLinks(result.element);
}

if (usedSlashCommand) {
const slashCommandElement = $('span.interactive-slash-command', { title: usedSlashCommand.detail }, `/${usedSlashCommand.command} `);
if (result.element.firstChild?.nodeName.toLowerCase() === 'p') {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/

import * as dom from 'vs/base/browser/dom';
import { IMarkdownString, MarkdownString } from 'vs/base/common/htmlContent';

const variableRefUrlPrefix = 'http://vscodeVar_';

export function fixVariableReferences(markdown: IMarkdownString): IMarkdownString {
const fixedMarkdownSource = markdown.value.replace(/\]\(values:(.*)/g, `](${variableRefUrlPrefix}_$1`);
return new MarkdownString(fixedMarkdownSource, { isTrusted: markdown.isTrusted, supportThemeIcons: markdown.supportThemeIcons, supportHtml: markdown.supportHtml });
}

export function walkTreeAndAnnotateResourceLinks(element: HTMLElement): void {
element.querySelectorAll('a').forEach(a => {
const href = a.getAttribute('data-href');
if (href) {
if (href.startsWith(variableRefUrlPrefix)) {
a.parentElement!.replaceChild(
renderResourceWidget(a.textContent!),
a);
}
}

walkTreeAndAnnotateResourceLinks(a as HTMLElement);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Recursion seems unnecessary, querySelectorAll will already have gotten all matching children in the element's tree

});
}

function renderResourceWidget(name: string): HTMLElement {
const container = dom.$('span.chat-resource-widget');
const alias = dom.$('span', undefined, name);
container.appendChild(alias);
return container;
}
8 changes: 8 additions & 0 deletions src/vs/workbench/contrib/chat/browser/media/chat.css
Original file line number Diff line number Diff line change
Expand Up @@ -469,3 +469,11 @@
border-radius: 4px;
width: auto;
}

.interactive-item-container .chat-resource-widget {
background-color: var(--vscode-chat-slashCommandBackground);
color: var(--vscode-chat-slashCommandForeground);
border-radius: 3px;
white-space: nowrap;
padding: 1px;
}
19 changes: 11 additions & 8 deletions src/vs/workbench/contrib/chat/common/chatServiceImpl.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
import { IChatAgentData, IChatAgentService } from 'vs/workbench/contrib/chat/common/chatAgents';
import { CONTEXT_PROVIDER_EXISTS } from 'vs/workbench/contrib/chat/common/chatContextKeys';
import { ChatModel, ChatWelcomeMessageModel, IChatModel, ISerializableChatData, ISerializableChatsData, isCompleteInteractiveProgressTreeData } from 'vs/workbench/contrib/chat/common/chatModel';
import { ChatModel, ChatRequestModel, ChatWelcomeMessageModel, IChatModel, ISerializableChatData, ISerializableChatsData, isCompleteInteractiveProgressTreeData } from 'vs/workbench/contrib/chat/common/chatModel';
import { ChatMessageRole, IChatMessage } from 'vs/workbench/contrib/chat/common/chatProvider';
import { IChat, IChatCompleteResponse, IChatDetail, IChatDynamicRequest, IChatFollowup, IChatProgress, IChatProvider, IChatProviderInfo, IChatReplyFollowup, IChatRequest, IChatResponse, IChatService, IChatTransferredSessionData, IChatUserActionEvent, ISlashCommand, InteractiveSessionCopyKind, InteractiveSessionVoteDirection } from 'vs/workbench/contrib/chat/common/chatService';
import { IChatSlashCommandService, IChatSlashFragment } from 'vs/workbench/contrib/chat/common/chatSlashCommands';
Expand Down Expand Up @@ -436,7 +436,7 @@ export class ChatService extends Disposable implements IChatService {

private async _sendRequestAsync(model: ChatModel, provider: IChatProvider, message: string | IChatReplyFollowup, usedSlashCommand?: ISlashCommand): Promise<void> {
const resolvedAgent = typeof message === 'string' ? this.resolveAgent(message) : undefined;
const request = model.addRequest(message, resolvedAgent);
let request: ChatRequestModel;

const resolvedCommand = typeof message === 'string' && message.startsWith('/') ? await this.handleSlashCommand(model.sessionId, message) : message;

Expand Down Expand Up @@ -492,6 +492,7 @@ export class ChatService extends Disposable implements IChatService {
let slashCommandFollowups: IChatFollowup[] | void = [];

if (typeof message === 'string' && resolvedAgent) {
request = model.addRequest(message);
const history: IChatMessage[] = [];
for (const request of model.getRequests()) {
if (typeof request.message !== 'string' || !request.response) {
Expand All @@ -510,6 +511,7 @@ export class ChatService extends Disposable implements IChatService {
slashCommandFollowups = agentResult?.followUp;
rawResponse = { session: model.session! };
} else if ((typeof resolvedCommand === 'string' && typeof message === 'string' && this.chatSlashCommandService.hasCommand(resolvedCommand))) {
request = model.addRequest(message);
// contributed slash commands
// TODO: spell this out in the UI
const history: IChatMessage[] = [];
Expand All @@ -531,19 +533,20 @@ export class ChatService extends Disposable implements IChatService {
rawResponse = { session: model.session! };

} else {
const request: IChatRequest = {
const requestProps: IChatRequest = {
session: model.session!,
message: resolvedCommand,
variables: {}
};

if (typeof request.message === 'string') {
const varResult = await this.chatVariablesService.resolveVariables(request.message, model, token);
request.variables = varResult.variables;
request.message = varResult.prompt;
if (typeof requestProps.message === 'string') {
const varResult = await this.chatVariablesService.resolveVariables(requestProps.message, model, token);
requestProps.variables = varResult.variables;
requestProps.message = varResult.prompt;
}
request = model.addRequest(requestProps.message);

rawResponse = await provider.provideReply(request, progressCallback, token);
rawResponse = await provider.provideReply(requestProps, progressCallback, token);
}

if (token.isCancellationRequested) {
Expand Down