diff --git a/locales/en/app.json b/locales/en/app.json index b72af0d5..d27b9a6c 100644 --- a/locales/en/app.json +++ b/locales/en/app.json @@ -66,6 +66,8 @@ "device_id": "Device ID: {{id}}", "duplicate_tiles_label": "Number of additional tile copies per participant", "hostname": "Hostname: {{hostname}}", + "livekit_server_info": "LiveKit Server Info", + "livekit_sfu": "LiveKit SFU: {{url}}", "matrix_id": "Matrix ID: {{id}}", "show_connection_stats": "Show connection statistics", "show_non_member_tiles": "Show tiles for non-member media" diff --git a/src/room/InCallView.tsx b/src/room/InCallView.tsx index 56dadd86..37db47c7 100644 --- a/src/room/InCallView.tsx +++ b/src/room/InCallView.tsx @@ -679,6 +679,7 @@ export const InCallView: FC = ({ onDismiss={closeSettings} tab={settingsTab} onTabChange={setSettingsTab} + livekitRoom={livekitRoom} /> )} diff --git a/src/settings/DeveloperSettingsTab.module.css b/src/settings/DeveloperSettingsTab.module.css new file mode 100644 index 00000000..4d6dccc6 --- /dev/null +++ b/src/settings/DeveloperSettingsTab.module.css @@ -0,0 +1,10 @@ +/* +Copyright 2025 New Vector Ltd. + +SPDX-License-Identifier: AGPL-3.0-only +Please see LICENSE in the repository root for full details. +*/ + +pre { + font-size: var(--font-size-micro); +} diff --git a/src/settings/DeveloperSettingsTab.tsx b/src/settings/DeveloperSettingsTab.tsx index 96ab262f..2592f424 100644 --- a/src/settings/DeveloperSettingsTab.tsx +++ b/src/settings/DeveloperSettingsTab.tsx @@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only Please see LICENSE in the repository root for full details. */ -import { type ChangeEvent, type FC, useCallback } from "react"; +import { type ChangeEvent, type FC, useCallback, useMemo } from "react"; import { useTranslation } from "react-i18next"; import { FieldRow, InputField } from "../input/Input"; @@ -17,12 +17,14 @@ import { showConnectionStats as showConnectionStatsSetting, } from "./settings"; import type { MatrixClient } from "matrix-js-sdk/src/client"; - +import type { Room as LivekitRoom } from "livekit-client"; +import styles from "./DeveloperSettingsTab.module.css"; interface Props { client: MatrixClient; + livekitRoom?: LivekitRoom; } -export const DeveloperSettingsTab: FC = ({ client }) => { +export const DeveloperSettingsTab: FC = ({ client, livekitRoom }) => { const { t } = useTranslation(); const [duplicateTiles, setDuplicateTiles] = useSetting(duplicateTilesSetting); const [debugTileLayout, setDebugTileLayout] = useSetting( @@ -36,6 +38,16 @@ export const DeveloperSettingsTab: FC = ({ client }) => { showConnectionStatsSetting, ); + const sfuUrl = useMemo((): URL | null => { + if (livekitRoom?.engine.client.ws?.url) { + // strip the URL params + const url = new URL(livekitRoom.engine.client.ws.url); + url.search = ""; + return url; + } + return null; + }, [livekitRoom]); + return ( <>

@@ -122,6 +134,22 @@ export const DeveloperSettingsTab: FC = ({ client }) => { )} /> + {livekitRoom ? ( + <> +

+ {t("developer_mode.livekit_sfu", { + url: sfuUrl?.href || "unknown", + })} +

+

{t("developer_mode.livekit_server_info")}

+
+            {livekitRoom.serverInfo
+              ? JSON.stringify(livekitRoom.serverInfo, null, 2)
+              : "undefined"}
+            {livekitRoom.metadata}
+          
+ + ) : null} ); }; diff --git a/src/settings/SettingsModal.tsx b/src/settings/SettingsModal.tsx index b7066095..da100e3d 100644 --- a/src/settings/SettingsModal.tsx +++ b/src/settings/SettingsModal.tsx @@ -9,6 +9,7 @@ import { type FC, useState } from "react"; import { useTranslation } from "react-i18next"; import { type MatrixClient } from "matrix-js-sdk/src/matrix"; import { Root as Form } from "@vector-im/compound-web"; +import { type Room as LivekitRoom } from "livekit-client"; import { Modal } from "../Modal"; import styles from "./SettingsModal.module.css"; @@ -46,6 +47,7 @@ interface Props { onTabChange: (tab: SettingsTab) => void; client: MatrixClient; roomId?: string; + livekitRoom?: LivekitRoom; } export const defaultSettingsTab: SettingsTab = "audio"; @@ -57,6 +59,7 @@ export const SettingsModal: FC = ({ onTabChange, client, roomId, + livekitRoom, }) => { const { t } = useTranslation(); @@ -138,7 +141,7 @@ export const SettingsModal: FC = ({ const developerTab: Tab = { key: "developer", name: t("settings.developer_tab_title"), - content: , + content: , }; const tabs = [audioTab, videoTab];