1use std::sync::Arc;
2use std::time::Duration;
3
4use crate::stdio::TerminalOutput;
5use anyhow::Result;
6use base64::prelude::*;
7use gpui::{
8 img, percentage, Animation, AnimationExt, AnyElement, FontWeight, Render, RenderImage, Task,
9 TextRun, Transformation, View,
10};
11use runtimelib::datatable::TableSchema;
12use runtimelib::media::datatable::TabularDataResource;
13use runtimelib::{ExecutionState, JupyterMessageContent, MimeBundle, MimeType};
14use serde_json::Value;
15use settings::Settings;
16use theme::ThemeSettings;
17use ui::{div, prelude::*, v_flex, IntoElement, Styled, ViewContext};
18
19use markdown_preview::{
20 markdown_elements::ParsedMarkdown, markdown_parser::parse_markdown,
21 markdown_renderer::render_markdown_block,
22};
23
24/// When deciding what to render from a collection of mediatypes, we need to rank them in order of importance
25fn rank_mime_type(mimetype: &MimeType) -> usize {
26 match mimetype {
27 MimeType::DataTable(_) => 6,
28 MimeType::Png(_) => 4,
29 MimeType::Jpeg(_) => 3,
30 MimeType::Markdown(_) => 2,
31 MimeType::Plain(_) => 1,
32 // All other media types are not supported in Zed at this time
33 _ => 0,
34 }
35}
36
37/// ImageView renders an image inline in an editor, adapting to the line height to fit the image.
38pub struct ImageView {
39 height: u32,
40 width: u32,
41 image: Arc<RenderImage>,
42}
43
44impl ImageView {
45 fn render(&self, cx: &ViewContext<ExecutionView>) -> AnyElement {
46 let line_height = cx.line_height();
47
48 let (height, width) = if self.height as f32 / line_height.0 == u8::MAX as f32 {
49 let height = u8::MAX as f32 * line_height.0;
50 let width = self.width as f32 * height / self.height as f32;
51 (height, width)
52 } else {
53 (self.height as f32, self.width as f32)
54 };
55
56 let image = self.image.clone();
57
58 div()
59 .h(Pixels(height))
60 .w(Pixels(width))
61 .child(img(image))
62 .into_any_element()
63 }
64
65 fn from(base64_encoded_data: &str) -> Result<Self> {
66 let bytes = BASE64_STANDARD.decode(base64_encoded_data)?;
67
68 let format = image::guess_format(&bytes)?;
69 let mut data = image::load_from_memory_with_format(&bytes, format)?.into_rgba8();
70
71 // Convert from RGBA to BGRA.
72 for pixel in data.chunks_exact_mut(4) {
73 pixel.swap(0, 2);
74 }
75
76 let height = data.height();
77 let width = data.width();
78
79 let gpui_image_data = RenderImage::new(vec![image::Frame::new(data)]);
80
81 return Ok(ImageView {
82 height,
83 width,
84 image: Arc::new(gpui_image_data),
85 });
86 }
87}
88
89/// TableView renders a static table inline in a buffer.
90/// It uses the https://specs.frictionlessdata.io/tabular-data-resource/ specification for data interchange.
91pub struct TableView {
92 pub table: TabularDataResource,
93 pub widths: Vec<Pixels>,
94}
95
96fn cell_content(row: &Value, field: &str) -> String {
97 match row.get(&field) {
98 Some(Value::String(s)) => s.clone(),
99 Some(Value::Number(n)) => n.to_string(),
100 Some(Value::Bool(b)) => b.to_string(),
101 Some(Value::Array(arr)) => format!("{:?}", arr),
102 Some(Value::Object(obj)) => format!("{:?}", obj),
103 Some(Value::Null) | None => String::new(),
104 }
105}
106
107// Declare constant for the padding multiple on the line height
108const TABLE_Y_PADDING_MULTIPLE: f32 = 0.5;
109
110impl TableView {
111 pub fn new(table: TabularDataResource, cx: &mut WindowContext) -> Self {
112 let mut widths = Vec::with_capacity(table.schema.fields.len());
113
114 let text_system = cx.text_system();
115 let text_style = cx.text_style();
116 let text_font = ThemeSettings::get_global(cx).buffer_font.clone();
117 let font_size = ThemeSettings::get_global(cx).buffer_font_size;
118 let mut runs = [TextRun {
119 len: 0,
120 font: text_font,
121 color: text_style.color,
122 background_color: None,
123 underline: None,
124 strikethrough: None,
125 }];
126
127 for field in table.schema.fields.iter() {
128 runs[0].len = field.name.len();
129 let mut width = text_system
130 .layout_line(&field.name, font_size, &runs)
131 .map(|layout| layout.width)
132 .unwrap_or(px(0.));
133
134 let Some(data) = table.data.as_ref() else {
135 widths.push(width);
136 continue;
137 };
138
139 for row in data {
140 let content = cell_content(&row, &field.name);
141 runs[0].len = content.len();
142 let cell_width = cx
143 .text_system()
144 .layout_line(&content, font_size, &runs)
145 .map(|layout| layout.width)
146 .unwrap_or(px(0.));
147
148 width = width.max(cell_width)
149 }
150
151 widths.push(width)
152 }
153
154 Self { table, widths }
155 }
156
157 pub fn render(&self, cx: &ViewContext<ExecutionView>) -> AnyElement {
158 let data = match &self.table.data {
159 Some(data) => data,
160 None => return div().into_any_element(),
161 };
162
163 let mut headings = serde_json::Map::new();
164 for field in &self.table.schema.fields {
165 headings.insert(field.name.clone(), Value::String(field.name.clone()));
166 }
167 let header = self.render_row(&self.table.schema, true, &Value::Object(headings), cx);
168
169 let body = data
170 .iter()
171 .map(|row| self.render_row(&self.table.schema, false, &row, cx));
172
173 v_flex()
174 .id("table")
175 .overflow_x_scroll()
176 .w_full()
177 .child(header)
178 .children(body)
179 .into_any_element()
180 }
181
182 pub fn render_row(
183 &self,
184 schema: &TableSchema,
185 is_header: bool,
186 row: &Value,
187 cx: &ViewContext<ExecutionView>,
188 ) -> AnyElement {
189 let theme = cx.theme();
190
191 let line_height = cx.line_height();
192
193 let row_cells = schema
194 .fields
195 .iter()
196 .zip(self.widths.iter())
197 .map(|(field, width)| {
198 let container = match field.field_type {
199 runtimelib::datatable::FieldType::String => div(),
200
201 runtimelib::datatable::FieldType::Number
202 | runtimelib::datatable::FieldType::Integer
203 | runtimelib::datatable::FieldType::Date
204 | runtimelib::datatable::FieldType::Time
205 | runtimelib::datatable::FieldType::Datetime
206 | runtimelib::datatable::FieldType::Year
207 | runtimelib::datatable::FieldType::Duration
208 | runtimelib::datatable::FieldType::Yearmonth => v_flex().items_end(),
209
210 _ => div(),
211 };
212
213 let value = cell_content(row, &field.name);
214
215 let mut cell = container
216 .min_w(*width + px(22.))
217 .w(*width + px(22.))
218 .child(value)
219 .px_2()
220 .py((TABLE_Y_PADDING_MULTIPLE / 2.0) * line_height)
221 .border_color(theme.colors().border);
222
223 if is_header {
224 cell = cell.border_1().bg(theme.colors().border_focused)
225 } else {
226 cell = cell.border_1()
227 }
228 cell
229 })
230 .collect::<Vec<_>>();
231
232 let mut total_width = px(0.);
233 for width in self.widths.iter() {
234 // Width fudge factor: border + 2 (heading), padding
235 total_width += *width + px(22.);
236 }
237
238 h_flex()
239 .w(total_width)
240 .children(row_cells)
241 .into_any_element()
242 }
243}
244
245/// Userspace error from the kernel
246pub struct ErrorView {
247 pub ename: String,
248 pub evalue: String,
249 pub traceback: TerminalOutput,
250}
251
252impl ErrorView {
253 fn render(&self, cx: &mut ViewContext<ExecutionView>) -> Option<AnyElement> {
254 let theme = cx.theme();
255
256 let padding = cx.line_height() / 2.;
257
258 Some(
259 v_flex()
260 .gap_3()
261 .child(
262 h_flex()
263 .font_buffer(cx)
264 .child(
265 Label::new(format!("{}: ", self.ename.clone()))
266 // .size(LabelSize::Large)
267 .color(Color::Error)
268 .weight(FontWeight::BOLD),
269 )
270 .child(
271 Label::new(self.evalue.clone())
272 // .size(LabelSize::Large)
273 .weight(FontWeight::BOLD),
274 ),
275 )
276 .child(
277 div()
278 .w_full()
279 .px(padding)
280 .py(padding)
281 .border_l_1()
282 .border_color(theme.status().error_border)
283 .child(self.traceback.render(cx)),
284 )
285 .into_any_element(),
286 )
287 }
288}
289
290pub struct MarkdownView {
291 contents: Option<ParsedMarkdown>,
292 parsing_markdown_task: Option<Task<Result<()>>>,
293}
294
295impl MarkdownView {
296 pub fn from(text: String, cx: &mut ViewContext<Self>) -> Self {
297 let task = cx.spawn(|markdown, mut cx| async move {
298 let text = text.clone();
299 let parsed = cx
300 .background_executor()
301 .spawn(async move { parse_markdown(&text, None, None).await });
302
303 let content = parsed.await;
304
305 markdown.update(&mut cx, |markdown, cx| {
306 markdown.parsing_markdown_task.take();
307 markdown.contents = Some(content);
308 cx.notify();
309 })
310 });
311
312 Self {
313 contents: None,
314 parsing_markdown_task: Some(task),
315 }
316 }
317}
318
319impl Render for MarkdownView {
320 fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
321 let Some(parsed) = self.contents.as_ref() else {
322 return div().into_any_element();
323 };
324
325 let mut markdown_render_context =
326 markdown_preview::markdown_renderer::RenderContext::new(None, cx);
327
328 v_flex()
329 .gap_3()
330 .py_4()
331 .children(parsed.children.iter().map(|child| {
332 div().relative().child(
333 div()
334 .relative()
335 .child(render_markdown_block(child, &mut markdown_render_context)),
336 )
337 }))
338 .into_any_element()
339 }
340}
341
342pub struct Output {
343 content: OutputContent,
344 display_id: Option<String>,
345}
346
347impl Output {
348 pub fn new(data: &MimeBundle, display_id: Option<String>, cx: &mut WindowContext) -> Self {
349 Self {
350 content: OutputContent::new(data, cx),
351 display_id,
352 }
353 }
354
355 pub fn from(content: OutputContent) -> Self {
356 Self {
357 content,
358 display_id: None,
359 }
360 }
361}
362
363pub enum OutputContent {
364 Plain(TerminalOutput),
365 Stream(TerminalOutput),
366 Image(ImageView),
367 ErrorOutput(ErrorView),
368 Message(String),
369 Table(TableView),
370 Markdown(View<MarkdownView>),
371 ClearOutputWaitMarker,
372}
373
374impl OutputContent {
375 fn render(&self, cx: &mut ViewContext<ExecutionView>) -> Option<AnyElement> {
376 let el = match self {
377 // Note: in typical frontends we would show the execute_result.execution_count
378 // Here we can just handle either
379 Self::Plain(stdio) => Some(stdio.render(cx)),
380 Self::Markdown(markdown) => Some(markdown.clone().into_any_element()),
381 Self::Stream(stdio) => Some(stdio.render(cx)),
382 Self::Image(image) => Some(image.render(cx)),
383 Self::Message(message) => Some(div().child(message.clone()).into_any_element()),
384 Self::Table(table) => Some(table.render(cx)),
385 Self::ErrorOutput(error_view) => error_view.render(cx),
386 Self::ClearOutputWaitMarker => None,
387 };
388
389 el
390 }
391
392 pub fn new(data: &MimeBundle, cx: &mut WindowContext) -> Self {
393 match data.richest(rank_mime_type) {
394 Some(MimeType::Plain(text)) => OutputContent::Plain(TerminalOutput::from(text, cx)),
395 Some(MimeType::Markdown(text)) => {
396 let view = cx.new_view(|cx| MarkdownView::from(text.clone(), cx));
397 OutputContent::Markdown(view)
398 }
399 Some(MimeType::Png(data)) | Some(MimeType::Jpeg(data)) => match ImageView::from(data) {
400 Ok(view) => OutputContent::Image(view),
401 Err(error) => OutputContent::Message(format!("Failed to load image: {}", error)),
402 },
403 Some(MimeType::DataTable(data)) => {
404 OutputContent::Table(TableView::new(data.clone(), cx))
405 }
406 // Any other media types are not supported
407 _ => OutputContent::Message("Unsupported media type".to_string()),
408 }
409 }
410}
411
412#[derive(Default, Clone, Debug)]
413pub enum ExecutionStatus {
414 #[default]
415 Unknown,
416 ConnectingToKernel,
417 Queued,
418 Executing,
419 Finished,
420 ShuttingDown,
421 Shutdown,
422 KernelErrored(String),
423}
424
425pub struct ExecutionView {
426 pub outputs: Vec<Output>,
427 pub status: ExecutionStatus,
428}
429
430impl ExecutionView {
431 pub fn new(status: ExecutionStatus, _cx: &mut ViewContext<Self>) -> Self {
432 Self {
433 outputs: Default::default(),
434 status,
435 }
436 }
437
438 /// Accept a Jupyter message belonging to this execution
439 pub fn push_message(&mut self, message: &JupyterMessageContent, cx: &mut ViewContext<Self>) {
440 let output: Output = match message {
441 JupyterMessageContent::ExecuteResult(result) => Output::new(
442 &result.data,
443 result.transient.as_ref().and_then(|t| t.display_id.clone()),
444 cx,
445 ),
446 JupyterMessageContent::DisplayData(result) => {
447 Output::new(&result.data, result.transient.display_id.clone(), cx)
448 }
449 JupyterMessageContent::StreamContent(result) => {
450 // Previous stream data will combine together, handling colors, carriage returns, etc
451 if let Some(new_terminal) = self.apply_terminal_text(&result.text, cx) {
452 Output::from(new_terminal)
453 } else {
454 return;
455 }
456 }
457 JupyterMessageContent::ErrorOutput(result) => {
458 let mut terminal = TerminalOutput::new(cx);
459 terminal.append_text(&result.traceback.join("\n"));
460
461 Output::from(OutputContent::ErrorOutput(ErrorView {
462 ename: result.ename.clone(),
463 evalue: result.evalue.clone(),
464 traceback: terminal,
465 }))
466 }
467 JupyterMessageContent::ExecuteReply(reply) => {
468 for payload in reply.payload.iter() {
469 match payload {
470 // Pager data comes in via `?` at the end of a statement in Python, used for showing documentation.
471 // Some UI will show this as a popup. For ease of implementation, it's included as an output here.
472 runtimelib::Payload::Page { data, .. } => {
473 let output = Output::new(data, None, cx);
474 self.outputs.push(output);
475 }
476
477 // There are other payloads that could be handled here, such as updating the input.
478 // Below are the other payloads that _could_ be handled, but are not required for Zed.
479
480 // Set next input adds text to the next cell. Not required to support.
481 // However, this could be implemented by adding text to the buffer.
482 // Trigger in python using `get_ipython().set_next_input("text")`
483 //
484 // runtimelib::Payload::SetNextInput { text, replace } => {},
485
486 // Not likely to be used in the context of Zed, where someone could just open the buffer themselves
487 // Python users can trigger this with the `%edit` magic command
488 // runtimelib::Payload::EditMagic { filename, line_number } => {},
489
490 // Ask the user if they want to exit the kernel. Not required to support.
491 // runtimelib::Payload::AskExit { keepkernel } => {},
492 _ => {}
493 }
494 }
495 cx.notify();
496 return;
497 }
498 JupyterMessageContent::ClearOutput(options) => {
499 if !options.wait {
500 self.outputs.clear();
501 cx.notify();
502 return;
503 }
504
505 // Create a marker to clear the output after we get in a new output
506 Output::from(OutputContent::ClearOutputWaitMarker)
507 }
508 JupyterMessageContent::Status(status) => {
509 match status.execution_state {
510 ExecutionState::Busy => {
511 self.status = ExecutionStatus::Executing;
512 }
513 ExecutionState::Idle => self.status = ExecutionStatus::Finished,
514 }
515 cx.notify();
516 return;
517 }
518 _msg => {
519 return;
520 }
521 };
522
523 // Check for a clear output marker as the previous output, so we can clear it out
524 if let Some(output) = self.outputs.last() {
525 if let OutputContent::ClearOutputWaitMarker = output.content {
526 self.outputs.clear();
527 }
528 }
529
530 self.outputs.push(output);
531
532 cx.notify();
533 }
534
535 pub fn update_display_data(
536 &mut self,
537 data: &MimeBundle,
538 display_id: &str,
539 cx: &mut ViewContext<Self>,
540 ) {
541 let mut any = false;
542
543 self.outputs.iter_mut().for_each(|output| {
544 if let Some(other_display_id) = output.display_id.as_ref() {
545 if other_display_id == display_id {
546 output.content = OutputContent::new(data, cx);
547 any = true;
548 }
549 }
550 });
551
552 if any {
553 cx.notify();
554 }
555 }
556
557 fn apply_terminal_text(
558 &mut self,
559 text: &str,
560 cx: &mut ViewContext<Self>,
561 ) -> Option<OutputContent> {
562 if let Some(last_output) = self.outputs.last_mut() {
563 match &mut last_output.content {
564 OutputContent::Stream(last_stream) => {
565 last_stream.append_text(text);
566 // Don't need to add a new output, we already have a terminal output
567 cx.notify();
568 return None;
569 }
570 // Edge case note: a clear output marker
571 OutputContent::ClearOutputWaitMarker => {
572 // Edge case note: a clear output marker is handled by the caller
573 // since we will return a new output at the end here as a new terminal output
574 }
575 // A different output type is "in the way", so we need to create a new output,
576 // which is the same as having no prior output
577 _ => {}
578 }
579 }
580
581 let mut new_terminal = TerminalOutput::new(cx);
582 new_terminal.append_text(text);
583 Some(OutputContent::Stream(new_terminal))
584 }
585}
586
587impl Render for ExecutionView {
588 fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
589 let status = match &self.status {
590 ExecutionStatus::ConnectingToKernel => Label::new("Connecting to kernel...")
591 .color(Color::Muted)
592 .into_any_element(),
593 ExecutionStatus::Executing => h_flex()
594 .gap_2()
595 .child(
596 Icon::new(IconName::ArrowCircle)
597 .size(IconSize::Small)
598 .color(Color::Muted)
599 .with_animation(
600 "arrow-circle",
601 Animation::new(Duration::from_secs(3)).repeat(),
602 |icon, delta| icon.transform(Transformation::rotate(percentage(delta))),
603 ),
604 )
605 .child(Label::new("Executing...").color(Color::Muted))
606 .into_any_element(),
607 ExecutionStatus::Finished => Icon::new(IconName::Check)
608 .size(IconSize::Small)
609 .into_any_element(),
610 ExecutionStatus::Unknown => Label::new("Unknown status")
611 .color(Color::Muted)
612 .into_any_element(),
613 ExecutionStatus::ShuttingDown => Label::new("Kernel shutting down...")
614 .color(Color::Muted)
615 .into_any_element(),
616 ExecutionStatus::Shutdown => Label::new("Kernel shutdown")
617 .color(Color::Muted)
618 .into_any_element(),
619 ExecutionStatus::Queued => Label::new("Queued...")
620 .color(Color::Muted)
621 .into_any_element(),
622 ExecutionStatus::KernelErrored(error) => Label::new(format!("Kernel error: {}", error))
623 .color(Color::Error)
624 .into_any_element(),
625 };
626
627 if self.outputs.len() == 0 {
628 return v_flex()
629 .min_h(cx.line_height())
630 .justify_center()
631 .child(status)
632 .into_any_element();
633 }
634
635 div()
636 .w_full()
637 .children(
638 self.outputs
639 .iter()
640 .filter_map(|output| output.content.render(cx)),
641 )
642 .children(match self.status {
643 ExecutionStatus::Executing => vec![status],
644 ExecutionStatus::Queued => vec![status],
645 _ => vec![],
646 })
647 .into_any_element()
648 }
649}