Optimize how statuses are re-rendered and relative time intervals

This commit is contained in:
Eugen Rochko 2016-11-04 12:48:53 +01:00
commit 98c3a5e9c3
6 changed files with 91 additions and 33 deletions

View file

@ -22,7 +22,8 @@ const Status = React.createClass({
onReblog: React.PropTypes.func,
onDelete: React.PropTypes.func,
onOpenMedia: React.PropTypes.func,
me: React.PropTypes.number
me: React.PropTypes.number,
now: React.PropTypes.any
},
mixins: [PureRenderMixin],
@ -43,7 +44,7 @@ const Status = React.createClass({
render () {
let media = '';
let { status, ...other } = this.props;
const { status, now, ...other } = this.props;
if (status === null) {
return <div />;
@ -80,7 +81,7 @@ const Status = React.createClass({
<div style={{ padding: '8px 10px', paddingLeft: '68px', position: 'relative', minHeight: '48px', borderBottom: '1px solid #363c4b', cursor: 'pointer' }} onClick={this.handleClick}>
<div style={{ fontSize: '15px' }}>
<div style={{ float: 'right', fontSize: '14px' }}>
<a href={status.get('url')} className='status__relative-time' style={{ color: '#616b86' }} target='_blank' rel='noopener'><RelativeTimestamp timestamp={status.get('created_at')} /></a>
<a href={status.get('url')} className='status__relative-time' style={{ color: '#616b86' }} target='_blank' rel='noopener'><RelativeTimestamp timestamp={status.get('created_at')} now={now} /></a>
</div>
<a onClick={this.handleAccountClick.bind(this, status.getIn(['account', 'id']))} href={status.getIn(['account', 'url'])} className='status__display-name' style={{ display: 'block', maxWidth: '100%', paddingRight: '25px', color: '#616b86' }}>