title_bar.rs

  1mod application_menu;
  2mod collab;
  3mod platforms;
  4mod window_controls;
  5
  6#[cfg(feature = "stories")]
  7mod stories;
  8
  9use crate::application_menu::ApplicationMenu;
 10use crate::platforms::{platform_linux, platform_mac, platform_windows};
 11use auto_update::AutoUpdateStatus;
 12use call::ActiveCall;
 13use client::{Client, UserStore};
 14use feature_flags::{FeatureFlagAppExt, ZedPro};
 15use gpui::{
 16    actions, div, px, Action, AnyElement, AppContext, Decorations, Element, InteractiveElement,
 17    Interactivity, IntoElement, Model, MouseButton, ParentElement, Render, Stateful,
 18    StatefulInteractiveElement, Styled, Subscription, View, ViewContext, VisualContext, WeakView,
 19};
 20use project::{Project, RepositoryEntry};
 21use recent_projects::RecentProjects;
 22use rpc::proto::{self, DevServerStatus};
 23use smallvec::SmallVec;
 24use std::sync::Arc;
 25use theme::ActiveTheme;
 26use ui::{
 27    h_flex, prelude::*, Avatar, Button, ButtonLike, ButtonStyle, ContextMenu, Icon, IconName,
 28    Indicator, PopoverMenu, Tooltip,
 29};
 30use util::ResultExt;
 31use vcs_menu::{BranchList, OpenRecent as ToggleVcsMenu};
 32use workspace::{notifications::NotifyResultExt, Workspace};
 33
 34#[cfg(feature = "stories")]
 35pub use stories::*;
 36
 37const MAX_PROJECT_NAME_LENGTH: usize = 40;
 38const MAX_BRANCH_NAME_LENGTH: usize = 40;
 39
 40actions!(
 41    collab,
 42    [
 43        ShareProject,
 44        UnshareProject,
 45        ToggleUserMenu,
 46        ToggleProjectMenu,
 47        SwitchBranch
 48    ]
 49);
 50
 51pub fn init(cx: &mut AppContext) {
 52    cx.observe_new_views(|workspace: &mut Workspace, cx| {
 53        let item = cx.new_view(|cx| TitleBar::new("title-bar", workspace, cx));
 54        workspace.set_titlebar_item(item.into(), cx)
 55    })
 56    .detach();
 57}
 58
 59pub struct TitleBar {
 60    platform_style: PlatformStyle,
 61    content: Stateful<Div>,
 62    children: SmallVec<[AnyElement; 2]>,
 63    project: Model<Project>,
 64    user_store: Model<UserStore>,
 65    client: Arc<Client>,
 66    workspace: WeakView<Workspace>,
 67    should_move: bool,
 68    application_menu: Option<View<ApplicationMenu>>,
 69    _subscriptions: Vec<Subscription>,
 70}
 71
 72impl Render for TitleBar {
 73    fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
 74        let close_action = Box::new(workspace::CloseWindow);
 75        let height = Self::height(cx);
 76        let supported_controls = cx.window_controls();
 77        let decorations = cx.window_decorations();
 78        let titlebar_color = if cfg!(target_os = "linux") {
 79            if cx.is_window_active() && !self.should_move {
 80                cx.theme().colors().title_bar_background
 81            } else {
 82                cx.theme().colors().title_bar_inactive_background
 83            }
 84        } else {
 85            cx.theme().colors().title_bar_background
 86        };
 87
 88        h_flex()
 89            .id("titlebar")
 90            .w_full()
 91            .h(height)
 92            .map(|this| {
 93                if cx.is_fullscreen() {
 94                    this.pl_2()
 95                } else if self.platform_style == PlatformStyle::Mac {
 96                    this.pl(px(platform_mac::TRAFFIC_LIGHT_PADDING))
 97                } else {
 98                    this.pl_2()
 99                }
100            })
101            .map(|el| match decorations {
102                Decorations::Server => el,
103                Decorations::Client { tiling, .. } => el
104                    .when(!(tiling.top || tiling.right), |el| {
105                        el.rounded_tr(theme::CLIENT_SIDE_DECORATION_ROUNDING)
106                    })
107                    .when(!(tiling.top || tiling.left), |el| {
108                        el.rounded_tl(theme::CLIENT_SIDE_DECORATION_ROUNDING)
109                    })
110                    // this border is to avoid a transparent gap in the rounded corners
111                    .mt(px(-1.))
112                    .border(px(1.))
113                    .border_color(titlebar_color),
114            })
115            .bg(titlebar_color)
116            .content_stretch()
117            .child(
118                div()
119                    .id("titlebar-content")
120                    .flex()
121                    .flex_row()
122                    .justify_between()
123                    .w_full()
124                    // Note: On Windows the title bar behavior is handled by the platform implementation.
125                    .when(self.platform_style != PlatformStyle::Windows, |this| {
126                        this.on_click(|event, cx| {
127                            if event.up.click_count == 2 {
128                                cx.zoom_window();
129                            }
130                        })
131                    })
132                    .child(
133                        h_flex()
134                            .gap_1()
135                            .when_some(self.application_menu.clone(), |this, menu| this.child(menu))
136                            .children(self.render_project_host(cx))
137                            .child(self.render_project_name(cx))
138                            .children(self.render_project_branch(cx))
139                            .on_mouse_down(MouseButton::Left, |_, cx| cx.stop_propagation()),
140                    )
141                    .child(self.render_collaborator_list(cx))
142                    .child(
143                        h_flex()
144                            .gap_1()
145                            .pr_1()
146                            .on_mouse_down(MouseButton::Left, |_, cx| cx.stop_propagation())
147                            .children(self.render_call_controls(cx))
148                            .map(|el| {
149                                let status = self.client.status();
150                                let status = &*status.borrow();
151                                if matches!(status, client::Status::Connected { .. }) {
152                                    el.child(self.render_user_menu_button(cx))
153                                } else {
154                                    el.children(self.render_connection_status(status, cx))
155                                        .child(self.render_sign_in_button(cx))
156                                        .child(self.render_user_menu_button(cx))
157                                }
158                            }),
159                    ),
160            )
161            .when(!cx.is_fullscreen(), |title_bar| match self.platform_style {
162                PlatformStyle::Mac => title_bar,
163                PlatformStyle::Linux => {
164                    if matches!(decorations, Decorations::Client { .. }) {
165                        title_bar
166                            .child(platform_linux::LinuxWindowControls::new(close_action))
167                            .when(supported_controls.window_menu, |titlebar| {
168                                titlebar.on_mouse_down(gpui::MouseButton::Right, move |ev, cx| {
169                                    cx.show_window_menu(ev.position)
170                                })
171                            })
172                            .on_mouse_move(cx.listener(move |this, _ev, cx| {
173                                if this.should_move {
174                                    this.should_move = false;
175                                    cx.start_window_move();
176                                }
177                            }))
178                            .on_mouse_down_out(cx.listener(move |this, _ev, _cx| {
179                                this.should_move = false;
180                            }))
181                            .on_mouse_up(
182                                gpui::MouseButton::Left,
183                                cx.listener(move |this, _ev, _cx| {
184                                    this.should_move = false;
185                                }),
186                            )
187                            .on_mouse_down(
188                                gpui::MouseButton::Left,
189                                cx.listener(move |this, _ev, _cx| {
190                                    this.should_move = true;
191                                }),
192                            )
193                    } else {
194                        title_bar
195                    }
196                }
197                PlatformStyle::Windows => {
198                    title_bar.child(platform_windows::WindowsWindowControls::new(height))
199                }
200            })
201    }
202}
203
204impl TitleBar {
205    pub fn new(
206        id: impl Into<ElementId>,
207        workspace: &Workspace,
208        cx: &mut ViewContext<Self>,
209    ) -> Self {
210        let project = workspace.project().clone();
211        let user_store = workspace.app_state().user_store.clone();
212        let client = workspace.app_state().client.clone();
213        let active_call = ActiveCall::global(cx);
214
215        let platform_style = PlatformStyle::platform();
216        let application_menu = match platform_style {
217            PlatformStyle::Mac => None,
218            PlatformStyle::Linux | PlatformStyle::Windows => {
219                Some(cx.new_view(ApplicationMenu::new))
220            }
221        };
222
223        let mut subscriptions = Vec::new();
224        subscriptions.push(
225            cx.observe(&workspace.weak_handle().upgrade().unwrap(), |_, _, cx| {
226                cx.notify()
227            }),
228        );
229        subscriptions.push(cx.observe(&project, |_, _, cx| cx.notify()));
230        subscriptions.push(cx.observe(&active_call, |this, _, cx| this.active_call_changed(cx)));
231        subscriptions.push(cx.observe_window_activation(Self::window_activation_changed));
232        subscriptions.push(cx.observe(&user_store, |_, _, cx| cx.notify()));
233
234        Self {
235            platform_style,
236            content: div().id(id.into()),
237            children: SmallVec::new(),
238            application_menu,
239            workspace: workspace.weak_handle(),
240            should_move: false,
241            project,
242            user_store,
243            client,
244            _subscriptions: subscriptions,
245        }
246    }
247
248    #[cfg(not(target_os = "windows"))]
249    pub fn height(cx: &mut WindowContext) -> Pixels {
250        (1.75 * cx.rem_size()).max(px(34.))
251    }
252
253    #[cfg(target_os = "windows")]
254    pub fn height(_cx: &mut WindowContext) -> Pixels {
255        // todo(windows) instead of hard coded size report the actual size to the Windows platform API
256        px(32.)
257    }
258
259    /// Sets the platform style.
260    pub fn platform_style(mut self, style: PlatformStyle) -> Self {
261        self.platform_style = style;
262        self
263    }
264
265    pub fn render_project_host(&self, cx: &mut ViewContext<Self>) -> Option<AnyElement> {
266        if let Some(dev_server) =
267            self.project
268                .read(cx)
269                .dev_server_project_id()
270                .and_then(|dev_server_project_id| {
271                    dev_server_projects::Store::global(cx)
272                        .read(cx)
273                        .dev_server_for_project(dev_server_project_id)
274                })
275        {
276            return Some(
277                ButtonLike::new("dev_server_trigger")
278                    .child(Indicator::dot().color(
279                        if dev_server.status == DevServerStatus::Online {
280                            Color::Created
281                        } else {
282                            Color::Disabled
283                        },
284                    ))
285                    .child(
286                        Label::new(dev_server.name.clone())
287                            .size(LabelSize::Small)
288                            .line_height_style(LineHeightStyle::UiLabel),
289                    )
290                    .tooltip(move |cx| Tooltip::text("Project is hosted on a dev server", cx))
291                    .on_click(cx.listener(|this, _, cx| {
292                        if let Some(workspace) = this.workspace.upgrade() {
293                            recent_projects::DevServerProjects::open(workspace, cx)
294                        }
295                    }))
296                    .into_any_element(),
297            );
298        }
299
300        if self.project.read(cx).is_disconnected() {
301            return Some(
302                Button::new("disconnected", "Disconnected")
303                    .disabled(true)
304                    .color(Color::Disabled)
305                    .style(ButtonStyle::Subtle)
306                    .label_size(LabelSize::Small)
307                    .into_any_element(),
308            );
309        }
310
311        let host = self.project.read(cx).host()?;
312        let host_user = self.user_store.read(cx).get_cached_user(host.user_id)?;
313        let participant_index = self
314            .user_store
315            .read(cx)
316            .participant_indices()
317            .get(&host_user.id)?;
318        Some(
319            Button::new("project_owner_trigger", host_user.github_login.clone())
320                .color(Color::Player(participant_index.0))
321                .style(ButtonStyle::Subtle)
322                .label_size(LabelSize::Small)
323                .tooltip(move |cx| {
324                    Tooltip::text(
325                        format!(
326                            "{} is sharing this project. Click to follow.",
327                            host_user.github_login.clone()
328                        ),
329                        cx,
330                    )
331                })
332                .on_click({
333                    let host_peer_id = host.peer_id;
334                    cx.listener(move |this, _, cx| {
335                        this.workspace
336                            .update(cx, |workspace, cx| {
337                                workspace.follow(host_peer_id, cx);
338                            })
339                            .log_err();
340                    })
341                })
342                .into_any_element(),
343        )
344    }
345
346    pub fn render_project_name(&self, cx: &mut ViewContext<Self>) -> impl IntoElement {
347        let name = {
348            let mut names = self.project.read(cx).visible_worktrees(cx).map(|worktree| {
349                let worktree = worktree.read(cx);
350                worktree.root_name()
351            });
352
353            names.next()
354        };
355        let is_project_selected = name.is_some();
356        let name = if let Some(name) = name {
357            util::truncate_and_trailoff(name, MAX_PROJECT_NAME_LENGTH)
358        } else {
359            "Open recent project".to_string()
360        };
361
362        let workspace = self.workspace.clone();
363        Button::new("project_name_trigger", name)
364            .when(!is_project_selected, |b| b.color(Color::Muted))
365            .style(ButtonStyle::Subtle)
366            .label_size(LabelSize::Small)
367            .tooltip(move |cx| {
368                Tooltip::for_action(
369                    "Recent Projects",
370                    &recent_projects::OpenRecent {
371                        create_new_window: false,
372                    },
373                    cx,
374                )
375            })
376            .on_click(cx.listener(move |_, _, cx| {
377                if let Some(workspace) = workspace.upgrade() {
378                    workspace.update(cx, |workspace, cx| {
379                        RecentProjects::open(workspace, false, cx);
380                    })
381                }
382            }))
383    }
384
385    pub fn render_project_branch(&self, cx: &mut ViewContext<Self>) -> Option<impl IntoElement> {
386        let entry = {
387            let mut names_and_branches =
388                self.project.read(cx).visible_worktrees(cx).map(|worktree| {
389                    let worktree = worktree.read(cx);
390                    worktree.root_git_entry()
391                });
392
393            names_and_branches.next().flatten()
394        };
395        let workspace = self.workspace.upgrade()?;
396        let branch_name = entry
397            .as_ref()
398            .and_then(RepositoryEntry::branch)
399            .map(|branch| util::truncate_and_trailoff(&branch, MAX_BRANCH_NAME_LENGTH))?;
400        Some(
401            Button::new("project_branch_trigger", branch_name)
402                .color(Color::Muted)
403                .style(ButtonStyle::Subtle)
404                .label_size(LabelSize::Small)
405                .tooltip(move |cx| {
406                    Tooltip::with_meta(
407                        "Recent Branches",
408                        Some(&ToggleVcsMenu),
409                        "Local branches only",
410                        cx,
411                    )
412                })
413                .on_click(move |_, cx| {
414                    let _ = workspace.update(cx, |this, cx| {
415                        BranchList::open(this, &Default::default(), cx)
416                    });
417                }),
418        )
419    }
420
421    fn window_activation_changed(&mut self, cx: &mut ViewContext<Self>) {
422        if cx.is_window_active() {
423            ActiveCall::global(cx)
424                .update(cx, |call, cx| call.set_location(Some(&self.project), cx))
425                .detach_and_log_err(cx);
426        } else if cx.active_window().is_none() {
427            ActiveCall::global(cx)
428                .update(cx, |call, cx| call.set_location(None, cx))
429                .detach_and_log_err(cx);
430        }
431        self.workspace
432            .update(cx, |workspace, cx| {
433                workspace.update_active_view_for_followers(cx);
434            })
435            .ok();
436    }
437
438    fn active_call_changed(&mut self, cx: &mut ViewContext<Self>) {
439        cx.notify();
440    }
441
442    fn share_project(&mut self, _: &ShareProject, cx: &mut ViewContext<Self>) {
443        let active_call = ActiveCall::global(cx);
444        let project = self.project.clone();
445        active_call
446            .update(cx, |call, cx| call.share_project(project, cx))
447            .detach_and_log_err(cx);
448    }
449
450    fn unshare_project(&mut self, _: &UnshareProject, cx: &mut ViewContext<Self>) {
451        let active_call = ActiveCall::global(cx);
452        let project = self.project.clone();
453        active_call
454            .update(cx, |call, cx| call.unshare_project(project, cx))
455            .log_err();
456    }
457
458    fn render_connection_status(
459        &self,
460        status: &client::Status,
461        cx: &mut ViewContext<Self>,
462    ) -> Option<AnyElement> {
463        match status {
464            client::Status::ConnectionError
465            | client::Status::ConnectionLost
466            | client::Status::Reauthenticating { .. }
467            | client::Status::Reconnecting { .. }
468            | client::Status::ReconnectionError { .. } => Some(
469                div()
470                    .id("disconnected")
471                    .child(Icon::new(IconName::Disconnected).size(IconSize::Small))
472                    .tooltip(|cx| Tooltip::text("Disconnected", cx))
473                    .into_any_element(),
474            ),
475            client::Status::UpgradeRequired => {
476                let auto_updater = auto_update::AutoUpdater::get(cx);
477                let label = match auto_updater.map(|auto_update| auto_update.read(cx).status()) {
478                    Some(AutoUpdateStatus::Updated { .. }) => "Please restart Zed to Collaborate",
479                    Some(AutoUpdateStatus::Installing)
480                    | Some(AutoUpdateStatus::Downloading)
481                    | Some(AutoUpdateStatus::Checking) => "Updating...",
482                    Some(AutoUpdateStatus::Idle) | Some(AutoUpdateStatus::Errored) | None => {
483                        "Please update Zed to Collaborate"
484                    }
485                };
486
487                Some(
488                    Button::new("connection-status", label)
489                        .label_size(LabelSize::Small)
490                        .on_click(|_, cx| {
491                            if let Some(auto_updater) = auto_update::AutoUpdater::get(cx) {
492                                if auto_updater.read(cx).status().is_updated() {
493                                    workspace::reload(&Default::default(), cx);
494                                    return;
495                                }
496                            }
497                            auto_update::check(&Default::default(), cx);
498                        })
499                        .into_any_element(),
500                )
501            }
502            _ => None,
503        }
504    }
505
506    pub fn render_sign_in_button(&mut self, _: &mut ViewContext<Self>) -> Button {
507        let client = self.client.clone();
508        Button::new("sign_in", "Sign in")
509            .label_size(LabelSize::Small)
510            .on_click(move |_, cx| {
511                let client = client.clone();
512                cx.spawn(move |mut cx| async move {
513                    client
514                        .authenticate_and_connect(true, &cx)
515                        .await
516                        .notify_async_err(&mut cx);
517                })
518                .detach();
519            })
520    }
521
522    pub fn render_user_menu_button(&mut self, cx: &mut ViewContext<Self>) -> impl Element {
523        let user_store = self.user_store.read(cx);
524        if let Some(user) = user_store.current_user() {
525            let plan = user_store.current_plan();
526            PopoverMenu::new("user-menu")
527                .menu(move |cx| {
528                    ContextMenu::build(cx, |menu, cx| {
529                        menu.when(cx.has_flag::<ZedPro>(), |menu| {
530                            menu.action(
531                                format!(
532                                    "Current Plan: {}",
533                                    match plan {
534                                        None => "",
535                                        Some(proto::Plan::Free) => "Free",
536                                        Some(proto::Plan::ZedPro) => "Pro",
537                                    }
538                                ),
539                                zed_actions::OpenAccountSettings.boxed_clone(),
540                            )
541                            .separator()
542                        })
543                        .action("Settings", zed_actions::OpenSettings.boxed_clone())
544                        .action("Key Bindings", Box::new(zed_actions::OpenKeymap))
545                        .action("Themes…", theme_selector::Toggle::default().boxed_clone())
546                        .action("Extensions", extensions_ui::Extensions.boxed_clone())
547                        .separator()
548                        .action("Sign Out", client::SignOut.boxed_clone())
549                    })
550                    .into()
551                })
552                .trigger(
553                    ButtonLike::new("user-menu")
554                        .child(
555                            h_flex()
556                                .gap_0p5()
557                                .child(Avatar::new(user.avatar_uri.clone()))
558                                .child(
559                                    Icon::new(IconName::ChevronDown)
560                                        .size(IconSize::Small)
561                                        .color(Color::Muted),
562                                ),
563                        )
564                        .style(ButtonStyle::Subtle)
565                        .tooltip(move |cx| Tooltip::text("Toggle User Menu", cx)),
566                )
567                .anchor(gpui::AnchorCorner::TopRight)
568        } else {
569            PopoverMenu::new("user-menu")
570                .menu(|cx| {
571                    ContextMenu::build(cx, |menu, _| {
572                        menu.action("Settings", zed_actions::OpenSettings.boxed_clone())
573                            .action("Key Bindings", Box::new(zed_actions::OpenKeymap))
574                            .action("Themes…", theme_selector::Toggle::default().boxed_clone())
575                            .action("Extensions", extensions_ui::Extensions.boxed_clone())
576                    })
577                    .into()
578                })
579                .trigger(
580                    ButtonLike::new("user-menu")
581                        .child(
582                            h_flex().gap_0p5().child(
583                                Icon::new(IconName::ChevronDown)
584                                    .size(IconSize::Small)
585                                    .color(Color::Muted),
586                            ),
587                        )
588                        .style(ButtonStyle::Subtle)
589                        .tooltip(move |cx| Tooltip::text("Toggle User Menu", cx)),
590                )
591        }
592    }
593}
594
595impl InteractiveElement for TitleBar {
596    fn interactivity(&mut self) -> &mut Interactivity {
597        self.content.interactivity()
598    }
599}
600
601impl StatefulInteractiveElement for TitleBar {}
602
603impl ParentElement for TitleBar {
604    fn extend(&mut self, elements: impl IntoIterator<Item = AnyElement>) {
605        self.children.extend(elements)
606    }
607}