From 65ab0ee6650badd474c6f322b69f3fda9df5f319 Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Fri, 27 Nov 2020 12:53:09 +0000
Subject: [PATCH] Slightly better error if we can't capture user media

Fixes https://github.com/vector-im/element-web/issues/15837
---
 src/CallHandler.tsx         | 39 +++++++++++++++++++++++++++++++++++--
 src/i18n/strings/en_EN.json |  7 +++++++
 2 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/src/CallHandler.tsx b/src/CallHandler.tsx
index 3be203ab98..710cd10f99 100644
--- a/src/CallHandler.tsx
+++ b/src/CallHandler.tsx
@@ -80,6 +80,7 @@ import { MatrixCall, CallErrorCode, CallState, CallEvent, CallParty, CallType }
 import Analytics from './Analytics';
 import CountlyAnalytics from "./CountlyAnalytics";
 import {UIFeature} from "./settings/UIFeature";
+import { CallError } from "matrix-js-sdk/src/webrtc/call";
 
 enum AudioID {
     Ring = 'ringAudio',
@@ -226,11 +227,17 @@ export default class CallHandler {
     }
 
     private setCallListeners(call: MatrixCall) {
-        call.on(CallEvent.Error, (err) => {
+        call.on(CallEvent.Error, (err: CallError) => {
             if (!this.matchesCallForThisRoom(call)) return;
 
-            Analytics.trackEvent('voip', 'callError', 'error', err);
+            Analytics.trackEvent('voip', 'callError', 'error', err.toString());
             console.error("Call error:", err);
+
+            if (err.code === CallErrorCode.NoUserMedia) {
+                this.showMediaCaptureError(call);
+                return;
+            }
+
             if (
                 MatrixClientPeg.get().getTurnServers().length === 0 &&
                 SettingsStore.getValue("fallbackICEServerAllowed") === null
@@ -377,6 +384,34 @@ export default class CallHandler {
         }, null, true);
     }
 
+    private showMediaCaptureError(call: MatrixCall) {
+        let title;
+        let description;
+
+        if (call.type === CallType.Voice) {
+            title = _t("Unable to access microphone");
+            description = <div>
+                {_t(
+                    "Call failed because no microphone could not be accessed. " +
+                    "Check that a microphone is plugged in and set up correctly.",
+                )}
+            </div>;
+        } else if (call.type === CallType.Video) {
+            title = _t("Unable to access webcam / microphone");
+            description = <div>
+                {_t("Call failed because no webcam or microphone could not be accessed. Check that:")}
+                <ul>
+                    <li>{_t("A microphone and webcam are plugged in and set up correctly")}</li>
+                    <li>{_t("Permission is granted to usethe webcam")}</li>
+                    <li>{_t("No other application is using the webcam")}</li>
+                </ul>
+            </div>;
+        }
+
+        Modal.createTrackedDialog('Media capture failed', '', ErrorDialog, {
+            title, description,
+        }, null, true);
+    }
 
     private placeCall(
         roomId: string, type: PlaceCallType,
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index 0d50128f32..165a312332 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -46,6 +46,13 @@
     "Alternatively, you can try to use the public server at <code>turn.matrix.org</code>, but this will not be as reliable, and it will share your IP address with that server. You can also manage this in Settings.": "Alternatively, you can try to use the public server at <code>turn.matrix.org</code>, but this will not be as reliable, and it will share your IP address with that server. You can also manage this in Settings.",
     "Try using turn.matrix.org": "Try using turn.matrix.org",
     "OK": "OK",
+    "Unable to access microphone": "Unable to access microphone",
+    "Call failed because no microphone could not be accessed. Check that a microphone is plugged in and set up correctly.": "Call failed because no microphone could not be accessed. Check that a microphone is plugged in and set up correctly.",
+    "Unable to access webcam / microphone": "Unable to access webcam / microphone",
+    "Call failed because no webcam or microphone could not be accessed. Check that:": "Call failed because no webcam or microphone could not be accessed. Check that:",
+    "A microphone and webcam are plugged in and set up correctly": "A microphone and webcam are plugged in and set up correctly",
+    "Permission is granted to usethe webcam": "Permission is granted to usethe webcam",
+    "No other application is using the webcam": "No other application is using the webcam",
     "Unable to capture screen": "Unable to capture screen",
     "Existing Call": "Existing Call",
     "You are already in a call.": "You are already in a call.",