fix(Call): Show feedback when user B deny call

src/lib/components/calling/CallScreen.svelte

@@ -13,7 +13,7 @@
     import type { Chat } from "$lib/types"
     import VolumeMixer from "./VolumeMixer.svelte"
     import { createEventDispatcher, onDestroy, onMount } from "svelte"
-    import { callTimeout, connectionOpened, TIME_TO_SHOW_CONNECTING, usersAcceptedTheCall, VoiceRTCInstance } from "$lib/media/Voice"
+    import { callTimeout, TIME_TO_SHOW_CONNECTING, TIME_TO_SHOW_END_CALL_FEEDBACK, usersAcceptedTheCall, usersDeniedTheCall, VoiceRTCInstance } from "$lib/media/Voice"
     import { log } from "$lib/utils/Logger"
     import { playSound, SoundHandler, Sounds } from "../utils/SoundHandler"
 
@@ -117,6 +117,15 @@
             },
         }
     }
+
+    $: if ($usersDeniedTheCall.length === chat.users.length - 1) {
+        setTimeout(() => {
+            Store.endCall()
+            VoiceRTCInstance.leaveCall()
+            dispatch("endCall")
+        }, TIME_TO_SHOW_END_CALL_FEEDBACK)
+    }
+
     let showAnimation = true
     let message = $_("settings.calling.connecting")
     let timeout: NodeJS.Timeout | undefined
@@ -128,6 +137,7 @@
     }
 
     onMount(async () => {
+        usersDeniedTheCall.set([])
         callTimeout.set(false)
         usersAcceptedTheCall.set([])
         document.addEventListener("mousedown", handleClickOutside)
@@ -176,7 +186,7 @@
             </svelte:fragment>
         </Topbar>
 
-        {#if !$callTimeout}
+        {#if !$callTimeout && ($usersDeniedTheCall.length === 0 || $usersDeniedTheCall.length !== chat.users.length - 1)}
             <div id="participants">
                 <div class="video-container">
                     <video
@@ -252,6 +262,11 @@
                     {/if}
                 {/each}
             </div>
+        {:else if $usersDeniedTheCall.length === chat.users.length - 1}
+            <div class="loading-when-no-answer">
+                <div class="spinner"></div>
+                <p>{$_("settings.calling.everybodyDeniedTheCall")}</p>
+            </div>
         {:else}
             <div class="loading-when-no-answer">
                 <div class="spinner"></div>

src/lib/lang/en.json

@@ -347,6 +347,7 @@
             "disconnecting": "Disconnecting...",
             "userInviteToAGroupCall": "is inviting you to join a group call",
             "noAnswer": "No answer, leaving the call...",
+            "everybodyDeniedTheCall": "Everybody Denied the call. Disconnecting...",
             "acceptedCall": "Joined, loading...",
             "connecting": "Connecting...",
             "noResponse": "No response"

src/lib/media/Voice.ts

@@ -12,10 +12,11 @@ import { joinRoom } from "trystero/ipfs"
 const CALL_ACK = "CALL_ACCEPT"
 
 const TIME_TO_WAIT_FOR_ANSWER = 35000
-const TIME_TO_SHOW_END_CALL_FEEDBACK = 3500
+export const TIME_TO_SHOW_END_CALL_FEEDBACK = 3500
 export const TIME_TO_SHOW_CONNECTING = 30000
 
 let timeOuts: NodeJS.Timeout[] = []
+export const usersDeniedTheCall: Writable<string[]> = writable([])
 export const usersAcceptedTheCall: Writable<string[]> = writable([])
 
 export enum VoiceRTCMessageType {
@@ -516,6 +517,7 @@ export class VoiceRTC {
                         conn = undefined
                         if (!accepted) {
                             log.info(`Recipient ${did} didn't accept`)
+                            usersDeniedTheCall.set([...get(usersDeniedTheCall), did])
                             // Do something else?
                             handled = true
                         }
@@ -593,6 +595,7 @@ export class VoiceRTC {
     }
 
     async leaveCall(sendEndCallMessage = false) {
+        usersDeniedTheCall.set([])
         callTimeout.set(false)
         connectionOpened.set(false)
         usersAcceptedTheCall.set([])
@@ -620,7 +623,7 @@ export class VoiceRTC {
         }
 
         log.info("Call ended and resources cleaned up.")
-        this.setupLocalPeer()
+        this.setupLocalPeer(true)
     }
 
     async getLocalStream(replace = false) {
@@ -700,13 +703,15 @@ export class VoiceRTC {
         this.invitations.forEach(c => c.cancel())
         this.invitations = []
         this.localPeer?.destroy()
+        this.localPeer = null
         if (this.localVideoCurrentSrc) {
             this.localVideoCurrentSrc.pause()
             this.localVideoCurrentSrc.srcObject = null
             this.localVideoCurrentSrc = null
         }
         if (this.localStream) this.localStream.getTracks().forEach(track => track.stop())
         this.localStream = null
+
         this.call?.room.leave()
         this.call = null
         Store.state.activeCallMeta.set({})