From fa2fcbcbecd993ab51b4bd2f3f4f395c85d5ef8c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=A0imon=20Brandner?= <simon.bra.ag@gmail.com>
Date: Tue, 25 Jul 2023 11:07:20 +0200
Subject: [PATCH] Hide E2EE behind a flag
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
---
 src/room/LobbyView.tsx         | 19 ++++++++++++-------
 src/settings/SettingsModal.tsx | 14 ++++++++++++++
 src/settings/useSetting.ts     |  3 +++
 3 files changed, 29 insertions(+), 7 deletions(-)

diff --git a/src/room/LobbyView.tsx b/src/room/LobbyView.tsx
index e52835ae..258b474f 100644
--- a/src/room/LobbyView.tsx
+++ b/src/room/LobbyView.tsx
@@ -27,6 +27,7 @@ import { useLocationNavigation } from "../useLocationNavigation";
 import { MatrixInfo, VideoPreview } from "./VideoPreview";
 import { E2EEConfig, UserChoices } from "../livekit/useLiveKit";
 import { InputField } from "../input/Input";
+import { useEnableE2EE } from "../settings/useSetting";
 
 interface Props {
   matrixInfo: MatrixInfo;
@@ -40,6 +41,8 @@ export function LobbyView(props: Props) {
   const { t } = useTranslation();
   useLocationNavigation();
 
+  const [enableE2EE] = useEnableE2EE();
+
   const joinCallButtonRef = useRef<HTMLButtonElement>(null);
   useEffect(() => {
     if (joinCallButtonRef.current) {
@@ -80,13 +83,15 @@ export function LobbyView(props: Props) {
             matrixInfo={props.matrixInfo}
             onUserChoicesChanged={setUserChoices}
           />
-          <InputField
-            className={styles.passwordField}
-            label={t("Password (if none E2EE, is disabled)")}
-            type="text"
-            onChange={onE2EESharedKeyChanged}
-            value={e2eeSharedKey}
-          />
+          {enableE2EE && (
+            <InputField
+              className={styles.passwordField}
+              label={t("Password (if none E2EE, is disabled)")}
+              type="text"
+              onChange={onE2EESharedKeyChanged}
+              value={e2eeSharedKey}
+            />
+          )}
           <Trans>
             <Button
               ref={joinCallButtonRef}
diff --git a/src/settings/SettingsModal.tsx b/src/settings/SettingsModal.tsx
index 19379cb4..1b9934b5 100644
--- a/src/settings/SettingsModal.tsx
+++ b/src/settings/SettingsModal.tsx
@@ -34,6 +34,7 @@ import {
   useOptInAnalytics,
   useDeveloperSettingsTab,
   useShowConnectionStats,
+  useEnableE2EE,
 } from "./useSetting";
 import { FieldRow, InputField } from "../input/Input";
 import { Button } from "../button";
@@ -68,6 +69,7 @@ export const SettingsModal = (props: Props) => {
     useDeveloperSettingsTab();
   const [showConnectionStats, setShowConnectionStats] =
     useShowConnectionStats();
+  const [enableE2EE, setEnableE2EE] = useEnableE2EE();
 
   const downloadDebugLog = useDownloadDebugLog();
 
@@ -249,6 +251,18 @@ export const SettingsModal = (props: Props) => {
             }
           />
         </FieldRow>
+        <FieldRow>
+          <InputField
+            id="enableE2EE"
+            name="end-to-end-encryption"
+            label={t("Enable end-to-end encryption (password protected calls)")}
+            type="checkbox"
+            checked={enableE2EE}
+            onChange={(e: ChangeEvent<HTMLInputElement>) =>
+              setEnableE2EE(e.target.checked)
+            }
+          />
+        </FieldRow>
         <FieldRow>
           <Button onPress={downloadDebugLog}>{t("Download debug logs")}</Button>
         </FieldRow>
diff --git a/src/settings/useSetting.ts b/src/settings/useSetting.ts
index 63f1e23a..8d3f074f 100644
--- a/src/settings/useSetting.ts
+++ b/src/settings/useSetting.ts
@@ -104,6 +104,9 @@ export const useDeveloperSettingsTab = () =>
 export const useShowConnectionStats = () =>
   useSetting("show-connection-stats", false);
 
+export const useEnableE2EE = () =>
+  useSetting("enable-end-to-end-encryption", false);
+
 export const useDefaultDevices = () =>
   useSetting("defaultDevices", {
     audioinput: "",