1use std::rc::Rc;
2use std::sync::Arc;
3
4use call::{ActiveCall, ParticipantLocation, 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, actions};
12use project::WorktreeSettings;
13use rpc::proto::{self};
14use settings::{Settings as _, SettingsLocation};
15use theme::ActiveTheme;
16use ui::{
17 Avatar, AvatarAudioStatusIndicator, ContextMenu, ContextMenuItem, Divider, DividerColor,
18 Facepile, PopoverMenu, SplitButton, SplitButtonStyle, TintColor, Tooltip, prelude::*,
19};
20use util::rel_path::RelPath;
21use workspace::notifications::DetachAndPromptErr;
22
23use crate::TitleBar;
24
25actions!(
26 collab,
27 [
28 /// Toggles screen sharing on or off.
29 ToggleScreenSharing,
30 /// Toggles microphone mute.
31 ToggleMute,
32 /// Toggles deafen mode (mute both microphone and speakers).
33 ToggleDeafen
34 ]
35);
36
37fn toggle_screen_sharing(
38 screen: anyhow::Result<Option<Rc<dyn ScreenCaptureSource>>>,
39 window: &mut Window,
40 cx: &mut App,
41) {
42 let call = ActiveCall::global(cx).read(cx);
43 let toggle_screen_sharing = match screen {
44 Ok(screen) => {
45 let Some(room) = call.room().cloned() else {
46 return;
47 };
48
49 room.update(cx, |room, cx| {
50 let clicked_on_currently_shared_screen =
51 room.shared_screen_id().is_some_and(|screen_id| {
52 Some(screen_id)
53 == screen
54 .as_deref()
55 .and_then(|s| s.metadata().ok().map(|meta| meta.id))
56 });
57 let should_unshare_current_screen = room.is_sharing_screen();
58 let unshared_current_screen = should_unshare_current_screen.then(|| {
59 telemetry::event!(
60 "Screen Share Disabled",
61 room_id = room.id(),
62 channel_id = room.channel_id(),
63 );
64 room.unshare_screen(clicked_on_currently_shared_screen || screen.is_none(), cx)
65 });
66 if let Some(screen) = screen {
67 if !should_unshare_current_screen {
68 telemetry::event!(
69 "Screen Share Enabled",
70 room_id = room.id(),
71 channel_id = room.channel_id(),
72 );
73 }
74 cx.spawn(async move |room, cx| {
75 unshared_current_screen.transpose()?;
76 if !clicked_on_currently_shared_screen {
77 room.update(cx, |room, cx| room.share_screen(screen, cx))?
78 .await
79 } else {
80 Ok(())
81 }
82 })
83 } else {
84 Task::ready(Ok(()))
85 }
86 })
87 }
88 Err(e) => Task::ready(Err(e)),
89 };
90 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)));
91}
92
93fn toggle_mute(_: &ToggleMute, cx: &mut App) {
94 let call = ActiveCall::global(cx).read(cx);
95 if let Some(room) = call.room().cloned() {
96 room.update(cx, |room, cx| {
97 let operation = if room.is_muted() {
98 "Microphone Enabled"
99 } else {
100 "Microphone Disabled"
101 };
102 telemetry::event!(
103 operation,
104 room_id = room.id(),
105 channel_id = room.channel_id(),
106 );
107
108 room.toggle_mute(cx)
109 });
110 }
111}
112
113fn toggle_deafen(_: &ToggleDeafen, cx: &mut App) {
114 if let Some(room) = ActiveCall::global(cx).read(cx).room().cloned() {
115 room.update(cx, |room, cx| room.toggle_deafen(cx));
116 }
117}
118
119fn render_color_ribbon(color: Hsla) -> impl Element {
120 canvas(
121 move |_, _, _| {},
122 move |bounds, _, window, _| {
123 let height = bounds.size.height;
124 let horizontal_offset = height;
125 let vertical_offset = height / 2.0;
126 let mut path = Path::new(bounds.bottom_left());
127 path.curve_to(
128 bounds.origin + point(horizontal_offset, vertical_offset),
129 bounds.origin + point(px(0.0), vertical_offset),
130 );
131 path.line_to(bounds.top_right() + point(-horizontal_offset, vertical_offset));
132 path.curve_to(
133 bounds.bottom_right(),
134 bounds.top_right() + point(px(0.0), vertical_offset),
135 );
136 path.line_to(bounds.bottom_left());
137 window.paint_path(path, color);
138 },
139 )
140 .h_1()
141 .w_full()
142}
143
144impl TitleBar {
145 pub(crate) fn render_collaborator_list(
146 &self,
147 _: &mut Window,
148 cx: &mut Context<Self>,
149 ) -> impl IntoElement {
150 let room = ActiveCall::global(cx).read(cx).room().cloned();
151 let current_user = self.user_store.read(cx).current_user();
152 let client = self.client.clone();
153 let project_id = self.project.read(cx).remote_id();
154 let workspace = self.workspace.upgrade();
155
156 h_flex()
157 .id("collaborator-list")
158 .w_full()
159 .gap_1()
160 .overflow_x_scroll()
161 .when_some(
162 current_user.zip(client.peer_id()).zip(room),
163 |this, ((current_user, peer_id), room)| {
164 let player_colors = cx.theme().players();
165 let room = room.read(cx);
166 let mut remote_participants =
167 room.remote_participants().values().collect::<Vec<_>>();
168 remote_participants.sort_by_key(|p| p.participant_index.0);
169
170 let current_user_face_pile = self.render_collaborator(
171 ¤t_user,
172 peer_id,
173 true,
174 room.is_speaking(),
175 room.is_muted(),
176 None,
177 room,
178 project_id,
179 ¤t_user,
180 cx,
181 );
182
183 this.children(current_user_face_pile.map(|face_pile| {
184 v_flex()
185 .on_mouse_down(MouseButton::Left, |_, window, _| {
186 window.prevent_default()
187 })
188 .child(face_pile)
189 .child(render_color_ribbon(player_colors.local().cursor))
190 }))
191 .children(remote_participants.iter().filter_map(|collaborator| {
192 let player_color =
193 player_colors.color_for_participant(collaborator.participant_index.0);
194 let is_following = workspace
195 .as_ref()?
196 .read(cx)
197 .is_being_followed(collaborator.peer_id);
198 let is_present = project_id.is_some_and(|project_id| {
199 collaborator.location
200 == ParticipantLocation::SharedProject { project_id }
201 });
202
203 let facepile = self.render_collaborator(
204 &collaborator.user,
205 collaborator.peer_id,
206 is_present,
207 collaborator.speaking,
208 collaborator.muted,
209 is_following.then_some(player_color.selection),
210 room,
211 project_id,
212 ¤t_user,
213 cx,
214 )?;
215
216 Some(
217 v_flex()
218 .id(("collaborator", collaborator.user.id))
219 .child(facepile)
220 .child(render_color_ribbon(player_color.cursor))
221 .cursor_pointer()
222 .on_mouse_down(MouseButton::Left, |_, window, _| {
223 window.prevent_default()
224 })
225 .on_click({
226 let peer_id = collaborator.peer_id;
227 cx.listener(move |this, _, window, cx| {
228 cx.stop_propagation();
229
230 this.workspace
231 .update(cx, |workspace, cx| {
232 if is_following {
233 workspace.unfollow(peer_id, window, cx);
234 } else {
235 workspace.follow(peer_id, window, cx);
236 }
237 })
238 .ok();
239 })
240 })
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| workspace.has_active_modal(window, cx))
347 .unwrap_or(false);
348
349 let room = room.read(cx);
350 let project = self.project.read(cx);
351 let is_local = project.is_local() || project.is_via_remote_server();
352 let is_shared = is_local && project.is_shared();
353 let is_muted = room.is_muted();
354 let muted_by_user = room.muted_by_user();
355 let is_deafened = room.is_deafened().unwrap_or(false);
356 let is_screen_sharing = room.is_sharing_screen();
357 let can_use_microphone = room.can_use_microphone();
358 let can_share_projects = room.can_share_projects();
359 let screen_sharing_supported = cx.is_screen_capture_supported();
360
361 let channel_store = ChannelStore::global(cx);
362 let channel = room
363 .channel_id()
364 .and_then(|channel_id| channel_store.read(cx).channel_for_id(channel_id).cloned());
365
366 let mut children = Vec::new();
367
368 children.push(
369 h_flex()
370 .gap_1()
371 .child(
372 IconButton::new("leave-call", IconName::Exit)
373 .style(ButtonStyle::Subtle)
374 .tooltip(Tooltip::text("Leave Call"))
375 .icon_size(IconSize::Small)
376 .on_click(move |_, _window, cx| {
377 ActiveCall::global(cx)
378 .update(cx, |call, cx| call.hang_up(cx))
379 .detach_and_log_err(cx);
380 }),
381 )
382 .child(Divider::vertical().color(DividerColor::Border))
383 .into_any_element(),
384 );
385
386 if is_local && can_share_projects && !is_connecting_to_project {
387 let is_sharing_disabled = channel.is_some_and(|channel| match channel.visibility {
388 proto::ChannelVisibility::Public => project.visible_worktrees(cx).any(|worktree| {
389 let worktree_id = worktree.read(cx).id();
390
391 let settings_location = Some(SettingsLocation {
392 worktree_id,
393 path: RelPath::empty(),
394 });
395
396 WorktreeSettings::get(settings_location, cx).prevent_sharing_in_public_channels
397 }),
398 proto::ChannelVisibility::Members => false,
399 });
400
401 children.push(
402 Button::new(
403 "toggle_sharing",
404 if is_shared { "Unshare" } else { "Share" },
405 )
406 .tooltip(Tooltip::text(if is_shared {
407 "Stop sharing project with call participants"
408 } else {
409 "Share project with call participants"
410 }))
411 .style(ButtonStyle::Subtle)
412 .selected_style(ButtonStyle::Tinted(TintColor::Accent))
413 .toggle_state(is_shared)
414 .label_size(LabelSize::Small)
415 .when(is_sharing_disabled, |parent| {
416 parent.disabled(true).tooltip(Tooltip::text(
417 "This project may not be shared in a public channel.",
418 ))
419 })
420 .on_click(cx.listener(move |this, _, window, cx| {
421 if is_shared {
422 this.unshare_project(window, cx);
423 } else {
424 this.share_project(cx);
425 }
426 }))
427 .into_any_element(),
428 );
429 }
430
431 if can_use_microphone {
432 children.push(
433 IconButton::new(
434 "mute-microphone",
435 if is_muted {
436 IconName::MicMute
437 } else {
438 IconName::Mic
439 },
440 )
441 .tooltip(move |_window, cx| {
442 if is_muted {
443 if is_deafened {
444 Tooltip::with_meta(
445 "Unmute Microphone",
446 None,
447 "Audio will be unmuted",
448 cx,
449 )
450 } else {
451 Tooltip::simple("Unmute Microphone", cx)
452 }
453 } else {
454 Tooltip::simple("Mute Microphone", cx)
455 }
456 })
457 .style(ButtonStyle::Subtle)
458 .icon_size(IconSize::Small)
459 .toggle_state(is_muted)
460 .selected_style(ButtonStyle::Tinted(TintColor::Error))
461 .on_click(move |_, _window, cx| {
462 toggle_mute(&Default::default(), cx);
463 })
464 .into_any_element(),
465 );
466 }
467
468 children.push(
469 IconButton::new(
470 "mute-sound",
471 if is_deafened {
472 IconName::AudioOff
473 } else {
474 IconName::AudioOn
475 },
476 )
477 .style(ButtonStyle::Subtle)
478 .selected_style(ButtonStyle::Tinted(TintColor::Error))
479 .icon_size(IconSize::Small)
480 .toggle_state(is_deafened)
481 .tooltip(move |_window, cx| {
482 if is_deafened {
483 let label = "Unmute Audio";
484
485 if !muted_by_user {
486 Tooltip::with_meta(label, None, "Microphone will be unmuted", cx)
487 } else {
488 Tooltip::simple(label, cx)
489 }
490 } else {
491 let label = "Mute Audio";
492
493 if !muted_by_user {
494 Tooltip::with_meta(label, None, "Microphone will be muted", cx)
495 } else {
496 Tooltip::simple(label, cx)
497 }
498 }
499 })
500 .on_click(move |_, _, cx| toggle_deafen(&Default::default(), cx))
501 .into_any_element(),
502 );
503
504 if can_use_microphone && screen_sharing_supported {
505 let trigger = IconButton::new("screen-share", IconName::Screen)
506 .style(ButtonStyle::Subtle)
507 .icon_size(IconSize::Small)
508 .toggle_state(is_screen_sharing)
509 .selected_style(ButtonStyle::Tinted(TintColor::Accent))
510 .tooltip(Tooltip::text(if is_screen_sharing {
511 "Stop Sharing Screen"
512 } else {
513 "Share Screen"
514 }))
515 .on_click(move |_, window, cx| {
516 let should_share = ActiveCall::global(cx)
517 .read(cx)
518 .room()
519 .is_some_and(|room| !room.read(cx).is_sharing_screen());
520
521 window
522 .spawn(cx, async move |cx| {
523 let screen = if should_share {
524 cx.update(|_, cx| pick_default_screen(cx))?.await
525 } else {
526 Ok(None)
527 };
528 cx.update(|window, cx| toggle_screen_sharing(screen, window, cx))?;
529
530 Result::<_, anyhow::Error>::Ok(())
531 })
532 .detach();
533 });
534
535 children.push(
536 SplitButton::new(
537 trigger.render(window, cx),
538 self.render_screen_list().into_any_element(),
539 )
540 .style(SplitButtonStyle::Transparent)
541 .into_any_element(),
542 );
543 }
544
545 children.push(div().pr_2().into_any_element());
546
547 children
548 }
549
550 fn render_screen_list(&self) -> impl IntoElement {
551 PopoverMenu::new("screen-share-screen-list")
552 .with_handle(self.screen_share_popover_handle.clone())
553 .trigger(
554 ui::ButtonLike::new_rounded_right("screen-share-screen-list-trigger")
555 .child(
556 h_flex()
557 .mx_neg_0p5()
558 .h_full()
559 .justify_center()
560 .child(Icon::new(IconName::ChevronDown).size(IconSize::XSmall)),
561 )
562 .toggle_state(self.screen_share_popover_handle.is_deployed()),
563 )
564 .menu(|window, cx| {
565 let screens = cx.screen_capture_sources();
566 Some(ContextMenu::build(window, cx, |context_menu, _, cx| {
567 cx.spawn(async move |this: WeakEntity<ContextMenu>, cx| {
568 let screens = screens.await??;
569 this.update(cx, |this, cx| {
570 let active_screenshare_id = ActiveCall::global(cx)
571 .read(cx)
572 .room()
573 .and_then(|room| room.read(cx).shared_screen_id());
574 for screen in screens {
575 let Ok(meta) = screen.metadata() else {
576 continue;
577 };
578
579 let label = meta
580 .label
581 .clone()
582 .unwrap_or_else(|| SharedString::from("Unknown screen"));
583 let resolution = SharedString::from(format!(
584 "{} × {}",
585 meta.resolution.width.0, meta.resolution.height.0
586 ));
587 this.push_item(ContextMenuItem::CustomEntry {
588 entry_render: Box::new(move |_, _| {
589 h_flex()
590 .gap_2()
591 .child(
592 Icon::new(IconName::Screen)
593 .size(IconSize::XSmall)
594 .map(|this| {
595 if active_screenshare_id == Some(meta.id) {
596 this.color(Color::Accent)
597 } else {
598 this.color(Color::Muted)
599 }
600 }),
601 )
602 .child(Label::new(label.clone()))
603 .child(
604 Label::new(resolution.clone())
605 .color(Color::Muted)
606 .size(LabelSize::Small),
607 )
608 .into_any()
609 }),
610 selectable: true,
611 documentation_aside: None,
612 handler: Rc::new(move |_, window, cx| {
613 toggle_screen_sharing(Ok(Some(screen.clone())), window, cx);
614 }),
615 });
616 }
617 })
618 })
619 .detach_and_log_err(cx);
620 context_menu
621 }))
622 })
623 }
624}
625
626/// Picks the screen to share when clicking on the main screen sharing button.
627fn pick_default_screen(cx: &App) -> Task<anyhow::Result<Option<Rc<dyn ScreenCaptureSource>>>> {
628 let source = cx.screen_capture_sources();
629 cx.spawn(async move |_| {
630 let available_sources = source.await??;
631 Ok(available_sources
632 .iter()
633 .find(|it| {
634 it.as_ref()
635 .metadata()
636 .is_ok_and(|meta| meta.is_main.unwrap_or_default())
637 })
638 .or_else(|| available_sources.first())
639 .cloned())
640 })
641}