fix overflow indicators not being updated when searching

pull/21833/head
Bruno Windels 2018-12-14 17:06:51 +01:00
parent e4d2b6f2b7
commit 3ea0fd1a2f
2 changed files with 24 additions and 2 deletions

View File

@ -313,6 +313,12 @@ const RoomSubList = React.createClass({
); );
}, },
checkOverflow: function() {
if (this.refs.scroller) {
this.refs.scroller.checkOverflow();
}
},
render: function() { render: function() {
const len = this.props.list.length + this.props.extraTiles.length; const len = this.props.list.length + this.props.extraTiles.length;
if (len) { if (len) {
@ -330,7 +336,7 @@ const RoomSubList = React.createClass({
tiles.push(...this.props.extraTiles); tiles.push(...this.props.extraTiles);
return <div className={subListClasses}> return <div className={subListClasses}>
{this._getHeaderJsx()} {this._getHeaderJsx()}
<IndicatorScrollbar className="mx_RoomSubList_scroll"> <IndicatorScrollbar ref="scroller" className="mx_RoomSubList_scroll">
{ tiles } { tiles }
</IndicatorScrollbar> </IndicatorScrollbar>
</div>; </div>;

View File

@ -71,6 +71,10 @@ module.exports = React.createClass({
getInitialState: function() { getInitialState: function() {
this._subListRefs = {
// key => RoomSubList ref
};
const sizesJson = window.localStorage.getItem("mx_roomlist_sizes"); const sizesJson = window.localStorage.getItem("mx_roomlist_sizes");
const collapsedJson = window.localStorage.getItem("mx_roomlist_collapsed"); const collapsedJson = window.localStorage.getItem("mx_roomlist_collapsed");
this.subListSizes = sizesJson ? JSON.parse(sizesJson) : {}; this.subListSizes = sizesJson ? JSON.parse(sizesJson) : {};
@ -174,8 +178,11 @@ module.exports = React.createClass({
this.mounted = true; this.mounted = true;
}, },
componentDidUpdate: function() { componentDidUpdate: function(prevProps) {
this._repositionIncomingCallBox(undefined, false); this._repositionIncomingCallBox(undefined, false);
if (this.props.searchFilter !== prevProps.searchFilter) {
Object.values(this._subListRefs).forEach(l => l.checkOverflow());
}
}, },
onAction: function(payload) { onAction: function(payload) {
@ -483,6 +490,14 @@ module.exports = React.createClass({
window.localStorage.setItem("mx_roomlist_collapsed", JSON.stringify(this.collapsedState)); window.localStorage.setItem("mx_roomlist_collapsed", JSON.stringify(this.collapsedState));
}, },
_subListRef: function(key, ref) {
if (!ref) {
delete this._subListRefs[key];
} else {
this._subListRefs[key] = ref;
}
},
_mapSubListProps: function(subListsProps) { _mapSubListProps: function(subListsProps) {
const defaultProps = { const defaultProps = {
collapsed: this.props.collapsed, collapsed: this.props.collapsed,
@ -513,6 +528,7 @@ module.exports = React.createClass({
const startAsHidden = props.startAsHidden || this.collapsedState[chosenKey]; const startAsHidden = props.startAsHidden || this.collapsedState[chosenKey];
let subList = (<RoomSubList let subList = (<RoomSubList
ref={this._subListRef.bind(this, chosenKey)}
startAsHidden={startAsHidden} startAsHidden={startAsHidden}
onHeaderClick={onSubListHeaderClick} onHeaderClick={onSubListHeaderClick}
key={chosenKey} key={chosenKey}