diff --git a/src/skins/vector/css/organisms/RoomSubList.css b/src/skins/vector/css/organisms/RoomSubList.css index b971f65c..57d23a38 100644 --- a/src/skins/vector/css/organisms/RoomSubList.css +++ b/src/skins/vector/css/organisms/RoomSubList.css @@ -20,6 +20,11 @@ limitations under the License. width: 100%; } +.mx_RoomSubList_bottommost { + /* XXX: this should really be 100% of the RoomList height, but can't seem to get at it */ + min-height: 400px; +} + .mx_RoomSubList_label { text-transform: uppercase; color: #3d3b39; diff --git a/src/skins/vector/views/organisms/RoomList.js b/src/skins/vector/views/organisms/RoomList.js index 5a43876a..ab673683 100644 --- a/src/skins/vector/views/organisms/RoomList.js +++ b/src/skins/vector/views/organisms/RoomList.js @@ -71,16 +71,6 @@ module.exports = React.createClass({ selectedRoom={ self.props.selectedRoom } collapsed={ self.props.collapsed } /> - <RoomSubList list={ self.state.lists['m.lowpriority'] } - label="Low priority" - tagName="m.lowpriority" - verb="demote" - editable={ true } - order="recent" - activityMap={ self.state.activityMap } - selectedRoom={ self.props.selectedRoom } - collapsed={ self.props.collapsed } /> - { Object.keys(self.state.lists).map(function(tagName) { if (!tagName.match(/^m\.(invite|favourite|recent|lowpriority|archived)$/)) { return <RoomSubList list={ self.state.lists[tagName] } @@ -97,10 +87,22 @@ module.exports = React.createClass({ } }) } + <RoomSubList list={ self.state.lists['m.lowpriority'] } + label="Low priority" + tagName="m.lowpriority" + verb="demote" + editable={ true } + order="recent" + bottommost={ self.state.lists['m.archived'].length === 0 } + activityMap={ self.state.activityMap } + selectedRoom={ self.props.selectedRoom } + collapsed={ self.props.collapsed } /> + <RoomSubList list={ self.state.lists['m.archived'] } label="Historical" editable={ false } order="recent" + bottommost={ true } activityMap={ self.state.activityMap } selectedRoom={ self.props.selectedRoom } collapsed={ self.props.collapsed } /> diff --git a/src/skins/vector/views/organisms/RoomSubList.js b/src/skins/vector/views/organisms/RoomSubList.js index 501a9f58..a4fd5e99 100644 --- a/src/skins/vector/views/organisms/RoomSubList.js +++ b/src/skins/vector/views/organisms/RoomSubList.js @@ -60,6 +60,7 @@ var RoomSubList = React.createClass({ tagName: React.PropTypes.string, editable: React.PropTypes.bool, order: React.PropTypes.string.isRequired, + bottommost: React.PropTypes.bool, selectedRoom: React.PropTypes.string.isRequired, activityMap: React.PropTypes.object.isRequired, collapsed: React.PropTypes.bool.isRequired @@ -245,16 +246,22 @@ var RoomSubList = React.createClass({ target = <RoomDropTarget label={ 'Drop here to ' + this.props.verb }/>; } - var subList; - if (!this.state.hidden) { - subList = <div className="mx_RoomSubList"> - { target } - { this.makeRoomTiles() } - </div>; - } - - if (this.state.sortedList.length > 0 || this.props.editable) { + var subList; + var classes = "mx_RoomSubList" + + (this.props.bottommost ? " mx_RoomSubList_bottommost" : ""); + + if (!this.state.hidden) { + subList = <div className={ classes }> + { target } + { this.makeRoomTiles() } + </div>; + } + else { + subList = <div className={ classes }> + </div>; + } + return connectDropTarget( <div> <h2 onClick={ this.onClick } className="mx_RoomSubList_label">{ this.props.collapsed ? '' : this.props.label }