diff --git a/src/components/views/rooms/NewRoomIntro.tsx b/src/components/views/rooms/NewRoomIntro.tsx
index 83e0a5eee84c..06ee495e8923 100644
--- a/src/components/views/rooms/NewRoomIntro.tsx
+++ b/src/components/views/rooms/NewRoomIntro.tsx
@@ -58,16 +58,18 @@ const NewRoomIntro = () => {
let body: JSX.Element;
if (dmPartner) {
let introMessage = _t("This is the beginning of your direct message history with .");
- let caption: string;
+ let captionElement: JSX.Element;
if (isLocalRoom) {
introMessage = _t("Send your first message to invite to chat");
} else if ((room.getJoinedMemberCount() + room.getInvitedMemberCount()) === 2) {
- caption = _t("Only the two of you are in this conversation, unless either of you invites anyone to join.");
+ captionElement =
+ { _t("Only the two of you are in this conversation, unless either of you invites anyone to join.") }
+
;
}
const member = room?.getMember(dmPartner);
- const displayName = room.name;
+ const displayName = room?.name || member?.rawDisplayName || dmPartner;
body =
{
{ _t(introMessage, {}, {
displayName: () => { displayName },
}) }
- { caption && { caption }
}
+ { captionElement }
;
} else {
const inRoom = room && room.getMyMembership() === "join";
diff --git a/test/components/views/rooms/NewRoomIntro-test.tsx b/test/components/views/rooms/NewRoomIntro-test.tsx
index a1ea8f43b748..fc3b9c2b1fca 100644
--- a/test/components/views/rooms/NewRoomIntro-test.tsx
+++ b/test/components/views/rooms/NewRoomIntro-test.tsx
@@ -60,7 +60,7 @@ describe("NewRoomIntro", () => {
it("should render the expected intro", () => {
const expected = `This is the beginning of your direct message history with test_room.`;
- screen.getByText((id, element) => element.tagName === "SPAN" && element.textContent === expected);
+ screen.getByText((id, element) => element?.tagName === "SPAN" && element?.textContent === expected);
});
});
@@ -75,7 +75,7 @@ describe("NewRoomIntro", () => {
it("should render the expected intro", () => {
const expected = `Send your first message to invite test_room to chat`;
- screen.getByText((id, element) => element.tagName === "SPAN" && element.textContent === expected);
+ screen.getByText((id, element) => element?.tagName === "SPAN" && element?.textContent === expected);
});
});
});