agent: Make the panel's textarea font size be controlled by `buffer_font_size` (#38726)

Danilo Leal created 1 month ago

Closes https://github.com/zed-industries/zed/issues/37882

Previously, every piece of text in the agent panel was controlled by
`agent_font_size`. Although it is nice to only have one setting to tweak
that, it could be a bit misleading particularly because we use
monospaced and sans-serif fonts for different elements in the panel. Any
editor/textarea in the panel, whehter it is the main message editor or
the previous message editor, uses the buffer font. Therefore, I think it
is reasonable to expect that tweaking `buffer_font_size` would also
change the agent panel's usage of buffer fonts.

With this change, regular buffers and the agent panel's message editor
will always have the same size.

Release Notes:

- agent: Made the agent panel's textarea font size follow the font size
of regular buffers. They're now both controlled by the
`buffer_font_size` setting.

Change summary

crates/agent_ui/src/acp/message_editor.rs | 15 +++------------
docs/src/ai/agent-settings.md             | 14 ++++++++++++++
2 files changed, 17 insertions(+), 12 deletions(-)

Detailed changes

crates/agent_ui/src/acp/message_editor.rs

@@ -47,12 +47,7 @@ use std::{
 };
 use text::OffsetRangeExt;
 use theme::ThemeSettings;
-use ui::{
-    ActiveTheme, AnyElement, App, ButtonCommon, ButtonLike, ButtonStyle, Color, Element as _,
-    FluentBuilder as _, Icon, IconName, IconSize, InteractiveElement, IntoElement, Label,
-    LabelCommon, LabelSize, ParentElement, Render, SelectableButton, Styled, TextSize, TintColor,
-    Toggleable, Window, div, h_flex,
-};
+use ui::{ButtonLike, TintColor, Toggleable, prelude::*};
 use util::{ResultExt, debug_panic};
 use workspace::{Workspace, notifications::NotifyResultExt as _};
 use zed_actions::agent::Chat;
@@ -1291,18 +1286,14 @@ impl Render for MessageEditor {
             .flex_1()
             .child({
                 let settings = ThemeSettings::get_global(cx);
-                let font_size = TextSize::Small
-                    .rems(cx)
-                    .to_pixels(settings.agent_font_size(cx));
-                let line_height = settings.buffer_line_height.value() * font_size;
 
                 let text_style = TextStyle {
                     color: cx.theme().colors().text,
                     font_family: settings.buffer_font.family.clone(),
                     font_fallbacks: settings.buffer_font.fallbacks.clone(),
                     font_features: settings.buffer_font.features.clone(),
-                    font_size: font_size.into(),
-                    line_height: line_height.into(),
+                    font_size: settings.buffer_font_size(cx).into(),
+                    line_height: relative(settings.buffer_line_height.value()),
                     ..Default::default()
                 };
 

docs/src/ai/agent-settings.md

@@ -123,6 +123,20 @@ You can choose between `thread` (the default) and `text_thread`:
 }
 ```
 
+### Font Size
+
+Use the `agent_font_size` setting to change the font size of rendered agent responses in the panel.
+
+```json
+{
+  "agent": {
+    "agent_font_size": 18
+  }
+}
+```
+
+> (Preview Version Note): Editors in the Agent Panel—whether that is the main message textarea or previous messages—use monospace fonts and therefore, are controlled by the `buffer_font_size` setting, which is defined globally in your `settings.json`.
+
 ### Auto-run Commands
 
 Control whether you want to allow the agent to run commands without asking you for permission.