In People & Favourites metaspaces always show all rooms (#7288)

This commit is contained in:
Michael Telatynski 2021-12-06 09:25:14 +00:00 committed by GitHub
parent 336f159004
commit baa17e4a68
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 4 deletions

View file

@ -616,6 +616,14 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
alwaysVisible = false; alwaysVisible = false;
} }
let forceExpanded = false;
if (
(this.props.activeSpace === MetaSpace.Favourites && orderedTagId === DefaultTagID.Favourite) ||
(this.props.activeSpace === MetaSpace.People && orderedTagId === DefaultTagID.DM)
) {
forceExpanded = true;
}
// The cost of mounting/unmounting this component offsets the cost // The cost of mounting/unmounting this component offsets the cost
// of keeping it in the DOM and hiding it when it is not required // of keeping it in the DOM and hiding it when it is not required
return <RoomSublist return <RoomSublist
@ -631,6 +639,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
resizeNotifier={this.props.resizeNotifier} resizeNotifier={this.props.resizeNotifier}
alwaysVisible={alwaysVisible} alwaysVisible={alwaysVisible}
onListCollapse={this.props.onListCollapse} onListCollapse={this.props.onListCollapse}
forceExpanded={forceExpanded}
/>; />;
}); });
} }

View file

@ -79,6 +79,7 @@ interface IProps {
tagId: TagID; tagId: TagID;
showSkeleton?: boolean; showSkeleton?: boolean;
alwaysVisible?: boolean; alwaysVisible?: boolean;
forceExpanded?: boolean;
resizeNotifier: ResizeNotifier; resizeNotifier: ResizeNotifier;
extraTiles?: ReactComponentElement<typeof ExtraTile>[]; extraTiles?: ReactComponentElement<typeof ExtraTile>[];
onListCollapse?: (isExpanded: boolean) => void; onListCollapse?: (isExpanded: boolean) => void;
@ -460,6 +461,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
}; };
private toggleCollapsed = () => { private toggleCollapsed = () => {
if (this.props.forceExpanded) return;
this.layout.isCollapsed = this.state.isExpanded; this.layout.isCollapsed = this.state.isExpanded;
this.setState({ isExpanded: !this.layout.isCollapsed }); this.setState({ isExpanded: !this.layout.isCollapsed });
if (this.props.onListCollapse) { if (this.props.onListCollapse) {
@ -508,7 +510,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
}; };
private renderVisibleTiles(): React.ReactElement[] { private renderVisibleTiles(): React.ReactElement[] {
if (!this.state.isExpanded) { if (!this.state.isExpanded && !this.props.forceExpanded) {
// don't waste time on rendering // don't waste time on rendering
return []; return [];
} }
@ -516,7 +518,11 @@ export default class RoomSublist extends React.Component<IProps, IState> {
const tiles: React.ReactElement[] = []; const tiles: React.ReactElement[] = [];
if (this.state.rooms) { if (this.state.rooms) {
const visibleRooms = this.state.rooms.slice(0, this.numVisibleTiles); let visibleRooms = this.state.rooms;
if (!this.props.forceExpanded) {
visibleRooms = visibleRooms.slice(0, this.numVisibleTiles);
}
for (const room of visibleRooms) { for (const room of visibleRooms) {
tiles.push(<RoomTile tiles.push(<RoomTile
room={room} room={room}
@ -537,7 +543,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
// to avoid spending cycles on slicing. It's generally fine to do this though // to avoid spending cycles on slicing. It's generally fine to do this though
// as users are unlikely to have more than a handful of tiles when the extra // as users are unlikely to have more than a handful of tiles when the extra
// tiles are used. // tiles are used.
if (tiles.length > this.numVisibleTiles) { if (tiles.length > this.numVisibleTiles && !this.props.forceExpanded) {
return tiles.slice(0, this.numVisibleTiles); return tiles.slice(0, this.numVisibleTiles);
} }
@ -731,7 +737,13 @@ export default class RoomSublist extends React.Component<IProps, IState> {
}); });
let content = null; let content = null;
if (visibleTiles.length > 0) { if (visibleTiles.length > 0 && this.props.forceExpanded) {
content = <div className="mx_RoomSublist_resizeBox">
<div className="mx_RoomSublist_tiles" ref={this.tilesRef}>
{ visibleTiles }
</div>
</div>;
} else if (visibleTiles.length > 0) {
const layout = this.layout; // to shorten calls const layout = this.layout; // to shorten calls
const minTiles = Math.min(layout.minVisibleTiles, this.numTiles); const minTiles = Math.min(layout.minVisibleTiles, this.numTiles);