commit_modal.rs

  1// #![allow(unused, dead_code)]
  2
  3use crate::branch_picker::{self, BranchList};
  4use crate::git_panel::{commit_message_editor, GitPanel};
  5use git::{Commit, GenerateCommitMessage};
  6use panel::{panel_button, panel_editor_style, panel_filled_button};
  7use ui::{prelude::*, KeybindingHint, PopoverMenu, PopoverMenuHandle, Tooltip};
  8
  9use editor::{Editor, EditorElement};
 10use gpui::*;
 11use util::ResultExt;
 12use workspace::{
 13    dock::{Dock, PanelHandle},
 14    ModalView, Workspace,
 15};
 16
 17// nate: It is a pain to get editors to size correctly and not overflow.
 18//
 19// this can get replaced with a simple flex layout with more time/a more thoughtful approach.
 20#[derive(Debug, Clone, Copy)]
 21pub struct ModalContainerProperties {
 22    pub modal_width: f32,
 23    pub editor_height: f32,
 24    pub footer_height: f32,
 25    pub container_padding: f32,
 26    pub modal_border_radius: f32,
 27}
 28
 29impl ModalContainerProperties {
 30    pub fn new(window: &Window, preferred_char_width: usize) -> Self {
 31        let container_padding = 5.0;
 32
 33        // Calculate width based on character width
 34        let mut modal_width = 460.0;
 35        let style = window.text_style().clone();
 36        let font_id = window.text_system().resolve_font(&style.font());
 37        let font_size = style.font_size.to_pixels(window.rem_size());
 38
 39        if let Ok(em_width) = window.text_system().em_width(font_id, font_size) {
 40            modal_width = preferred_char_width as f32 * em_width.0 + (container_padding * 2.0);
 41        }
 42
 43        Self {
 44            modal_width,
 45            editor_height: 300.0,
 46            footer_height: 24.0,
 47            container_padding,
 48            modal_border_radius: 12.0,
 49        }
 50    }
 51
 52    pub fn editor_border_radius(&self) -> Pixels {
 53        px(self.modal_border_radius - self.container_padding / 2.0)
 54    }
 55}
 56
 57pub fn init(cx: &mut App) {
 58    cx.observe_new(|workspace: &mut Workspace, window, cx| {
 59        let Some(window) = window else {
 60            return;
 61        };
 62        CommitModal::register(workspace, window, cx)
 63    })
 64    .detach();
 65}
 66
 67pub struct CommitModal {
 68    git_panel: Entity<GitPanel>,
 69    commit_editor: Entity<Editor>,
 70    restore_dock: RestoreDock,
 71    properties: ModalContainerProperties,
 72    branch_list_handle: PopoverMenuHandle<BranchList>,
 73}
 74
 75impl Focusable for CommitModal {
 76    fn focus_handle(&self, cx: &App) -> gpui::FocusHandle {
 77        self.commit_editor.focus_handle(cx)
 78    }
 79}
 80
 81impl EventEmitter<DismissEvent> for CommitModal {}
 82impl ModalView for CommitModal {
 83    fn on_before_dismiss(
 84        &mut self,
 85        window: &mut Window,
 86        cx: &mut Context<Self>,
 87    ) -> workspace::DismissDecision {
 88        self.git_panel.update(cx, |git_panel, cx| {
 89            git_panel.set_modal_open(false, cx);
 90        });
 91        self.restore_dock
 92            .dock
 93            .update(cx, |dock, cx| {
 94                if let Some(active_index) = self.restore_dock.active_index {
 95                    dock.activate_panel(active_index, window, cx)
 96                }
 97                dock.set_open(self.restore_dock.is_open, window, cx)
 98            })
 99            .log_err();
100        workspace::DismissDecision::Dismiss(true)
101    }
102}
103
104struct RestoreDock {
105    dock: WeakEntity<Dock>,
106    is_open: bool,
107    active_index: Option<usize>,
108}
109
110impl CommitModal {
111    pub fn register(workspace: &mut Workspace, _: &mut Window, _cx: &mut Context<Workspace>) {
112        workspace.register_action(|workspace, _: &Commit, window, cx| {
113            CommitModal::toggle(workspace, window, cx);
114        });
115    }
116
117    pub fn toggle(workspace: &mut Workspace, window: &mut Window, cx: &mut Context<'_, Workspace>) {
118        let Some(git_panel) = workspace.panel::<GitPanel>(cx) else {
119            return;
120        };
121
122        git_panel.update(cx, |git_panel, cx| {
123            git_panel.set_modal_open(true, cx);
124        });
125
126        let dock = workspace.dock_at_position(git_panel.position(window, cx));
127        let is_open = dock.read(cx).is_open();
128        let active_index = dock.read(cx).active_panel_index();
129        let dock = dock.downgrade();
130        let restore_dock_position = RestoreDock {
131            dock,
132            is_open,
133            active_index,
134        };
135
136        workspace.open_panel::<GitPanel>(window, cx);
137        workspace.toggle_modal(window, cx, move |window, cx| {
138            CommitModal::new(git_panel, restore_dock_position, window, cx)
139        })
140    }
141
142    fn new(
143        git_panel: Entity<GitPanel>,
144        restore_dock: RestoreDock,
145        window: &mut Window,
146        cx: &mut Context<Self>,
147    ) -> Self {
148        let panel = git_panel.read(cx);
149        let suggested_commit_message = panel.suggest_commit_message();
150
151        let commit_editor = git_panel.update(cx, |git_panel, cx| {
152            git_panel.set_modal_open(true, cx);
153            let buffer = git_panel.commit_message_buffer(cx).clone();
154            let panel_editor = git_panel.commit_editor.clone();
155            let project = git_panel.project.clone();
156
157            cx.new(|cx| {
158                let mut editor =
159                    commit_message_editor(buffer, None, project.clone(), false, window, cx);
160                editor.sync_selections(panel_editor, cx).detach();
161
162                editor
163            })
164        });
165
166        let commit_message = commit_editor.read(cx).text(cx);
167
168        if let Some(suggested_commit_message) = suggested_commit_message {
169            if commit_message.is_empty() {
170                commit_editor.update(cx, |editor, cx| {
171                    editor.set_placeholder_text(suggested_commit_message, cx);
172                });
173            }
174        }
175
176        let focus_handle = commit_editor.focus_handle(cx);
177
178        cx.on_focus_out(&focus_handle, window, |this, _, window, cx| {
179            if !this.branch_list_handle.is_focused(window, cx) {
180                cx.emit(DismissEvent);
181            }
182        })
183        .detach();
184
185        let properties = ModalContainerProperties::new(window, 50);
186
187        Self {
188            git_panel,
189            commit_editor,
190            restore_dock,
191            properties,
192            branch_list_handle: PopoverMenuHandle::default(),
193        }
194    }
195
196    fn commit_editor_element(&self, window: &mut Window, cx: &mut Context<Self>) -> EditorElement {
197        let editor_style = panel_editor_style(true, window, cx);
198        EditorElement::new(&self.commit_editor, editor_style)
199    }
200
201    pub fn render_commit_editor(
202        &self,
203        window: &mut Window,
204        cx: &mut Context<Self>,
205    ) -> impl IntoElement {
206        let properties = self.properties;
207        let padding_t = 3.0;
208        let padding_b = 6.0;
209        // magic number for editor not to overflow the container??
210        let extra_space_hack = 1.5 * window.line_height();
211
212        v_flex()
213            .h(px(properties.editor_height + padding_b + padding_t) + extra_space_hack)
214            .w_full()
215            .flex_none()
216            .rounded(properties.editor_border_radius())
217            .overflow_hidden()
218            .px_1p5()
219            .pt(px(padding_t))
220            .pb(px(padding_b))
221            .child(
222                div()
223                    .h(px(properties.editor_height))
224                    .w_full()
225                    .child(self.commit_editor_element(window, cx)),
226            )
227    }
228
229    pub fn render_footer(&self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
230        let (can_commit, tooltip, commit_label, co_authors, generate_commit_message, active_repo) =
231            self.git_panel.update(cx, |git_panel, cx| {
232                let (can_commit, tooltip) = git_panel.configure_commit_button(cx);
233                let title = git_panel.commit_button_title();
234                let co_authors = git_panel.render_co_authors(cx);
235                let generate_commit_message = git_panel.render_generate_commit_message_button(cx);
236                let active_repo = git_panel.active_repository.clone();
237                (
238                    can_commit,
239                    tooltip,
240                    title,
241                    co_authors,
242                    generate_commit_message,
243                    active_repo,
244                )
245            });
246
247        let branch = active_repo
248            .as_ref()
249            .and_then(|repo| repo.read(cx).repository_entry.branch())
250            .map(|b| b.name.clone())
251            .unwrap_or_else(|| "<no branch>".into());
252
253        let branch_picker_button = panel_button(branch)
254            .icon(IconName::GitBranch)
255            .icon_size(IconSize::Small)
256            .icon_color(Color::Placeholder)
257            .color(Color::Muted)
258            .icon_position(IconPosition::Start)
259            .tooltip(Tooltip::for_action_title(
260                "Switch Branch",
261                &zed_actions::git::Branch,
262            ))
263            .on_click(cx.listener(|_, _, window, cx| {
264                window.dispatch_action(zed_actions::git::Branch.boxed_clone(), cx);
265            }))
266            .style(ButtonStyle::Transparent);
267
268        let branch_picker = PopoverMenu::new("popover-button")
269            .menu(move |window, cx| Some(branch_picker::popover(active_repo.clone(), window, cx)))
270            .with_handle(self.branch_list_handle.clone())
271            .trigger_with_tooltip(
272                branch_picker_button,
273                Tooltip::for_action_title("Switch Branch", &zed_actions::git::Branch),
274            )
275            .anchor(Corner::BottomLeft)
276            .offset(gpui::Point {
277                x: px(0.0),
278                y: px(-2.0),
279            });
280        let focus_handle = self.focus_handle(cx);
281
282        let close_kb_hint =
283            if let Some(close_kb) = ui::KeyBinding::for_action(&menu::Cancel, window, cx) {
284                Some(
285                    KeybindingHint::new(close_kb, cx.theme().colors().editor_background)
286                        .suffix("Cancel"),
287                )
288            } else {
289                None
290            };
291
292        let commit_button = panel_filled_button(commit_label)
293            .tooltip({
294                let panel_editor_focus_handle = focus_handle.clone();
295                move |window, cx| {
296                    Tooltip::for_action_in(tooltip, &Commit, &panel_editor_focus_handle, window, cx)
297                }
298            })
299            .disabled(!can_commit)
300            .on_click(cx.listener(move |this, _: &ClickEvent, window, cx| {
301                telemetry::event!("Git Committed", source = "Git Modal");
302                this.git_panel
303                    .update(cx, |git_panel, cx| git_panel.commit_changes(window, cx));
304                cx.emit(DismissEvent);
305            }));
306
307        h_flex()
308            .group("commit_editor_footer")
309            .flex_none()
310            .w_full()
311            .items_center()
312            .justify_between()
313            .w_full()
314            .h(px(self.properties.footer_height))
315            .gap_1()
316            .child(
317                h_flex()
318                    .gap_1()
319                    .flex_shrink()
320                    .overflow_x_hidden()
321                    .child(
322                        h_flex()
323                            .flex_shrink()
324                            .overflow_x_hidden()
325                            .child(branch_picker),
326                    )
327                    .children(generate_commit_message)
328                    .children(co_authors),
329            )
330            .child(div().flex_1())
331            .child(
332                h_flex()
333                    .items_center()
334                    .justify_end()
335                    .flex_none()
336                    .px_1()
337                    .gap_4()
338                    .children(close_kb_hint)
339                    .child(commit_button),
340            )
341    }
342
343    fn dismiss(&mut self, _: &menu::Cancel, _: &mut Window, cx: &mut Context<Self>) {
344        cx.emit(DismissEvent);
345    }
346
347    fn commit(&mut self, _: &git::Commit, window: &mut Window, cx: &mut Context<Self>) {
348        telemetry::event!("Git Committed", source = "Git Modal");
349        self.git_panel
350            .update(cx, |git_panel, cx| git_panel.commit_changes(window, cx));
351        cx.emit(DismissEvent);
352    }
353
354    fn toggle_branch_selector(&mut self, window: &mut Window, cx: &mut Context<Self>) {
355        if self.branch_list_handle.is_focused(window, cx) {
356            self.focus_handle(cx).focus(window)
357        } else {
358            self.branch_list_handle.toggle(window, cx);
359        }
360    }
361}
362
363impl Render for CommitModal {
364    fn render(&mut self, window: &mut Window, cx: &mut Context<'_, Self>) -> impl IntoElement {
365        let properties = self.properties;
366        let width = px(properties.modal_width);
367        let container_padding = px(properties.container_padding);
368        let border_radius = properties.modal_border_radius;
369        let editor_focus_handle = self.commit_editor.focus_handle(cx);
370
371        v_flex()
372            .id("commit-modal")
373            .key_context("GitCommit")
374            .on_action(cx.listener(Self::dismiss))
375            .on_action(cx.listener(Self::commit))
376            .on_action(cx.listener(|this, _: &GenerateCommitMessage, _, cx| {
377                this.git_panel.update(cx, |panel, cx| {
378                    panel.generate_commit_message(cx);
379                })
380            }))
381            .on_action(
382                cx.listener(|this, _: &zed_actions::git::Branch, window, cx| {
383                    this.toggle_branch_selector(window, cx);
384                }),
385            )
386            .on_action(
387                cx.listener(|this, _: &zed_actions::git::CheckoutBranch, window, cx| {
388                    this.toggle_branch_selector(window, cx);
389                }),
390            )
391            .on_action(
392                cx.listener(|this, _: &zed_actions::git::Switch, window, cx| {
393                    this.toggle_branch_selector(window, cx);
394                }),
395            )
396            .elevation_3(cx)
397            .overflow_hidden()
398            .flex_none()
399            .relative()
400            .bg(cx.theme().colors().elevated_surface_background)
401            .rounded(px(border_radius))
402            .border_1()
403            .border_color(cx.theme().colors().border)
404            .w(width)
405            .p(container_padding)
406            .child(
407                v_flex()
408                    .id("editor-container")
409                    .justify_between()
410                    .p_2()
411                    .size_full()
412                    .gap_2()
413                    .rounded(properties.editor_border_radius())
414                    .overflow_hidden()
415                    .cursor_text()
416                    .bg(cx.theme().colors().editor_background)
417                    .border_1()
418                    .border_color(cx.theme().colors().border_variant)
419                    .on_click(cx.listener(move |_, _: &ClickEvent, window, _cx| {
420                        window.focus(&editor_focus_handle);
421                    }))
422                    .child(
423                        div()
424                            .flex_1()
425                            .size_full()
426                            .child(self.render_commit_editor(window, cx)),
427                    )
428                    .child(self.render_footer(window, cx)),
429            )
430    }
431}