fix(ai-chat): add space after all autocompletions in AI chat

This change ensures proper spacing after autocompleted items by: - Removing unnecessary space when triggering the @ menu - Adding a space after each autocompleted item fixed eclipse-theia#15051
eclipsesource · Feb 26, 2025 · 2c075a0 · 2c075a0
1 parent 82a3e31
commit 2c075a0
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/packages/ai-chat-ui/src/browser/chat-input-widget.tsx b/packages/ai-chat-ui/src/browser/chat-input-widget.tsx
@@ -463,7 +463,7 @@ const ChatInput: React.FunctionComponent<ChatInputProperties> = (props: ChatInpu
                     endLineNumber: 1,
                     endColumn: 1
                 },
-                text: '@ ',
+                text: '@',
             }]);
             editorRef.current.getControl().setPosition({ lineNumber: 1, column: 2 });
             editorRef.current.getControl().getAction('editor.action.triggerSuggest')?.run();

diff --git a/packages/ai-chat-ui/src/browser/chat-view-language-contribution.ts b/packages/ai-chat-ui/src/browser/chat-view-language-contribution.ts
@@ -121,7 +121,7 @@ export class ChatViewLanguageContribution implements FrontendApplicationContribu
             PromptText.AGENT_CHAR,
             this.agentService.getAgents(),
             monaco.languages.CompletionItemKind.Value,
-            agent => agent.id,
+            agent => `${agent.id} `,
             agent => agent.name,
             agent => agent.description
         );
@@ -134,7 +134,7 @@ export class ChatViewLanguageContribution implements FrontendApplicationContribu
             PromptText.VARIABLE_CHAR,
             this.variableService.getVariables(),
             monaco.languages.CompletionItemKind.Variable,
-            variable => variable.args?.some(arg => !arg.isOptional) ? variable.name + PromptText.VARIABLE_SEPARATOR_CHAR : variable.name,
+            variable => variable.args?.some(arg => !arg.isOptional) ? variable.name + PromptText.VARIABLE_SEPARATOR_CHAR : `${variable.name} `,
             variable => variable.name,
             variable => variable.description,
             {
@@ -174,7 +174,7 @@ export class ChatViewLanguageContribution implements FrontendApplicationContribu
             PromptText.FUNCTION_CHAR,
             this.toolInvocationRegistry.getAllFunctions(),
             monaco.languages.CompletionItemKind.Function,
-            tool => tool.id,
+            tool => `${tool.id} `,
             tool => tool.name,
             tool => tool.description ?? ''
         );