mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-23 17:56:01 +03:00
Code Issues Projects Releases Packages Wiki Activity

Hide RoomSublist when empty rather than unmounting them

Browse source
This commit is contained in:
Germain Souquet 2021-04-15 16:11:45 +01:00
parent a59873df0b
commit 02debd12f6
3 changed files with 10 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
res/css/views/rooms/_RoomSublist.scss
View file

@ -18,6 +18,10 @@ limitations under the License.
margin-left: 8px; margin-left: 8px;
margin-bottom: 4px; margin-bottom: 4px;
&.mx_RoomSublist_hidden {
display: none;
}
.mx_RoomSublist_headerContainer { .mx_RoomSublist_headerContainer {
// Create a flexbox to make alignment easy // Create a flexbox to make alignment easy
display: flex; display: flex;

11
src/components/views/rooms/RoomList.tsx
View file

@ -86,10 +86,6 @@ const TAG_ORDER: TagID[] = [
DefaultTagID.Archived, DefaultTagID.Archived,
]; ];
const CUSTOM_TAGS_BEFORE_TAG = DefaultTagID.LowPriority; const CUSTOM_TAGS_BEFORE_TAG = DefaultTagID.LowPriority;
const ALWAYS_VISIBLE_TAGS: TagID[] = [
DefaultTagID.DM,
DefaultTagID.Untagged,
];
interface ITagAesthetics { interface ITagAesthetics {
sectionLabel: string; sectionLabel: string;
@ -518,8 +514,6 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
Object.values(RoomListStore.instance.unfilteredLists).every(list => !list?.length); Object.values(RoomListStore.instance.unfilteredLists).every(list => !list?.length);
for (const orderedTagId of tagOrder) { for (const orderedTagId of tagOrder) {
const orderedRooms = this.state.sublists[orderedTagId] || [];
let extraTiles = null; let extraTiles = null;
if (orderedTagId === DefaultTagID.Invite) { if (orderedTagId === DefaultTagID.Invite) {
extraTiles = this.renderCommunityInvites(); extraTiles = this.renderCommunityInvites();
@ -527,11 +521,6 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
extraTiles = this.renderSuggestedRooms(); extraTiles = this.renderSuggestedRooms();
} }
const totalTiles = orderedRooms.length + (extraTiles ? extraTiles.length : 0);
if (totalTiles === 0 && !ALWAYS_VISIBLE_TAGS.includes(orderedTagId)) {
continue; // skip tag - not needed
}
const aesthetics: ITagAesthetics = isCustomTag(orderedTagId) const aesthetics: ITagAesthetics = isCustomTag(orderedTagId)
? customTagAesthetics(orderedTagId) ? customTagAesthetics(orderedTagId)
: this.tagAesthetics[orderedTagId]; : this.tagAesthetics[orderedTagId];

6
src/components/views/rooms/RoomSublist.tsx
View file

@ -60,6 +60,11 @@ export const HEADER_HEIGHT = 32; // As defined by CSS
const MAX_PADDING_HEIGHT = SHOW_N_BUTTON_HEIGHT + RESIZE_HANDLE_HEIGHT; const MAX_PADDING_HEIGHT = SHOW_N_BUTTON_HEIGHT + RESIZE_HANDLE_HEIGHT;
const ALWAYS_VISIBLE_TAGS: TagID[] = [
DefaultTagID.DM,
DefaultTagID.Untagged,
];
// HACK: We really shouldn't have to do this. // HACK: We really shouldn't have to do this.
polyfillTouchEvent(); polyfillTouchEvent();
@ -762,6 +767,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
'mx_RoomSublist': true, 'mx_RoomSublist': true,
'mx_RoomSublist_hasMenuOpen': !!this.state.contextMenuPosition, 'mx_RoomSublist_hasMenuOpen': !!this.state.contextMenuPosition,
'mx_RoomSublist_minimized': this.props.isMinimized, 'mx_RoomSublist_minimized': this.props.isMinimized,
'mx_RoomSublist_hidden': !this.state.rooms.length && !ALWAYS_VISIBLE_TAGS.includes(this.props.tagId),
}); });
let content = null; let content = null;