Use local room state to render space hierarchy if the room is known

pull/21833/head
Michael Telatynski 2021-05-24 18:57:24 +01:00
parent 7123abc122
commit 5b66975605
1 changed files with 20 additions and 12 deletions

View File

@ -101,15 +101,13 @@ const Tile: React.FC<ITileProps> = ({
numChildRooms, numChildRooms,
children, children,
}) => { }) => {
const name = room.name || room.canonical_alias || room.aliases?.[0] const cli = MatrixClientPeg.get();
const joinedRoom = cli.getRoom(room.room_id)?.getMyMembership() === "join" && cli.getRoom(room.room_id);
const name = joinedRoom?.name || room.name || room.canonical_alias || room.aliases?.[0]
|| (room.room_type === RoomType.Space ? _t("Unnamed Space") : _t("Unnamed Room")); || (room.room_type === RoomType.Space ? _t("Unnamed Space") : _t("Unnamed Room"));
const [showChildren, toggleShowChildren] = useStateToggle(true); const [showChildren, toggleShowChildren] = useStateToggle(true);
const cli = MatrixClientPeg.get();
const cliRoom = cli.getRoom(room.room_id);
const myMembership = cliRoom?.getMyMembership();
const onPreviewClick = (ev: ButtonEvent) => { const onPreviewClick = (ev: ButtonEvent) => {
ev.preventDefault(); ev.preventDefault();
ev.stopPropagation(); ev.stopPropagation();
@ -122,7 +120,7 @@ const Tile: React.FC<ITileProps> = ({
} }
let button; let button;
if (myMembership === "join") { if (joinedRoom) {
button = <AccessibleButton onClick={onPreviewClick} kind="primary_outline"> button = <AccessibleButton onClick={onPreviewClick} kind="primary_outline">
{ _t("View") } { _t("View") }
</AccessibleButton>; </AccessibleButton>;
@ -146,17 +144,27 @@ const Tile: React.FC<ITileProps> = ({
} }
} }
let url: string; let avatar;
if (room.avatar_url) { if (joinedRoom) {
url = mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(20); avatar = <RoomAvatar room={joinedRoom} width={20} height={20} />;
} else {
avatar = <BaseAvatar
name={name}
idName={room.room_id}
url={room.avatar_url ? mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(20) : null}
width={20}
height={20}
/>;
} }
let description = _t("%(count)s members", { count: room.num_joined_members }); let description = _t("%(count)s members", { count: room.num_joined_members });
if (numChildRooms !== undefined) { if (numChildRooms !== undefined) {
description += " · " + _t("%(count)s rooms", { count: numChildRooms }); description += " · " + _t("%(count)s rooms", { count: numChildRooms });
} }
if (room.topic) {
description += " · " + room.topic; const topic = joinedRoom?.currentState.getStateEvents(EventType.RoomTopic, "")?.getContent()?.topic || room.topic;
if (topic) {
description += " · " + topic;
} }
let suggestedSection; let suggestedSection;
@ -167,7 +175,7 @@ const Tile: React.FC<ITileProps> = ({
} }
const content = <React.Fragment> const content = <React.Fragment>
<BaseAvatar name={name} idName={room.room_id} url={url} width={20} height={20} /> { avatar }
<div className="mx_SpaceRoomDirectory_roomTile_name"> <div className="mx_SpaceRoomDirectory_roomTile_name">
{ name } { name }
{ suggestedSection } { suggestedSection }