diff --git a/res/css/views/rooms/_RoomTile.scss b/res/css/views/rooms/_RoomTile.scss index 6b2e2573e5..f2557f7849 100644 --- a/res/css/views/rooms/_RoomTile.scss +++ b/res/css/views/rooms/_RoomTile.scss @@ -191,3 +191,7 @@ limitations under the License. .mx_RoomTile.mx_RoomTile_transparent:focus { background-color: $roomtile-transparent-focused-color; } + +.mx_GroupInviteTile .mx_RoomTile_name { + flex: 1; +} diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index f7f74da728..78cc5bd58f 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -282,18 +282,10 @@ const RoomSubList = React.createClass({ this.setState({scrollTop: this.refs.scroller.getScrollTop()}); }, - _getRenderItems: function() { - // try our best to not create a new array - // because LazyRenderList rerender when the items prop - // is not the same object as the previous value - const {list, extraTiles} = this.props; - if (!extraTiles || !extraTiles.length) { - return list; - } - if (!list || list.length) { - return extraTiles; - } - return list.concat(extraTiles); + _canUseLazyListRendering() { + // for now disable lazy rendering as they are already rendered tiles + // not rooms like props.list we pass to LazyRenderList + return !this.props.extraTiles || !this.props.extraTiles.length; }, render: function() { @@ -310,7 +302,7 @@ const RoomSubList = React.createClass({ return
{this._getHeaderJsx(isCollapsed)}
; - } else { + } else if (this._canUseLazyListRendering()) { return
{this._getHeaderJsx(isCollapsed)} @@ -319,7 +311,16 @@ const RoomSubList = React.createClass({ height={ this.state.scrollerHeight } renderItem={ this.makeRoomTile } itemHeight={34} - items={this._getRenderItems()} /> + items={ this.props.list } /> + +
; + } else { + const roomTiles = this.props.list.map(r => this.makeRoomTile(r)); + const tiles = roomTiles.concat(this.props.extraTiles); + return
+ {this._getHeaderJsx(isCollapsed)} + + { tiles }
; } diff --git a/src/components/views/groups/GroupInviteTile.js b/src/components/views/groups/GroupInviteTile.js index 9e28ff5adf..44441f4754 100644 --- a/src/components/views/groups/GroupInviteTile.js +++ b/src/components/views/groups/GroupInviteTile.js @@ -150,6 +150,7 @@ export default React.createClass({ const classes = classNames('mx_RoomTile mx_RoomTile_highlight', { 'mx_RoomTile_menuDisplayed': this.state.menuDisplayed, 'mx_RoomTile_selected': this.state.selected, + 'mx_GroupInviteTile': true, }); return (