refactor renderSublists for better readability
This commit is contained in:
parent
f1453e8d2b
commit
327983672e
1 changed files with 35 additions and 43 deletions
|
@ -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() {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue