From 2753f04f0bd0fb9e9de36d0ade9ab271fce30aa6 Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 19 Sep 2023 18:23:44 +0100 Subject: [PATCH] Include the room name in the generated URL --- src/home/CallList.tsx | 18 +++++++++++------- src/matrix-utils.ts | 12 ++++++++---- src/room/AppSelectionModal.tsx | 6 +++++- src/room/GroupCallView.tsx | 2 +- src/room/ShareModal.tsx | 9 +++++---- 5 files changed, 30 insertions(+), 17 deletions(-) diff --git a/src/home/CallList.tsx b/src/home/CallList.tsx index a82e4c13..97469e55 100644 --- a/src/home/CallList.tsx +++ b/src/home/CallList.tsx @@ -17,6 +17,7 @@ limitations under the License. import { Link } from "react-router-dom"; import { MatrixClient } from "matrix-js-sdk/src/client"; import { RoomMember } from "matrix-js-sdk/src/models/room-member"; +import { Room } from "matrix-js-sdk"; import { CopyButton } from "../button"; import { Avatar, Size } from "../Avatar"; @@ -40,7 +41,7 @@ export function CallList({ rooms, client }: CallListProps) { client={client} name={roomName} avatarUrl={avatarUrl} - roomId={room.roomId} + room={room} participants={participants} /> ))} @@ -57,17 +58,20 @@ export function CallList({ rooms, client }: CallListProps) { interface CallTileProps { name: string; avatarUrl: string; - roomId: string; + room: Room; participants: RoomMember[]; client: MatrixClient; } -function CallTile({ name, avatarUrl, roomId }: CallTileProps) { - const roomSharedKey = useRoomSharedKey(roomId); +function CallTile({ name, avatarUrl, room }: CallTileProps) { + const roomSharedKey = useRoomSharedKey(room.roomId); return (
- - + +
{name} @@ -78,7 +82,7 @@ function CallTile({ name, avatarUrl, roomId }: CallTileProps) {
); diff --git a/src/matrix-utils.ts b/src/matrix-utils.ts index a9f37011..e9f8a35c 100644 --- a/src/matrix-utils.ts +++ b/src/matrix-utils.ts @@ -345,10 +345,14 @@ export async function createRoom( * @param password * @returns */ -export function getRoomUrl(roomId: string, password?: string): string { - return `${window.location.protocol}//${ - window.location.host - }/room/#?roomId=${roomId}${password ? "&" + PASSWORD_STRING + password : ""}`; +export function getRoomUrl( + roomId: string, + roomName?: string, + password?: string +): string { + return `${window.location.protocol}//${window.location.host}/#${ + roomName ? "/" + roomAliasLocalpartFromRoomName(roomName) : "" + }?roomId=${roomId}${password ? "&" + PASSWORD_STRING + password : ""}`; } export function getAvatarUrl( diff --git a/src/room/AppSelectionModal.tsx b/src/room/AppSelectionModal.tsx index b1cc4e48..ec639a39 100644 --- a/src/room/AppSelectionModal.tsx +++ b/src/room/AppSelectionModal.tsx @@ -45,10 +45,14 @@ export const AppSelectionModal: FC = ({ roomId }) => { const roomSharedKey = useRoomSharedKey(roomId ?? ""); const appUrl = useMemo(() => { // If the room ID is not known, fall back to the URL of the current page + // Also, we don't really know the room name at this stage as we haven't + // started a client and synced to get the room details. We could take the one + // we got in our own URL and use that, but it's not a string that a human + // ever sees so it's somewhat redundant. We just don't pass a name. const url = new URL( roomId === null ? window.location.href - : getRoomUrl(roomId, roomSharedKey ?? undefined) + : getRoomUrl(roomId, undefined, roomSharedKey ?? undefined) ); // Edit the URL to prevent the app selection prompt from appearing a second // time within the app, and to keep the user confined to the current room diff --git a/src/room/GroupCallView.tsx b/src/room/GroupCallView.tsx index a9db1bb7..809bba7d 100644 --- a/src/room/GroupCallView.tsx +++ b/src/room/GroupCallView.tsx @@ -302,7 +302,7 @@ export function GroupCallView({ const shareModal = ( diff --git a/src/room/ShareModal.tsx b/src/room/ShareModal.tsx index b9adc8e0..1e140c3f 100644 --- a/src/room/ShareModal.tsx +++ b/src/room/ShareModal.tsx @@ -16,6 +16,7 @@ limitations under the License. import { FC } from "react"; import { useTranslation } from "react-i18next"; +import { Room } from "matrix-js-sdk"; import { Modal } from "../Modal"; import { CopyButton } from "../button"; @@ -24,21 +25,21 @@ import styles from "./ShareModal.module.css"; import { useRoomSharedKey } from "../e2ee/sharedKeyManagement"; interface Props { - roomId: string; + room: Room; open: boolean; onDismiss: () => void; } -export const ShareModal: FC = ({ roomId, open, onDismiss }) => { +export const ShareModal: FC = ({ room, open, onDismiss }) => { const { t } = useTranslation(); - const roomSharedKey = useRoomSharedKey(roomId); + const roomSharedKey = useRoomSharedKey(room.roomId); return (

{t("Copy and share this call link")}