Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 0d100cb

Browse files
authored
Render HTML topics in rooms on space home (#8939)
* Render HTML topics in rooms on space home Signed-off-by: Johannes Marbach <[email protected]> * Add type annotations Signed-off-by: Johannes Marbach <[email protected]> * Remove superfluous conditional check Signed-off-by: Johannes Marbach <[email protected]>
1 parent 933ced5 commit 0d100cb

File tree

1 file changed

+16
-9
lines changed

1 file changed

+16
-9
lines changed

src/components/structures/SpaceHierarchy.tsx

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import React, {
1818
Dispatch,
1919
KeyboardEvent,
2020
KeyboardEventHandler,
21+
ReactElement,
2122
ReactNode,
2223
SetStateAction,
2324
useCallback,
@@ -50,7 +51,7 @@ import TextWithTooltip from "../views/elements/TextWithTooltip";
5051
import { useStateToggle } from "../../hooks/useStateToggle";
5152
import { getChildOrder } from "../../stores/spaces/SpaceStore";
5253
import AccessibleTooltipButton from "../views/elements/AccessibleTooltipButton";
53-
import { linkifyElement } from "../../HtmlUtils";
54+
import { linkifyElement, topicToHtml } from "../../HtmlUtils";
5455
import { useDispatcher } from "../../hooks/useDispatcher";
5556
import { Action } from "../../dispatcher/actions";
5657
import { IState, RovingTabIndexProvider, useRovingTabIndex } from "../../accessibility/RovingTabIndex";
@@ -65,6 +66,7 @@ import { JoinRoomReadyPayload } from "../../dispatcher/payloads/JoinRoomReadyPay
6566
import { KeyBindingAction } from "../../accessibility/KeyboardShortcuts";
6667
import { getKeyBindingsManager } from "../../KeyBindingsManager";
6768
import { Alignment } from "../views/elements/Tooltip";
69+
import { getTopic } from "../../hooks/room/useTopic";
6870

6971
interface IProps {
7072
space: Room;
@@ -122,7 +124,7 @@ const Tile: React.FC<ITileProps> = ({
122124
});
123125
};
124126

125-
let button;
127+
let button: ReactElement;
126128
if (busy) {
127129
button = <AccessibleTooltipButton
128130
disabled={true}
@@ -154,7 +156,7 @@ const Tile: React.FC<ITileProps> = ({
154156
</AccessibleButton>;
155157
}
156158

157-
let checkbox;
159+
let checkbox: ReactElement | undefined;
158160
if (onToggleClick) {
159161
if (hasPermissions) {
160162
checkbox = <StyledCheckbox checked={!!selected} onChange={onToggleClick} tabIndex={isActive ? 0 : -1} />;
@@ -168,7 +170,7 @@ const Tile: React.FC<ITileProps> = ({
168170
}
169171
}
170172

171-
let avatar;
173+
let avatar: ReactElement;
172174
if (joinedRoom) {
173175
avatar = <RoomAvatar room={joinedRoom} width={20} height={20} />;
174176
} else {
@@ -186,19 +188,22 @@ const Tile: React.FC<ITileProps> = ({
186188
description += " · " + _t("%(count)s rooms", { count: numChildRooms });
187189
}
188190

189-
const topic = joinedRoom?.currentState?.getStateEvents(EventType.RoomTopic, "")?.getContent()?.topic || room.topic;
190-
if (topic) {
191-
description += " · " + topic;
191+
let topic: ReactNode | string | null;
192+
if (joinedRoom) {
193+
const topicObj = getTopic(joinedRoom);
194+
topic = topicToHtml(topicObj?.text, topicObj?.html);
195+
} else {
196+
topic = room.topic;
192197
}
193198

194-
let joinedSection;
199+
let joinedSection: ReactElement | undefined;
195200
if (joinedRoom) {
196201
joinedSection = <div className="mx_SpaceHierarchy_roomTile_joined">
197202
{ _t("Joined") }
198203
</div>;
199204
}
200205

201-
let suggestedSection;
206+
let suggestedSection: ReactElement | undefined;
202207
if (suggested && (!joinedRoom || hasPermissions)) {
203208
suggestedSection = <InfoTooltip tooltip={_t("This room is suggested as a good one to join")}>
204209
{ _t("Suggested") }
@@ -226,6 +231,8 @@ const Tile: React.FC<ITileProps> = ({
226231
}}
227232
>
228233
{ description }
234+
{ topic && " · " }
235+
{ topic }
229236
</div>
230237
</div>
231238
<div className="mx_SpaceHierarchy_actions">

0 commit comments

Comments
 (0)