1use std::rc::Rc;
2use std::sync::Arc;
3
4use call::{ActiveCall, Room};
5use channel::ChannelStore;
6use client::{User, proto::PeerId};
7use gpui::{
8 AnyElement, Hsla, IntoElement, MouseButton, Path, ScreenCaptureSource, Styled, WeakEntity,
9 canvas, point,
10};
11use gpui::{App, Task, Window};
12use icons::IconName;
13use livekit_client::ConnectionQuality;
14use project::WorktreeSettings;
15use remote_connection::RemoteConnectionModal;
16use rpc::proto::{self};
17use settings::{Settings as _, SettingsLocation};
18use theme::ActiveTheme;
19use ui::{
20 Avatar, AvatarAudioStatusIndicator, ContextMenu, ContextMenuItem, Divider, DividerColor,
21 Facepile, PopoverMenu, SplitButton, SplitButtonStyle, TintColor, Tooltip, prelude::*,
22};
23use util::rel_path::RelPath;
24use workspace::{ParticipantLocation, notifications::DetachAndPromptErr};
25use zed_actions::ShowCallStats;
26
27use crate::TitleBar;
28
29fn format_stat(value: Option<f64>, format: impl Fn(f64) -> String) -> String {
30 match value {
31 Some(v) => format(v),
32 None => "—".to_string(),
33 }
34}
35
36pub fn toggle_screen_sharing(
37 screen: anyhow::Result<Option<Rc<dyn ScreenCaptureSource>>>,
38 window: &mut Window,
39 cx: &mut App,
40) {
41 let call = ActiveCall::global(cx).read(cx);
42 let toggle_screen_sharing = match screen {
43 Ok(screen) => {
44 let Some(room) = call.room().cloned() else {
45 return;
46 };
47
48 room.update(cx, |room, cx| {
49 let clicked_on_currently_shared_screen =
50 room.shared_screen_id().is_some_and(|screen_id| {
51 Some(screen_id)
52 == screen
53 .as_deref()
54 .and_then(|s| s.metadata().ok().map(|meta| meta.id))
55 });
56 let should_unshare_current_screen = room.is_sharing_screen();
57 let unshared_current_screen = should_unshare_current_screen.then(|| {
58 telemetry::event!(
59 "Screen Share Disabled",
60 room_id = room.id(),
61 channel_id = room.channel_id(),
62 );
63 room.unshare_screen(clicked_on_currently_shared_screen || screen.is_none(), cx)
64 });
65 if let Some(screen) = screen {
66 if !should_unshare_current_screen {
67 telemetry::event!(
68 "Screen Share Enabled",
69 room_id = room.id(),
70 channel_id = room.channel_id(),
71 );
72 }
73 cx.spawn(async move |room, cx| {
74 unshared_current_screen.transpose()?;
75 if !clicked_on_currently_shared_screen {
76 room.update(cx, |room, cx| room.share_screen(screen, cx))?
77 .await
78 } else {
79 Ok(())
80 }
81 })
82 } else {
83 Task::ready(Ok(()))
84 }
85 })
86 }
87 Err(e) => Task::ready(Err(e)),
88 };
89 toggle_screen_sharing.detach_and_prompt_err("Sharing Screen Failed", window, cx, |e, _, _| Some(format!("{:?}\n\nPlease check that you have given Zed permissions to record your screen in Settings.", e)));
90}
91
92pub fn toggle_mute(cx: &mut App) {
93 let call = ActiveCall::global(cx).read(cx);
94 if let Some(room) = call.room().cloned() {
95 room.update(cx, |room, cx| {
96 let operation = if room.is_muted() {
97 "Microphone Enabled"
98 } else {
99 "Microphone Disabled"
100 };
101 telemetry::event!(
102 operation,
103 room_id = room.id(),
104 channel_id = room.channel_id(),
105 );
106
107 room.toggle_mute(cx)
108 });
109 }
110}
111
112pub fn toggle_deafen(cx: &mut App) {
113 if let Some(room) = ActiveCall::global(cx).read(cx).room().cloned() {
114 room.update(cx, |room, cx| room.toggle_deafen(cx));
115 }
116}
117
118fn render_color_ribbon(color: Hsla) -> impl Element {
119 canvas(
120 move |_, _, _| {},
121 move |bounds, _, window, _| {
122 let height = bounds.size.height;
123 let horizontal_offset = height;
124 let vertical_offset = height / 2.0;
125 let mut path = Path::new(bounds.bottom_left());
126 path.curve_to(
127 bounds.origin + point(horizontal_offset, vertical_offset),
128 bounds.origin + point(px(0.0), vertical_offset),
129 );
130 path.line_to(bounds.top_right() + point(-horizontal_offset, vertical_offset));
131 path.curve_to(
132 bounds.bottom_right(),
133 bounds.top_right() + point(px(0.0), vertical_offset),
134 );
135 path.line_to(bounds.bottom_left());
136 window.paint_path(path, color);
137 },
138 )
139 .h_1()
140 .w_full()
141}
142
143impl TitleBar {
144 pub(crate) fn render_collaborator_list(
145 &self,
146 _: &mut Window,
147 cx: &mut Context<Self>,
148 ) -> impl IntoElement {
149 let room = ActiveCall::global(cx).read(cx).room().cloned();
150 let current_user = self.user_store.read(cx).current_user();
151 let client = self.client.clone();
152 let project_id = self.project.read(cx).remote_id();
153 let workspace = self.workspace.upgrade();
154
155 h_flex()
156 .id("collaborator-list")
157 .w_full()
158 .gap_1()
159 .overflow_x_scroll()
160 .when_some(
161 current_user.zip(client.peer_id()).zip(room),
162 |this, ((current_user, peer_id), room)| {
163 let player_colors = cx.theme().players();
164 let room = room.read(cx);
165 let mut remote_participants =
166 room.remote_participants().values().collect::<Vec<_>>();
167 remote_participants.sort_by_key(|p| p.participant_index.0);
168
169 let current_user_face_pile = self.render_collaborator(
170 ¤t_user,
171 peer_id,
172 true,
173 room.is_speaking(),
174 room.is_muted(),
175 None,
176 room,
177 project_id,
178 ¤t_user,
179 cx,
180 );
181
182 this.children(current_user_face_pile.map(|face_pile| {
183 v_flex()
184 .on_mouse_down(MouseButton::Left, |_, window, _| {
185 window.prevent_default()
186 })
187 .child(face_pile)
188 .child(render_color_ribbon(player_colors.local().cursor))
189 }))
190 .children(remote_participants.iter().filter_map(|collaborator| {
191 let player_color =
192 player_colors.color_for_participant(collaborator.participant_index.0);
193 let is_following = workspace
194 .as_ref()?
195 .read(cx)
196 .is_being_followed(collaborator.peer_id);
197 let is_present = project_id.is_some_and(|project_id| {
198 collaborator.location
199 == ParticipantLocation::SharedProject { project_id }
200 });
201
202 let facepile = self.render_collaborator(
203 &collaborator.user,
204 collaborator.peer_id,
205 is_present,
206 collaborator.speaking,
207 collaborator.muted,
208 is_following.then_some(player_color.selection),
209 room,
210 project_id,
211 ¤t_user,
212 cx,
213 )?;
214
215 Some(
216 v_flex()
217 .id(("collaborator", collaborator.user.id))
218 .child(facepile)
219 .child(render_color_ribbon(player_color.cursor))
220 .cursor_pointer()
221 .on_mouse_down(MouseButton::Left, |_, window, _| {
222 window.prevent_default()
223 })
224 .on_click({
225 let peer_id = collaborator.peer_id;
226 cx.listener(move |this, _, window, cx| {
227 cx.stop_propagation();
228
229 this.workspace
230 .update(cx, |workspace, cx| {
231 if is_following {
232 workspace.unfollow(peer_id, window, cx);
233 } else {
234 workspace.follow(peer_id, window, cx);
235 }
236 })
237 .ok();
238 })
239 })
240 .occlude()
241 .tooltip({
242 let login = collaborator.user.github_login.clone();
243 Tooltip::text(format!("Follow {login}"))
244 }),
245 )
246 }))
247 },
248 )
249 }
250
251 fn render_collaborator(
252 &self,
253 user: &Arc<User>,
254 peer_id: PeerId,
255 is_present: bool,
256 is_speaking: bool,
257 is_muted: bool,
258 leader_selection_color: Option<Hsla>,
259 room: &Room,
260 project_id: Option<u64>,
261 current_user: &Arc<User>,
262 cx: &App,
263 ) -> Option<Div> {
264 if room.role_for_user(user.id) == Some(proto::ChannelRole::Guest) {
265 return None;
266 }
267
268 const FACEPILE_LIMIT: usize = 3;
269 let followers = project_id.map_or(&[] as &[_], |id| room.followers_for(peer_id, id));
270 let extra_count = followers.len().saturating_sub(FACEPILE_LIMIT);
271
272 Some(
273 div()
274 .m_0p5()
275 .p_0p5()
276 // When the collaborator is not followed, still draw this wrapper div, but leave
277 // it transparent, so that it does not shift the layout when following.
278 .when_some(leader_selection_color, |div, color| {
279 div.rounded_sm().bg(color)
280 })
281 .child(
282 Facepile::empty()
283 .child(
284 Avatar::new(user.avatar_uri.clone())
285 .grayscale(!is_present)
286 .border_color(if is_speaking {
287 cx.theme().status().info
288 } else {
289 // We draw the border in a transparent color rather to avoid
290 // the layout shift that would come with adding/removing the border.
291 gpui::transparent_black()
292 })
293 .when(is_muted, |avatar| {
294 avatar.indicator(
295 AvatarAudioStatusIndicator::new(ui::AudioStatus::Muted)
296 .tooltip({
297 let github_login = user.github_login.clone();
298 Tooltip::text(format!("{} is muted", github_login))
299 }),
300 )
301 }),
302 )
303 .children(followers.iter().take(FACEPILE_LIMIT).filter_map(
304 |follower_peer_id| {
305 let follower = room
306 .remote_participants()
307 .values()
308 .find_map(|p| {
309 (p.peer_id == *follower_peer_id).then_some(&p.user)
310 })
311 .or_else(|| {
312 (self.client.peer_id() == Some(*follower_peer_id))
313 .then_some(current_user)
314 })?
315 .clone();
316
317 Some(div().mt(-px(4.)).child(
318 Avatar::new(follower.avatar_uri.clone()).size(rems(0.75)),
319 ))
320 },
321 ))
322 .children(if extra_count > 0 {
323 Some(
324 Label::new(format!("+{extra_count}"))
325 .ml_1()
326 .into_any_element(),
327 )
328 } else {
329 None
330 }),
331 ),
332 )
333 }
334
335 pub(crate) fn render_call_controls(
336 &self,
337 window: &mut Window,
338 cx: &mut Context<Self>,
339 ) -> Vec<AnyElement> {
340 let Some(room) = ActiveCall::global(cx).read(cx).room().cloned() else {
341 return Vec::new();
342 };
343
344 let is_connecting_to_project = self
345 .workspace
346 .update(cx, |workspace, cx| {
347 workspace
348 .active_modal::<RemoteConnectionModal>(cx)
349 .is_some()
350 })
351 .unwrap_or(false);
352
353 let room = room.read(cx);
354 let project = self.project.read(cx);
355 let is_local = project.is_local() || project.is_via_remote_server();
356 let is_shared = is_local && project.is_shared();
357 let is_muted = room.is_muted();
358 let muted_by_user = room.muted_by_user();
359 let is_deafened = room.is_deafened().unwrap_or(false);
360 let is_screen_sharing = room.is_sharing_screen();
361 let can_use_microphone = room.can_use_microphone();
362 let can_share_projects = room.can_share_projects();
363 let screen_sharing_supported = cx.is_screen_capture_supported();
364
365 let stats = room
366 .diagnostics()
367 .map(|d| d.read(cx).stats().clone())
368 .unwrap_or_default();
369
370 let channel_store = ChannelStore::global(cx);
371 let channel = room
372 .channel_id()
373 .and_then(|channel_id| channel_store.read(cx).channel_for_id(channel_id).cloned());
374
375 let mut children = Vec::new();
376
377 let effective_quality = stats.effective_quality.unwrap_or(ConnectionQuality::Lost);
378 let (signal_icon, signal_color, quality_label) = match effective_quality {
379 ConnectionQuality::Excellent => {
380 (IconName::SignalHigh, Some(Color::Success), "Excellent")
381 }
382 ConnectionQuality::Good => (IconName::SignalHigh, None, "Good"),
383 ConnectionQuality::Poor => (IconName::SignalMedium, Some(Color::Warning), "Poor"),
384 ConnectionQuality::Lost => (IconName::SignalLow, Some(Color::Error), "Lost"),
385 };
386 let quality_label: SharedString = quality_label.into();
387 children.push(
388 IconButton::new("call-quality", signal_icon)
389 .style(ButtonStyle::Subtle)
390 .icon_size(IconSize::Small)
391 .when_some(signal_color, |button, color| button.icon_color(color))
392 .tooltip(move |_window, cx| {
393 let quality_label = quality_label.clone();
394 let latency = format_stat(stats.latency_ms, |v| format!("{:.0}ms", v));
395 let jitter = format_stat(stats.jitter_ms, |v| format!("{:.0}ms", v));
396 let packet_loss = format_stat(stats.packet_loss_pct, |v| format!("{:.1}%", v));
397 let input_lag =
398 format_stat(stats.input_lag.map(|d| d.as_secs_f64() * 1000.0), |v| {
399 format!("{:.1}ms", v)
400 });
401
402 Tooltip::with_meta(
403 format!("Connection: {quality_label}"),
404 Some(&ShowCallStats),
405 format!(
406 "Latency: {latency} · Jitter: {jitter} · Loss: {packet_loss} · Input lag: {input_lag}",
407 ),
408 cx,
409 )
410 })
411 .on_click(move |_, window, cx| {
412 window.dispatch_action(Box::new(ShowCallStats), cx);
413 })
414 .into_any_element(),
415 );
416 children.push(
417 h_flex()
418 .gap_1()
419 .child(
420 IconButton::new("leave-call", IconName::Exit)
421 .style(ButtonStyle::Subtle)
422 .tooltip(Tooltip::text("Leave Call"))
423 .icon_size(IconSize::Small)
424 .on_click(move |_, _window, cx| {
425 ActiveCall::global(cx)
426 .update(cx, |call, cx| call.hang_up(cx))
427 .detach_and_log_err(cx);
428 }),
429 )
430 .child(Divider::vertical().color(DividerColor::Border))
431 .into_any_element(),
432 );
433
434 if is_local && can_share_projects && !is_connecting_to_project {
435 let is_sharing_disabled = channel.is_some_and(|channel| match channel.visibility {
436 proto::ChannelVisibility::Public => project.visible_worktrees(cx).any(|worktree| {
437 let worktree_id = worktree.read(cx).id();
438
439 let settings_location = Some(SettingsLocation {
440 worktree_id,
441 path: RelPath::empty(),
442 });
443
444 WorktreeSettings::get(settings_location, cx).prevent_sharing_in_public_channels
445 }),
446 proto::ChannelVisibility::Members => false,
447 });
448
449 children.push(
450 Button::new(
451 "toggle_sharing",
452 if is_shared { "Unshare" } else { "Share" },
453 )
454 .tooltip(Tooltip::text(if is_shared {
455 "Stop sharing project with call participants"
456 } else {
457 "Share project with call participants"
458 }))
459 .style(ButtonStyle::Subtle)
460 .selected_style(ButtonStyle::Tinted(TintColor::Accent))
461 .toggle_state(is_shared)
462 .label_size(LabelSize::Small)
463 .when(is_sharing_disabled, |parent| {
464 parent.disabled(true).tooltip(Tooltip::text(
465 "This project may not be shared in a public channel.",
466 ))
467 })
468 .on_click(cx.listener(move |this, _, window, cx| {
469 if is_shared {
470 this.unshare_project(window, cx);
471 } else {
472 this.share_project(cx);
473 }
474 }))
475 .into_any_element(),
476 );
477 }
478
479 if can_use_microphone {
480 children.push(
481 IconButton::new(
482 "mute-microphone",
483 if is_muted {
484 IconName::MicMute
485 } else {
486 IconName::Mic
487 },
488 )
489 .tooltip(move |_window, cx| {
490 if is_muted {
491 if is_deafened {
492 Tooltip::with_meta(
493 "Unmute Microphone",
494 None,
495 "Audio will be unmuted",
496 cx,
497 )
498 } else {
499 Tooltip::simple("Unmute Microphone", cx)
500 }
501 } else {
502 Tooltip::simple("Mute Microphone", cx)
503 }
504 })
505 .style(ButtonStyle::Subtle)
506 .icon_size(IconSize::Small)
507 .toggle_state(is_muted)
508 .selected_style(ButtonStyle::Tinted(TintColor::Error))
509 .on_click(move |_, _window, cx| toggle_mute(cx))
510 .into_any_element(),
511 );
512 }
513
514 children.push(
515 IconButton::new(
516 "mute-sound",
517 if is_deafened {
518 IconName::AudioOff
519 } else {
520 IconName::AudioOn
521 },
522 )
523 .style(ButtonStyle::Subtle)
524 .selected_style(ButtonStyle::Tinted(TintColor::Error))
525 .icon_size(IconSize::Small)
526 .toggle_state(is_deafened)
527 .tooltip(move |_window, cx| {
528 if is_deafened {
529 let label = "Unmute Audio";
530
531 if !muted_by_user {
532 Tooltip::with_meta(label, None, "Microphone will be unmuted", cx)
533 } else {
534 Tooltip::simple(label, cx)
535 }
536 } else {
537 let label = "Mute Audio";
538
539 if !muted_by_user {
540 Tooltip::with_meta(label, None, "Microphone will be muted", cx)
541 } else {
542 Tooltip::simple(label, cx)
543 }
544 }
545 })
546 .on_click(move |_, _, cx| toggle_deafen(cx))
547 .into_any_element(),
548 );
549
550 if can_use_microphone && screen_sharing_supported {
551 #[cfg(target_os = "linux")]
552 let is_wayland = gpui::guess_compositor() == "Wayland";
553 #[cfg(not(target_os = "linux"))]
554 let is_wayland = false;
555
556 let trigger = IconButton::new("screen-share", IconName::Screen)
557 .style(ButtonStyle::Subtle)
558 .icon_size(IconSize::Small)
559 .toggle_state(is_screen_sharing)
560 .selected_style(ButtonStyle::Tinted(TintColor::Accent))
561 .tooltip(Tooltip::text(if is_screen_sharing {
562 "Stop Sharing Screen"
563 } else {
564 "Share Screen"
565 }))
566 .on_click(move |_, window, cx| {
567 let should_share = ActiveCall::global(cx)
568 .read(cx)
569 .room()
570 .is_some_and(|room| !room.read(cx).is_sharing_screen());
571
572 #[cfg(target_os = "linux")]
573 {
574 if is_wayland
575 && let Some(room) = ActiveCall::global(cx).read(cx).room().cloned()
576 {
577 let task = room.update(cx, |room, cx| {
578 if should_share {
579 room.share_screen_wayland(cx)
580 } else {
581 room.unshare_screen(true, cx)
582 .map(|()| Task::ready(Ok(())))
583 .unwrap_or_else(|e| Task::ready(Err(e)))
584 }
585 });
586 task.detach_and_prompt_err(
587 "Sharing Screen Failed",
588 window,
589 cx,
590 |e, _, _| Some(format!("{e:?}")),
591 );
592 }
593 }
594 if !is_wayland {
595 window
596 .spawn(cx, async move |cx| {
597 let screen = if should_share {
598 cx.update(|_, cx| pick_default_screen(cx))?.await
599 } else {
600 Ok(None)
601 };
602 cx.update(|window, cx| toggle_screen_sharing(screen, window, cx))?;
603
604 Result::<_, anyhow::Error>::Ok(())
605 })
606 .detach();
607 }
608 });
609
610 if is_wayland {
611 children.push(trigger.into_any_element());
612 } else {
613 children.push(
614 SplitButton::new(
615 trigger.render(window, cx),
616 self.render_screen_list().into_any_element(),
617 )
618 .style(SplitButtonStyle::Transparent)
619 .into_any_element(),
620 );
621 }
622 }
623
624 children.push(div().pr_2().into_any_element());
625
626 children
627 }
628
629 fn render_screen_list(&self) -> impl IntoElement {
630 PopoverMenu::new("screen-share-screen-list")
631 .with_handle(self.screen_share_popover_handle.clone())
632 .trigger(
633 ui::ButtonLike::new_rounded_right("screen-share-screen-list-trigger")
634 .child(
635 h_flex()
636 .mx_neg_0p5()
637 .h_full()
638 .justify_center()
639 .child(Icon::new(IconName::ChevronDown).size(IconSize::XSmall)),
640 )
641 .toggle_state(self.screen_share_popover_handle.is_deployed()),
642 )
643 .menu(|window, cx| {
644 let screens = cx.screen_capture_sources();
645 Some(ContextMenu::build(window, cx, |context_menu, _, cx| {
646 cx.spawn(async move |this: WeakEntity<ContextMenu>, cx| {
647 let screens = screens.await??;
648 this.update(cx, |this, cx| {
649 let active_screenshare_id = ActiveCall::global(cx)
650 .read(cx)
651 .room()
652 .and_then(|room| room.read(cx).shared_screen_id());
653 for screen in screens {
654 let Ok(meta) = screen.metadata() else {
655 continue;
656 };
657
658 let label = meta
659 .label
660 .clone()
661 .unwrap_or_else(|| SharedString::from("Unknown screen"));
662 let resolution = SharedString::from(format!(
663 "{} × {}",
664 meta.resolution.width.0, meta.resolution.height.0
665 ));
666 this.push_item(ContextMenuItem::CustomEntry {
667 entry_render: Box::new(move |_, _| {
668 h_flex()
669 .gap_2()
670 .child(
671 Icon::new(IconName::Screen)
672 .size(IconSize::XSmall)
673 .map(|this| {
674 if active_screenshare_id == Some(meta.id) {
675 this.color(Color::Accent)
676 } else {
677 this.color(Color::Muted)
678 }
679 }),
680 )
681 .child(Label::new(label.clone()))
682 .child(
683 Label::new(resolution.clone())
684 .color(Color::Muted)
685 .size(LabelSize::Small),
686 )
687 .into_any()
688 }),
689 selectable: true,
690 documentation_aside: None,
691 handler: Rc::new(move |_, window, cx| {
692 toggle_screen_sharing(Ok(Some(screen.clone())), window, cx);
693 }),
694 });
695 }
696 })
697 })
698 .detach_and_log_err(cx);
699 context_menu
700 }))
701 })
702 }
703}
704
705/// Picks the screen to share when clicking on the main screen sharing button.
706fn pick_default_screen(cx: &App) -> Task<anyhow::Result<Option<Rc<dyn ScreenCaptureSource>>>> {
707 let source = cx.screen_capture_sources();
708 cx.spawn(async move |_| {
709 let available_sources = source.await??;
710 Ok(available_sources
711 .iter()
712 .find(|it| {
713 it.as_ref()
714 .metadata()
715 .is_ok_and(|meta| meta.is_main.unwrap_or_default())
716 })
717 .or_else(|| available_sources.first())
718 .cloned())
719 })
720}