Polish diff for the edit_file tool (#29911)

I added some padding to the editor, and removed the border around each
hunk as it would overlap in weird ways with the card container.

## Before

<img width="1148" alt="image"
src="https://github.com/user-attachments/assets/2018feaa-c847-4609-bc82-522660714b9a"
/>

## After

One Light:

<img width="1148" alt="image"
src="https://github.com/user-attachments/assets/4da1a4b6-0af2-4479-afcc-02da50178fd6"
/>

One Dark:

<img width="1148" alt="image"
src="https://github.com/user-attachments/assets/0168631d-7b76-4582-8174-c6e9c1297dc8"
/>


Release Notes:

- Improved displaying of diffs when the agent edits files.
This commit is contained in:
Antonio Scandurra 2025-05-05 13:17:15 +02:00 committed by GitHub
parent 0048e67832
commit 1adb4ecc95
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 61 additions and 23 deletions

View file

@ -170,7 +170,7 @@ pub struct EditorElement {
type DisplayRowDelta = u32;
impl EditorElement {
pub(crate) const SCROLLBAR_WIDTH: Pixels = px(15.);
pub const SCROLLBAR_WIDTH: Pixels = px(15.);
pub fn new(editor: &Entity<Editor>, style: EditorStyle) -> Self {
Self {
@ -6810,10 +6810,27 @@ impl Element for EditorElement {
cx,
)
.unwrap_or_default();
let text_width = bounds.size.width - gutter_dimensions.width;
let hitbox = window.insert_hitbox(bounds, false);
let gutter_hitbox =
window.insert_hitbox(gutter_bounds(bounds, gutter_dimensions), false);
let text_hitbox = window.insert_hitbox(
Bounds {
origin: gutter_hitbox.top_right()
+ point(style.horizontal_padding, Pixels::default()),
size: size(
bounds.size.width
- gutter_dimensions.width
- 2. * style.horizontal_padding,
bounds.size.height,
),
},
false,
);
let editor_width =
text_width - gutter_dimensions.margin - em_width - style.scrollbar_width;
let editor_width = text_hitbox.size.width
- gutter_dimensions.margin
- em_width
- style.scrollbar_width;
snapshot = self.editor.update(cx, |editor, cx| {
editor.last_bounds = Some(bounds);
@ -6849,24 +6866,13 @@ impl Element for EditorElement {
.map(|(guide, active)| (self.column_pixels(*guide, window, cx), *active))
.collect::<SmallVec<[_; 2]>>();
let hitbox = window.insert_hitbox(bounds, false);
let gutter_hitbox =
window.insert_hitbox(gutter_bounds(bounds, gutter_dimensions), false);
let text_hitbox = window.insert_hitbox(
Bounds {
origin: gutter_hitbox.top_right(),
size: size(text_width, bounds.size.height),
},
false,
);
// Offset the content_bounds from the text_bounds by the gutter margin (which
// is roughly half a character wide) to make hit testing work more like how we want.
let content_offset = point(gutter_dimensions.margin, Pixels::ZERO);
let content_origin = text_hitbox.origin + content_offset;
let editor_text_bounds =
Bounds::from_corners(content_origin, bounds.bottom_right());
Bounds::from_corners(content_origin, text_hitbox.bounds.bottom_right());
let height_in_lines = editor_text_bounds.size.height / line_height;