outputs.rs

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