diff options
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/mastodon/components/relative_timestamp.js | 45 |
1 files changed, 33 insertions, 12 deletions
diff --git a/app/javascript/mastodon/components/relative_timestamp.js b/app/javascript/mastodon/components/relative_timestamp.js index 13c36c0e4..3eed88df8 100644 --- a/app/javascript/mastodon/components/relative_timestamp.js +++ b/app/javascript/mastodon/components/relative_timestamp.js @@ -2,19 +2,40 @@ import React from 'react'; import { injectIntl, FormattedRelative } from 'react-intl'; import PropTypes from 'prop-types'; -const RelativeTimestamp = ({ intl, timestamp }) => { - const date = new Date(timestamp); - - return ( - <time dateTime={timestamp} title={intl.formatDate(date, { hour12: false, year: 'numeric', month: 'short', day: '2-digit', hour: '2-digit', minute: '2-digit' })}> - <FormattedRelative value={date} /> - </time> - ); +const dateFormatOptions = { + hour12: false, + year: 'numeric', + month: 'short', + day: '2-digit', + hour: '2-digit', + minute: '2-digit', }; -RelativeTimestamp.propTypes = { - intl: PropTypes.object.isRequired, - timestamp: PropTypes.string.isRequired, -}; +class RelativeTimestamp extends React.Component { + + static propTypes = { + intl: PropTypes.object.isRequired, + timestamp: PropTypes.string.isRequired, + }; + + shouldComponentUpdate (nextProps) { + // As of right now the locale doesn't change without a new page load, + // but we might as well check in case that ever changes. + return this.props.timestamp !== nextProps.timestamp || + this.props.intl.locale !== nextProps.intl.locale; + } + + render () { + const { timestamp, intl } = this.props; + const date = new Date(timestamp); + + return ( + <time dateTime={timestamp} title={intl.formatDate(date, dateFormatOptions)}> + <FormattedRelative value={date} /> + </time> + ); + } + +} export default injectIntl(RelativeTimestamp); |