syntax_tree_view.rs

  1use editor::{scroll::Autoscroll, Anchor, Editor, ExcerptId};
  2use gpui::{
  3    actions, div, rems, uniform_list, AppContext, Div, EventEmitter, FocusHandle, FocusableView,
  4    Hsla, InteractiveElement, IntoElement, Model, MouseButton, MouseDownEvent, MouseMoveEvent,
  5    ParentElement, Render, SharedString, Styled, UniformListScrollHandle, View, ViewContext,
  6    VisualContext, WeakView, WindowContext,
  7};
  8use language::{Buffer, OwnedSyntaxLayer};
  9use std::{mem, ops::Range};
 10use theme::ActiveTheme;
 11use tree_sitter::{Node, TreeCursor};
 12use ui::{h_flex, ButtonLike, Color, ContextMenu, Label, LabelCommon, PopoverMenu};
 13use workspace::{
 14    item::{Item, ItemHandle},
 15    SplitDirection, ToolbarItemEvent, ToolbarItemLocation, ToolbarItemView, Workspace,
 16};
 17
 18actions!(debug, [OpenSyntaxTreeView]);
 19
 20pub fn init(cx: &mut AppContext) {
 21    cx.observe_new_views(|workspace: &mut Workspace, _| {
 22        workspace.register_action(|workspace, _: &OpenSyntaxTreeView, cx| {
 23            let active_item = workspace.active_item(cx);
 24            let workspace_handle = workspace.weak_handle();
 25            let syntax_tree_view =
 26                cx.new_view(|cx| SyntaxTreeView::new(workspace_handle, active_item, cx));
 27            workspace.split_item(SplitDirection::Right, Box::new(syntax_tree_view), cx)
 28        });
 29    })
 30    .detach();
 31}
 32
 33pub struct SyntaxTreeView {
 34    workspace_handle: WeakView<Workspace>,
 35    editor: Option<EditorState>,
 36    list_scroll_handle: UniformListScrollHandle,
 37    selected_descendant_ix: Option<usize>,
 38    hovered_descendant_ix: Option<usize>,
 39    focus_handle: FocusHandle,
 40}
 41
 42pub struct SyntaxTreeToolbarItemView {
 43    tree_view: Option<View<SyntaxTreeView>>,
 44    subscription: Option<gpui::Subscription>,
 45}
 46
 47struct EditorState {
 48    editor: View<Editor>,
 49    active_buffer: Option<BufferState>,
 50    _subscription: gpui::Subscription,
 51}
 52
 53#[derive(Clone)]
 54struct BufferState {
 55    buffer: Model<Buffer>,
 56    excerpt_id: ExcerptId,
 57    active_layer: Option<OwnedSyntaxLayer>,
 58}
 59
 60impl SyntaxTreeView {
 61    pub fn new(
 62        workspace_handle: WeakView<Workspace>,
 63        active_item: Option<Box<dyn ItemHandle>>,
 64        cx: &mut ViewContext<Self>,
 65    ) -> Self {
 66        let mut this = Self {
 67            workspace_handle: workspace_handle.clone(),
 68            list_scroll_handle: UniformListScrollHandle::new(),
 69            editor: None,
 70            hovered_descendant_ix: None,
 71            selected_descendant_ix: None,
 72            focus_handle: cx.focus_handle(),
 73        };
 74
 75        this.workspace_updated(active_item, cx);
 76        cx.observe(
 77            &workspace_handle.upgrade().unwrap(),
 78            |this, workspace, cx| {
 79                this.workspace_updated(workspace.read(cx).active_item(cx), cx);
 80            },
 81        )
 82        .detach();
 83
 84        this
 85    }
 86
 87    fn workspace_updated(
 88        &mut self,
 89        active_item: Option<Box<dyn ItemHandle>>,
 90        cx: &mut ViewContext<Self>,
 91    ) {
 92        if let Some(item) = active_item {
 93            if item.item_id() != cx.entity_id() {
 94                if let Some(editor) = item.act_as::<Editor>(cx) {
 95                    self.set_editor(editor, cx);
 96                }
 97            }
 98        }
 99    }
100
101    fn set_editor(&mut self, editor: View<Editor>, cx: &mut ViewContext<Self>) {
102        if let Some(state) = &self.editor {
103            if state.editor == editor {
104                return;
105            }
106            editor.update(cx, |editor, cx| {
107                editor.clear_background_highlights::<Self>(cx)
108            });
109        }
110
111        let subscription = cx.subscribe(&editor, |this, _, event, cx| {
112            let did_reparse = match event {
113                editor::EditorEvent::Reparsed(_) => true,
114                editor::EditorEvent::SelectionsChanged { .. } => false,
115                _ => return,
116            };
117            this.editor_updated(did_reparse, cx);
118        });
119
120        self.editor = Some(EditorState {
121            editor,
122            _subscription: subscription,
123            active_buffer: None,
124        });
125        self.editor_updated(true, cx);
126    }
127
128    fn editor_updated(&mut self, did_reparse: bool, cx: &mut ViewContext<Self>) -> Option<()> {
129        // Find which excerpt the cursor is in, and the position within that excerpted buffer.
130        let editor_state = self.editor.as_mut()?;
131        let (buffer, range, excerpt_id) = editor_state.editor.update(cx, |editor, cx| {
132            let selection_range = editor.selections.last::<usize>(cx).range();
133            editor
134                .buffer()
135                .read(cx)
136                .range_to_buffer_ranges(selection_range, cx)
137                .pop()
138        })?;
139
140        // If the cursor has moved into a different excerpt, retrieve a new syntax layer
141        // from that buffer.
142        let buffer_state = editor_state
143            .active_buffer
144            .get_or_insert_with(|| BufferState {
145                buffer: buffer.clone(),
146                excerpt_id,
147                active_layer: None,
148            });
149        let mut prev_layer = None;
150        if did_reparse {
151            prev_layer = buffer_state.active_layer.take();
152        }
153        if buffer_state.buffer != buffer || buffer_state.excerpt_id != excerpt_id {
154            buffer_state.buffer = buffer.clone();
155            buffer_state.excerpt_id = excerpt_id;
156            buffer_state.active_layer = None;
157        }
158
159        let layer = match &mut buffer_state.active_layer {
160            Some(layer) => layer,
161            None => {
162                let snapshot = buffer.read(cx).snapshot();
163                let layer = if let Some(prev_layer) = prev_layer {
164                    let prev_range = prev_layer.node().byte_range();
165                    snapshot
166                        .syntax_layers()
167                        .filter(|layer| layer.language == &prev_layer.language)
168                        .min_by_key(|layer| {
169                            let range = layer.node().byte_range();
170                            ((range.start as i64) - (prev_range.start as i64)).abs()
171                                + ((range.end as i64) - (prev_range.end as i64)).abs()
172                        })?
173                } else {
174                    snapshot.syntax_layers().next()?
175                };
176                buffer_state.active_layer.insert(layer.to_owned())
177            }
178        };
179
180        // Within the active layer, find the syntax node under the cursor,
181        // and scroll to it.
182        let mut cursor = layer.node().walk();
183        while cursor.goto_first_child_for_byte(range.start).is_some() {
184            if !range.is_empty() && cursor.node().end_byte() == range.start {
185                cursor.goto_next_sibling();
186            }
187        }
188
189        // Ascend to the smallest ancestor that contains the range.
190        loop {
191            let node_range = cursor.node().byte_range();
192            if node_range.start <= range.start && node_range.end >= range.end {
193                break;
194            }
195            if !cursor.goto_parent() {
196                break;
197            }
198        }
199
200        let descendant_ix = cursor.descendant_index();
201        self.selected_descendant_ix = Some(descendant_ix);
202        self.list_scroll_handle.scroll_to_item(descendant_ix);
203
204        cx.notify();
205        Some(())
206    }
207
208    fn update_editor_with_range_for_descendant_ix(
209        &self,
210        descendant_ix: usize,
211        cx: &mut ViewContext<Self>,
212        mut f: impl FnMut(&mut Editor, Range<Anchor>, &mut ViewContext<Editor>),
213    ) -> Option<()> {
214        let editor_state = self.editor.as_ref()?;
215        let buffer_state = editor_state.active_buffer.as_ref()?;
216        let layer = buffer_state.active_layer.as_ref()?;
217
218        // Find the node.
219        let mut cursor = layer.node().walk();
220        cursor.goto_descendant(descendant_ix);
221        let node = cursor.node();
222        let range = node.byte_range();
223
224        // Build a text anchor range.
225        let buffer = buffer_state.buffer.read(cx);
226        let range = buffer.anchor_before(range.start)..buffer.anchor_after(range.end);
227
228        // Build a multibuffer anchor range.
229        let multibuffer = editor_state.editor.read(cx).buffer();
230        let multibuffer = multibuffer.read(cx).snapshot(cx);
231        let excerpt_id = buffer_state.excerpt_id;
232        let range = multibuffer
233            .anchor_in_excerpt(excerpt_id, range.start)
234            .unwrap()
235            ..multibuffer
236                .anchor_in_excerpt(excerpt_id, range.end)
237                .unwrap();
238
239        // Update the editor with the anchor range.
240        editor_state.editor.update(cx, |editor, cx| {
241            f(editor, range, cx);
242        });
243        Some(())
244    }
245
246    fn render_node(cursor: &TreeCursor, depth: u32, selected: bool, cx: &AppContext) -> Div {
247        let colors = cx.theme().colors();
248        let mut row = h_flex();
249        if let Some(field_name) = cursor.field_name() {
250            row = row.children([Label::new(field_name).color(Color::Info), Label::new(": ")]);
251        }
252
253        let node = cursor.node();
254        row.child(if node.is_named() {
255            Label::new(node.kind()).color(Color::Default)
256        } else {
257            Label::new(format!("\"{}\"", node.kind())).color(Color::Created)
258        })
259        .child(
260            div()
261                .child(Label::new(format_node_range(node)).color(Color::Muted))
262                .pl_1(),
263        )
264        .text_bg(if selected {
265            colors.element_selected
266        } else {
267            Hsla::default()
268        })
269        .pl(rems(depth as f32))
270        .hover(|style| style.bg(colors.element_hover))
271    }
272}
273
274impl Render for SyntaxTreeView {
275    fn render(&mut self, cx: &mut gpui::ViewContext<'_, Self>) -> impl IntoElement {
276        let mut rendered = div().flex_1();
277
278        if let Some(layer) = self
279            .editor
280            .as_ref()
281            .and_then(|editor| editor.active_buffer.as_ref())
282            .and_then(|buffer| buffer.active_layer.as_ref())
283        {
284            let layer = layer.clone();
285            rendered = rendered.child(uniform_list(
286                cx.view().clone(),
287                "SyntaxTreeView",
288                layer.node().descendant_count(),
289                move |this, range, cx| {
290                    let mut items = Vec::new();
291                    let mut cursor = layer.node().walk();
292                    let mut descendant_ix = range.start;
293                    cursor.goto_descendant(descendant_ix);
294                    let mut depth = cursor.depth();
295                    let mut visited_children = false;
296                    while descendant_ix < range.end {
297                        if visited_children {
298                            if cursor.goto_next_sibling() {
299                                visited_children = false;
300                            } else if cursor.goto_parent() {
301                                depth -= 1;
302                            } else {
303                                break;
304                            }
305                        } else {
306                            items.push(
307                                Self::render_node(
308                                    &cursor,
309                                    depth,
310                                    Some(descendant_ix) == this.selected_descendant_ix,
311                                    cx,
312                                )
313                                .on_mouse_down(
314                                    MouseButton::Left,
315                                    cx.listener(move |tree_view, _: &MouseDownEvent, cx| {
316                                        tree_view.update_editor_with_range_for_descendant_ix(
317                                            descendant_ix,
318                                            cx,
319                                            |editor, mut range, cx| {
320                                                // Put the cursor at the beginning of the node.
321                                                mem::swap(&mut range.start, &mut range.end);
322
323                                                editor.change_selections(
324                                                    Some(Autoscroll::newest()),
325                                                    cx,
326                                                    |selections| {
327                                                        selections.select_ranges(vec![range]);
328                                                    },
329                                                );
330                                            },
331                                        );
332                                    }),
333                                )
334                                .on_mouse_move(cx.listener(
335                                    move |tree_view, _: &MouseMoveEvent, cx| {
336                                        if tree_view.hovered_descendant_ix != Some(descendant_ix) {
337                                            tree_view.hovered_descendant_ix = Some(descendant_ix);
338                                            tree_view.update_editor_with_range_for_descendant_ix(descendant_ix, cx, |editor, range, cx| {
339                                                editor.clear_background_highlights::<Self>(cx);
340                                                editor.highlight_background::<Self>(
341                                                    &[range],
342                                                    |theme| theme.editor_document_highlight_write_background,
343                                                    cx,
344                                                );
345                                            });
346                                            cx.notify();
347                                        }
348                                    },
349                                )),
350                            );
351                            descendant_ix += 1;
352                            if cursor.goto_first_child() {
353                                depth += 1;
354                            } else {
355                                visited_children = true;
356                            }
357                        }
358                    }
359                    items
360                },
361            )
362            .size_full()
363            .track_scroll(self.list_scroll_handle.clone())
364            .text_bg(cx.theme().colors().background).into_any_element());
365        }
366
367        rendered
368    }
369}
370
371impl EventEmitter<()> for SyntaxTreeView {}
372
373impl FocusableView for SyntaxTreeView {
374    fn focus_handle(&self, _: &AppContext) -> gpui::FocusHandle {
375        self.focus_handle.clone()
376    }
377}
378
379impl Item for SyntaxTreeView {
380    type Event = ();
381
382    fn to_item_events(_: &Self::Event, _: impl FnMut(workspace::item::ItemEvent)) {}
383
384    fn tab_content_text(&self, _cx: &WindowContext) -> Option<SharedString> {
385        Some("Syntax Tree".into())
386    }
387
388    fn telemetry_event_text(&self) -> Option<&'static str> {
389        None
390    }
391
392    fn clone_on_split(
393        &self,
394        _: Option<workspace::WorkspaceId>,
395        cx: &mut ViewContext<Self>,
396    ) -> Option<View<Self>>
397    where
398        Self: Sized,
399    {
400        Some(cx.new_view(|cx| {
401            let mut clone = Self::new(self.workspace_handle.clone(), None, cx);
402            if let Some(editor) = &self.editor {
403                clone.set_editor(editor.editor.clone(), cx)
404            }
405            clone
406        }))
407    }
408}
409
410impl Default for SyntaxTreeToolbarItemView {
411    fn default() -> Self {
412        Self::new()
413    }
414}
415
416impl SyntaxTreeToolbarItemView {
417    pub fn new() -> Self {
418        Self {
419            tree_view: None,
420            subscription: None,
421        }
422    }
423
424    fn render_menu(&mut self, cx: &mut ViewContext<'_, Self>) -> Option<PopoverMenu<ContextMenu>> {
425        let tree_view = self.tree_view.as_ref()?;
426        let tree_view = tree_view.read(cx);
427
428        let editor_state = tree_view.editor.as_ref()?;
429        let buffer_state = editor_state.active_buffer.as_ref()?;
430        let active_layer = buffer_state.active_layer.clone()?;
431        let active_buffer = buffer_state.buffer.read(cx).snapshot();
432
433        let view = cx.view().clone();
434        Some(
435            PopoverMenu::new("Syntax Tree")
436                .trigger(Self::render_header(&active_layer))
437                .menu(move |cx| {
438                    ContextMenu::build(cx, |mut menu, cx| {
439                        for (layer_ix, layer) in active_buffer.syntax_layers().enumerate() {
440                            menu = menu.entry(
441                                format!(
442                                    "{} {}",
443                                    layer.language.name(),
444                                    format_node_range(layer.node())
445                                ),
446                                None,
447                                cx.handler_for(&view, move |view, cx| {
448                                    view.select_layer(layer_ix, cx);
449                                }),
450                            );
451                        }
452                        menu
453                    })
454                    .into()
455                }),
456        )
457    }
458
459    fn select_layer(&mut self, layer_ix: usize, cx: &mut ViewContext<Self>) -> Option<()> {
460        let tree_view = self.tree_view.as_ref()?;
461        tree_view.update(cx, |view, cx| {
462            let editor_state = view.editor.as_mut()?;
463            let buffer_state = editor_state.active_buffer.as_mut()?;
464            let snapshot = buffer_state.buffer.read(cx).snapshot();
465            let layer = snapshot.syntax_layers().nth(layer_ix)?;
466            buffer_state.active_layer = Some(layer.to_owned());
467            view.selected_descendant_ix = None;
468            cx.notify();
469            view.focus_handle.focus(cx);
470            Some(())
471        })
472    }
473
474    fn render_header(active_layer: &OwnedSyntaxLayer) -> ButtonLike {
475        ButtonLike::new("syntax tree header")
476            .child(Label::new(active_layer.language.name().0))
477            .child(Label::new(format_node_range(active_layer.node())))
478    }
479}
480
481fn format_node_range(node: Node) -> String {
482    let start = node.start_position();
483    let end = node.end_position();
484    format!(
485        "[{}:{} - {}:{}]",
486        start.row + 1,
487        start.column + 1,
488        end.row + 1,
489        end.column + 1,
490    )
491}
492
493impl Render for SyntaxTreeToolbarItemView {
494    fn render(&mut self, cx: &mut ViewContext<'_, Self>) -> impl IntoElement {
495        self.render_menu(cx)
496            .unwrap_or_else(|| PopoverMenu::new("Empty Syntax Tree"))
497    }
498}
499
500impl EventEmitter<ToolbarItemEvent> for SyntaxTreeToolbarItemView {}
501
502impl ToolbarItemView for SyntaxTreeToolbarItemView {
503    fn set_active_pane_item(
504        &mut self,
505        active_pane_item: Option<&dyn ItemHandle>,
506        cx: &mut ViewContext<Self>,
507    ) -> ToolbarItemLocation {
508        if let Some(item) = active_pane_item {
509            if let Some(view) = item.downcast::<SyntaxTreeView>() {
510                self.tree_view = Some(view.clone());
511                self.subscription = Some(cx.observe(&view, |_, _, cx| cx.notify()));
512                return ToolbarItemLocation::PrimaryLeft;
513            }
514        }
515        self.tree_view = None;
516        self.subscription = None;
517        ToolbarItemLocation::Hidden
518    }
519}