Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

MELS: check scroll on load + use mels-1,-2,... key #715

Merged
merged 2 commits into from
Feb 23, 2017
Merged

MELS: check scroll on load + use mels-1,-2,... key #715

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6fead66
MELS: check scroll on load + use mels-1,-2,... key
Feb 20, 2017
f92708f
In practice the MELS-1,2,3 solves nothing, revert it
Feb 22, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 8 additions & 5 deletions src/components/structures/MessagePanel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,6 +237,7 @@ module.exports = React.createClass({
this.eventNodes = {};

var i;
let melsIndex = 0;

// first figure out which is the last event in the list which we're
// actually going to show; this allows us to behave slightly
Expand Down Expand Up @@ -302,10 +303,10 @@ module.exports = React.createClass({
// instead will allow new props to be provided. In turn, the shouldComponentUpdate
// method on MELS can be used to prevent unnecessary renderings.
//
// Whilst back-paginating with a MELS at the top of the panel, prevEvent will be null,
// so use the key "membereventlistsummary-initial". Otherwise, use the ID of the first
// membership event, which will not change during forward pagination.
const key = "membereventlistsummary-" + (prevEvent ? mxEv.getId() : "initial");
// melsIndex is deliberately unrelated to the contained events so that pagination
// will not cause it to be recreated.
const key = "membereventlistsummary-" + melsIndex;
melsIndex++;

if (this._wantsDateSeparator(prevEvent, mxEv.getDate())) {
let dateSeparator = <li key={ts1+'~'}><DateSeparator key={ts1+'~'} ts={ts1}/></li>;
Expand Down Expand Up @@ -349,7 +350,9 @@ module.exports = React.createClass({
<MemberEventListSummary
key={key}
events={summarisedEvents}
data-scroll-token={eventId}>
data-scroll-token={eventId}
onToggle={this._onWidgetLoad} // Update scroll state
>
{eventTiles}
</MemberEventListSummary>
);
Expand Down
3 changes: 3 additions & 0 deletions src/components/views/elements/MemberEventListSummary.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@ module.exports = React.createClass({
avatarsMaxLength: React.PropTypes.number,
// The minimum number of events needed to trigger summarisation
threshold: React.PropTypes.number,
// Called when the MELS expansion is toggled
onToggle: React.PropTypes.func,
},

getInitialState: function() {
Expand Down Expand Up @@ -63,6 +65,7 @@ module.exports = React.createClass({
this.setState({
expanded: !this.state.expanded,
});
this.props.onToggle();
},

/**
Expand Down