refactor renderSublists for better readability

This commit is contained in:
Germain Souquet 2021-04-16 10:17:46 +01:00
parent f1453e8d2b
commit 327983672e

View file

@ -501,23 +501,20 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
} }
private renderSublists(): React.ReactElement[] { private renderSublists(): React.ReactElement[] {
const components: React.ReactElement[] = [];
const tagOrder = TAG_ORDER.reduce((p, c) => {
if (c === CUSTOM_TAGS_BEFORE_TAG) {
const customTags = Object.keys(this.state.sublists)
.filter(t => isCustomTag(t));
p.push(...customTags);
}
p.push(c);
return p;
}, [] as TagID[]);
// show a skeleton UI if the user is in no rooms and they are not filtering // show a skeleton UI if the user is in no rooms and they are not filtering
const showSkeleton = !this.state.isNameFiltering && const showSkeleton = !this.state.isNameFiltering &&
Object.values(RoomListStore.instance.unfilteredLists).every(list => !list?.length); Object.values(RoomListStore.instance.unfilteredLists).every(list => !list?.length);
for (const orderedTagId of tagOrder) { return TAG_ORDER.reduce((tags, tagId) => {
if (tagId === CUSTOM_TAGS_BEFORE_TAG) {
const customTags = Object.keys(this.state.sublists)
.filter(tagId => isCustomTag(tagId));
tags.push(...customTags);
}
tags.push(tagId);
return tags;
}, [] as TagID[])
.map(orderedTagId => {
let extraTiles = null; let extraTiles = null;
if (orderedTagId === DefaultTagID.Invite) { if (orderedTagId === DefaultTagID.Invite) {
extraTiles = this.renderCommunityInvites(); extraTiles = this.renderCommunityInvites();
@ -530,10 +527,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
: this.tagAesthetics[orderedTagId]; : this.tagAesthetics[orderedTagId];
if (!aesthetics) throw new Error(`Tag ${orderedTagId} does not have aesthetics`); if (!aesthetics) throw new Error(`Tag ${orderedTagId} does not have aesthetics`);
// The cost of mounting/unmounting this component all the time return <RoomSublist
// offsets the memory cost of keeping it at all time and hiding
// it when no results are found
components.push(<RoomSublist
key={`sublist-${orderedTagId}`} key={`sublist-${orderedTagId}`}
tagId={orderedTagId} tagId={orderedTagId}
forRooms={true} forRooms={true}
@ -547,10 +541,8 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
showSkeleton={showSkeleton} showSkeleton={showSkeleton}
extraTiles={extraTiles} extraTiles={extraTiles}
alwaysVisible={!ALWAYS_VISIBLE_TAGS.includes(orderedTagId)} alwaysVisible={!ALWAYS_VISIBLE_TAGS.includes(orderedTagId)}
/>); />
} });
return components;
} }
public render() { public render() {