ui/components/pane/
render.rs

1//! [`Render`] impl for [`super::Pane`] — the tab strip (with close/add
2//! affordances and drag-to-reorder) plus the active tab's content.
3
4use gpui::Empty;
5
6use super::Pane;
7use crate::{IconButton, IconName, IconSize, Tab, TabBar, prelude::*};
8
9/// Bare `IconButton::new`'s own default `debug_selector` (`"ICON-{icon:?}"`)
10/// collides across every tab sharing the same icon within a `Pane` — this
11/// wraps it in a `div` carrying a per-instance selector instead. The wrapper
12/// does not intercept clicks; the inner `IconButton` still owns the only
13/// click handler (mirrors `ActionPanel`'s Save/Cancel wrapper precedent).
14fn debug_wrap(id: impl Into<ElementId>, selector: String, child: IconButton) -> impl IntoElement {
15    div().id(id).debug_selector(move || selector).child(child)
16}
17
18/// Drag payload used for reordering tabs within a [`Pane`]'s tab strip.
19#[derive(Clone, Copy)]
20struct TabDragPayload {
21    from_idx: usize,
22}
23
24impl Render for Pane {
25    fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
26        let active_idx = self.active_idx;
27        let mut tab_bar = TabBar::new("pane-tab-bar");
28
29        for ix in 0..self.tabs.len() {
30            let tab_id = self.tabs[ix].0;
31            let title = self.tabs[ix].1.title();
32            let selected = ix == active_idx;
33
34            let close_button = debug_wrap(
35                ("pane-tab-close-wrap", tab_id.0),
36                format!("PANE-TAB-CLOSE-{}", tab_id.0),
37                IconButton::new(("pane-tab-close", tab_id.0), IconName::Close)
38                    .icon_size(IconSize::XSmall)
39                    .on_click(cx.listener(move |this, _, _, cx| {
40                        this.close_tab(ix, cx);
41                    })),
42            );
43
44            let tab = Tab::new(("pane-tab", tab_id.0))
45                .toggle_state(selected)
46                .end_slot(close_button)
47                .child(title)
48                .on_click(cx.listener(move |this, _, _, cx| {
49                    this.activate(ix, cx);
50                }))
51                .on_drag(TabDragPayload { from_idx: ix }, |_, _, _, cx| {
52                    cx.new(|_| Empty)
53                })
54                .drag_over::<TabDragPayload>(|style, _, _, _| style.opacity(0.5))
55                .on_drop(cx.listener(move |this, payload: &TabDragPayload, _, cx| {
56                    this.reorder(payload.from_idx, ix, cx);
57                }));
58
59            tab_bar = tab_bar.child(tab);
60        }
61
62        tab_bar = tab_bar.end_child(debug_wrap(
63            "pane-add-tab-wrap",
64            "PANE-ADD-TAB".to_string(),
65            IconButton::new("pane-add-tab", IconName::Plus)
66                .icon_size(IconSize::XSmall)
67                .on_click(cx.listener(|this, _, _, cx| {
68                    let content = (this.new_tab_factory)();
69                    this.add_tab(content, cx);
70                })),
71        ));
72
73        let content = self
74            .tabs
75            .get(active_idx)
76            .map(|(_, content)| content.render(true, window, cx));
77
78        v_flex()
79            .id("pane")
80            .size_full()
81            .child(tab_bar)
82            .child(div().flex_1().min_h_0().overflow_hidden().children(content))
83    }
84}
ui/components/pane/render.rs

ui/components/pane/
render.rs
