Skip to content

Commit

Permalink
assistant2: Add "Copy code" button to code blocks (#22866)
Browse files Browse the repository at this point in the history
Here's what it looks like, including the "Copy" hover text in one case:


![screenshot](https://github.com/user-attachments/assets/c8d27205-9650-493d-bd3c-a8c7beb142f9)


Release Notes:

- N/A

---------

Co-authored-by: Conrad <conrad@zed.dev>
Co-authored-by: Danilo Leal <daniloleal09@gmail.com>
  • Loading branch information
3 people authored Jan 9, 2025
1 parent a8ef0f2 commit 7d905d0
Showing 1 changed file with 74 additions and 2 deletions.
76 changes: 74 additions & 2 deletions crates/markdown/src/markdown.rs
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ use parser::{parse_links_only, parse_markdown, MarkdownEvent, MarkdownTag, Markd

use std::{iter, mem, ops::Range, rc::Rc, sync::Arc};
use theme::SyntaxTheme;
use ui::prelude::*;
use ui::{prelude::*, Tooltip};
use util::{ResultExt, TryFutureExt};

#[derive(Clone)]
Expand Down Expand Up @@ -667,6 +667,31 @@ impl Element for MarkdownElement {
}
MarkdownTagEnd::CodeBlock => {
builder.trim_trailing_newline();
builder.flush_text();
builder.modify_current_div(|el| {
let id =
ElementId::NamedInteger("copy-markdown-code".into(), range.end);
let copy_button = div().absolute().top_1().right_1().w_5().child(
IconButton::new(id, IconName::Copy)
.icon_color(Color::Muted)
.shape(ui::IconButtonShape::Square)
.tooltip(|cx| Tooltip::text("Copy Code Block", cx))
.on_click({
let code = without_fences(
parsed_markdown.source()[range.clone()].trim(),
)
.to_string();

move |_, cx| {
cx.write_to_clipboard(ClipboardItem::new_string(
code.clone(),
))
}
}),
);

el.child(copy_button)
});
builder.pop_div();
builder.pop_code_block();
if self.style.code_block.text.is_some() {
Expand Down Expand Up @@ -917,6 +942,13 @@ impl MarkdownElementBuilder {
self.div_stack.push(div);
}

fn modify_current_div(&mut self, f: impl FnOnce(AnyDiv) -> AnyDiv) {
self.flush_text();
if let Some(div) = self.div_stack.pop() {
self.div_stack.push(f(div));
}
}

fn pop_div(&mut self) {
self.flush_text();
let div = self.div_stack.pop().unwrap().into_any_element();
Expand Down Expand Up @@ -1001,7 +1033,7 @@ impl MarkdownElementBuilder {
}
}

fn flush_text(&mut self) {
pub fn flush_text(&mut self) {
let line = mem::take(&mut self.pending_line);
if line.text.is_empty() {
return;
Expand Down Expand Up @@ -1220,3 +1252,43 @@ impl RenderedText {
.find(|link| link.source_range.contains(&source_index))
}
}

/// Some markdown blocks are indented, and others have e.g. ```rust … ``` around them.
/// If this block is fenced with backticks, strip them off (and the language name).
/// We use this when copying code blocks to the clipboard.
fn without_fences(mut markdown: &str) -> &str {
if let Some(opening_backticks) = markdown.find("```") {
markdown = &markdown[opening_backticks..];

// Trim off the next newline. This also trims off a language name if it's there.
if let Some(newline) = markdown.find('\n') {
markdown = &markdown[newline + 1..];
}
};

if let Some(closing_backticks) = markdown.rfind("```") {
markdown = &markdown[..closing_backticks];
};

markdown
}

#[cfg(test)]
mod tests {
use super::*;

#[test]
fn test_without_fences() {
let input = "```rust\nlet x = 5;\n```";
assert_eq!(without_fences(input), "let x = 5;\n");

let input = " ```\nno language\n``` ";
assert_eq!(without_fences(input), "no language\n");

let input = "plain text";
assert_eq!(without_fences(input), "plain text");

let input = "```python\nprint('hello')\nprint('world')\n```";
assert_eq!(without_fences(input), "print('hello')\nprint('world')\n");
}
}

0 comments on commit 7d905d0

Please sign in to comment.