diff --git a/public/locales/en-GB/app.json b/public/locales/en-GB/app.json
index 5d3d524c..f14af673 100644
--- a/public/locales/en-GB/app.json
+++ b/public/locales/en-GB/app.json
@@ -21,6 +21,8 @@
"By clicking \"Go\", you agree to our <2>End User Licensing Agreement (EULA)2>": "By clicking \"Go\", you agree to our <2>End User Licensing Agreement (EULA)2>",
"By clicking \"Join call now\", you agree to our <2>End User Licensing Agreement (EULA)2>": "By clicking \"Join call now\", you agree to our <2>End User Licensing Agreement (EULA)2>",
"By participating in this beta, you consent to the collection of anonymous data, which we use to improve the product. You can find more information about which data we track in our <2>Privacy Policy2> and our <5>Cookie Policy5>.": "By participating in this beta, you consent to the collection of anonymous data, which we use to improve the product. You can find more information about which data we track in our <2>Privacy Policy2> and our <5>Cookie Policy5>.",
+ "Call not found": "Call not found",
+ "Calls are now end-to-end encrypted and need to be created from the home page. This helps make sure everyone's using the same encryption key.": "Calls are now end-to-end encrypted and need to be created from the home page. This helps make sure everyone's using the same encryption key.",
"Camera": "Camera",
"Close": "Close",
"Confirm password": "Confirm password",
diff --git a/src/room/GroupCallLoader.tsx b/src/room/GroupCallLoader.tsx
index 5f71f203..c61f4ca4 100644
--- a/src/room/GroupCallLoader.tsx
+++ b/src/room/GroupCallLoader.tsx
@@ -14,10 +14,13 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
-import { ReactNode } from "react";
+import { ReactNode, useCallback } from "react";
import { MatrixClient } from "matrix-js-sdk/src/client";
import { useTranslation } from "react-i18next";
import { MatrixRTCSession } from "matrix-js-sdk/src/matrixrtc/MatrixRTCSession";
+import { MatrixError } from "matrix-js-sdk";
+import { useHistory } from "react-router-dom";
+import { Heading, Link, Text } from "@vector-im/compound-web";
import { useLoadGroupCall } from "./useLoadGroupCall";
import { ErrorView, FullScreenView } from "../FullScreenView";
@@ -38,6 +41,15 @@ export function GroupCallLoader({
const { t } = useTranslation();
const groupCallState = useLoadGroupCall(client, roomIdOrAlias, viaServers);
+ const history = useHistory();
+ const onHomeClick = useCallback(
+ (ev: React.MouseEvent) => {
+ ev.preventDefault();
+ history.push("/");
+ },
+ [history]
+ );
+
switch (groupCallState.kind) {
case "loading":
return (
@@ -48,6 +60,24 @@ export function GroupCallLoader({
case "loaded":
return <>{children(groupCallState.rtcSession)}>;
case "failed":
- return ;
+ if ((groupCallState.error as MatrixError).errcode === "M_NOT_FOUND") {
+ return (
+
+ {t("Call not found")}
+
+ {t(
+ "Calls are now end-to-end encrypted and need to be created from the home page. This helps make sure everyone's using the same encryption key."
+ )}
+
+ {/* XXX: A 'create it for me' button would be the obvious UX here. Two screens already have
+ dupes of this flow, let's make a common component and put it here. */}
+
+ {t("Home")}
+
+
+ );
+ } else {
+ return ;
+ }
}
}
diff --git a/src/room/useLoadGroupCall.ts b/src/room/useLoadGroupCall.ts
index e6f79ced..c47a678b 100644
--- a/src/room/useLoadGroupCall.ts
+++ b/src/room/useLoadGroupCall.ts
@@ -20,14 +20,10 @@ import { ClientEvent, MatrixClient } from "matrix-js-sdk/src/client";
import { SyncState } from "matrix-js-sdk/src/sync";
import { useTranslation } from "react-i18next";
import { MatrixRTCSession } from "matrix-js-sdk/src/matrixrtc/MatrixRTCSession";
-import { randomString } from "matrix-js-sdk/src/randomstring";
import type { Room } from "matrix-js-sdk/src/models/room";
import type { GroupCall } from "matrix-js-sdk/src/webrtc/groupCall";
-import { setLocalStorageItem } from "../useLocalStorage";
-import { isLocalRoomId, createRoom, roomNameFromRoomId } from "../matrix-utils";
import { useEnableE2EE } from "../settings/useSetting";
-import { getRoomSharedKeyLocalStorageKey } from "../e2ee/sharedKeyManagement";
export type GroupCallLoaded = {
kind: "loaded";
@@ -65,58 +61,21 @@ export const useLoadGroupCall = (
useEffect(() => {
const fetchOrCreateRoom = async (): Promise => {
- try {
- // We lowercase the localpart when we create the room, so we must lowercase
- // it here too (we just do the whole alias). We can't do the same to room IDs
- // though.
- const sanitisedIdOrAlias =
- roomIdOrAlias[0] === "#"
- ? roomIdOrAlias.toLowerCase()
- : roomIdOrAlias;
+ // We lowercase the localpart when we create the room, so we must lowercase
+ // it here too (we just do the whole alias). We can't do the same to room IDs
+ // though.
+ const sanitisedIdOrAlias =
+ roomIdOrAlias[0] === "#" ? roomIdOrAlias.toLowerCase() : roomIdOrAlias;
- const room = await client.joinRoom(sanitisedIdOrAlias, {
- viaServers,
- });
- logger.info(
- `Joined ${sanitisedIdOrAlias}, waiting room to be ready for group calls`
- );
- await client.waitUntilRoomReadyForGroupCalls(room.roomId);
- logger.info(`${sanitisedIdOrAlias}, is ready for group calls`);
- return room;
- } catch (error) {
- if (
- isLocalRoomId(roomIdOrAlias, client) &&
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
- (error.errcode === "M_NOT_FOUND" ||
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
- (error.message &&
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
- error.message.indexOf("Failed to fetch alias") !== -1))
- ) {
- // The room doesn't exist, but we can create it
- const [, roomId] = await createRoom(
- client,
- roomNameFromRoomId(roomIdOrAlias),
- e2eeEnabled ?? false
- );
-
- if (e2eeEnabled) {
- setLocalStorageItem(
- getRoomSharedKeyLocalStorageKey(roomId),
- randomString(32)
- );
- }
-
- // likewise, wait for the room
- await client.waitUntilRoomReadyForGroupCalls(roomId);
- return client.getRoom(roomId)!;
- } else {
- throw error;
- }
- }
+ const room = await client.joinRoom(sanitisedIdOrAlias, {
+ viaServers,
+ });
+ logger.info(
+ `Joined ${sanitisedIdOrAlias}, waiting room to be ready for group calls`
+ );
+ await client.waitUntilRoomReadyForGroupCalls(room.roomId);
+ logger.info(`${sanitisedIdOrAlias}, is ready for group calls`);
+ return room;
};
const fetchOrCreateGroupCall = async (): Promise => {