Remove unnecessary usage of a roomIdOrAlias

In most cases the `roomId` was used despite the name of the variable.

src/home/RegisteredView.tsx

@@ -70,10 +70,9 @@ export function RegisteredView({ client, isPasswordlessUser }: Props) {
         setError(undefined);
         setLoading(true);
 
-        const [roomIdOrAlias] = await createRoom(client, roomName, ptt);
-
-        if (roomIdOrAlias) {
-          history.push(`/room/${roomIdOrAlias}`);
+        const [roomAlias] = await createRoom(client, roomName, ptt);
+        if (roomAlias) {
+          history.push(`/room/${roomAlias}`);
         }
       }
 

src/home/UnauthenticatedView.tsx

@@ -79,9 +79,9 @@ export const UnauthenticatedView: FC = () => {
           true
         );
 
-        let roomIdOrAlias: string;
+        let roomAlias: string;
         try {
-          [roomIdOrAlias] = await createRoom(client, roomName, ptt);
+          [roomAlias] = await createRoom(client, roomName, ptt);
         } catch (error) {
           if (!setClient) {
             throw error;
@@ -111,7 +111,7 @@ export const UnauthenticatedView: FC = () => {
         }
 
         setClient({ client, session });
-        history.push(`/room/${roomIdOrAlias}`);
+        history.push(`/room/${roomAlias}`);
       }
 
       submit().catch((error) => {

src/room/GroupCallView.tsx

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { useHistory } from "react-router-dom";
 import { GroupCall, GroupCallState } from "matrix-js-sdk/src/webrtc/groupCall";
 import { MatrixClient } from "matrix-js-sdk/src/client";
@@ -50,7 +50,6 @@ interface Props {
   isEmbedded: boolean;
   preload: boolean;
   hideHeader: boolean;
-  roomIdOrAlias: string;
   groupCall: GroupCall;
 }
 
@@ -60,7 +59,6 @@ export function GroupCallView({
   isEmbedded,
   preload,
   hideHeader,
-  roomIdOrAlias,
   groupCall,
 }: Props) {
   const {
@@ -83,13 +81,14 @@ export function GroupCallView({
   }, [groupCall]);
 
   const { displayName, avatarUrl } = useProfile(client);
-
-  const matrixInfo: MatrixInfo = {
-    displayName: displayName!,
-    avatarUrl: avatarUrl!,
-    roomName: groupCall.room.name,
-    roomIdOrAlias,
-  };
+  const matrixInfo = useMemo((): MatrixInfo => {
+    return {
+      displayName: displayName!,
+      avatarUrl: avatarUrl!,
+      roomId: groupCall.room.roomId,
+      roomName: groupCall.room.name,
+    };
+  }, [displayName, avatarUrl, groupCall]);
 
   useEffect(() => {
     if (widget && preload) {
@@ -243,7 +242,6 @@ export function GroupCallView({
           onLeave={onLeave}
           unencryptedEventsFromUsers={unencryptedEventsFromUsers}
           hideHeader={hideHeader}
-          matrixInfo={matrixInfo}
           userChoices={userChoices}
           otelGroupCallMembership={otelGroupCallMembership}
         />

src/room/InCallView.tsx

@@ -68,7 +68,6 @@ import { ElementWidgetActions, widget } from "../widget";
 import { GridLayoutMenu } from "./GridLayoutMenu";
 import { GroupCallInspector } from "./GroupCallInspector";
 import styles from "./InCallView.module.css";
-import { MatrixInfo } from "./VideoPreview";
 import { useJoinRule } from "./useJoinRule";
 import { ParticipantInfo } from "./useGroupCall";
 import { ItemData, TileContent, VideoTile } from "../video-grid/VideoTile";
@@ -118,7 +117,6 @@ export interface InCallViewProps {
   onLeave: () => void;
   unencryptedEventsFromUsers: Set<string>;
   hideHeader: boolean;
-  matrixInfo: MatrixInfo;
   otelGroupCallMembership?: OTelGroupCallMembership;
 }
 
@@ -130,7 +128,6 @@ export function InCallView({
   onLeave,
   unencryptedEventsFromUsers,
   hideHeader,
-  matrixInfo,
   otelGroupCallMembership,
 }: InCallViewProps) {
   const { t } = useTranslation();
@@ -397,7 +394,7 @@ export function InCallView({
       {!hideHeader && maximisedParticipant === null && (
         <Header>
           <LeftNav>
-            <RoomHeaderInfo roomName={matrixInfo.roomName} />
+            <RoomHeaderInfo roomName={groupCall.room.name} />
             <VersionMismatchWarning
               users={unencryptedEventsFromUsers}
               room={groupCall.room}
@@ -428,7 +425,7 @@ export function InCallView({
       {rageshakeRequestModalState.isOpen && !noControls && (
         <RageshakeRequestModal
           {...rageshakeRequestModalProps}
-          roomIdOrAlias={matrixInfo.roomIdOrAlias}
+          roomId={groupCall.room.roomId}
         />
       )}
       {settingsModalState.isOpen && (
@@ -440,10 +437,7 @@ export function InCallView({
         />
       )}
       {inviteModalState.isOpen && (
-        <InviteModal
-          roomIdOrAlias={matrixInfo.roomIdOrAlias}
-          {...inviteModalProps}
-        />
+        <InviteModal roomId={groupCall.room.roomId} {...inviteModalProps} />
       )}
     </div>
   );

src/room/InviteModal.tsx

@@ -23,10 +23,10 @@ import { getRoomUrl } from "../matrix-utils";
 import styles from "./InviteModal.module.css";
 
 interface Props extends Omit<ModalProps, "title" | "children"> {
-  roomIdOrAlias: string;
+  roomId: string;
 }
 
-export const InviteModal: FC<Props> = ({ roomIdOrAlias, ...rest }) => {
+export const InviteModal: FC<Props> = ({ roomId, ...rest }) => {
   const { t } = useTranslation();
 
   return (
@@ -40,7 +40,7 @@ export const InviteModal: FC<Props> = ({ roomIdOrAlias, ...rest }) => {
         <p>{t("Copy and share this call link")}</p>
         <CopyButton
           className={styles.copyButton}
-          value={getRoomUrl(roomIdOrAlias)}
+          value={getRoomUrl(roomId)}
           data-testid="modal_inviteLink"
         />
       </ModalContent>

src/room/LobbyView.tsx

@@ -81,7 +81,7 @@ export function LobbyView(props: Props) {
             <Body>Or</Body>
             <CopyButton
               variant="secondaryCopy"
-              value={getRoomUrl(props.matrixInfo.roomName)}
+              value={getRoomUrl(props.matrixInfo.roomId)}
               className={styles.copyButton}
               copiedMessage={t("Call link copied")}
               data-testid="lobby_inviteLink"

src/room/RageshakeRequestModal.tsx

@@ -25,13 +25,13 @@ import { Body } from "../typography/Typography";
 
 interface Props extends Omit<ModalProps, "title" | "children"> {
   rageshakeRequestId: string;
-  roomIdOrAlias: string;
+  roomId: string;
   onClose: () => void;
 }
 
 export const RageshakeRequestModal: FC<Props> = ({
   rageshakeRequestId,
-  roomIdOrAlias,
+  roomId,
   ...rest
 }) => {
   const { t } = useTranslation();
@@ -57,7 +57,7 @@ export const RageshakeRequestModal: FC<Props> = ({
               submitRageshake({
                 sendLogs: true,
                 rageshakeRequestId,
-                roomId: roomIdOrAlias, // Possibly not a room ID, but oh well
+                roomId,
               })
             }
             disabled={sending}

src/room/RoomPage.tsx

@@ -77,7 +77,6 @@ export const RoomPage: FC = () => {
     (groupCall: GroupCall) => (
       <GroupCallView
         client={client!}
-        roomIdOrAlias={roomIdOrAlias}
         groupCall={groupCall}
         isPasswordlessUser={passwordlessUser}
         isEmbedded={isEmbedded}
@@ -85,7 +84,7 @@ export const RoomPage: FC = () => {
         hideHeader={hideHeader}
       />
     ),
-    [client, roomIdOrAlias, passwordlessUser, isEmbedded, preload, hideHeader]
+    [client, passwordlessUser, isEmbedded, preload, hideHeader]
   );
 
   if (loading || isRegistering) {

src/room/VideoPreview.tsx

@@ -34,8 +34,8 @@ import { useDefaultDevices } from "../settings/useSetting";
 export type MatrixInfo = {
   displayName: string;
   avatarUrl: string;
+  roomId: string;
   roomName: string;
-  roomIdOrAlias: string;
 };
 
 interface Props {