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