mirror of
https://github.com/element-hq/element-web
synced 2024-11-27 03:36:07 +03:00
Add read receipt times to the hovertip of read markers
Fixes #2709. Surprisingly, this data was never passed down to ReadReceiptMarker.
This commit is contained in:
parent
587325b36c
commit
bd7553d1ea
3 changed files with 27 additions and 1 deletions
|
@ -33,6 +33,7 @@ module.exports = React.createClass({
|
|||
onClick: React.PropTypes.func,
|
||||
// Whether the onClick of the avatar should be overriden to dispatch 'view_user'
|
||||
viewUserOnClick: React.PropTypes.bool,
|
||||
title: React.PropTypes.string,
|
||||
},
|
||||
|
||||
getDefaultProps: function() {
|
||||
|
@ -58,7 +59,7 @@ module.exports = React.createClass({
|
|||
}
|
||||
return {
|
||||
name: props.member.name,
|
||||
title: props.member.userId,
|
||||
title: props.title || props.member.userId,
|
||||
imageUrl: Avatar.avatarUrlForMember(props.member,
|
||||
props.width,
|
||||
props.height,
|
||||
|
|
|
@ -290,6 +290,18 @@ module.exports = WithMatrixClient(React.createClass({
|
|||
|
||||
var left = 0;
|
||||
|
||||
var readReceiptData = Object.create(null);
|
||||
var room = this.props.matrixClient.getRoom(this.props.mxEvent.getRoomId());
|
||||
if (room) {
|
||||
// [ {type/userId/data} ]
|
||||
room.getReceiptsForEvent(this.props.mxEvent).forEach(function(r) {
|
||||
if (r.type !== "m.read" || !r.data.ts) {
|
||||
return;
|
||||
}
|
||||
readReceiptData[r.userId] = r.data;
|
||||
})
|
||||
}
|
||||
|
||||
var receipts = this.props.readReceipts || [];
|
||||
for (var i = 0; i < receipts.length; ++i) {
|
||||
var member = receipts[i];
|
||||
|
@ -312,6 +324,8 @@ module.exports = WithMatrixClient(React.createClass({
|
|||
|
||||
//console.log("i = " + i + ", MAX_READ_AVATARS = " + MAX_READ_AVATARS + ", allReadAvatars = " + this.state.allReadAvatars + " visibility = " + style.visibility);
|
||||
|
||||
var rData = readReceiptData[member.userId];
|
||||
|
||||
// add to the start so the most recent is on the end (ie. ends up rightmost)
|
||||
avatars.unshift(
|
||||
<ReadReceiptMarker key={userId} member={member}
|
||||
|
@ -320,6 +334,7 @@ module.exports = WithMatrixClient(React.createClass({
|
|||
checkUnmounting={this.props.checkUnmounting}
|
||||
suppressAnimation={this._suppressReadReceiptAnimation}
|
||||
onClick={this.toggleAllReadAvatars}
|
||||
timestamp={rData ? rData.ts : null}
|
||||
/>
|
||||
);
|
||||
|
||||
|
|
|
@ -60,6 +60,9 @@ module.exports = React.createClass({
|
|||
|
||||
// callback for clicks on this RR
|
||||
onClick: React.PropTypes.func,
|
||||
|
||||
// Timestamp when the receipt was read
|
||||
timestamp: React.PropTypes.number,
|
||||
},
|
||||
|
||||
getDefaultProps: function() {
|
||||
|
@ -162,6 +165,12 @@ module.exports = React.createClass({
|
|||
visibility: this.props.hidden ? 'hidden' : 'visible',
|
||||
};
|
||||
|
||||
var title;
|
||||
if (this.props.timestamp) {
|
||||
// "7:05:45 PM (@alice:matrix.org)"
|
||||
title = new Date(this.props.timestamp).toLocaleTimeString() + " (" + this.props.member.userId + ")";
|
||||
}
|
||||
|
||||
return (
|
||||
<Velociraptor
|
||||
startStyles={this.state.startStyles}
|
||||
|
@ -170,6 +179,7 @@ module.exports = React.createClass({
|
|||
member={this.props.member}
|
||||
width={14} height={14} resizeMethod="crop"
|
||||
style={style}
|
||||
title={title}
|
||||
onClick={this.props.onClick}
|
||||
/>
|
||||
</Velociraptor>
|
||||
|
|
Loading…
Reference in a new issue