make FilePanel refresh when we switch rooms

pull/21833/head
Matthew Hodgson 2016-09-07 15:43:14 +01:00
parent e7074ef9af
commit 990d84df77
1 changed files with 25 additions and 17 deletions

View File

@ -34,14 +34,27 @@ var FilePanel = React.createClass({
getInitialState: function() { getInitialState: function() {
return { return {
room: MatrixClientPeg.get().getRoom(this.props.roomId),
timelineSet: null, timelineSet: null,
} }
}, },
componentWillMount: function() { componentWillMount: function() {
if (this.state.room) { this.updateTimelineSet(this.props.roomId);
var client = MatrixClientPeg.get(); },
componentWillReceiveProps: function(nextProps) {
if (nextProps.roomId !== this.props.roomId) {
// otherwise we race between updating the TimelinePanel and determining the new timelineSet
this.setState({ timelineSet: null });
this.updateTimelineSet(nextProps.roomId);
}
},
updateTimelineSet: function(roomId) {
var client = MatrixClientPeg.get();
var room = client.getRoom(roomId);
if (room) {
var filter = new Matrix.Filter(client.credentials.userId); var filter = new Matrix.Filter(client.credentials.userId);
filter.setDefinition( filter.setDefinition(
{ {
@ -56,7 +69,7 @@ var FilePanel = React.createClass({
client.getOrCreateFilter("FILTER_FILES_" + client.credentials.userId, filter).then( client.getOrCreateFilter("FILTER_FILES_" + client.credentials.userId, filter).then(
(filterId)=>{ (filterId)=>{
filter.filterId = filterId; filter.filterId = filterId;
var timelineSet = this.state.room.getOrCreateFilteredTimelineSet(filter); var timelineSet = room.getOrCreateFilteredTimelineSet(filter);
this.setState({ timelineSet: timelineSet }); this.setState({ timelineSet: timelineSet });
}, },
(error)=>{ (error)=>{
@ -80,20 +93,11 @@ var FilePanel = React.createClass({
var TimelinePanel = sdk.getComponent("structures.TimelinePanel"); var TimelinePanel = sdk.getComponent("structures.TimelinePanel");
var Loader = sdk.getComponent("elements.Spinner"); var Loader = sdk.getComponent("elements.Spinner");
// <TimelinePanel ref={this._gatherTimelinePanelRef}
// room={this.state.room}
// hidden={hideMessagePanel}
// highlightedEventId={this.props.highlightedEventId}
// eventId={this.props.eventId}
// eventPixelOffset={this.props.eventPixelOffset}
// onScroll={ this.onMessageListScroll }
// onReadMarkerUpdated={ this._updateTopUnreadMessagesBar }
// showUrlPreview = { this.state.showUrlPreview }
// opacity={ this.props.opacity }
if (this.state.timelineSet) { if (this.state.timelineSet) {
console.log("rendering TimelinePanel for timelineSet " + this.state.timelineSet.roomId + " " +
"(" + this.state.timelineSet._timelines.join(", ") + ")" + " with key " + this.props.roomId);
return ( return (
<TimelinePanel ref={this._gatherTimelinePanelRef} <TimelinePanel key={"filepanel_" + this.props.roomId} ref={this._gatherTimelinePanelRef}
className="mx_FilePanel" className="mx_FilePanel"
manageReadReceipts={false} manageReadReceipts={false}
manageReadMarkers={false} manageReadMarkers={false}
@ -104,7 +108,11 @@ var FilePanel = React.createClass({
); );
} }
else { else {
return <Loader/> return (
<div className="mx_FilePanel">
<Loader/>
</div>
);
} }
}, },
}); });