Messaging · Calls: controls, tiles, a grid, a shared screen, a bar, a ringing dialog, a huddle

CallControls holds the microphone, camera and a shared screen as
toggles, then Leave. ParticipantTile shows a camera's frame from the
host or the person's initials, their name with a mark when muted, and a
ring while they speak. VideoCallGrid lays tiles in even rows as far as
they fit across its measured width; a short last row centers at the
full rows' width. ScreenShareView names who presents and offers Stop
presenting for your own share, the call's tiles beside or below.
VoiceCallBar tells where a call is, how long it has run and who is in
it, with the microphone and Leave. IncomingCallDialog rings with the
caller's picture; Accept or Decline answers each ring once, and Escape
declines. HuddleIndicator rings while a huddle is live; a press joins.

The recorder's device toggle and the camera's name chip now have one
home in media. People: member names sort whatever their case, a
status's words save trimmed, and a profile card's local time ticks.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

examples/gallery/pages/messaging/mod.rs

@@ -7,6 +7,7 @@ use ely_gpui_component::{
 use gpui::{AnyElement, App, IntoElement, ParentElement, SharedString, Styled, Window, div, px};
 use jiff::{SignedDuration, Timestamp};
 
+mod calls;
 mod messages;
 mod people;
 
@@ -51,6 +52,15 @@ const SCRIPT: &[Step] = &[
     Step::Type("On leave till Monday"),
     Step::Wait(200),
     Step::Shot("status-draft"),
+    Step::DownAt("messaging-call", 73.0, 112.0),
+    Step::UpAt("messaging-call", 73.0, 112.0),
+    Step::HoverAt("messaging-share", 10.0, 10.0),
+    Step::Wait(200),
+    Step::Shot("presenting"),
+    Step::DownAt("messaging-incoming", 24.0, 14.0),
+    Step::UpAt("messaging-incoming", 24.0, 14.0),
+    Step::Wait(300),
+    Step::Shot("incoming-call"),
 ];
 
 /// The demo's chats: which is open and what waits unread in each.
@@ -238,5 +248,9 @@ fn render(window: &mut Window, cx: &mut App) -> AnyElement {
         .child(people::members(window, cx))
         .child(people::statuses(cx))
         .child(people::setter(window, cx))
+        .child(calls::controls(window, cx))
+        .child(calls::grid(window, cx))
+        .child(calls::share(window, cx))
+        .child(calls::incoming(window, cx))
         .into_any_element()
 }