chore(ai): avoid line wrap in code response parts

Line wrapping lead to cut off code. Instead, we now never wrap and show a horizontal bar. Moreover, this change ensures that mouse wheel events aren't caught be the code parts but always continue scrolling the chat view.
eclipse-theia · Oct 30, 2024 · 5723d52 · 5723d52
1 parent fbcd368
commit 5723d52
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/packages/ai-chat-ui/src/browser/chat-response-renderer/code-part-renderer.tsx b/packages/ai-chat-ui/src/browser/chat-response-renderer/code-part-renderer.tsx
@@ -176,7 +176,11 @@ export const CodeWrapper = (props: {
             scrollBeyondLastColumn: 0,
             renderFinalNewline: 'off',
             maxHeight: -1,
-            scrollbar: { vertical: 'hidden' },
+            scrollbar: {
+                vertical: 'hidden',
+                alwaysConsumeMouseWheel: false
+            },
+            wordWrap: 'off',
             codeLens: false,
             inlayHints: { enabled: 'off' },
             hover: { enabled: false }

diff --git a/packages/ai-chat-ui/src/browser/style/index.css b/packages/ai-chat-ui/src/browser/style/index.css
@@ -125,6 +125,7 @@ div:last-child > .theia-ChatNode {
 
 .theia-ChatNode .theia-CodeWrapper {
   padding: 0.5em;
+  padding-bottom: 0;
   background-color: var(--theia-editor-background);
   border-radius: 6px;
   border: var(--theia-border-width) solid var(--theia-checkbox-border);