Remove the group call inspector

It's unused ever since we switched to LiveKit, and we intend to use other telemetry mechanisms going forward to fill this debugging use case, so it can be removed as discussed in today's team meeting.

src/settings/SettingsModal.tsx

@@ -30,7 +30,6 @@ import { ReactComponent as UserIcon } from "../icons/User.svg";
 import { ReactComponent as FeedbackIcon } from "../icons/Feedback.svg";
 import { SelectInput } from "../input/SelectInput";
 import {
-  useShowInspector,
   useOptInAnalytics,
   useDeveloperSettingsTab,
   useShowConnectionStats,
@@ -38,8 +37,6 @@ import {
   isFirefox,
 } from "./useSetting";
 import { FieldRow, InputField } from "../input/Input";
-import { Button } from "../button";
-import { useDownloadDebugLog } from "./submit-rageshake";
 import { Body, Caption } from "../typography/Typography";
 import { AnalyticsNotice } from "../analytics/AnalyticsNotice";
 import { ProfileSettingsTab } from "./ProfileSettingsTab";
@@ -62,7 +59,6 @@ interface Props {
 export const SettingsModal = (props: Props) => {
   const { t } = useTranslation();
 
-  const [showInspector, setShowInspector] = useShowInspector();
   const [optInAnalytics, setOptInAnalytics] = useOptInAnalytics();
   const [developerSettingsTab, setDeveloperSettingsTab] =
     useDeveloperSettingsTab();
@@ -70,8 +66,6 @@ export const SettingsModal = (props: Props) => {
     useShowConnectionStats();
   const [enableE2EE, setEnableE2EE] = useEnableE2EE();
 
-  const downloadDebugLog = useDownloadDebugLog();
-
   // Generate a `SelectInput` with a list of devices for a given device kind.
   const generateDeviceSelection = (devices: MediaDevice, caption: string) => {
     if (devices.available.length == 0) return null;
@@ -234,18 +228,6 @@ export const SettingsModal = (props: Props) => {
           })}
         </Body>
       </FieldRow>
-      <FieldRow>
-        <InputField
-          id="showInspector"
-          name="inspector"
-          label={t("Show call inspector")}
-          type="checkbox"
-          checked={showInspector}
-          onChange={(e: ChangeEvent<HTMLInputElement>) =>
-            setShowInspector(e.target.checked)
-          }
-        />
-      </FieldRow>
       <FieldRow>
         <InputField
           id="showConnectionStats"
@@ -275,9 +257,6 @@ export const SettingsModal = (props: Props) => {
           }
         />
       </FieldRow>
-      <FieldRow>
-        <Button onPress={downloadDebugLog}>{t("Download debug logs")}</Button>
-      </FieldRow>
     </TabItem>
   );
 

src/settings/submit-rageshake.ts

@@ -14,13 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {
-  ComponentProps,
-  useCallback,
-  useContext,
-  useEffect,
-  useState,
-} from "react";
+import { ComponentProps, useCallback, useEffect, useState } from "react";
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
 import pako from "pako";
@@ -30,7 +24,6 @@ import { logger } from "matrix-js-sdk/src/logger";
 
 import { getLogsForReport } from "./rageshake";
 import { useClient } from "../ClientContext";
-import { InspectorContext } from "../room/GroupCallInspector";
 import { Config } from "../config/Config";
 import { ElementCallOpenTelemetry } from "../otel/otel";
 import { RageshakeRequestModal } from "../room/RageshakeRequestModal";
@@ -58,10 +51,6 @@ export function useSubmitRageshake(): {
 } {
   const { client } = useClient();
 
-  // The value of the context is the whole tuple returned from setState,
-  // so we just want the current state.
-  const [inspectorState] = useContext(InspectorContext) ?? [];
-
   const [{ sending, sent, error }, setState] = useState<{
     sending: boolean;
     sent: boolean;
@@ -270,16 +259,6 @@ export function useSubmitRageshake(): {
             gzip(ElementCallOpenTelemetry.instance.rageshakeProcessor!.dump()),
             "traces.json.gz"
           );
-
-          if (inspectorState) {
-            body.append(
-              "file",
-              new Blob([JSON.stringify(inspectorState)], {
-                type: "text/plain",
-              }),
-              "groupcall.txt"
-            );
-          }
         }
 
         if (opts.rageshakeRequestId) {
@@ -300,7 +279,7 @@ export function useSubmitRageshake(): {
         logger.error(error);
       }
     },
-    [client, inspectorState, sending]
+    [client, sending]
   );
 
   return {
@@ -311,27 +290,6 @@ export function useSubmitRageshake(): {
   };
 }
 
-export function useDownloadDebugLog(): () => void {
-  const json = useContext(InspectorContext);
-
-  const downloadDebugLog = useCallback(() => {
-    const blob = new Blob([JSON.stringify(json)], { type: "application/json" });
-    const url = URL.createObjectURL(blob);
-    const el = document.createElement("a");
-    el.href = url;
-    el.download = "groupcall.json";
-    el.style.display = "none";
-    document.body.appendChild(el);
-    el.click();
-    setTimeout(() => {
-      URL.revokeObjectURL(url);
-      el.parentNode!.removeChild(el);
-    }, 0);
-  }, [json]);
-
-  return downloadDebugLog;
-}
-
 export function useRageshakeRequest(): (
   roomId: string,
   rageshakeRequestId: string

src/settings/useSetting.ts

@@ -83,8 +83,6 @@ export const useSpatialAudio = (): DisableableSetting<boolean> => {
   return [false, null];
 };
 
-export const useShowInspector = () => useSetting("show-inspector", false);
-
 // null = undecided
 export const useOptInAnalytics = (): DisableableSetting<boolean | null> => {
   const settingVal = useSetting<boolean | null>("opt-in-analytics", null);