Call participants (#5722)

Co-authored-by: Hamish Peebles <[email protected]>
open-chat-labs · Apr 25, 2024 · 5bb9d0b · 5bb9d0b
1 parent f16fbdd
commit 5bb9d0b
Show file tree

Hide file tree

Showing 59 changed files with 1,248 additions and 242 deletions.
diff --git a/backend/canisters/community/api/can.did b/backend/canisters/community/api/can.did
@@ -869,6 +869,23 @@ type SetMemberDisplayNameResponse = variant {
     DisplayNameTooLong : nat16;
 };
 
+type SetVideoCallPresenceArgs = record {
+    channel_id : ChannelId;
+    message_id : MessageId;
+    presence : VideoCallPresence;
+};
+
+type SetVideoCallPresenceResponse = variant {
+    Success;
+    MessageNotFound;
+    AlreadyEnded;
+    CommunityFrozen;
+    UserNotInCommunity;
+    UserSuspended;
+    ChannelNotFound;
+    UserNotInChannel;
+};
+
 type StartVideoCallArgs = record {
     channel_id : ChannelId;
     message_id : MessageId;
@@ -1101,6 +1118,7 @@ service : {
     reset_invite_code : (EmptyArgs) -> (EnableInviteCodeResponse);
     send_message : (SendMessageArgs) -> (SendMessageResponse);
     set_member_display_name : (SetMemberDisplayNameArgs) -> (SetMemberDisplayNameResponse);
+    set_video_call_presence: (SetVideoCallPresenceArgs) -> (SetVideoCallPresenceResponse);
     start_video_call : (StartVideoCallArgs) -> (StartVideoCallResponse);
     toggle_mute_notifications : (ToggleMuteNotificationsArgs) -> (ToggleMuteNotificationsResponse);
     unblock_user : (UnblockUserArgs) -> (UnblockUserResponse);

diff --git a/backend/canisters/community/api/src/main.rs b/backend/canisters/community/api/src/main.rs
@@ -57,6 +57,7 @@ fn main() {
     generate_candid_method!(community, reset_invite_code, update);
     generate_candid_method!(community, send_message, update);
     generate_candid_method!(community, set_member_display_name, update);
+    generate_candid_method!(community, set_video_call_presence, update);
     generate_candid_method!(community, start_video_call, update);
     generate_candid_method!(community, toggle_mute_notifications, update);
     generate_candid_method!(community, unblock_user, update);

diff --git a/backend/canisters/group/api/can.did b/backend/canisters/group/api/can.did
@@ -89,6 +89,20 @@ type JoinVideoCallResponse = variant {
     UserSuspended;
 };
 
+type SetVideoCallPresenceArgs = record {
+    message_id : MessageId;
+    presence : VideoCallPresence;
+};
+
+type SetVideoCallPresenceResponse = variant {
+    Success;
+    MessageNotFound;
+    AlreadyEnded;
+    GroupFrozen;
+    UserNotInGroup;
+    UserSuspended;
+};
+
 type DeleteMessagesArgs = record {
     thread_root_message_index : opt MessageIndex;
     message_ids : vec MessageId;
@@ -726,6 +740,7 @@ service : {
     follow_thread : (FollowThreadArgs) -> (FollowThreadResponse);
     unfollow_thread : (UnfollowThreadArgs) -> (UnfollowThreadResponse);
     join_video_call : (JoinVideoCallArgs) -> (JoinVideoCallResponse);
+    set_video_call_presence: (SetVideoCallPresenceArgs) -> (SetVideoCallPresenceResponse);
 
     // Video call operator only
     start_video_call : (StartVideoCallArgs) -> (StartVideoCallResponse);

diff --git a/backend/canisters/group/api/src/main.rs b/backend/canisters/group/api/src/main.rs
@@ -43,6 +43,7 @@ fn main() {
     generate_candid_method!(group, report_message, update);
     generate_candid_method!(group, reset_invite_code, update);
     generate_candid_method!(group, send_message_v2, update);
+    generate_candid_method!(group, set_video_call_presence, update);
     generate_candid_method!(group, start_video_call, update);
     generate_candid_method!(group, toggle_mute_notifications, update);
     generate_candid_method!(group, unblock_user, update);

diff --git a/backend/libraries/types/can.did b/backend/libraries/types/can.did
@@ -1775,3 +1775,9 @@ type VideoCallType = variant {
     Broadcast;
     Default;
 };
+
+type VideoCallPresence = variant {
+    Default;
+    Owner;
+    Hidden;
+}
diff --git a/frontend/app/src/components/App.svelte b/frontend/app/src/components/App.svelte
@@ -398,8 +398,10 @@
         incomingVideoCall.set(undefined);
         const chat = client.lookupChatSummary(ev.detail);
         if (chat) {
-            page(routeForChatIdentifier("none", chat.id));
-            videoCallElement?.startOrJoinVideoCall(chat, true);
+            if (chat.videoCallInProgress !== undefined) {
+                page(routeForChatIdentifier("none", chat.id));
+                videoCallElement?.startOrJoinVideoCall(chat, true);
+            }
         }
     }
 
@@ -426,7 +428,6 @@
 
 <IncomingCall on:joinVideoCall={joinVideoCall} />
 
-
 <Witch background />
 
 {#if isCanisterUrl}

diff --git a/frontend/app/src/components/home/ChatMessageContent.svelte b/frontend/app/src/components/home/ChatMessageContent.svelte
@@ -63,7 +63,7 @@
 {:else if content.kind === "video_content"}
     <VideoContent {edited} {fill} {content} {reply} {height} />
 {:else if content.kind === "video_call_content"}
-    <VideoCallContent on:startVideoCall {messageIndex} {content} {timestamp} />
+    <VideoCallContent on:startVideoCall {senderId} {messageIndex} {content} {timestamp} />
 {:else if content.kind === "audio_content"}
     <AudioContent {edited} {content} />
 {:else if content.kind === "file_content"}

diff --git a/frontend/app/src/components/home/MiddlePanel.svelte b/frontend/app/src/components/home/MiddlePanel.svelte
@@ -51,7 +51,10 @@
             if (callContainer) {
                 if (call.view === "fullscreen") {
                     let width = window.innerWidth;
-                    if (layout.rightPanel !== "floating" && call.threadOpen) {
+                    if (
+                        layout.rightPanel !== "floating" &&
+                        (call.threadOpen || call.participantsOpen)
+                    ) {
                         width = width - (rightPanelWidth ?? 500);
                     }
                     callContainer.style.setProperty("left", `0px`);

diff --git a/frontend/app/src/components/home/RightPanel.svelte b/frontend/app/src/components/home/RightPanel.svelte
@@ -35,6 +35,7 @@
     import Resizable from "../Resizable.svelte";
     import { i18nKey } from "../../i18n/i18n";
     import { activeVideoCall } from "../../stores/video";
+    import ActiveCallParticipants from "./video/ActiveCallParticipants.svelte";
 
     const dispatch = createEventDispatcher();
 
@@ -368,6 +369,11 @@
             on:editGroup
             on:chatWith
             on:showGroupMembers />
+    {:else if lastState.kind === "call_participants_panel"}
+        <ActiveCallParticipants
+            isOwner={lastState.isOwner}
+            chatId={lastState.chatId}
+            messageId={lastState.messageId} />
     {:else if lastState.kind === "invite_community_users" && $selectedCommunity !== undefined}
         <InviteUsers
             {level}

diff --git a/frontend/app/src/components/home/VideoCallContent.svelte b/frontend/app/src/components/home/VideoCallContent.svelte
@@ -19,14 +19,12 @@
     export let content: VideoCallContent;
     export let messageIndex: number;
     export let timestamp: bigint | undefined;
+    export let senderId: string;
 
     $: selectedChat = client.selectedChatStore;
     $: communityMembers = client.currentCommunityMembers;
     $: userStore = client.userStore;
-    $: initiator = content.participants[0];
-    $: displayName = initiator
-        ? client.getDisplayNameById(initiator.userId, $communityMembers)
-        : $_("unknownUser");
+    $: displayName = client.getDisplayNameById(senderId, $communityMembers);
     $: incall =
         $activeVideoCall !== undefined &&
         $selectedChat !== undefined &&