Handle broken links better

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

src/UrlParams.ts

@@ -102,12 +102,12 @@ export const getUrlParams = (
   pathname = window.location.pathname,
   hash = window.location.hash
 ): UrlParams => {
-  let roomAlias: string | undefined;
+  let roomAlias: string | null = null;
   if (!ignoreRoomAlias) {
     if (hash === "") {
       roomAlias = pathname.substring(1); // Strip the "/"
 
-      // Delete "/room/" and "?", if present
+      // Delete "/room/", if present
       if (roomAlias.startsWith("room/")) {
         roomAlias = roomAlias.substring("room/".length);
       }
@@ -123,6 +123,14 @@ export const getUrlParams = (
     if (!roomAlias.includes(":")) {
       roomAlias = `${roomAlias}:${Config.defaultServerName()}`;
     }
+
+    // Delete "?" and what comes afterwards
+    roomAlias = roomAlias.split("?")[0];
+
+    // Make roomAlias undefined, if empty
+    if (roomAlias.length <= 1) {
+      roomAlias = null;
+    }
   }
 
   const fragmentQueryStart = hash.indexOf("?");
@@ -145,9 +153,17 @@ export const getUrlParams = (
 
   const fontScale = parseFloat(getParam("fontScale") ?? "");
 
+  // Make sure roomId is valid
+  let roomId: string | null = getParam("roomId");
+  if (!roomId?.startsWith("!")) {
+    roomId = null;
+  } else if (!roomId.includes("")) {
+    roomId = null;
+  }
+
   return {
-    roomAlias: !roomAlias || roomAlias.includes("!") ? null : roomAlias,
-    roomId: getParam("roomId"),
+    roomAlias,
+    roomId,
     viaServers: getAllParams("via"),
     isEmbedded: hasParam("embed"),
     preload: hasParam("preload"),

src/room/RoomPage.tsx

@@ -15,7 +15,6 @@ limitations under the License.
 */
 
 import { FC, useEffect, useState, useCallback } from "react";
-import { useTranslation } from "react-i18next";
 
 import type { GroupCall } from "matrix-js-sdk/src/webrtc/groupCall";
 import { useClientLegacy } from "../ClientContext";
@@ -25,11 +24,11 @@ import { GroupCallLoader } from "./GroupCallLoader";
 import { GroupCallView } from "./GroupCallView";
 import { useUrlParams } from "../UrlParams";
 import { useRegisterPasswordlessUser } from "../auth/useRegisterPasswordlessUser";
-import { translatedError } from "../TranslatedError";
 import { useOptInAnalytics } from "../settings/useSetting";
+import { useHistory } from "react-router-dom";
 
 export const RoomPage: FC = () => {
-  const { t } = useTranslation();
+  const history = useHistory();
 
   const {
     roomAlias,
@@ -42,7 +41,11 @@ export const RoomPage: FC = () => {
     displayName,
   } = useUrlParams();
   const roomIdOrAlias = roomId ?? roomAlias;
-  if (!roomIdOrAlias) throw translatedError("No room specified", t);
+  if (!roomIdOrAlias) {
+    history.push("/");
+    console.error("No room specified");
+    return null;
+  }
 
   const [optInAnalytics, setOptInAnalytics] = useOptInAnalytics();
   const { registerPasswordlessUser } = useRegisterPasswordlessUser();